/*
Theme Name: Domus Creativa Engine
Theme URI: https://domuscreativa.com/
Author: Domus Creativa / BlouzaTech
Description: Black-and-gold control-room theme for the Studio KPI Engine plugin. Branded staff/manager/CFO login and role-based dashboards. Requires the "Studio KPI Engine" plugin.
Version: 1.3.1
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: domus-creativa
*/

:root{
  --dce-black:#0b0b0d;
  --dce-panel:#15151a;
  --dce-panel-2:#1d1d24;
  --dce-line:#2a2a33;
  --dce-gold:#d4af37;
  --dce-gold-soft:#e8c969;
  --dce-gold-dim:#8c7320;
  --dce-text:#f3f1ea;
  --dce-muted:#9a9488;
  --dce-green:#7bd88f;
  --dce-red:#e0796b;
  --dce-serif:"Roboto","Roboto Slab",Georgia,serif;
  --dce-sans:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:var(--dce-black);
  color:var(--dce-text);
  font-family:var(--dce-sans);
  font-size:16px;line-height:1.55;
  background-image:radial-gradient(1200px 500px at 80% -10%, rgba(212,175,55,.08), transparent 60%);
  background-attachment:fixed;
}
a{color:var(--dce-gold);text-decoration:none}
a:hover{color:var(--dce-gold-soft)}

/* ---- Top bar ---- */
.dce-topbar{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;border-bottom:1px solid var(--dce-line);
  background:linear-gradient(180deg,#0e0e12,#0b0b0d);position:sticky;top:0;z-index:50;
}
.dce-brand{display:flex;align-items:center;gap:12px}
.dce-brand .dce-mark{width:38px;height:38px}
.dce-brand .dce-name{font-family:var(--dce-serif);font-size:20px;letter-spacing:.5px}
.dce-brand .dce-name b{color:var(--dce-gold)}
.dce-brand .dce-sub{display:block;font-size:10px;letter-spacing:3px;text-transform:uppercase;color:var(--dce-muted);font-family:var(--dce-sans)}
.dce-nav{display:flex;align-items:center;gap:18px;font-size:14px}
.dce-role{font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--dce-black);background:var(--dce-gold);padding:4px 10px;border-radius:20px;font-weight:600}
.dce-logout{color:var(--dce-muted)}
.dce-logout:hover{color:var(--dce-gold)}

/* ---- Layout ---- */
.dce-main{max-width:1180px;margin:0 auto;padding:34px 28px 80px}
.dce-page-title{font-family:var(--dce-serif);font-size:30px;margin:0 0 4px}
.dce-page-title .gold{color:var(--dce-gold)}
.dce-page-sub{color:var(--dce-muted);margin:0 0 26px;font-size:14px}
.dce-rule{height:1px;background:linear-gradient(90deg,var(--dce-gold-dim),transparent);border:0;margin:22px 0}
.dce-footer{border-top:1px solid var(--dce-line);color:var(--dce-muted);text-align:center;padding:24px;font-size:12px;letter-spacing:1px}

