*{box-sizing:border-box}
body{margin:0;font-family:Arial,sans-serif;background:#f4f7fb;color:#132238}
a{color:#0b4ea2;text-decoration:none}
a:hover{text-decoration:underline}
h1,h2{margin:0 0 .35rem}
p{margin:.2rem 0}.muted{color:#607086}
.topbar{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;padding:1.25rem 1.5rem;background:#0c2f6b;color:#fff}
.topbar .muted{color:#d7e3f4}
.page{padding:1.2rem;display:grid;gap:1rem;min-width:0}
.crm-page-shell{display:grid;gap:1rem;min-width:0;width:100%}
.crm-fullwidth-panels,.crm-table-area{width:100%;min-width:0;max-width:100%}
.topbar-actions{display:flex;gap:.8rem;align-items:center}
.user-badge{background:#143f86;border-radius:12px;padding:.75rem 1rem;display:flex;flex-direction:column;gap:.15rem}
.panel{background:#fff;border-radius:16px;padding:1rem;box-shadow:0 10px 25px rgba(17,39,67,.08);overflow:hidden;width:100%;max-width:100%;min-width:0}
.form-panel,.users-panel,.overview-panel{width:100%;max-width:100%}
.panel-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:10px;padding:.7rem 1rem;background:#e7eef8;color:#10243b;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{text-decoration:none;filter:brightness(.98)}
.btn-primary{background:#0c2f6b;color:#fff}
.btn-secondary{background:#f1f4f8}
.btn-danger{background:#ffe3e3;color:#8d2020}
.btn-small{padding:.45rem .6rem;font-size:.88rem}
.alert{padding:.9rem 1rem;border-radius:12px}
.alert-success{background:#e8f7ec;color:#14532d}
.alert-error{background:#ffe7e7;color:#842029}
.form-grid,.filter-grid{display:grid;gap:.9rem}
.form-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.filter-grid{grid-template-columns:2fr repeat(4,minmax(140px,1fr)) auto;align-items:end}
label{display:flex;flex-direction:column;gap:.35rem;font-size:.92rem;font-weight:700;min-width:0}
label span{color:#34465e}
input,select,textarea{width:100%;padding:.72rem .82rem;border:1px solid #d8e0ea;border-radius:10px;background:#fff;font:inherit}
input[readonly]{background:#f3f7fc;color:#30435c}
textarea{resize:vertical;min-height:92px}
.span-4{grid-column:span 4}
.form-actions,.filter-actions,.action-row{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.form-spacer{display:block}
.summary-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.75rem;margin:1rem 0 0}
.summary-card{background:#f4f7fb;border:1px solid #dbe4f2;border-radius:14px;padding:.9rem 1rem;display:flex;flex-direction:column;gap:.35rem}
.summary-card span{font-size:.86rem;color:#607086;text-transform:uppercase;letter-spacing:.03em}
.summary-card strong{font-size:1.15rem;white-space:nowrap}
.summary-card.accent{background:#fff6d8;border-color:#f2d36d}
.table-shell{position:relative;width:100%;min-width:0}
.table-scroll-overlay{position:sticky;top:10px;z-index:30;overflow-x:auto;overflow-y:hidden;height:18px;margin:0 0 .65rem 0;background:rgba(255,255,255,.96);border:1px solid #d9e1ea;border-radius:999px;backdrop-filter:blur(8px);box-shadow:0 4px 14px rgba(15,23,42,.08)}
.table-scroll-overlay-inner{height:1px}
.table-wrap{overflow:auto;border:1px solid #dbe4f2;border-radius:14px;background:#fff;width:100%;min-width:0}
.crm-table{border-collapse:separate;border-spacing:0;background:#fff;table-layout:fixed}
.crm-table.main-table{width:max-content;min-width:1830px}
.crm-table.compact{width:100%;min-width:640px;table-layout:auto}
.crm-table th,.crm-table td{padding:.75rem .8rem;border-top:1px solid #edf1f6;vertical-align:top;font-size:.92rem;position:relative;background:#fff}
.crm-table thead th{position:sticky;top:0;background:#0c2f6b;color:#fff;text-align:left;font-size:.88rem;white-space:nowrap;z-index:15;border-top:none}
.crm-table thead .group-row th{background:#1d74bc;color:#fff;text-align:center;z-index:16}
.crm-table tbody tr:nth-child(even) td{background:#fafcff}
.crm-table th a{color:#fff;text-decoration:none}
.crm-table th a:hover{text-decoration:underline}
.amount-cell{white-space:nowrap;min-width:126px}
.actions-cell{display:flex;gap:.4rem;flex-wrap:wrap;min-width:220px}
.empty-state{text-align:center;padding:2rem !important;color:#607086}
.status-chip{display:inline-flex;align-items:center;justify-content:center;padding:.7rem 1rem;min-width:128px;border-radius:6px;font-weight:500;white-space:nowrap;text-align:center;border:1px solid transparent}
.status-done{background:#c8d7e4;color:#003f7d}
.status-progress{background:#c7dbc0;color:#435400}
.status-failed{background:#e8a3a3;color:#7c0000}
.status-cancelled{background:#e6e6e6;color:#5c4300}
.status-refunded{background:#e6e6e6;color:#6a5a32}
.status-default{background:#eef3fb;color:#20497a}
.sticky-col{position:sticky !important;z-index:12;box-shadow:1px 0 0 #dbe4f2}
.crm-table thead .sticky-col{z-index:20}
.crm-table thead .group-row .sticky-col{z-index:21}
.sticky-col-1{left:0;min-width:74px;width:74px}
.sticky-col-2{left:74px;min-width:146px;width:146px}
.sticky-col-3{left:220px;min-width:150px;width:150px}
.sticky-col-4{left:370px;min-width:170px;width:170px}
.users-layout{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);gap:1rem;min-width:0}
.users-table-wrap{overflow:auto;border:1px solid #dbe4f2;border-radius:14px}
.two-col{display:grid;grid-template-columns:360px 1fr;gap:1rem}
.login-body{min-height:100vh;display:grid;place-items:center;padding:1.5rem;background:linear-gradient(180deg,#0c2f6b 0%,#f4f7fb 100%)}
.login-card{width:min(460px,100%);background:#fff;border-radius:18px;padding:1.4rem;box-shadow:0 18px 40px rgba(16,36,59,.18)}
.demo-box{margin-top:1rem;padding:.9rem 1rem;background:#f4f7fb;border-radius:12px}
.stack{display:grid;gap:.85rem}
.col-resize-handle{position:absolute;top:0;right:-3px;width:8px;height:100%;cursor:col-resize;z-index:35}
@media (max-width:1180px){
  .summary-row{grid-template-columns:repeat(3,minmax(0,1fr))}
  .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .span-4{grid-column:span 2}
  .filter-grid,.users-layout,.two-col{grid-template-columns:1fr}
  .form-spacer{display:none}
}
@media (max-width:720px){
  .topbar{flex-direction:column}
  .summary-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form-grid{grid-template-columns:1fr}
  .span-4{grid-column:span 1}
  .filter-grid{grid-template-columns:1fr}
}