/* Opportunity Dashboard — colored account bands, typed rows, KPI strip */
.od-shell{padding:14px;max-width:1400px;margin:0 auto}
.od-hero{
  display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;
  margin-bottom:14px;padding:18px 20px;border-radius:16px;
  background:
    radial-gradient(700px 180px at 100% -20%,rgba(16,185,129,.28),transparent 55%),
    radial-gradient(500px 160px at 0% 120%,rgba(59,130,246,.22),transparent 55%),
    linear-gradient(120deg,#0f172a 0%,#132033 50%,#0b3b32 100%);
  border:1px solid rgba(56,189,248,.28);
  box-shadow:0 12px 28px -18px rgba(6,182,212,.55);
}
.od-hero h2{margin:0;font-size:20px;font-weight:800;color:#f8fafc}
.od-hero p{margin:6px 0 0;font-size:12.5px;color:rgba(226,232,240,.82);max-width:720px}

.od-kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:14px}
.od-kpi{
  --kpi:#3b82f6;
  position:relative;overflow:hidden;
  border:1px solid color-mix(in srgb,var(--kpi) 45%,var(--border));
  border-radius:16px;padding:14px 14px 14px 16px;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--kpi) 22%,transparent),transparent 58%),
    var(--bg2);
  box-shadow:0 10px 24px -18px color-mix(in srgb,var(--kpi) 70%,black);
}
.od-kpi::before{
  content:"";position:absolute;inset-inline-start:0;top:0;bottom:0;width:4px;
  background:linear-gradient(180deg,var(--kpi),color-mix(in srgb,var(--kpi) 40%,transparent));
}
.od-kpi-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.od-kpi-ico{
  width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:900;color:#fff;
  background:linear-gradient(145deg,var(--kpi),color-mix(in srgb,var(--kpi) 55%,#0f172a));
  box-shadow:0 6px 14px -8px var(--kpi);
}
.od-kpi-lbl{font-size:11px;font-weight:800;color:color-mix(in srgb,var(--kpi) 70%,var(--text2));text-transform:uppercase;letter-spacing:.45px}
.od-kpi-val{font-size:22px;font-weight:900;color:var(--text);margin-top:8px;font-variant-numeric:tabular-nums}
.od-kpi-sub{font-size:11px;color:var(--text2);margin-top:4px}

.od-toolbar{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:12px;align-items:center}
.od-toolbar-left,.od-toolbar-right{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.od-quarter-bar{
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  margin-bottom:12px;padding:10px 14px;border-radius:14px;
  border:1px solid var(--border);
  background:linear-gradient(90deg,rgba(59,130,246,.12),rgba(139,92,246,.08));
}
.od-quarter-title{font-size:12px;font-weight:800;color:var(--text2);white-space:nowrap}
.od-quarter-btns{display:inline-flex;gap:6px;flex-wrap:wrap}
.od-q-btn{
  border:1px solid var(--border);background:var(--bg2);color:var(--text2);
  padding:6px 12px;border-radius:999px;font-size:12px;font-weight:800;cursor:pointer;font-family:inherit;
  transition:all .14s ease;
}
.od-q-btn:hover{border-color:rgba(59,130,246,.45);color:var(--text)}
.od-q-btn.active{
  background:linear-gradient(120deg,rgba(59,130,246,.55),rgba(139,92,246,.42));
  border-color:rgba(147,197,253,.85);color:#fff;
  box-shadow:0 0 0 2px rgba(59,130,246,.35),0 8px 20px -10px rgba(59,130,246,.9);
  transform:translateY(-1px);
}
.od-quarter-hint-wrap{flex:1 1 220px;min-width:200px}
.od-quarter-hint{
  display:inline-block;font-size:14px;font-weight:900;letter-spacing:.03em;line-height:1.35;
  padding:6px 12px;border-radius:10px;
}
.od-quarter-hint-active{
  color:#bfdbfe;
  background:linear-gradient(90deg,rgba(59,130,246,.22),rgba(6,182,212,.14));
  border:1px solid rgba(96,165,250,.45);
  text-shadow:0 1px 8px rgba(59,130,246,.35);
}
.od-quarter-hint-muted{
  font-size:12px;font-weight:700;color:var(--text2);
  background:transparent;border:none;padding:0;
}
.od-year-select{min-width:110px}
.od-date-range{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.od-date-lbl{font-size:11px;font-weight:700;color:var(--text2)}
.od-date-input{min-width:140px}
.od-mgmt-toggle{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--text2);cursor:pointer}
.od-pill{
  font-size:11px;font-weight:700;padding:4px 10px;border-radius:999px;
  background:rgba(245,158,11,.16);color:#fbbf24;border:1px solid rgba(245,158,11,.35)
}
.od-panel{
  margin-bottom:14px;border:1px solid var(--border);border-radius:14px;background:var(--bg2);overflow:hidden
}
.od-panel-head{padding:12px 14px;border-bottom:1px solid var(--border)}
.od-panel-head h3{margin:0;font-size:14px;font-weight:800;color:var(--text)}
.od-muted{font-size:12px;color:var(--text2);margin:4px 0 0}
.od-unassigned{border-color:rgba(245,158,11,.35)}
.od-unassigned .od-panel-head{
  background:linear-gradient(90deg,rgba(245,158,11,.18),rgba(245,158,11,.04));
}

.od-accounts{display:flex;flex-direction:column;gap:12px}
.od-account{
  --acc:#3b82f6;
  border:1px solid color-mix(in srgb,var(--acc) 42%,var(--border));
  border-radius:16px;background:var(--bg2);overflow:hidden;
  box-shadow:0 10px 22px -18px color-mix(in srgb,var(--acc) 55%,black);
}
.od-account-head{
  display:flex;justify-content:space-between;gap:10px;align-items:center;
  padding:14px 16px;cursor:pointer;
  background:
    linear-gradient(100deg,color-mix(in srgb,var(--acc) 34%,transparent) 0%,color-mix(in srgb,var(--acc) 10%,transparent) 55%,transparent 100%),
    color-mix(in srgb,var(--acc) 8%,var(--bg2));
  border-bottom:1px solid color-mix(in srgb,var(--acc) 28%,transparent);
}
.od-account-head h3{margin:0;font-size:16px;font-weight:900;color:var(--text)}
.od-account-meta{
  display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px
}
.od-account-chip{
  display:inline-flex;align-items:center;gap:4px;
  font-size:11px;font-weight:800;padding:3px 9px;border-radius:999px;
  color:#fff;background:color-mix(in srgb,var(--acc) 78%,#0f172a);
  border:1px solid color-mix(in srgb,var(--acc) 55%,#fff);
}
.od-account-chip.soft{
  color:color-mix(in srgb,var(--acc) 85%,#fff);
  background:color-mix(in srgb,var(--acc) 18%,transparent);
}
.od-account-actions{display:flex;gap:8px;align-items:center}
.od-chevron{
  width:28px;height:28px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;
  color:#fff;background:color-mix(in srgb,var(--acc) 70%,#0f172a);font-size:13px
}
.od-account-body{padding:0 10px 12px}
.od-account-totals{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;
  margin-top:10px
}
.od-total-card{
  --tot:#64748b;
  border-radius:12px;padding:10px 12px;
  border:1px solid color-mix(in srgb,var(--tot) 40%,var(--border));
  background:linear-gradient(145deg,color-mix(in srgb,var(--tot) 18%,transparent),transparent 70%);
}
.od-total-card .od-muted{display:block;margin:0 0 4px;color:color-mix(in srgb,var(--tot) 65%,var(--text2));font-weight:700}
.od-total-card strong{font-size:15px;color:var(--text);font-variant-numeric:tabular-nums}

.od-table-wrap{overflow:auto}
.od-table{width:100%;border-collapse:collapse;font-size:12.5px}
.od-table th,.od-table td{padding:9px 10px;border-bottom:1px solid var(--border);text-align:start;vertical-align:middle}
.od-table th{font-size:11px;color:var(--text2);font-weight:700;white-space:nowrap}
.od-table tbody tr{transition:background .12s ease}
.od-row-type-cr td{background:rgba(59,130,246,.08)}
.od-row-type-hosting td{background:rgba(16,185,129,.09)}
.od-row-type-support_maintenance td{background:rgba(168,85,247,.09)}
.od-row-type-other td{background:rgba(100,116,139,.08)}
.od-row-status-draft td{box-shadow:inset 3px 0 0 #f59e0b}
.od-row-status-agreed td{box-shadow:inset 3px 0 0 #22c55e}
.od-row-status-collected td{box-shadow:inset 3px 0 0 #10b981}
.od-row-status-cancelled td{box-shadow:inset 3px 0 0 #ef4444;opacity:.78}
.od-row-overdue td{background:rgba(239,68,68,.12)!important;box-shadow:inset 3px 0 0 #ef4444}
.od-actions{white-space:nowrap}

.od-badge{
  display:inline-block;font-size:10.5px;font-weight:800;padding:2px 8px;border-radius:999px;border:1px solid transparent
}
.od-badge-cr{background:rgba(59,130,246,.16);color:#60a5fa;border-color:rgba(59,130,246,.35)}
.od-badge-host{background:rgba(16,185,129,.16);color:#34d399;border-color:rgba(16,185,129,.35)}
.od-badge-support{background:rgba(168,85,247,.16);color:#c084fc;border-color:rgba(168,85,247,.35)}
.od-badge-other{background:rgba(148,163,184,.16);color:#94a3b8;border-color:rgba(148,163,184,.35)}
.od-badge-ok{background:rgba(34,197,94,.16);color:#4ade80;border-color:rgba(34,197,94,.35)}
.od-badge-collected{background:rgba(16,185,129,.18);color:#34d399;border-color:rgba(16,185,129,.4)}
.od-badge-draft{background:rgba(245,158,11,.16);color:#fbbf24;border-color:rgba(245,158,11,.35)}
.od-badge-bad{background:rgba(239,68,68,.16);color:#f87171;border-color:rgba(239,68,68,.35)}
.od-empty{padding:28px 16px;text-align:center;color:var(--text2);border:1px dashed var(--border);border-radius:14px}
.od-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.od-form-grid .full{grid-column:1/-1}
.od-modal-card{width:100%;max-width:720px}
.od-details{display:grid;grid-template-columns:1fr 1fr;gap:12px;font-size:13px}
.od-details .full{grid-column:1/-1}
.od-details .od-muted{display:block;margin-bottom:2px}
@media (max-width:720px){
  .od-form-grid,.od-details{grid-template-columns:1fr}
  .od-hero{padding:14px}
  .od-search{min-width:0;width:100%}
}