/* ==========================================================
   TKLM CRM UI V4 — POLISHED / RBAC SAFE
   ========================================================== */
:root{
  --v4-bg:#0b0f16;
  --v4-panel:#121822;
  --v4-card:#171e2a;
  --v4-card2:#101722;
  --v4-line:#273245;
  --v4-line2:#36445c;
  --v4-text:#edf3f8;
  --v4-muted:#8f9cae;
  --v4-blue:#3b82f6;
  --v4-orange:#f97316;
  --v4-green:#22c55e;
  --v4-red:#ef4444;
  --v4-purple:#8b5cf6;
}

.tk-sidebar{
  background:linear-gradient(180deg,#0d121a 0%,#090d13 100%)!important;
  border-right:1px solid #202a39!important;
}
.tk-side-scroll{padding:18px 10px 20px!important}
.tk-sidebar .tk-nav-clean{gap:4px!important}
.tk-sidebar .tk-nav-clean .tk-nav-section{
  padding:13px 10px 5px!important;
  margin:3px 0 2px!important;
  font-size:9px!important;
  letter-spacing:.15em!important;
  color:#6f7c8e!important;
  font-weight:800!important;
}
.tk-sidebar .tk-nav-clean a{
  min-height:39px!important;
  height:auto!important;
  border-radius:8px!important;
  padding:9px 11px!important;
  font-size:12px!important;
  gap:10px!important;
}
.tk-sidebar .tk-nav-clean a i{
  color:#8392a6!important;
  width:18px!important;
}
.tk-sidebar .tk-nav-clean a.active{
  background:linear-gradient(90deg,rgba(59,130,246,.18),rgba(59,130,246,.05))!important;
  border-color:rgba(59,130,246,.30)!important;
  box-shadow:inset 2px 0 var(--v4-blue)!important;
}
.tk-sidebar .tk-nav-clean a.active i{color:#72aaff!important}
.tk-sidebar .tk-nav-clean .tk-nav-sub{
  margin-left:11px!important;
  width:calc(100% - 11px)!important;
  font-size:11px!important;
  min-height:35px!important;
}
.tk-topbar{
  background:rgba(10,14,20,.94)!important;
  border-bottom:1px solid #202a39!important;
}
.tk-content{width:min(100%,1680px)!important;padding:20px 20px 48px!important}
.tk-search input{background:#101722!important;border-color:#283348!important}
.tk-search input:focus{border-color:#4c83d9!important;box-shadow:0 0 0 3px rgba(59,130,246,.11)!important}

/* General controls */
.tkv4-btn{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:8px 12px;
  border-radius:8px;
  border:1px solid #34435a;
  background:#172235;
  color:#eef4fa!important;
  text-decoration:none!important;
  font-size:11px;
  font-weight:750;
  cursor:pointer;
  transition:.15s ease;
}
.tkv4-btn:hover{transform:translateY(-1px);filter:brightness(1.08);color:#fff!important}
.tkv4-btn.primary{background:#2563d9;border-color:#3b82f6}
.tkv4-btn.orange{background:#bd5e10;border-color:#e17720}
.tkv4-btn.green{background:#137a50;border-color:#249b6e}
.tkv4-btn.red{background:#a52f3a;border-color:#d44854}
.tkv4-btn.ghost{background:#111925;border-color:#2d3a4d}
.tkv4-btn.sm{min-height:32px;padding:6px 9px;font-size:10px}
.tkv4-btn i{font-size:12px}
.tkv4-input{
  height:38px;
  border:1px solid #2c394d!important;
  background:#0e151f!important;
  color:#fff!important;
  border-radius:8px!important;
  padding:0 11px!important;
  font-size:11px!important;
}
.tkv4-input:focus{outline:none;border-color:#4d82d5!important;box-shadow:0 0 0 3px rgba(59,130,246,.09)!important}

/* Page shell */
.tkv4-wrap{max-width:1620px;margin:0 auto}
.tkv4-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;
  margin:0 0 14px;
}
.tkv4-kicker{font-size:9px;color:#718097;text-transform:uppercase;letter-spacing:.14em;font-weight:800}
.tkv4-title{font-size:25px;line-height:1.1;margin:3px 0 0;color:#fff;font-weight:760;letter-spacing:-.025em}
.tkv4-sub{font-size:11px;color:var(--v4-muted);margin-top:5px}
.tkv4-toolbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.tkv4-panel{
  background:linear-gradient(145deg,#151d29,#101721);
  border:1px solid #263347;
  border-radius:12px;
  box-shadow:0 10px 28px rgba(0,0,0,.16);
}
.tkv4-badge{
  display:inline-flex;align-items:center;gap:5px;
  border-radius:999px;padding:4px 8px;
  background:#1d2939;color:#9cabbf;font-size:9px;font-weight:750;
  border:1px solid #2b3a50;
}
.tkv4-badge.blue{background:#122c51;color:#9cc8ff;border-color:#244e82}
.tkv4-badge.green{background:#103828;color:#82e2b0;border-color:#1e6045}
.tkv4-badge.orange{background:#432610;color:#f4b36f;border-color:#73441b}
.tkv4-badge.red{background:#421921;color:#f4a1a8;border-color:#6e2a35}

/* Portfolio */
.tkv4-filterbar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;
  padding:10px 12px;margin-bottom:12px;
}
.tkv4-tabs{display:flex;gap:6px;flex-wrap:wrap}
.tkv4-tabs a{
  display:inline-flex;align-items:center;gap:5px;padding:7px 10px;
  border-radius:999px;border:1px solid #2b394d;background:#111a26;
  color:#91a0b4!important;font-size:10px;font-weight:750;text-decoration:none!important;
}
.tkv4-tabs a.on{background:#19345e;border-color:#3567a5;color:#b7d7ff!important}
.tkv4-addbar{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  padding:10px 12px;margin:0 0 14px;
}
.tkv4-domain-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(340px,1fr));
  gap:12px;
}
.tkv4-domain-card{
  min-width:0;
  padding:14px;
  display:flex;flex-direction:column;
  background:linear-gradient(145deg,#171f2b,#121923);
  border:1px solid #273449;
  border-radius:12px;
  transition:.15s ease;
}
.tkv4-domain-card:hover{border-color:#3d506b;transform:translateY(-1px)}
.tkv4-domain-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.tkv4-domain-name{font-size:15px;color:#fff!important;font-weight:800;text-decoration:none!important}
.tkv4-score{font-size:26px;line-height:1;font-weight:850}
.tkv4-score.good{color:#49d99a}.tkv4-score.warn{color:#f0b35f}.tkv4-score.bad{color:#f16a78}
.tkv4-now{
  margin-top:10px;padding:10px 11px;border-radius:9px;
  background:#0f1722;border:1px solid #223149;border-left:3px solid #6698d8;
}
.tkv4-now.p1{border-left-color:#ef5968}.tkv4-now.p2{border-left-color:#e9a64c}.tkv4-now.p3{border-left-color:#5d9eea}
.tkv4-now .prio{font-size:8px;color:#8fa0b4;font-weight:800;text-transform:uppercase}
.tkv4-now b{display:block;font-size:12px;color:#fff;margin:4px 0}
.tkv4-now p{margin:0;color:#98a7ba;font-size:10px;line-height:1.35}
.tkv4-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}
.tkv4-metric{background:#0e151f;border:1px solid #1e2a3b;border-radius:8px;padding:7px}
.tkv4-metric b{display:block;color:#fff;font-size:14px}
.tkv4-metric span{display:block;color:#77869a;font-size:7px;text-transform:uppercase;margin-top:2px}
.tkv4-card-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:11px}
.tkv4-card-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap}

/* Domain dashboard */
.tkv4-domain-command{
  display:flex;align-items:center;gap:7px;flex-wrap:wrap;
  margin:10px 0 11px;
}
.tkv4-decision-grid{
  display:grid;grid-template-columns:.85fr .85fr 1.2fr 1.4fr 1fr;gap:8px;margin-bottom:10px
}
.tkv4-decision{
  padding:10px 11px;min-height:82px;
  background:linear-gradient(145deg,#151e2b,#101721);
  border:1px solid #27354a;border-radius:10px;
}
.tkv4-decision label{
  display:block;font-size:7px;color:#718298;text-transform:uppercase;letter-spacing:.08em;font-weight:800
}
.tkv4-decision b{display:block;margin-top:5px;color:#fff;font-size:12px;line-height:1.3}
.tkv4-decision .big{font-size:23px;line-height:1}
.tkv4-decision .small{font-size:8px;color:#8596aa;margin-top:4px;text-transform:none}
.good{color:#50daa6!important}.warn{color:#f0b65e!important}.bad{color:#fb7885!important}

.tkv4-hermes{
  padding:13px;margin:10px 0 12px;
  background:linear-gradient(135deg,#121e32,#0e1725);
  border:1px solid #34547b;border-radius:12px;
}
.tkv4-hermes-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.tkv4-hermes-title{font-size:15px;margin:5px 0 0;color:#fff;font-weight:800}
.tkv4-hermes-summary{font-size:10px;color:#cfdae7;line-height:1.5;margin-top:8px;white-space:pre-wrap}
.tkv4-ai-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}
.tkv4-ai-card{background:#0b1420;border:1px solid #21334a;border-radius:9px;padding:9px}
.tkv4-ai-card h3{font-size:10px;margin:0 0 5px;color:#fff}
.tkv4-ai-row{padding:6px 0;border-top:1px solid #1b2b3e;font-size:9px}
.tkv4-ai-row:first-of-type{border-top:0}
.tkv4-ai-rec{color:#9eafc2;margin-top:3px;line-height:1.35}

.tkv4-section-title{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:14px;color:#fff;margin:13px 0 8px;font-weight:800
}
.tkv4-actions-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.tkv4-action{
  padding:10px 11px;border:1px solid #26364c;border-top:3px solid #517cab;border-radius:10px;
  background:linear-gradient(145deg,#151d29,#0f1620);
}
.tkv4-action.p1{border-top-color:#ef5f6c}.tkv4-action.p2{border-top-color:#efb051}.tkv4-action.p3{border-top-color:#5f9fe9}
.tkv4-action .prio{font-size:7px;color:#8191a6;text-transform:uppercase;font-weight:850}
.tkv4-action h3{font-size:12px;color:#fff;margin:5px 0}
.tkv4-action p{font-size:9px;color:#9aabbf;margin:5px 0;line-height:1.35}
.tkv4-action .effect{border-top:1px solid #223147;padding-top:5px}

.tkv4-kpis{
  display:grid;grid-template-columns:repeat(4,1fr);gap:7px;
}
.tkv4-kpi{padding:9px;background:#0e151f;border:1px solid #1e2b3d;border-radius:9px}
.tkv4-kpi b{display:block;color:#fff;font-size:17px}
.tkv4-kpi span{display:block;color:#77889d;font-size:7px;text-transform:uppercase;margin-top:2px}

.tkv4-chart-grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tkv4-chart-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:8px}
.tkv4-chartbox{padding:10px;background:#101823;border:1px solid #27354a;border-radius:10px}
.tkv4-chartbox>strong{font-size:10px;color:#fff}
.tkv4-chart{height:160px}
.tkv4-chart svg{width:100%;height:100%;display:block}
.tkv4-legend{display:flex;gap:10px;flex-wrap:wrap;font-size:7px;color:#91a2b6}
.tkv4-legend i{display:inline-block;width:9px;height:3px;margin-right:4px}

.tkv4-details{margin-top:10px}
.tkv4-details details{
  background:#111923;border:1px solid #27354a;border-radius:9px;margin-top:6px;overflow:hidden
}
.tkv4-details summary{
  cursor:pointer;padding:10px 11px;font-size:10px;color:#e6edf5;font-weight:800;list-style:none
}
.tkv4-details summary::-webkit-details-marker{display:none}
.tkv4-details summary:after{content:"+";float:right;color:#7f91a7}
.tkv4-details details[open] summary:after{content:"−"}
.tkv4-inside{padding:0 11px 11px}
.tkv4-row{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid #1e2b3d;font-size:9px}
.tkv4-table{width:100%;border-collapse:collapse;font-size:9px}
.tkv4-table th,.tkv4-table td{padding:6px;border-bottom:1px solid #1f2c3e;text-align:left}
.tkv4-table th{color:#8999ae;font-size:8px;text-transform:uppercase}
.tkv4-srcs{display:flex;gap:5px;flex-wrap:wrap}
.tkv4-src{padding:4px 6px;border-radius:999px;background:#421a23;color:#d6a0ad;font-size:7px}
.tkv4-src.on{background:#103b2c;color:#7ce2b0}

@media(max-width:1180px){
  .tkv4-decision-grid{grid-template-columns:repeat(2,1fr)}
  .tkv4-decision-grid .tkv4-decision:last-child{grid-column:1/-1}
  .tkv4-actions-grid{grid-template-columns:1fr}
}
@media(max-width:980px){
  .tkv4-domain-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tkv4-kpis{grid-template-columns:repeat(3,1fr)}
  .tkv4-chart-grid2,.tkv4-chart-grid3,.tkv4-ai-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
  .tkv4-domain-grid{grid-template-columns:1fr}
  .tkv4-kpis{grid-template-columns:repeat(2,1fr)}
  .tkv4-metrics{grid-template-columns:repeat(2,1fr)}
}