/* ---- Hero / login (logged-out front page) ---- */
.dce-hero{min-height:78vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 20px}
.dce-hero .dce-mark{width:84px;height:84px;margin-bottom:18px}
.dce-hero h1{font-family:var(--dce-serif);font-size:46px;margin:0;line-height:1.1}
.dce-hero h1 .gold{color:var(--dce-gold)}
.dce-hero p{color:var(--dce-muted);max-width:520px;margin:14px auto 26px}
.dce-loginbox{background:var(--dce-panel);border:1px solid var(--dce-line);border-radius:14px;padding:26px;width:100%;max-width:360px;text-align:left;box-shadow:0 30px 60px rgba(0,0,0,.5)}
.dce-loginbox h3{font-family:var(--dce-serif);margin:0 0 14px;color:var(--dce-gold);font-size:18px}
.dce-loginbox label{display:block;font-size:12px;color:var(--dce-muted);margin:10px 0 4px;letter-spacing:.5px}
.dce-loginbox input[type=text],.dce-loginbox input[type=password]{width:100%;padding:11px 12px;border:1px solid var(--dce-line);background:#0f0f13;color:var(--dce-text);border-radius:9px;font-size:15px}
.dce-loginbox input:focus{outline:none;border-color:var(--dce-gold)}
.dce-loginbox .button-primary,.dce-loginbox button,.dce-loginbox input[type=submit]{
  margin-top:16px;width:100%;background:linear-gradient(180deg,var(--dce-gold-soft),var(--dce-gold));
  color:#1a1404;border:0;border-radius:9px;padding:12px;font-weight:700;font-size:15px;cursor:pointer;letter-spacing:.5px}
.dce-loginbox .button-primary:hover{filter:brightness(1.05)}
.dce-login-foot{font-size:12px;color:var(--dce-muted);margin-top:12px}

/* =========================================================
   Re-skin the Studio KPI Engine plugin app to black & gold
   ========================================================= */
.skpi-app{color:var(--dce-text);max-width:100%}
.skpi-app .skpi-head{border-bottom:1px solid var(--dce-gold-dim)}
.skpi-app .skpi-head h2{font-family:var(--dce-serif);color:var(--dce-gold)}
.skpi-app .skpi-asof{color:var(--dce-muted)}
.skpi-app h3{font-family:var(--dce-serif);color:var(--dce-gold-soft);margin-top:30px;font-weight:600}
.skpi-cards{gap:14px}
.skpi-card{background:var(--dce-panel);border:1px solid var(--dce-line);border-radius:12px}
.skpi-card span{color:var(--dce-muted)}
.skpi-card b{color:var(--dce-text)}
.skpi-card i{color:var(--dce-gold)}
.skpi-person{border:1px solid var(--dce-line);background:var(--dce-panel);border-radius:12px}
.skpi-person-h{background:linear-gradient(180deg,#1b160a,#141008);color:var(--dce-gold);border-bottom:1px solid var(--dce-gold-dim)}
.skpi-row{border-top:1px solid var(--dce-line)}
.skpi-row span{color:var(--dce-muted)}
.skpi-row em{color:var(--dce-gold)}
.skpi-tablewrap{overflow-x:auto;border:1px solid var(--dce-line);border-radius:12px;margin-top:8px}
.skpi-table{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
.skpi-table th{background:#13130f;color:var(--dce-gold);text-align:left;padding:10px 12px;border-bottom:1px solid var(--dce-gold-dim);font-weight:600}
.skpi-table td{padding:9px 12px;border-bottom:1px solid var(--dce-line);color:var(--dce-text)}
.skpi-table tr:nth-child(even) td{background:var(--dce-panel-2)}
.skpi-logform{background:var(--dce-panel);border:1px solid var(--dce-line);border-radius:12px}
.skpi-logform label{color:var(--dce-muted)}
.skpi-logform input,.skpi-logform select{background:#0f0f13;border:1px solid var(--dce-line);color:var(--dce-text)}
.skpi-logform input:focus,.skpi-logform select:focus{outline:none;border-color:var(--dce-gold)}
.skpi-logform button{background:linear-gradient(180deg,var(--dce-gold-soft),var(--dce-gold));color:#1a1404;font-weight:700}
.skpi-logform button:hover{filter:brightness(1.05)}
.skpi-msg{color:var(--dce-green)}
.skpi-note{color:var(--dce-muted)}
.skpi-err{color:var(--dce-red)}
.skpi-rev-in{width:120px;padding:6px 8px;background:#0f0f13;border:1px solid var(--dce-line);color:var(--dce-text);border-radius:6px}
.skpi-rev-save{margin-left:6px;background:var(--dce-gold);color:#1a1404;border:0;border-radius:6px;padding:6px 12px;cursor:pointer;font-weight:600}
.skpi-adminlinks{margin-top:26px;color:var(--dce-muted);font-size:13px;border-top:1px solid var(--dce-line);padding-top:14px}
.dce-notice{background:#241a0a;border:1px solid var(--dce-gold-dim);color:var(--dce-gold-soft);padding:16px 18px;border-radius:10px}

@media(max-width:640px){
  .dce-topbar{padding:12px 16px}
  .dce-brand .dce-name{font-size:17px}
  .dce-hero h1{font-size:34px}
  .dce-main{padding:24px 16px 60px}
}

/* ---- chart overrides (black & gold) ---- */
.skpi-chart{background:var(--dce-panel);border-color:var(--dce-line)}
.skpi-chart h4{color:var(--dce-gold-soft)}
.skpi-bar-label{color:var(--dce-muted)}
.skpi-bar-track,.skpi-progress{background:#0f0f13;border:1px solid var(--dce-line)}
.skpi-bar-fill,.skpi-progress-fill{background:linear-gradient(90deg,var(--dce-gold-dim),var(--dce-gold))}
.skpi-bar-val{color:var(--dce-text)}
.skpi-bar-target{background:var(--dce-gold-soft)}
.skpi-progress-cap,.skpi-chart-legend{color:var(--dce-muted)}
.skpi-chart-legend .tick{color:var(--dce-gold-soft)}
.skpi-export{background:linear-gradient(180deg,var(--dce-gold-soft),var(--dce-gold));color:#1a1404;font-weight:700}
.skpi-export:hover{filter:brightness(1.05)}

/* ============================================================
   v1.2.0 — Roboto, neat cards + drop shadows, infographics,
   countdown, projected-vs-actual (black & gold overrides)
   ============================================================ */

/* softer, rounder cards with depth */
.skpi-app .skpi-card,
.skpi-app .skpi-chart,
.skpi-app .skpi-person,
.skpi-app .skpi-logform,
.skpi-app .skpi-tablewrap{
  border-radius:16px;
  box-shadow:0 10px 30px rgba(0,0,0,.45), 0 1px 0 rgba(212,175,55,.06) inset;
}
.skpi-app .skpi-card{padding:18px;transition:transform .18s ease, box-shadow .18s ease}
.skpi-app .skpi-card:hover{transform:translateY(-2px);box-shadow:0 16px 40px rgba(0,0,0,.55)}
.skpi-app .skpi-chart{padding:20px}
.skpi-app h3{margin-top:34px}

/* control bar + editable date */
.skpi-controlbar{padding:10px 14px;background:var(--dce-panel);border:1px solid var(--dce-line);border-radius:14px;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.skpi-asof2{color:var(--dce-gold-soft)}
.skpi-controlbar input[type=date]{background:#0f0f13;border:1px solid var(--dce-line);color:var(--dce-text)}
.skpi-controlbar input[type=date]:focus{outline:none;border-color:var(--dce-gold)}
.skpi-month{color:var(--dce-muted)}

/* countdown card — make it a feature tile */
.skpi-cd{background:linear-gradient(160deg,#1b160a,#121016)!important;border:1px solid var(--dce-gold-dim)!important}
.skpi-cd span{color:var(--dce-gold-soft)}
.skpi-cd b{color:var(--dce-gold);font-size:30px}
.skpi-cd-track{background:#0f0f13}
.skpi-cd-bar{background:linear-gradient(90deg,var(--dce-gold-dim),var(--dce-gold))}

/* infographics */
.skpi-info-cap{color:var(--dce-muted)}
.skpi-gauge-bg{stroke:#22222b}
.skpi-gauge-arc{stroke:var(--dce-gold)}
.skpi-gauge-val{fill:var(--dce-gold)}
.skpi-gauge-sub{fill:var(--dce-muted)}
.skpi-leg{color:var(--dce-muted)}
.skpi-leg b{color:var(--dce-text)}

/* projected vs actual */
.skpi-pva-h{color:var(--dce-gold-soft)}
.skpi-pva-var.up{color:var(--dce-green);background:rgba(123,216,143,.12)}
.skpi-pva-var.down{color:var(--dce-red);background:rgba(224,121,107,.12)}
.skpi-pva-cap{color:var(--dce-muted)}
.skpi-pva-cap .tick{color:var(--dce-gold-soft)}

/* tabular figures everywhere for neatness */
.skpi-app .skpi-card b,.skpi-app .skpi-bar-val,.skpi-app .skpi-table td{font-variant-numeric:tabular-nums}

/* ============================================================
   v1.3.0 — luxury black · white · gold: team profiles, tasks,
   profit target, refined surfaces
   ============================================================ */
.skpi-app h3{position:relative;padding-bottom:8px;border-bottom:1px solid var(--dce-line);font-weight:700;letter-spacing:.3px}
.skpi-app h3:after{content:"";position:absolute;left:0;bottom:-1px;width:54px;height:2px;background:linear-gradient(90deg,var(--dce-gold),transparent)}

/* team profile cards */
.skpi-app .skpi-person{background:linear-gradient(180deg,#16161c,#101015);border:1px solid var(--dce-line);box-shadow:0 14px 36px rgba(0,0,0,.5)}
.skpi-person-top{border-bottom:1px solid var(--dce-line)}
.skpi-avatar{border:2px solid var(--dce-gold);box-shadow:0 0 0 4px rgba(212,175,55,.12)}
.skpi-avatar-ph{background:linear-gradient(135deg,var(--dce-gold-soft),var(--dce-gold-dim));color:#1a1404}
.skpi-person-name{color:#fff;letter-spacing:.3px}
.skpi-person-title{color:var(--dce-gold-soft);text-transform:uppercase;letter-spacing:1.5px;font-size:11px}
.skpi-stars .skpi-star{color:#3a3a44}
.skpi-stars .skpi-star.on{color:var(--dce-gold)}
.skpi-yrs{color:var(--dce-muted)}
.skpi-skill-n{color:var(--dce-muted)}
.skpi-skill-track{background:#0f0f13;border:1px solid var(--dce-line)}
.skpi-skill-fill{background:linear-gradient(90deg,var(--dce-gold-dim),var(--dce-gold))}
.skpi-person-kpis .skpi-row{border-top-color:var(--dce-line)}

/* tasks */
.skpi-badge{background:var(--dce-gold);color:#1a1404}
.skpi-app .skpi-task{background:#14141a;border:1px solid var(--dce-line);border-left:4px solid var(--dce-muted);box-shadow:0 10px 26px rgba(0,0,0,.45)}
.skpi-app .skpi-task.pri-high{border-left-color:var(--dce-red)}
.skpi-app .skpi-task.pri-low{border-left-color:var(--dce-green)}
.skpi-task-title{color:#fff}
.skpi-task-pill{background:#22222b;color:var(--dce-gold-soft)}
.skpi-task.done .skpi-task-pill{background:rgba(123,216,143,.14);color:var(--dce-green)}
.skpi-task-meta,.skpi-task-det{color:var(--dce-muted)}
.skpi-task-actions button{background:linear-gradient(180deg,var(--dce-gold-soft),var(--dce-gold));color:#1a1404;font-weight:700}
.skpi-task-actions .skpi-tk-del{background:#2a2a33;color:var(--dce-red)}

/* profit target tile */
.skpi-profit-meta{color:#fff}
.skpi-profit-meta span:first-child{color:var(--dce-gold)}
.skpi-profit-meta2{color:var(--dce-muted)}

/* luxury: white headline numbers, gold labels */
.skpi-app .skpi-card b{color:#fff}
.skpi-app .skpi-card span{color:var(--dce-gold-soft);text-transform:uppercase;letter-spacing:1px;font-size:11px}
.skpi-app .skpi-card i{color:var(--dce-muted)}

/* ============================================================
   v1.3.1 — force black card/surfaces over plugin light base
   (higher specificity than the plugin's bare classes)
   ============================================================ */
.skpi-app .skpi-card,
.skpi-app .skpi-chart,
.skpi-app .skpi-logform,
.skpi-app .skpi-tablewrap{
  background:linear-gradient(180deg,#161620,#0d0d12)!important;
  border:1px solid var(--dce-line)!important;
  color:var(--dce-text);
}
.skpi-app .skpi-card span{color:var(--dce-gold-soft)!important}
.skpi-app .skpi-card b{color:#fff!important}
.skpi-app .skpi-card i{color:var(--dce-muted)!important}
.skpi-app .skpi-cd{background:linear-gradient(160deg,#1c170b,#100e14)!important;border:1px solid var(--dce-gold-dim)!important}
.skpi-app .skpi-cd span{color:var(--dce-gold-soft)!important}
.skpi-app .skpi-cd b{color:var(--dce-gold)!important}
.skpi-app .skpi-person{background:linear-gradient(180deg,#16161c,#101015)!important}
.skpi-app .skpi-task{background:#14141a!important}
.skpi-app .skpi-chart h4{color:var(--dce-gold-soft)}
/* form + input surfaces dark */
.skpi-app .skpi-logform input,.skpi-app .skpi-logform select,
.skpi-app .skpi-controlbar input[type=date]{background:#0f0f13!important;border-color:var(--dce-line)!important;color:var(--dce-text)!important}
/* track backgrounds dark */
.skpi-app .skpi-bar-track,.skpi-app .skpi-skill-track,
.skpi-app .skpi-progress,.skpi-app .skpi-cd-track{background:#0f0f13!important}
