:root {
    /* Brand colors */
  --brand-primary:#2563eb;
  --brand-secondary:#7c3aed;
  --brand-accent:#22c55e;
  --surface:#020617;
  --surface-alt:#0b1120;
  --section-alt:rgba(15,23,42,.6);

  /* Status colors */
  --status-resolved:#16a34a;
  --status-underdev:#2563eb;
  --status-rejected:#dc2626;
  --status-onhold:#d97706;
  --status-notstarted:#6b7280;
  --status-sent:#7c3aed;
  --status-onstage:#0284c7;

  /* Priority colors */
  --priority-high:#dc2626;
  --priority-medium:#d97706;
  --priority-low:#16a34a;

  /* Theme – dark (default) */
  --bg:#020617;
  --card:#020617;
  --muted:#9ca3af;
  --text:#e5e7eb;
  --accent:var(--brand-primary);
  --danger:#dc2626;
  --ok:#16a34a;
  --warn:#d97706;
  --info:#2563eb;
  --purple:#7c3aed;
  --neutral:#6b7280;
  --border:#1f2933;
  --shadow:0 14px 30px rgba(15,23,42,.45);
  --focus:0 0 0 2px rgba(37,99,235,.55);

  /* Extra */
  --chip:#020617;
  --skeleton:#0b1120;
  --shimmer:linear-gradient(90deg, transparent, rgba(148,163,184,.18), transparent);
   --risk-bar-track:rgba(55,65,81,.55);
  
}
:root[data-theme="light"] {
  --brand-primary:#1d4ed8;
  --brand-secondary:#6d28d9;
  --brand-accent:#16a34a;
  --surface:#ffffff;
  --surface-alt:#f9fafb;
  --section-alt:#eef2ff;
  
  --bg:#f3f4f6;
  --card:#ffffff;
  --muted:#6b7280;
  --text:#111827;
  --accent:var(--brand-primary);
  --danger:#b91c1c;
  --ok:#15803d;
  --warn:#c2410c;
  --info:#1d4ed8;
  --purple:#7c3aed;
  --neutral:#4b5563;
  --border:#e5e7eb;
  --shadow:0 10px 24px rgba(148,163,184,.35);
  --focus:0 0 0 2px rgba(37,99,235,.45);
  --chip:#f9fafb;
  --skeleton:#e5e7eb;
  --shimmer:linear-gradient(90deg, transparent, rgba(156,163,175,.25), transparent);
    --risk-bar-track:rgba(148,163,184,.5);
  
}


/* Base */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:var(--bg);
  color:var(--text);
  transition:background .2s ease,color .2s ease;
  line-height:1.5;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body.drawer-open{
  overflow:hidden;
}

body.auth-locked #appHeader,
body.auth-locked #features,
body.auth-locked #app{
  display:none;
}

body:not(.auth-locked) #loginSection{
  display:none;
}

body.auth-locked #loginSection{
  min-height:100vh;
  display:flex;
  align-items:center;
  background:#202994;
}

body.auth-locked #loginSection .hero-grid{
  grid-template-columns:minmax(320px, 420px);
  justify-content:center;
}

body.auth-locked #loginSection .hero-grid > div{
  display:none;
}

body.auth-locked #loginSection .container{
  max-width:560px;
}

.login-product-name{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:4px;
  margin:2px 0 14px;
  text-align:center;
}
.login-product-name strong{
  font-size:1.05rem;
  letter-spacing:.01em;
}
.login-product-name span{
  font-size:.78rem;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.12em;
}

h1,h2,h3,h4{
  font-weight:700;
  letter-spacing:-.02em;
  margin:0;
}
h1{
  font-size:clamp(2.2rem, 3.2vw, 3.4rem);
  line-height:1.05;
}
h2{
  font-size:clamp(1.6rem, 2.2vw, 2.2rem);
  line-height:1.2;
}
p{
  margin:0;
  font-size:1rem;
  line-height:1.6;
}
small{
  font-size:.85rem;
}
:focus-visible{
  outline:none;
  box-shadow:var(--focus);
  border-radius:6px;
}

.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* Header */
#appHeader.app-topbar{
  position:sticky;
  top:16px;
  z-index:20;
  width:calc(100% - 32px);
  min-height:82px;
  margin:16px;
  padding:12px 18px;
  border:1px solid rgba(226,232,240,.9);
  border-radius:22px;
  background:rgba(255,255,255,.96);
  color:#0f172a;
  box-shadow:0 18px 45px rgba(15,23,42,.08);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  display:flex;
  align-items:center;
  gap:18px;
  justify-content:flex-start;
  overflow:visible;
}
:root[data-theme="light"] #appHeader.app-topbar{
  background:rgba(255,255,255,.96);
}
.brand{
  display:flex;align-items:center;gap:10px;
}
.brand-logo{height:38px;width:auto;display:block;object-fit:contain;}
.brand-text{display:flex;flex-direction:column}
.brand-text span:first-child{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
}
.brand-text span:last-child{
  font-size:15px;
  font-weight:600;
}
.topbar-menu-btn,
.topbar-icon-btn,
.topbar-language,
.topbar-profile,
.topbar-logout{
  border:1px solid #e5e7eb;
  background:#fff;
  color:#0f172a;
  font:inherit;
  cursor:pointer;
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease,transform .12s ease,color .16s ease;
}
.topbar-menu-btn{
  flex:0 0 auto;
  width:58px;
  height:58px;
  border-radius:18px;
  border-color:#2563eb;
  background:#2563eb;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
  line-height:1;
  box-shadow:0 14px 28px rgba(37,99,235,.28);
}
.topbar-menu-btn:hover{background:#1d4ed8;border-color:#1d4ed8;transform:translateY(-1px)}
.topbar-brand{display:flex;align-items:center;gap:0;flex:0 0 auto;min-width:0;}
.topbar-logo{
  width:210px;height:60px;border-radius:14px;background:transparent;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  border:0;padding:2px 4px;
}
.topbar-logo .brand-logo{width:100%;height:100%;object-fit:contain;}
.topbar-brand-text{display:none;}
.topbar-brand-text strong{font-size:17px;color:#0f172a;letter-spacing:-.02em;}
.topbar-brand-text span{font-size:10px;font-weight:800;letter-spacing:.18em;color:#64748b;margin-top:4px;}
.topbar-divider{width:1px;height:42px;background:#e5e7eb;flex:0 0 auto;}
.topbar-search{
  flex:1 1 360px;min-width:220px;max-width:620px;height:52px;border:1px solid #e5e7eb;border-radius:999px;
  background:#f8fafc;display:flex;align-items:center;gap:10px;padding:0 12px 0 18px;color:#64748b;
}
.topbar-search:focus-within{border-color:#93c5fd;box-shadow:0 0 0 4px rgba(37,99,235,.10);background:#fff;}
.topbar-search-icon{font-size:20px;color:#2563eb;}
.topbar-search input{border:0;outline:0;background:transparent;color:#0f172a;width:100%;min-width:0;font:inherit;font-size:14px;}
.topbar-search input::placeholder{color:#94a3b8;}
.topbar-search-shortcut{flex:0 0 auto;border:1px solid #e5e7eb;background:#fff;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:700;color:#64748b;}
.toolbar.topbar-actions{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:nowrap;min-width:0;}
.topbar-icon-btn{width:46px;height:46px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;font-size:18px;position:relative;box-shadow:0 8px 20px rgba(15,23,42,.04);}
.topbar-icon-btn:hover,.topbar-language:hover,.topbar-profile:hover,.topbar-logout:hover{color:#2563eb;border-color:#bfdbfe;background:#eff6ff;transform:translateY(-1px);box-shadow:0 10px 22px rgba(37,99,235,.12);}
.notification-shell{position:relative;display:inline-flex;}
.topbar-badge{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#ef4444;color:#fff;border:2px solid #fff;font-size:10px;font-weight:800;align-items:center;justify-content:center;line-height:1;}
.topbar-online{height:38px;display:inline-flex;align-items:center;gap:7px;padding:0 12px;border-radius:999px;background:#f0fdf4;border:1px solid #bbf7d0;color:#16a34a;font-size:13px;font-weight:800;white-space:nowrap;}
.topbar-online > span:first-child{width:8px;height:8px;border-radius:999px;background:#16a34a;box-shadow:0 0 0 4px rgba(22,163,74,.12);}
.topbar-online.offline{background:#fff7ed;border-color:#fed7aa;color:#c2410c;}
.topbar-online.offline > span:first-child{background:#f97316;box-shadow:0 0 0 4px rgba(249,115,22,.12);}
.topbar-language{height:42px;border-radius:14px;display:inline-flex;align-items:center;gap:7px;padding:0 11px;font-size:13px;font-weight:800;white-space:nowrap;}
.topbar-profile{height:52px;border-radius:18px;display:inline-flex;align-items:center;gap:10px;padding:6px 10px 6px 7px;min-width:0;}
.topbar-avatar{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#2563eb,#1d4ed8);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:900;letter-spacing:.02em;flex:0 0 auto;}
.topbar-user-info{display:flex;flex-direction:column;align-items:flex-start;line-height:1.15;min-width:0;}
.topbar-user-info strong{font-size:13px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#0f172a;}
.topbar-role-badge{margin-top:4px;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border-radius:999px;background:#eff6ff;color:#1d4ed8;padding:3px 8px;font-size:10px;font-weight:800;text-transform:capitalize;}
.topbar-profile-arrow{color:#64748b;font-size:13px;}
.topbar-logout{height:42px;border-radius:14px;display:inline-flex;align-items:center;gap:7px;padding:0 13px;font-size:13px;font-weight:800;white-space:nowrap;}
@media (max-width:1024px){
  #appHeader.app-topbar{gap:12px;padding:12px 14px;}
  .topbar-search{flex-basis:240px;max-width:360px;}
  .topbar-role-badge,.topbar-profile-arrow{display:none;}
  .topbar-user-info strong{max-width:110px;}
}
@media (max-width:768px){
  #appHeader.app-topbar{top:10px;width:calc(100% - 20px);margin:10px;min-height:auto;flex-wrap:wrap;border-radius:20px;gap:10px;}
  .topbar-menu-btn{width:50px;height:50px;border-radius:16px;}
  .topbar-brand-text{display:none;}
  .topbar-divider{display:none;}
  .topbar-search{order:3;flex:1 0 100%;max-width:none;height:46px;}
  .toolbar.topbar-actions{flex:1 1 auto;gap:8px;justify-content:flex-end;}
  .topbar-language span:nth-child(2),.topbar-user-info{display:none;}
  .topbar-profile{height:46px;padding:4px;border-radius:15px;}
  .topbar-avatar{width:36px;height:36px;}
}
@media (max-width:560px){
  #appHeader.app-topbar{padding:10px;gap:8px;}
  .topbar-logo{width:150px;height:42px;border-radius:13px;padding:2px 4px;background:transparent;border:0;}
  .topbar-icon-btn{width:40px;height:40px;border-radius:13px;font-size:16px;}
  .topbar-online{height:34px;padding:0 9px;font-size:12px;}
  .topbar-language{height:38px;padding:0 9px;}
  .topbar-logout{width:40px;height:40px;padding:0;justify-content:center;}
  .topbar-logout-text,.topbar-search-shortcut{display:none;}
}

/* Toolbar */
.toolbar{
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
  font-size:13px;
  justify-content:center;
}
.saved-views{
  display:flex;
  align-items:center;
  gap:6px;
}

.pwa-install-banner{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:1200;
  padding:0 12px calc(12px + env(safe-area-inset-bottom));
  transform:translateY(120%);
  opacity:0;
  pointer-events:none;
  transition:transform .25s ease, opacity .25s ease;
}
.pwa-install-banner.show{
  transform:translateY(0);
  opacity:1;
  pointer-events:auto;
}
.pwa-install-banner__surface{
  margin:0 auto;
  width:min(680px,100%);
  display:grid;
  grid-template-columns:auto 1fr;
  gap:12px;
  align-items:start;
  background:var(--card);
  color:var(--text);
  border:1px solid var(--border);
  border-radius:16px 16px 10px 10px;
  box-shadow:0 -10px 26px rgba(2,6,23,.25);
  padding:12px;
}
.pwa-install-banner__icon{
  border-radius:9px;
  border:1px solid var(--border);
  background:rgba(15,23,42,.06);
}
.pwa-install-banner__content{min-width:0;}
.pwa-install-banner__title{margin:0;font-size:15px;}
.pwa-install-banner__body{
  margin:6px 0 0;
  color:var(--muted);
  font-size:13px;
}
.pwa-install-banner__actions{
  grid-column:1 / -1;
  display:flex;
  gap:8px;
}
.pwa-install-banner__actions .btn{
  flex:1 1 0;
  min-height:40px;
}

/* Inputs / buttons */
.btn,.select,.input{
  padding:7px 11px;
  border-radius:999px;
  border:1px solid var(--border);
  background:#020617;
  color:inherit;
  font:inherit;
  transition:border-color .15s ease,background .15s ease,box-shadow .15s ease,transform .08s ease,color .15s ease;
}
:root[data-theme="light"] .btn,
:root[data-theme="light"] .select,
:root[data-theme="light"] .input{
  background:#ffffff;
}

.btn{
  cursor:pointer;
  font-weight:500;
  display:inline-flex;align-items:center;gap:6px;
  box-shadow:none;
}
.btn.cta{
  padding:12px 20px;
  border-radius:999px;
  font-size:15px;
  font-weight:600;
  letter-spacing:.01em;
}
.btn.primary{
  background:var(--accent);
  border-color:var(--accent);
  color:#fff;
   text-shadow:0 1px 0 rgba(0,0,0,.16);
}
:root[data-theme="light"] .btn.primary{
  color:#000;
  text-shadow:none;
}
.btn.ghost{
  border-color:transparent;
  background:transparent;
  box-shadow:none;
}
.btn.sm,
.btn.btn-sm{
  padding:5px 9px;
  border-radius:999px;
  font-size:12px;
}
.btn.btn-success{
  background:var(--ok);
  border-color:var(--ok);
  color:#fff;
}
.btn.btn-danger{
  background:var(--danger);
  border-color:var(--danger);
  color:#fff;
}
.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 10px rgba(15,23,42,.25);
}
.btn.primary:hover{
  background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary));
  border-color:transparent;
}
.btn.ghost:hover{
  background:rgba(148,163,184,.12);
}
.btn:active{
  transform:translateY(0);
  box-shadow:0 2px 6px rgba(15,23,42,.35) inset;
}
.btn:disabled{
  opacity:.55;
  cursor:not-allowed;
  box-shadow:none;
}
.btn:focus-visible{
  box-shadow:0 0 0 2px rgba(37,99,235,.7);
  border-color:var(--accent);
}
.theme-toggle-btn{
  width:34px;
  height:34px;
  min-width:34px;
  padding:0;
  border-radius:999px;
  justify-content:center;
  font-size:16px;
  line-height:1;
  transition:transform .15s ease, box-shadow .15s ease, background .2s ease;
}
.theme-toggle-btn:hover{
  transform:translateY(-1px) scale(1.02);
}
.theme-toggle-btn:focus-visible{
  box-shadow:0 0 0 2px rgba(79,140,255,.75);
}

.input,.select{
  background:#020617;
  box-shadow:none;
}
.input::placeholder{color:var(--muted)}

.proposal-lock-message{
  margin:0 0 12px;
  padding:10px 12px;
  border:1px solid rgba(245, 158, 11, .45);
  border-radius:12px;
  background:rgba(245, 158, 11, .12);
  color:#fbbf24;
  font-weight:700;
}

.readonly-field.locked-field{
  background:rgba(100,116,139,.14);
  color:var(--text);
  cursor:not-allowed;
}
.form-section{
  margin-top:1rem;
  padding-top:.75rem;
  border-top:1px solid rgba(148,163,184,.25);
}
.form-section-header h3{
  margin:0;
  font-size:.95rem;
  font-weight:700;
}
.form-section-header p{
  margin:.25rem 0 .75rem;
  font-size:.75rem;
  color:var(--muted);
}
.form-grid.readonly-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.75rem 1rem;
}

.signatory-section{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  align-items:start;
}
.signatory-column{
  display:grid;
  gap:12px;
  align-content:start;
}
@media(max-width:640px){
  .signatory-section{grid-template-columns:1fr;}
}
.form-group-full{
  grid-column:1 / -1;
}
@media (max-width:768px){
  .form-grid.readonly-grid{
    grid-template-columns:1fr;
  }
}

/* Keep proposal/agreement dropdown menu options visually aligned with status filters */
#statusFilter option,
#proposalsStatusFilter option,
#agreementsStatusFilter option,
#proposalFormStatus option,
#agreementFormStatus option{
  background:#020617;
  color:var(--text);
}
:root[data-theme="light"] #statusFilter option,
:root[data-theme="light"] #proposalsStatusFilter option,
:root[data-theme="light"] #agreementsStatusFilter option,
:root[data-theme="light"] #proposalFormStatus option,
:root[data-theme="light"] #agreementFormStatus option{
  background:#ffffff;
  color:#0f172a;
}

/* Marketing layout */
.section{
  padding:64px 0;
}
.section.alt{
  background:var(--section-alt);
}
.container{
  width:100%;
  max-width:1120px;
  margin:0 auto;
  padding:0 24px;
}
.hero{
  position:relative;
  overflow:hidden;
}
.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 10% 20%, rgba(59,130,246,.25), transparent 55%),
    radial-gradient(circle at 90% 10%, rgba(124,58,237,.25), transparent 45%);
  pointer-events:none;
}
.hero-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:36px;
  align-items:center;
  position:relative;
  z-index:1;
}
.hero p{
  color:var(--muted);
  font-size:1.05rem;
}
.hero-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 12px;
  border-radius:999px;
  background:rgba(37,99,235,.12);
  color:var(--accent);
  font-size:.8rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:16px;
}
.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:22px;
}
.hero-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:20px;
  padding:22px;
  box-shadow:var(--shadow);
  display:grid;
  gap:16px;
}
.hero-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}
.metric{
  padding:12px;
  border-radius:14px;
  background:var(--surface-alt);
  border:1px solid var(--border);
}
.metric h3{
  font-size:1.15rem;
}
.metric span{
  color:var(--muted);
  font-size:.85rem;
}

.login-card h2{
  font-size:1.45rem;
}
.login-form{
  display:grid;
  gap:14px;
}
.login-form .input,
.login-form .select,
.login-form .btn{
  width:100%;
  border-radius:8px;
}
.login-form .btn{
  justify-content:center;
  margin-top:8px;
  letter-spacing:.02em;
  font-weight:700;
}

body.auth-locked .login-card{
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
  gap:22px;
}

body.auth-locked .login-logo,
.login-brand-logo,
.auth-brand-logo{
  display:block;
  width:min(500px,88vw);
  max-width:500px;
  height:auto;
  max-height:180px;
  object-fit:contain;
  object-position:center;
  margin:0 auto 1rem;
  background:transparent;
  border:0;
  box-shadow:none;
}

body.auth-locked .login-logo{
  filter:none;
}

body.auth-locked .login-form .input,
body.auth-locked .login-form .select{
  border:none;
  background:#f3f4f6;
  color:#374151;
  min-height:50px;
  padding:0 20px;
  font-size:1.05rem;
}

body.auth-locked .login-form .input::placeholder{
  color:#4b5563;
}

body.auth-locked .login-form .btn.primary{
  border:none;
  background:#18256e;
  color:#fff;
  min-height:50px;
}

body.auth-locked .login-form .btn.primary:hover{
  background:#121d58;
  transform:none;
  box-shadow:none;
}

body.auth-locked .login-hint{
  color:#dbe3ff;
  text-align:center;
}
.feature-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.feature-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  padding:22px;
  display:grid;
  gap:10px;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.feature-card:hover{
  transform:translateY(-4px);
  border-color:rgba(37,99,235,.6);
  box-shadow:0 18px 34px rgba(15,23,42,.35);
}
.feature-card img{
  width:40px;
  height:40px;
}
.testimonial-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:18px;
}
.testimonial{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;
  padding:20px;
  display:grid;
  gap:12px;
}
.testimonial strong{
  font-size:.95rem;
}
@media(max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .testimonial-grid{grid-template-columns:1fr}
}
@media(max-width:640px){
  .hero-metrics{grid-template-columns:1fr}
  .feature-grid{grid-template-columns:1fr}
}
.input:focus-visible,
.select:focus-visible{
  box-shadow:var(--focus);
  border-color:var(--accent);
  outline:none;
}
:root[data-theme="light"] .input,
:root[data-theme="light"] .select{
  background:#ffffff;
}
.icon{font-size:18px;line-height:1}

#accentColor{
  padding:2px;
  width:38px;
  min-width:38px;
  border-radius:999px;
}

/* Status line */
.statusline{
  display:flex;gap:10px;align-items:center;margin-left:8px;
  font-size:12px;
}
.dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.ok{background:var(--ok)} .warn{background:var(--warn)} .err{background:var(--danger)}
.chip{
  padding:3px 8px;border-radius:999px;background:var(--chip);
  border:1px solid var(--border);font-size:12px;color:var(--muted);
  display:inline-flex;align-items:center;gap:6px;
}
.chip.online{border-color:var(--ok);color:var(--ok)}
.chip.offline{border-color:var(--warn);color:var(--warn)}

/* Layout */
.wrap{
  display:grid;grid-template-columns:minmax(0,1fr);
  gap:18px;padding:18px;max-width:1440px;margin:0 auto;
}
.wrap.csm-filters-only{
  grid-template-columns:minmax(0,1fr);
}
.wrap.csm-filters-only .sidebar{
  display:none;
}
.wrap.is-locked{
  display:none;
}
@media(max-width:980px){.wrap{grid-template-columns:1fr}}

/* Sidebar */
.sidebar{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 14px 16px;
  box-shadow:var(--shadow);
}
.sidebar h3{
  margin:0 0 8px;font-size:11px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.12em;
}
.filter-group{display:grid;gap:9px;margin-bottom:14px}
.filter-row{display:grid;gap:5px}
.muted{color:var(--muted);font-size:12px}
.divider{
  height:1px;background:var(--border);
  margin:10px 0 14px;opacity:.85;
}

/* Scrollbars (sidebar, table, modals) */
.sidebar::-webkit-scrollbar,
.table-wrap::-webkit-scrollbar,
.modal-content::-webkit-scrollbar{
  width:8px;
}
.sidebar::-webkit-scrollbar-track,
.table-wrap::-webkit-scrollbar-track,
.modal-content::-webkit-scrollbar-track{
  background:transparent;
}
.sidebar::-webkit-scrollbar-thumb,
.table-wrap::-webkit-scrollbar-thumb,
.modal-content::-webkit-scrollbar-thumb{
  background:rgba(107,114,128,.6);
  border-radius:999px;
}
.sidebar,
.table-wrap,
.modal-content{
  scrollbar-width:thin;
  scrollbar-color:rgba(107,114,128,.7) transparent;
}

/* Content & tabs */
.content{min-width:0}
.sidebar{order:1}
.content{order:2}
.content-layout{
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  gap:16px;
  align-items:start;
}
.view-menu{
  position:sticky;
  top:82px;
  padding:12px;
}
.view-menu-title{
  margin:0 0 10px;
  font-size:11px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.12em;
}
.view-tabs{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.view-tab{
  border:1px solid transparent;background:transparent;color:var(--muted);
  padding:8px 10px;border-radius:10px;font-size:13px;cursor:pointer;
  display:flex;align-items:center;gap:8px;width:100%;
  text-align:left;
}
.view-tab .icon{font-size:15px}
.view-tab.active{
  background:var(--accent);
  color:#fff;
  border-color:transparent;
}
.view-tab:not(.active):hover{
  border-color:var(--border);
  color:var(--text);
}
.content-panels{
  min-width:0;
}

.view{display:none}
.view.active{display:block}
.view>*+*{margin-top:14px}
.user-form-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
#usersTable th,#usersTable td{
  white-space:nowrap;
}
#rolePermissionsTable th,#rolePermissionsTable td{
  white-space:nowrap;
}
@media(max-width:980px){
  .user-form-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:640px){
  .user-form-grid{
    grid-template-columns:1fr;
  }
}
@media(max-width:980px){
  .wrap{
    padding-top:8px;
  }
  .content-layout{
    grid-template-columns:220px minmax(0,1fr);
  }
  .view-menu{
    position:sticky;
    top:82px;
    padding:10px;
  }
  .view-tabs{
    flex-direction:column;
    flex-wrap:nowrap;
  }
  .view-tab{
    width:100%;
  }
}


.grid{display:grid;gap:14px}
.grid.cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:640px){.grid.cols-2{grid-template-columns:1fr}}
@media(max-width:980px){.grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.grid.cols-4{grid-template-columns:1fr}}

.grid.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}
@media(max-width:980px){.grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.grid.cols-3{grid-template-columns:1fr}}

.rp-chip{
  display:inline-flex;
  align-items:center;
  border:1px solid var(--border);
  border-radius:999px;
  padding:2px 8px;
  font-size:12px;
  margin:2px 4px 2px 0;
  background:rgba(125,211,252,.08);
}

/* Cards */
.card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  padding:14px 14px 15px;
  box-shadow:var(--shadow);
  transition:border-color .15s ease,box-shadow .15s ease,transform .08s ease,background .15s ease;
}
.card:hover{
  border-color:rgba(37,99,235,.7);
    box-shadow:0 14px 30px rgba(15,23,42,.45);
  transform:translateY(-2px);
  background:rgba(15,23,42,.96);
}
:root[data-theme="light"] .card:hover{
  background:#f9fafb;
}

.summary-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:13px;
  flex-wrap:wrap;
}
.summary-meta{
  font-size:12px;
  color:var(--muted);
}
.summary-meta.stale{
  color:var(--warn);
}

/* KPIs */
.kpi{
  cursor:pointer;
  text-align:left;
}
.kpi .label{
  font-size:11px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.12em;
}
.kpi .value{font-size:24px;font-weight:700;margin-top:4px}
.kpi .sub{font-size:12px;color:var(--muted);margin-top:2px}

.ticket-internal-summary-card{
  display:flex;
  flex-direction:column;
  min-height:100%;
}
.ticket-internal-summary-chart-wrap{
  position:relative;
  min-height:240px;
  flex:1;
}
.ticket-internal-summary-chart-wrap canvas{
  width:100% !important;
  height:100% !important;
}
.ticket-internal-summary-footer{
  margin-top:8px;
  padding-top:4px;
}

.leads-analytics{
  display:grid;
  gap:12px;
  margin-bottom:12px;
}
.deals-analytics{
  display:grid;
  gap:12px;
  margin-bottom:12px;
}
.leads-analytics-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.deals-analytics-grid{
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:10px;
}
.leads-kpi-card{
  cursor:pointer;
  min-height:94px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.deals-kpi-card{
  cursor:pointer;
  min-height:94px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.kpi-filter-active{
  border-color:rgba(37,99,235,.75);
  box-shadow:0 0 0 2px rgba(37,99,235,.2);
}
.leads-kpi-card .value{
  font-size:22px;
  line-height:1.2;
  word-break:break-word;
}
.deals-kpi-card .value{
  font-size:20px;
  line-height:1.2;
  word-break:break-word;
}
.leads-status-card{
  padding:12px;
}
.deals-breakdown-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.deals-breakdown-card{
  padding:12px;
}
.deals-breakdown-title{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:10px;
}
.leads-status-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
  flex-wrap:wrap;
}
.leads-status-bars{
  display:grid;
  gap:8px;
}
.deals-status-bars{
  display:grid;
  gap:8px;
}
.leads-status-row{
  display:grid;
  grid-template-columns:110px minmax(0,1fr) 74px;
  gap:10px;
  align-items:center;
}
.deals-status-row{
  display:grid;
  grid-template-columns:110px minmax(0,1fr) 74px;
  gap:10px;
  align-items:center;
}
.leads-status-label{
  font-size:12px;
  color:var(--muted);
}
.deals-status-label{
  font-size:12px;
  color:var(--muted);
}
.leads-status-track{
  height:8px;
  border-radius:999px;
  background:rgba(148,163,184,.25);
  overflow:hidden;
}
.leads-status-fill{
  height:100%;
  display:block;
  border-radius:999px;
  background:linear-gradient(90deg,var(--brand-primary),var(--brand-secondary));
}
.deals-status-fill{
  height:100%;
  display:block;
  border-radius:999px;
  background:linear-gradient(90deg,var(--brand-primary),var(--brand-secondary));
}
.leads-status-meta{
  font-size:12px;
  color:var(--muted);
  text-align:right;
  white-space:nowrap;
}
.deals-status-meta{
  font-size:12px;
  color:var(--muted);
  text-align:right;
  white-space:nowrap;
}
@media(max-width:1280px){
  .leads-analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .deals-analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .deals-breakdown-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:980px){
  .leads-analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .deals-analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .leads-analytics-grid{grid-template-columns:1fr}
  .deals-analytics-grid{grid-template-columns:1fr}
  .deals-breakdown-grid{grid-template-columns:1fr}
  .leads-status-row{grid-template-columns:1fr}
  .deals-status-row{grid-template-columns:1fr}
  .leads-status-meta{text-align:left}
  .deals-status-meta{text-align:left}
}

/* Charts */
.charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(max-width:980px){.charts{grid-template-columns:1fr}}

.csm-shell{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;align-items:start}
.csm-panel,.csm-main{min-width:0}
.csm-panel{position:static}
.csm-filters-title{
  margin:0 0 10px;
  font-size:18px;
  color:var(--text);
}
.csm-panel-brand{display:flex;gap:10px;align-items:center}
.csm-avatar{height:34px;width:34px;border-radius:11px;background:linear-gradient(145deg,#0ea5e9,#2563eb);display:grid;place-items:center;font-weight:700;color:#fff;font-size:11px}
.csm-panel-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.csm-panel h4{font-size:13px;margin:0 0 8px}
.csm-main{display:grid;gap:14px}
.csm-header-card h2{font-size:34px;line-height:1.1;margin:0 0 4px}
.csm-kpi{cursor:default;border-top:3px solid #22d3ee}
.csm-kpi .label{font-weight:700}
.csm-kpi .sub{font-size:12px;color:var(--muted);margin-top:4px}
.csm-split-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:14px}
.csm-insight-list{
  display:grid;
  gap:10px;
  margin-top:10px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.csm-insight-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border:1px solid var(--border);
  border-radius:12px;
  background:rgba(148,163,184,.08);
}
.csm-insight-item strong{
  display:block;
  line-height:1.2;
  margin-bottom:4px;
}
.csm-insight-item p{
  font-size:12px;
  margin:0;
  line-height:1.35;
}
.csm-insight-value{
  font-size:22px;
  font-weight:700;
  color:#2563eb;
  line-height:1;
  text-align:right;
  white-space:nowrap;
}
@media(max-width:900px){
  .csm-insight-list{grid-template-columns:1fr}
}
.csm-filters-grid{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr))}
.csm-panel .filter-row{min-width:0}
.csm-panel .filter-row .input,
.csm-panel .filter-row .select{
  width:100%;
  max-width:100%;
  min-width:0;
}
.csm-panel .filter-row label{
  display:block;
  margin-bottom:6px;
  font-size:11px;
}
@media(max-width:1400px){.csm-split-grid{grid-template-columns:1fr}.csm-header-card h2{font-size:30px}}
@media(max-width:1200px){.csm-filters-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.csm-filters-grid{grid-template-columns:1fr}}
.csm-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:980px){.csm-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.csm-kpi-grid{grid-template-columns:1fr}}
.csm-kpi-grid-six{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:1280px){.csm-kpi-grid-six{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:980px){.csm-kpi-grid-six{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.csm-kpi-grid-six{grid-template-columns:1fr}}

.csm-widget-card{display:grid;gap:10px}
.csm-widget-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;flex-wrap:wrap}
.csm-widget-head strong{font-size:21px;line-height:1.2;display:block;min-height:2.5em;font-weight:700}
.csm-widget-head .chip{font-size:11px}

/* Table & skeleton */
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  font-size:13px;
}
thead th{
  position:sticky;top:0;z-index:5;
  background:var(--card);
  text-align:left;padding:8px 9px;
  border-bottom:1px solid var(--border);
  user-select:none;cursor:pointer;
  font-size:11px;color:var(--muted);
  font-weight:500;
}
tbody td{
  padding:8px 9px;
  border-bottom:1px solid rgba(31,41,55,.65);
}
tr:hover{
  background:rgba(31,41,55,.8);
}
:root[data-theme="light"] tr:hover{
  background:#f3f4ff;
}
.table-wrap{
  max-height:440px;
  overflow:auto;
  border-radius:12px;
  border:1px solid var(--border);
  background:var(--card);
  position:relative;
}
.table-wrap::after{
  content:"";
  position:sticky;
  top:0;
  left:0;
  right:0;
  height:0;
  box-shadow:0 6px 12px rgba(15,23,42,.6);
  pointer-events:none;
}

th.sortable::after{
  content:"";margin-left:6px;border:4px solid transparent;
  border-top-color:var(--muted);display:inline-block;transform:translateY(1px);
}
th.sorted-asc::after{
  border-bottom-color:var(--accent);
  border-top-color:transparent;
  transform:translateY(-1px);
}
th.sorted-desc::after{
  border-top-color:var(--accent);
  border-bottom-color:transparent;
  transform:translateY(1px);
}

/* Loading skeleton */
.skeleton{
  position:relative;overflow:hidden;background:var(--skeleton);
  border-radius:8px;
}
.skeleton::after{
  content:"";position:absolute;inset:0;
  animation:shimmer 1.1s infinite;
  background:var(--shimmer);
}
@keyframes shimmer{
  0%{transform:translateX(-100%)}100%{transform:translateX(100%)}
}

/* Pills / status / priority */
.pill{
  padding:2px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:600;
  display:inline-block;
  letter-spacing:.03em;
  text-transform:uppercase;
}

/* updated to dash-format class names (matches JS badgeStatus) */
.status-Resolved{background:var(--status-resolved);color:#fff}
.status-Under-Development{background:var(--status-underdev);color:#fff}
.status-Rejected{background:var(--status-rejected);color:#fff}
.status-On-Hold{background:var(--status-onhold);color:#fff}
.status-Not-Started-Yet{background:var(--status-notstarted);color:#fff}
.status-Sent{background:var(--status-sent);color:#fff}
.status-On-Stage{background:var(--status-onstage);color:#fff}

.priority-High{background:var(--priority-high);color:#fff}
.priority-Medium{background:var(--priority-medium);color:#fff}
.priority-Low{background:var(--priority-low);color:#fff}

.pill[class*="dev-team-"],
.pill[class*="issue-related-"]{
  background:var(--neutral);
  color:#fff;
}

/* Dev Team Status color coding */
.pill.dev-team-local{background:#0ea5e9}
.pill.dev-team-staging{background:#7c3aed}
.pill.dev-team-tested-on-stage{background:#2563eb}
.pill.dev-team-production{background:#16a34a}
.pill.dev-team-tested-on-production{background:#15803d}
.pill.dev-team-disregard{background:#6b7280}

/* Issue Related color coding */
.pill.issue-related-backend{background:#b91c1c}
.pill.issue-related-frontend{background:#047857}
.pill.issue-related-mobile-app{background:#1d4ed8}
.pill.issue-related-hosting-and-infrastructure{background:#6d28d9}

/* Filter chips */
.filter-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-bottom:4px;
}
.filter-chip{
  padding:3px 8px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--chip);
  font-size:11px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  cursor:pointer;
  color:var(--muted);
}
.filter-chip:hover{
  border-color:var(--accent);
  color:var(--text);
}

/* Risk bar */
.risk-bar-wrap{
  width:100%;
  height:5px;
  border-radius:999px;
  background:var(--risk-bar-track);
  overflow:hidden;
  margin-top:3px;
}
.risk-bar{
  height:100%;
  transform-origin:left center;
  background:linear-gradient(90deg,#22c55e,#facc15,#ef4444);
}

/* Modal */
.modal{
  display:none;position:fixed;inset:0;
  background:rgba(15,23,42,.75);align-items:center;justify-content:center;z-index:100;
}
.modal.open{
  display:flex;
}
.modal-content{
  background:var(--card);color:var(--text);
  border:1px solid var(--border);
  padding:16px 16px 18px;border-radius:18px;
  max-width:1120px;width:min(96vw,1120px);max-height:90%;overflow:auto;
  box-shadow:var(--shadow);
}
.modal .header{
  display:flex;align-items:center;gap:10px;justify-content:space-between;margin-bottom:8px;
}
.modal .actions{display:flex;gap:8px;flex-wrap:wrap}
.modal-close{cursor:pointer;border:none;background:transparent;color:var(--muted);font-size:20px}
.ticket-detail{
  border:1px solid var(--border);
  border-radius:20px;
  overflow:hidden;
  background:color-mix(in oklab, var(--card) 95%, #ffffff 5%);
}
.ticket-hero{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:18px 20px;
  border-bottom:1px solid var(--border);
}
.ticket-person{display:flex;align-items:center;gap:12px}
.ticket-avatar{
  width:64px;height:64px;border-radius:14px;
  display:grid;place-items:center;
  font-weight:700;font-size:22px;
  background:linear-gradient(135deg, rgba(148,163,184,.35), rgba(148,163,184,.15));
  border:1px solid var(--border);
}
.ticket-id{
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:6px;
}
.ticket-person h3{margin:0;font-size:36px;line-height:1}
.ticket-status-pill{
  font-size:14px;
  font-weight:700;
  letter-spacing:.02em;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(59,130,246,.16);
}
.ticket-title-row{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  padding:18px 20px;
  border-bottom:1px solid var(--border);
}
.ticket-title-row h4{
  margin:0;
  font-size:clamp(2rem, 2.8vw, 2.5rem);
  line-height:1.15;
}
.ticket-priority-pill{
  color:#ef4444;
  font-weight:700;
  font-size:clamp(1rem, 1.4vw, 1.2rem);
  white-space:nowrap;
}
.ticket-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  border-bottom:1px solid var(--border);
}
.ticket-col{
  padding:18px 20px;
  display:grid;
  gap:10px;
}
.ticket-col + .ticket-col{border-left:1px solid var(--border)}
.ticket-col p{margin:0}
.ticket-meta-item{
  display:grid;
  grid-template-columns:minmax(180px, 42%) minmax(0, 1fr);
  align-items:start;
  gap:8px;
  font-size:1.02rem;
  line-height:1.35;
}
.ticket-label{
  font-weight:600;
  color:color-mix(in oklab, var(--text) 85%, var(--muted) 15%);
}
.ticket-description,.ticket-log{padding:16px;border-bottom:1px solid var(--border)}
.ticket-description p{
  margin:8px 0 0;
  padding:14px 16px;
  border-radius:10px;
  background:rgba(245, 158, 11, .1);
  font-size:1.1rem;
  line-height:1.5;
}
.ticket-log{border-bottom:none}
.ticket-description h5,
.ticket-log h5{
  margin:0;
  font-size:clamp(1.8rem, 2.4vw, 2.2rem);
  line-height:1.2;
}
.ticket-log p{
  margin:8px 0 0;
  color:var(--muted);
  font-size:1.1rem;
  line-height:1.5;
}

@media (max-width:840px){
  .ticket-title-row{flex-direction:column;align-items:flex-start}
  .ticket-title-row h4{font-size:30px}
  .ticket-description h5,
  .ticket-log h5{font-size:28px}
  .ticket-description p,
  .ticket-log p{font-size:1rem}
  .ticket-meta-item{
    grid-template-columns:1fr;
    gap:4px;
    font-size:.98rem;
  }
  .ticket-priority-pill{font-size:20px}
  .ticket-person h3{font-size:24px}
  .ticket-grid{grid-template-columns:1fr}
  .ticket-col + .ticket-col{border-left:none;border-top:1px solid var(--border)}
}

/* Pagination */
.table-actions{
  display:flex;gap:10px;align-items:center;justify-content:space-between;
  margin-top:10px;flex-wrap:wrap;
  font-size:12px;
}
.table-tools{
  display:flex;
  align-items:center;
  gap:8px;
  position:relative;
  flex-wrap:wrap;
}
.column-panel{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  min-width:220px;
  background:var(--card);
  border:1px solid var(--border);
  border-radius:12px;
  box-shadow:var(--shadow);
  padding:10px;
  display:none;
  z-index:40;
}
.column-panel.open{
  display:block;
}
.column-panel-header{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
  margin-bottom:8px;
}
.column-list{
  display:grid;
  gap:6px;
  max-height:220px;
  overflow:auto;
  padding-right:2px;
}
.column-list label{
  display:flex;
  gap:6px;
  align-items:center;
  font-size:12px;
}
.col-hidden{
  display:none;
}
.pagination{display:flex;gap:6px;align-items:center}
.chip-btn{
  padding:5px 9px;border-radius:999px;background:var(--card);
  border:1px solid var(--border);cursor:pointer;font-size:12px;
}
.chip-btn[disabled]{opacity:.45;cursor:not-allowed}
.chip-btn.active{background:var(--accent);color:#fff;border-color:var(--accent)}
.event-issue-chip-list{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.event-issue-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 8px;
  border-radius:999px;
  border:1px solid var(--line);
  background:var(--bg);
  font-size:12px;
}
.event-issue-chip button{
  border:0;
  background:transparent;
  color:var(--muted);
  cursor:pointer;
  font-size:12px;
  padding:0;
  line-height:1;
}
.select.sm,.input.sm{padding:5px 8px;border-radius:999px;font-size:12px}

/* Drawer */
.drawer-toggle{display:none}
@media(max-width:980px){
  .drawer-toggle{display:inline-flex}
  .sidebar{
    position:fixed;inset:82px 0 0 auto;width:88%;max-width:360px;
    height:fit-content;
    max-height:calc(100vh - 96px);
    overflow:auto;
    transform:translateX(110%);transition:transform .22s ease;
  }
  .sidebar.open{transform:translateX(0)}
}

@media(min-width:981px){
  .sidebar{
    position:static;
  }
  .sidebar h3{
    margin-bottom:12px;
  }
  .sidebar .filter-group{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-end;
    gap:10px;
  }
  .sidebar .filter-row{
    min-width:150px;
    flex:1 1 150px;
  }
  .sidebar #resetBtn{
    align-self:flex-end;
  }
  .sidebar .filter-group .muted{
    flex:1 1 260px;
  }
}

/* Spinner & Toast */
.spinner{
  display:none;position:fixed;inset:0;
  background:rgba(15,23,42,.7);z-index:120;
  align-items:center;justify-content:center;
}
.spinner .ring{
  width:46px;height:46px;border:4px solid var(--border);
  border-top-color:var(--accent);border-radius:50%;
  animation:spin 1s linear infinite;background:transparent;
}
@keyframes spin{to{transform:rotate(360deg)}}
.toast{
  position:fixed;right:16px;bottom:16px;
  background:var(--card);border:1px solid var(--border);color:var(--text);
  padding:9px 11px;border-radius:10px;z-index:130;
  box-shadow:var(--shadow);display:none;font-size:12px;
}

.cancelled-event-title {
  text-decoration: line-through;
  opacity: 0.65;
}
.event-detail-title {
  margin-top:4px;
  font-size:14px;
  font-weight:600;
}

/* Calendar */
#calendar{margin-top:6px;min-height:500px}
.fc{font-size:13px}
.fc .fc-toolbar-title{font-size:15px;font-weight:600}
.fc-theme-standard .fc-scrollgrid,
.fc-theme-standard td,
.fc-theme-standard th{border-color:var(--border)}
.fc .fc-col-header-cell-cushion,
.fc .fc-daygrid-day-number{color:var(--muted)}
.fc .fc-daygrid-day.fc-day-today{
  background:rgba(37,99,235,.07);
}
.fc .fc-button{
  background:var(--card);border-color:var(--border);
  color:var(--text);border-radius:999px;padding:3px 9px;font-size:12px;
}
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active,
.fc .fc-button-primary:not(:disabled):focus,
.fc .fc-button-primary:not(:disabled):hover{
  background:var(--accent);border-color:var(--accent);
}
.fc .fc-toolbar.fc-header-toolbar{margin-bottom:10px}
.fc-event.event-type-deployment{background-color:var(--info);border-color:var(--info)}
.fc-event.event-type-maintenance{background-color:var(--warn);border-color:var(--warn)}
.fc-event.event-type-release{background-color:var(--ok);border-color:var(--ok)}
.fc-event.event-type-other{background-color:var(--purple);border-color:var(--purple)}

/* Calendar env & risk signals */
.fc-event.event-env-prod .fc-event-main{border-left:3px solid var(--ok);}
.fc-event.event-env-staging .fc-event-main{border-left:3px solid var(--info);}
.fc-event.event-env-dev .fc-event-main{border-left:3px solid var(--neutral);}
.fc-event.event-env-other .fc-event-main{border-left:3px solid var(--purple);}
.fc-event.event-collision .fc-event-main{box-shadow:0 0 0 1px var(--danger) inset;}
.fc-event.event-freeze .fc-event-main{box-shadow:0 0 0 1px var(--warn) inset;}
.fc-event.event-hot .fc-event-main{box-shadow:0 0 0 2px var(--danger) inset;}

.event-risk-badge{
  margin-left:6px;padding:0 6px;border-radius:5px;font-size:10px;
  border:1px solid rgba(15,23,42,.4);
}
.risk-low{background:rgba(34,197,94,.18)}
.risk-med{background:rgba(234,179,8,.22)}
.risk-high{background:rgba(248,113,113,.24)}
.risk-crit{background:rgba(220,38,38,.35)}

/* Hide log col on small screens */
@media(max-width:768px){
 #issuesTable th:nth-child(14),
  #issuesTable td:nth-child(14){display:none}
}

/* Extra compact mode: hide module + priority on very small screens */
@media(max-width:480px){
  #issuesTable th:nth-child(8),
  #issuesTable td:nth-child(8),
  #issuesTable th:nth-child(7),
  #issuesTable td:nth-child(7){
    display:none;
  }
}

@media (prefers-reduced-motion: reduce){
  *{transition:none!important;animation:none!important}
}

/* =========================================================
   Freeze windows UI
   ========================================================= */

.freeze-window-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-top:10px;
  font-size:12px;
}
.freeze-window-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  border:1px solid var(--border);
  border-radius:10px;
  padding:6px 8px;
  background:var(--card);
}
.freeze-window-tags{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  color:var(--muted);
}
.freeze-day-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  font-size:12px;
  color:var(--muted);
}

/* =========================================================
   Event readiness checklist
   ========================================================= */

.readiness-list{
  display:grid;
  gap:6px;
  font-size:12px;
  color:var(--muted);
}
.readiness-item{
  display:flex;
  align-items:center;
  gap:6px;
}



/* =========================================================
   Release Planner – F&B Middle East
   ========================================================= */

#releasePlannerCard .planner-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
@media(max-width:980px){
  #releasePlannerCard .planner-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:640px){
  #releasePlannerCard .planner-grid{
    grid-template-columns:1fr;
  }
}

/* Planner controls */
#releasePlannerCard label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
  display:block;
  margin-bottom:3px;
}
#releasePlannerCard .input,
#releasePlannerCard .select,
#releasePlannerCard textarea{
  width:100%;
}
#releasePlannerCard textarea{
  min-height:70px;
  resize:vertical;
  border-radius:8px;
}

/* Suggested slot styling */
.planner-slot{
  border-radius:8px;
  border:1px solid var(--border);
  padding:7px 9px;
  margin-top:6px;
  background:var(--card);
}
.planner-slot-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:13px;
  font-weight:500;
}
.planner-slot-meta{
  font-size:11px;
  color:var(--muted);
  margin-top:3px;
}
.planner-slot-score{
  font-size:11px;
  font-weight:600;
  padding:2px 6px;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.5);
}
.planner-score-low{background:rgba(34,197,94,.18);}
.planner-score-med{background:rgba(234,179,8,.22);}
.planner-score-high{background:rgba(248,113,113,.24);}

/* Small screen tweaks */
@media(max-width:520px){
  header{
    flex-wrap:wrap;
    row-gap:6px;
    padding:8px 12px;
  }
  .wrap{
    padding:12px;
  }
  .card{
    padding:12px;
  }
}

/* Lifecycle Analytics */
.lifecycle-skeleton-grid .skeleton-block,
.skeleton-block {
  min-height: 96px;
  background: var(--skeleton);
  border: 1px solid var(--border);
  position: relative;
  overflow: hidden;
}
.skeleton-block::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--shimmer);
  transform: translateX(-100%);
  animation: shimmer 1.2s infinite;
}

/* =========================================================
   Mobile & tablet responsiveness hardening
   ========================================================= */

#app,
.content,
.content-panels,
.card,
.table-wrap{
  min-width:0;
  max-width:100%;
}

/* Prevent page-level horizontal overflow while preserving local table scroll. */
body{
  overflow-x:hidden;
}

.table-wrap{
  width:100%;
}

.table-wrap > table{
  width:100%;
}

/* Keep action bars and controls touch-friendly and wrappable. */
.table-actions,
.table-tools,
.pagination,
.modal .actions{
  flex-wrap:wrap;
  row-gap:8px;
}

.pagination{
  align-items:center;
}

.btn,
.chip-btn{
  min-height:34px;
}

/* Constrain long inline controls used in analytics/search bars. */
input[style*="min-width"]{
  max-width:100%;
}

/* Tablet: keep layout usable while preserving desktop density. */
@media (max-width:1024px){
  .table-wrap > table{
    width:max(100%, 680px);
  }
  .content-layout{
    grid-template-columns:1fr;
    gap:12px;
  }
  .view-menu{
    position:static;
    top:auto;
    padding:10px 0;
  }
  .view-tabs{
    flex-direction:row;
    overflow:auto;
    padding-bottom:2px;
    scrollbar-width:thin;
  }
  .view-tab{
    width:auto;
    flex:0 0 auto;
    min-height:38px;
    white-space:nowrap;
  }
  .grid.cols-4{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

/* Mobile large/small */
@media (max-width:767px){
  header{
    justify-content:flex-start;
  }
  .brand{
    width:100%;
    justify-content:center;
  }
  .toolbar{
    width:100%;
    justify-content:flex-start;
    gap:8px;
  }
  .toolbar .input,
  .toolbar .select{
    width:100%;
  }
  .toolbar .btn{
    min-height:38px;
  }
  .wrap{
    padding:10px;
    gap:12px;
  }
  .card{
    padding:12px;
  }
  .sidebar{
    width:min(92vw,360px);
    max-height:calc(100vh - 90px);
    border-radius:12px 0 0 12px;
    z-index:95;
  }
  .filter-row .input,
  .filter-row .select,
  .filter-row textarea,
  .filter-row .btn{
    width:100%;
    max-width:100%;
    min-width:0;
  }
  .grid.cols-3,
  .grid.cols-4{
    grid-template-columns:1fr;
  }
  .table-wrap{
    max-width:100%;
  }
  .table-wrap > table{
    width:max(100%, 740px);
  }
  .pagination{
    width:100%;
    justify-content:flex-start;
  }
  .table-actions{
    align-items:stretch;
  }
  .table-actions > *{
    width:100%;
  }
  .modal{
    align-items:flex-start;
    padding:8px;
  }
  .modal-content{
    width:100%;
    max-width:100%;
    max-height:calc(100vh - 16px);
    margin:0;
    border-radius:14px;
    padding:12px;
  }
  .modal .header{
    position:sticky;
    top:0;
    z-index:2;
    background:var(--card);
    padding-bottom:6px;
  }
  .modal iframe{
    min-height:58vh !important;
  }
  .modal-content .grid[style*="repeat(2"],
  .modal-content .grid[style*="repeat(3"]{
    grid-template-columns:1fr !important;
  }
  .modal-content .actions[style*="justify-content:space-between"]{
    justify-content:flex-start !important;
  }
  .modal-content .actions[style*="justify-content:space-between"] > div{
    width:100%;
    display:flex;
    flex-wrap:wrap;
  }
  .hero-grid{
    grid-template-columns:1fr;
  }
  .login-card{
    width:100%;
  }
  body.auth-locked #loginSection .hero-grid{
    grid-template-columns:minmax(0,1fr);
  }
}

@media (max-width:430px){
  .btn,
  .input,
  .select{
    font-size:14px;
  }
  .view-tab{
    padding:9px 11px;
  }
  .ticket-hero,
  .ticket-title-row,
  .ticket-col{
    padding:14px 12px;
  }
}
@keyframes shimmer {
  100% {
    transform: translateX(100%);
  }
}
.lifecycle-timeline {
  margin-top: 12px;
  display: grid;
  gap: 10px;
}
.lifecycle-timeline-item {
  display: grid;
  grid-template-columns: 14px 1fr;
  gap: 10px;
  align-items: start;
}
.lifecycle-timeline-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  margin-top: 8px;
  background: var(--accent);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.2);
}
.lifecycle-timeline-content {
  border-left: 1px dashed var(--border);
  padding-left: 12px;
  padding-bottom: 10px;
  min-width: 0;
}
.lifecycle-note {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.lifecycle-timeline-title-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.lifecycle-records-grid {
  margin-top: 10px;
}
.lifecycle-record-card {
  display: grid;
  gap: 4px;
}
#lifecycleSummaryCards,
#lifecycleMetricsGrid {
  align-items: stretch;
  grid-auto-rows: 1fr;
}
#lifecycleSummaryCards .card,
#lifecycleMetricsGrid .card {
  min-height: 108px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
#lifecycleSummaryCards .value,
#lifecycleMetricsGrid .value {
  margin-top: 8px;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
@media (max-width: 920px) {
  #lifecycleAnalyticsView .grid.cols-4,
  #lifecycleAnalyticsView .grid.cols-3 {
    grid-template-columns: 1fr;
  }
  #lifecycleSearchInput {
    min-width: 0 !important;
    width: 100%;
  }
}

.notification-shell { position: relative; }
.notification-bell { position: relative; }
.notification-unread-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 11px;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  font-weight: 700;
}
.notification-preview-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(420px, 92vw);
  max-height: 70vh;
  overflow: auto;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  box-shadow: var(--shadow);
  padding: 12px;
  z-index: 80;
  display: none;
}
.notification-preview-panel.open { display: block; }
.notification-preview-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}
.notification-preview-list { display: grid; gap: 8px; }
.notification-item {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: inherit;
  text-align: left;
  padding: 10px;
  cursor: pointer;
}
.notification-item.unread { border-left: 4px solid var(--accent); background: color-mix(in oklab, var(--accent) 8%, transparent); }
.notification-item-head { display: flex; justify-content: space-between; gap: 6px; font-size: 12px; margin-bottom: 6px; }
.notification-item-body { font-size: 13px; }
.notification-target-highlight {
  outline: 2px solid var(--accent-color, #2563eb);
  background: rgba(37, 99, 235, 0.08);
  transition: background 0.3s ease;
}
.notification-filter-row { display: flex; gap: 8px; flex-wrap: wrap; }
.notification-filter-row .chip-btn.active { border-color: var(--accent); color: var(--accent); }
.notification-row-unread td { font-weight: 600; }

.push-foreground-banner-stack {
  position: fixed;
  right: 12px;
  top: max(12px, env(safe-area-inset-top));
  z-index: 3200;
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: min(360px, calc(100vw - 24px));
  pointer-events: none;
}

.push-foreground-banner {
  pointer-events: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--card);
  color: var(--text);
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.22);
  padding: 12px;
}

.push-foreground-banner__title {
  font-weight: 700;
  margin-bottom: 4px;
}

.push-foreground-banner__body {
  color: var(--muted);
  font-size: 13px;
  margin-bottom: 10px;
}

.push-foreground-banner__actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

@media (max-width: 720px) {
  .push-foreground-banner-stack {
    left: 12px;
    right: 12px;
    top: auto;
    bottom: max(12px, env(safe-area-inset-bottom));
    width: auto;
  }
}
.notification-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.chip.high-priority { background: #fee2e2; color: #991b1b; border-color: #fecaca; }
.row-highlight-pulse {
  animation: row-highlight-pulse 2.2s ease-out 1;
}

/* =========================================================
   Advanced responsive utilities (layout-only)
   ========================================================= */

.responsive-grid{
  display:grid;
  gap:12px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}
.responsive-form-grid{
  display:grid;
  gap:10px;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.responsive-table-wrap,
.mobile-scroll{
  width:100%;
  max-width:100%;
  overflow:auto;
}
.mobile-stack{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.mobile-action-bar{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}
.modal-responsive{
  width:min(100%,1120px);
  max-height:90vh;
  overflow:auto;
}

/* Baseline hardening */
#appHeader,
#app,
.wrap,
.content-layout,
.content,
.content-panels,
.view,
.card{
  max-width:100%;
}

/* Keep row actions/critical controls touch-friendly across modules. */
.btn,
.chip-btn,
.view-tab,
.table-actions .btn,
.modal .actions .btn{
  min-height:40px;
}

/* Generic table hygiene; keep horizontal scroll local to table wrappers. */
.table-wrap{
  overflow:auto;
  overscroll-behavior:contain;
}
.table-wrap > table{
  min-width:100%;
}

/* Preserve readability for matrix + dense admin tables. */
#rolePermissionsTable,
#workflowMatrixContainer table,
#workflowRulesTbody,
#workflowApprovalsTbody{
  font-size:12.5px;
}

/* Tablet layout (desktop-like, denser spacing). */
@media (max-width:1024px){
  .wrap{
    width:100%;
    padding:12px;
  }

  .toolbar{
    justify-content:flex-start;
    flex-wrap:wrap;
    align-items:stretch;
  }
  #searchInput{
    min-width:min(420px,100%);
    flex:1 1 280px;
  }
  .toolbar .input,
  .toolbar .select{
    flex:1 1 220px;
    min-width:min(220px,100%);
  }
  .toolbar .btn{
    flex:0 1 auto;
  }

  .grid.cols-4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grid.cols-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .responsive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .responsive-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}

  .table-wrap > table{
    width:max(100%,760px);
  }

  .pagination{
    flex-wrap:wrap;
    gap:8px;
  }
}

/* Mobile layout (stack while preserving modules/actions). */
@media (max-width:768px){
  .toolbar{
    width:100%;
    gap:8px;
    flex-wrap:wrap;
    align-items:stretch;
  }
  #searchInput,
  .toolbar .input,
  .toolbar .select{
    width:100%;
    min-width:0;
    flex:1 1 100%;
  }
  .toolbar .btn{
    flex:1 1 auto;
  }

  .responsive-grid,
  .responsive-form-grid,
  .grid.cols-2,
  .grid.cols-3,
  .grid.cols-4{
    grid-template-columns:1fr;
  }

  .table-wrap{
    max-width:100%;
    overflow-x:auto;
    overflow-y:auto;
  }
  .table-wrap > table{
    width:max(100%,820px);
  }
  th, td{
    white-space:nowrap;
    padding:7px 8px;
  }
  td .pill,
  td .chip{
    white-space:nowrap;
  }

  .table-actions,
  .table-tools,
  td .actions,
  .pagination,
  .notification-filter-row,
  .notification-actions{
    width:100%;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:6px;
  }
  .table-actions > *,
  .table-tools > *,
  td .actions > *,
  .pagination > *,
  .notification-filter-row > *,
  .notification-actions > *{
    flex:1 1 auto;
  }
  td .actions .btn,
  .notification-actions .btn{
    white-space:normal;
    min-height:36px;
  }

  .sidebar{
    inset:72px 0 0 auto;
    width:min(94vw,360px);
    max-height:calc(100vh - 80px);
  }

  .modal{
    padding:6px;
  }
  .modal-content{
    width:100%;
    max-width:100%;
    max-height:calc(100vh - 12px);
    border-radius:12px;
    overflow:auto;
    overscroll-behavior:contain;
  }
  .modal .header{
    position:sticky;
    top:0;
    z-index:3;
    background:var(--card);
  }
  .modal-content iframe{
    width:100%;
    min-height:62vh !important;
  }
  .modal-content .actions{
    position:sticky;
    bottom:0;
    z-index:2;
    background:var(--card);
    padding-top:8px;
    padding-bottom:calc(8px + env(safe-area-inset-bottom));
  }

  form .input,
  form .select,
  form textarea{
    width:100%;
    min-width:0;
    max-width:100%;
  }
}

/* Small mobile density tuning (360-430 baseline). */
@media (max-width:480px){
  .wrap{padding:8px}
  .card{padding:10px}
  .toolbar .btn,
  .table-actions .btn,
  .modal .actions .btn{
    width:100%;
  }
  .notification-preview-panel{
    right:auto;
    left:0;
    width:min(96vw,420px);
  }
  .pwa-install-banner{
    padding:0 8px calc(8px + env(safe-area-inset-bottom));
  }
  .pwa-install-banner__surface{
    border-radius:14px 14px 10px 10px;
    padding:10px;
  }
  .pwa-install-banner__actions{
    flex-direction:column;
  }
}

@keyframes row-highlight-pulse {
  0% {
    background-color: rgba(72, 187, 120, 0.42);
  }
  100% {
    background-color: transparent;
  }
}

.analytics-page { width: 100%; }
.analytics-header h2 { margin: 0; }
.analytics-header p { margin: 0.35rem 0 0; }
.analytics-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.75rem;
  margin: 0.75rem 0 1rem;
  width: 100%;
}
.analytics-filter-control {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  min-width: 150px;
  max-width: 220px;
}
.analytics-filter-control.search {
  min-width: 240px;
  flex: 1 1 260px;
}
.analytics-filter-control.date {
  min-width: 150px;
  max-width: 170px;
}
.analytics-filter-label { font-size: 0.72rem; font-weight: 600; color: #64748b; }
.analytics-filter-input { width: 100%; }
.analytics-filter-actions { display:flex; gap:0.5rem; align-items:center; }
@media (max-width: 768px) {
  .analytics-filter-bar { flex-direction: column; align-items: stretch; }
  .analytics-filter-control,
  .analytics-filter-control.search,
  .analytics-filter-control.date { width: 100%; max-width: none; }
  .analytics-filter-actions { width: 100%; }
}


body.permissions-loading [data-permission-resource][data-permission-action]{display:none !important;}
.is-permission-hidden{display:none !important;}

/* Communication Centre chat layout */
#communicationCentreView{background:#f6f8fb;padding:16px;border-radius:16px}
.cc-layout{display:grid;grid-template-columns:minmax(300px,340px) minmax(540px,1fr) minmax(280px,340px);gap:18px;min-height:72vh;align-items:stretch}

#communicationCentreView .cc-chat{
  display:flex;
  flex-direction:column;
  min-height:0;
}
#communicationCentreView .cc-chat-header,
#communicationCentreView .cc-composer{
  flex:0 0 auto;
}
#communicationCentreView .cc-messages{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scroll-behavior:auto;
  overflow-anchor:none;
}
.cc-sidebar,.cc-chat,.cc-details{background:#fff;border:1px solid #e6eaf0;border-radius:14px;box-shadow:0 8px 24px rgba(16,24,40,.06)}
.cc-sidebar,.cc-details{padding:14px}
.cc-chat{display:flex;flex-direction:column;min-height:0;overflow:hidden}
.cc-layout,.cc-chat,.cc-sidebar,.cc-details,.cc-item,.cc-chat-header,.cc-composer{min-width:0}
.cc-layout{overflow-x:hidden}
.cc-sidebar-top{position:sticky;top:0;background:#fff;z-index:2;padding-bottom:12px;border-bottom:1px solid #f1f3f7}
.cc-sidebar-top h2{margin:0 0 6px;font-size:20px;color:#172033;letter-spacing:.01em}
.cc-sidebar-top .muted{font-size:12px;line-height:1.45;color:#667085;margin-bottom:10px}
#communicationCentreNewBtn{width:100%;height:38px;border-radius:10px;background:#2563eb;color:#fff;border-color:#2563eb;font-weight:600;box-shadow:0 6px 14px rgba(37,99,235,.24)}
#communicationCentreSearch{margin-top:10px;background:#fbfcfe;border-color:#e4e8f0;height:38px}
.cc-filters{display:flex;gap:6px;padding:12px 0 10px;flex-wrap:wrap}
.cc-filters .btn{border-radius:999px;padding:6px 12px;border:1px solid #e5e9f1;background:#f8faff;color:#44506b}
.cc-filters .btn.active{background:#eaf1ff;border-color:#c8d9ff;color:#1d4ed8}
.cc-list{max-height:58vh;overflow:auto;padding-right:2px}
.cc-item{width:100%;display:flex;justify-content:space-between;gap:14px;text-align:left;padding:12px;margin-bottom:8px;border:1px solid transparent;background:#fff;border-radius:12px;transition:.2s}
.cc-item:hover{background:#f8fbff;border-color:#dbe7ff}.cc-item.active{background:#eef4ff;border-color:#bfd4ff;box-shadow:0 2px 8px rgba(37,99,235,.12)}
.cc-item.unread .cc-item-main strong{color:#0f172a;font-weight:700}
.cc-item-main{min-width:0;flex:1 1 auto}.cc-item-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-width:0}.cc-item-title-wrap{min-width:0;flex:1 1 auto}.cc-item-main small{display:block;color:#8a94a6;font-size:11px;margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cc-item-main strong{display:block;color:#172033;font-size:14px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cc-item-main p{margin:5px 0 0;font-size:12px;color:#667085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-item-submeta{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.cc-item-meta{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:0 0 auto}.cc-time{font-size:11px;color:#8b95a7}
.communication-conversation-card.has-unread,.cc-item.has-unread{background:color-mix(in oklab, #fff 88%, #2563eb 12%);border-color:#c8d9ff;box-shadow:0 2px 10px rgba(37,99,235,.08)}
.conversation-unread-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:#2563eb;color:#fff;font-size:11px;font-weight:800;line-height:1;box-shadow:0 2px 6px rgba(37,99,235,.28)}
.chip{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;font-size:11px;font-weight:600;line-height:1.2;border:1px solid transparent;background:#f1f5f9;color:#475569}
.cc-status-chip{background:#ecfdf3;color:#067647}.cc-priority-chip{background:#fff7ed;color:#c2410c}.cc-unread-chip{background:#eaf2ff;color:#1d4ed8}
.cc-chat-header{position:relative;background:#fff;padding:14px 16px;border-bottom:1px solid #e9edf3;z-index:2;display:flex;justify-content:space-between;align-items:center;flex-shrink:0}
.cc-chat-heading{min-width:0;flex:1}.cc-chat-heading h3{margin:0;font-size:18px;color:#172033;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cc-chat-heading .muted{margin-top:4px;font-size:12px;color:#667085;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-chat-header-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
#communicationCentreExportPdfBtn{border-color:#cfd8e6;background:#f8fbff;color:#172033;font-weight:600}
#communicationCentreExportPdfBtn:disabled{opacity:.65;cursor:wait}
.cc-messages{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scroll-behavior:auto;overflow-anchor:none;padding:18px;background:linear-gradient(180deg,#fbfcff 0%,#f7f9fc 100%)}
.cc-message-row{display:flex;margin-bottom:12px}.cc-message-row.mine{justify-content:flex-end}.cc-message-row.incoming{justify-content:flex-start}
.cc-bubble{max-width:min(72%,640px);padding:10px 12px;border-radius:12px;border:1px solid #e7ebf2;background:#fff;box-shadow:0 2px 6px rgba(15,23,42,.04)}
.cc-message-row.mine .cc-bubble{background:#eaf2ff;border-color:#cddfff}
.cc-message-meta{font-size:11px;color:#64748b;font-weight:600;margin-bottom:6px}.cc-message-body{font-size:14px;color:#1f2937;line-height:1.45;white-space:pre-wrap}
.cc-system-message{margin:8px auto 14px;padding:6px 12px;background:#f3f4f6;color:#6b7280;border-radius:999px;font-size:11px;border:1px solid #e5e7eb;max-width:80%;text-align:center}
#communicationCentreClosedMsg{margin:0 12px 12px;padding:10px 12px;border:1px solid #e5e7eb;background:#f8fafc;border-radius:10px;color:#667085 !important}
.cc-composer{position:relative;bottom:auto;flex-shrink:0;padding:14px;padding-bottom:calc(14px + env(safe-area-inset-bottom));border-top:1px solid #e9edf3;background:#fff;display:flex;gap:10px;align-items:flex-end}
.cc-new-messages-btn{position:absolute;left:14px;top:-38px;z-index:3;box-shadow:0 6px 14px rgba(16,24,40,.15)}
.cc-composer textarea{resize:none;min-height:52px;max-height:140px;overflow:auto;flex:1;border-radius:10px;border:1px solid #dfe5ef;background:#fff;padding:10px 12px;line-height:1.4}
.cc-composer textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.15)}
#communicationCentreReplyBtn{height:40px;padding:0 16px;border-radius:10px;background:#2563eb;color:#fff;border-color:#2563eb;font-weight:600}
.cc-details .header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid #edf1f6;position:sticky;top:0;background:#fff;z-index:2}
.cc-details h3{margin:0;color:#172033}.cc-details #communicationCentreDrawerMeta{font-size:12px;color:#667085;padding:10px;border:1px solid #edf1f6;background:#f8fbff;border-radius:10px;margin-bottom:10px}
.cc-details #communicationCentreParticipants{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.cc-participant-chip{background:#f8faff;color:#3b4a67;border-color:#e4eaf5}
.cc-details .actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:10px}
.cc-details-section{padding:10px;border:1px solid #edf1f6;border-radius:10px;background:#fbfdff;margin-bottom:10px}
.cc-details-section strong{display:block;margin-bottom:6px;color:#172033}
.cc-details .actions .btn{border-radius:9px}
.cc-pagination{padding-top:10px;border-top:1px solid #edf1f6;display:flex;justify-content:space-between;gap:8px;align-items:center;flex-wrap:wrap}
@media (max-width:1100px){.cc-layout{grid-template-columns:minmax(280px,320px) 1fr}.cc-details{position:fixed;right:10px;top:100px;width:min(360px,95vw);max-height:80vh;overflow:auto;z-index:40}}
@media (max-width:1023px){.cc-layout{grid-template-columns:minmax(260px,320px) 1fr}.cc-details{position:fixed;right:0;top:70px;width:min(440px,100vw);height:calc(100dvh - 70px);max-height:none;border-radius:12px 0 0 12px;overflow:auto;z-index:50}.cc-details.collapsed{display:none}}
@media (max-width:767px){
  #communicationCentreView{overflow:hidden}
  .cc-layout{grid-template-columns:1fr;height:calc(100dvh - 120px);min-height:0;width:100%;max-width:100%;overflow-x:hidden}
  .cc-sidebar,.cc-chat,.cc-details{height:100%;border-radius:0}
  #communicationCentreView[data-mobile-view="list"] .cc-chat,#communicationCentreView[data-mobile-view="list"] .cc-details{display:none}
  #communicationCentreView[data-mobile-view="chat"] .cc-sidebar,#communicationCentreView[data-mobile-view="chat"] .cc-details{display:none}
  #communicationCentreView[data-mobile-view="details"] .cc-sidebar,#communicationCentreView[data-mobile-view="details"] .cc-chat{display:none}
  .cc-sidebar-top{position:static;top:auto;background:#fff;z-index:1;padding-bottom:8px}
  .cc-item{min-height:54px}
  .cc-chat-header{gap:8px;padding:10px 12px}
  .cc-chat-heading h3{font-size:15px}
  .cc-message-row .cc-bubble{max-width:82%}
  .cc-composer{padding:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom))}
  .cc-details{position:absolute;inset:0;z-index:60;width:100%;height:100%;max-height:none;border-radius:0}
}

.cc-mobile-only{display:none}
@media (max-width:767px){.cc-mobile-only{display:inline-flex}.cc-chat,.cc-sidebar,.cc-details{width:100%;max-width:100%;overflow-x:hidden}.cc-item-main strong,.cc-item-main p,.cc-message-body{overflow-wrap:anywhere}.cc-bubble{max-width:82%}}

#communicationCentreView.cc-details-hidden .cc-layout{grid-template-columns:minmax(300px,340px) minmax(540px,1fr);}
#communicationCentreView.cc-details-hidden .cc-chat{grid-column:auto;}
.cc-details.collapsed{display:none !important;}
.cc-message-row{align-items:flex-end;gap:10px;margin-bottom:16px}.cc-message-row.mine{justify-content:flex-end}.cc-message-row.incoming{justify-content:flex-start}
.cc-avatar{width:32px;height:32px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#eef2ff;color:#1d4ed8;font-size:11px;font-weight:700;flex:0 0 32px;border:1px solid #d8e2ff}
.cc-avatar.mine{background:#dbeafe;color:#1d4ed8}
.cc-message-row.mine .cc-message-meta{text-align:right;justify-content:flex-end}.cc-message-row.mine .cc-message-actions{justify-content:flex-end}.cc-message-row.mine .cc-reactions{justify-content:flex-end}
.cc-message-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.cc-sender{font-weight:700;color:#0f172a}.cc-sep{color:#94a3b8}
.cc-message-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.cc-message-actions .btn,.cc-reaction-btn{padding:4px 8px;border-radius:999px;font-size:11px}
.cc-reactions{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.cc-message-row.mine .cc-bubble{border-top-right-radius:6px}.cc-message-row.incoming .cc-bubble{border-top-left-radius:6px}
.cc-system-message{display:block}
.cc-chat-header .btn{white-space:nowrap}
@media (max-width:1100px){#communicationCentreView.cc-details-hidden .cc-layout{grid-template-columns:minmax(280px,320px) 1fr;}}
@media (max-width:767px){.cc-avatar{display:none}.cc-message-row{gap:0}.cc-message-actions{gap:4px}}
.cc-reply-target{margin:10px 14px 0;padding:10px 12px;border:1px solid #bfdbfe;border-left:4px solid #2563eb;background:#eff6ff;border-radius:12px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#1e3a8a}
.cc-reply-target div{min-width:0}.cc-reply-target strong{display:block;font-size:12px;margin-bottom:3px}.cc-reply-target span{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#475569}
.cc-message-status{margin-top:6px;font-size:11px;font-weight:700;text-align:right;color:#64748b}.cc-message-status.read{color:#2563eb}.cc-message-status.received{color:#64748b}
.cc-message-row.incoming .cc-message-status{display:none}
.cc-reaction-btn{cursor:pointer}.cc-reaction-btn:hover{transform:translateY(-1px);background:#eef4ff;border-color:#c7d7fe}
.is-blocked,
.action-btn:disabled,
.create-invoice-btn.is-disabled,
.create-invoice-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
  pointer-events:none;
}
@media (max-width:767px){.cc-reply-target{margin:8px 10px 0}.cc-reply-target span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.cc-message-status{font-size:10px}}

/* Communication Centre assignment controls */
.cc-assignment-manage-section{display:flex;flex-direction:column;gap:8px}
.cc-assignment-manage-section label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.02em;color:#667085;margin-top:4px}
.cc-assignment-manage-section .select{width:100%;min-height:36px;border-radius:9px;border:1px solid #dfe5ef;background:#fff;padding:7px 10px;color:#172033}
.cc-assignment-hint{font-size:11px;line-height:1.4;background:#f8fbff;border:1px solid #edf1f6;border-radius:8px;padding:8px}


/* Communication Centre: fixed-height chat thread with internal message scroll */
#communicationCentreView{
  height:calc(100dvh - 104px);
  min-height:560px;
  max-height:calc(100dvh - 104px);
  overflow:hidden;
}
#communicationCentreView .cc-layout{
  height:100%;
  min-height:0;
  max-height:100%;
  overflow:hidden;
}
#communicationCentreView .cc-sidebar,
#communicationCentreView .cc-chat,
#communicationCentreView .cc-details{
  min-height:0;
  max-height:100%;
  overflow:hidden;
}
#communicationCentreView .cc-chat{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
}
#communicationCentreView .cc-chat-header,
#communicationCentreView .cc-composer,
#communicationCentreView #communicationCentreClosedMsg,
#communicationCentreView #communicationCentreReplyTarget,
#communicationCentreView #communicationCentreReplyError{
  flex:0 0 auto;
}
#communicationCentreView .cc-messages{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scroll-behavior:auto;
}
#communicationCentreView .cc-list{
  max-height:none;
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
}
#communicationCentreView .cc-sidebar{
  display:flex;
  flex-direction:column;
}
#communicationCentreView .cc-sidebar-top,
#communicationCentreView .cc-filters,
#communicationCentreView .cc-pagination{
  flex:0 0 auto;
}
#communicationCentreView .cc-details{
  overflow-y:auto;
  overflow-x:hidden;
}
@media (max-width:767px){
  #communicationCentreView{
    height:calc(100dvh - 88px);
    min-height:calc(100dvh - 88px);
    max-height:calc(100dvh - 88px);
    padding:0;
    border-radius:0;
  }
  #communicationCentreView .cc-layout{
    height:100%;
    min-height:0;
  }
  #communicationCentreView .cc-chat,
  #communicationCentreView .cc-sidebar,
  #communicationCentreView .cc-details{
    height:100%;
    min-height:0;
    max-height:100%;
  }
  #communicationCentreView .cc-messages{
    min-height:0;
    padding-bottom:18px;
  }
}

/* Communication Centre theme fixes: use the app theme variables (dark is the default root theme; light is :root[data-theme="light"]). */
.communication-centre-module,
#communicationCentreView.communication-centre-module{
  background:var(--bg);
  color:var(--text);
}
.communication-centre-layout,
.communication-conversation-list,
.communication-message-list{
  color:var(--text);
}
.communication-centre-sidebar,
.communication-thread,
.communication-conversation-card,
.communication-composer,
.communication-centre-modal .modal-content,
.communication-centre-modal .header,
.communication-centre-modal .actions,
.communication-action-item-card,
.cc-sidebar,
.cc-chat,
.cc-details,
.cc-item,
.cc-composer,
.cc-details-section{
  background:var(--card);
  color:var(--text);
  border-color:var(--border);
}
.cc-sidebar-top,
.communication-thread-header,
.cc-chat-header,
.cc-details .header{
  background:var(--card);
  color:var(--text);
  border-color:var(--border);
}
.cc-sidebar-top h2,
.cc-chat-heading h3,
.cc-details h3,
.cc-details-section strong,
.cc-item-main strong,
.cc-sender{
  color:var(--text);
}
.cc-sidebar-top .muted,
.cc-chat-heading .muted,
.cc-item-main small,
.cc-item-main p,
.cc-time,
.cc-message-meta,
.cc-message-status,
.communication-centre-empty-state,
.communication-centre-module .muted,
.communication-centre-module .text-muted,
.communication-centre-modal .muted,
.cc-assignment-manage-section label{
  color:var(--muted) !important;
}
.cc-list,
.cc-messages,
.communication-message-list{
  background:color-mix(in oklab, var(--bg) 92%, var(--card) 8%);
}
.communication-conversation-card:hover,
.communication-conversation-card.active,
.cc-item:hover,
.cc-item.active{
  background:color-mix(in oklab, var(--card) 78%, var(--accent) 22%);
  border-color:color-mix(in oklab, var(--border) 62%, var(--accent) 38%);
}
.cc-item.unread .cc-item-main strong{
  color:var(--text);
  font-weight:800;
}
.communication-conversation-card.has-unread,
.cc-item.has-unread{
  background:color-mix(in oklab, var(--card) 84%, var(--accent) 16%);
  border-color:color-mix(in oklab, var(--border) 58%, var(--accent) 42%);
}
.conversation-unread-badge{
  background:var(--accent);
  color:#fff;
}
.communication-centre-module input,
.communication-centre-module select,
.communication-centre-module textarea,
.communication-composer textarea,
.communication-composer input,
.communication-centre-modal input,
.communication-centre-modal select,
.communication-centre-modal textarea,
.communication-related-record-select,
.cc-assignment-manage-section .select{
  background:var(--bg);
  color:var(--text);
  border-color:var(--border);
}
.communication-centre-module input::placeholder,
.communication-centre-module textarea::placeholder,
.communication-centre-modal input::placeholder,
.communication-centre-modal textarea::placeholder{
  color:var(--muted);
}
.communication-centre-module option,
.communication-centre-modal option{
  background:var(--card);
  color:var(--text);
}
.communication-related-record-results,
.communication-related-record-results.card,
#communicationCentreCreateRelatedRecordResults{
  background:var(--card);
  color:var(--text);
  border-color:var(--border);
  box-shadow:var(--shadow);
}
.cc-related-record-option,
.communication-related-record-option{
  display:block;
  width:100%;
  text-align:left;
  padding:8px 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  cursor:pointer;
}
.cc-related-record-option:hover,
.communication-related-record-option:hover{
  background:color-mix(in oklab, var(--card) 78%, var(--accent) 22%);
}
.cc-related-record-option strong,
.communication-related-record-option strong{
  color:var(--text);
}
.communication-message-bubble,
.cc-bubble{
  background:var(--card);
  color:var(--text);
  border-color:var(--border);
}
.communication-message-bubble .cc-message-body,
.cc-bubble .cc-message-body{
  color:var(--text);
}
.communication-message-bubble.incoming,
.cc-message-row.incoming .cc-bubble{
  background:color-mix(in oklab, var(--card) 88%, var(--bg) 12%);
  color:var(--text);
  border-color:var(--border);
}
.communication-message-bubble.outgoing,
.cc-message-row.mine .cc-bubble{
  background:color-mix(in oklab, var(--accent) 38%, var(--card) 62%);
  color:var(--text);
  border-color:color-mix(in oklab, var(--accent) 60%, var(--border) 40%);
}
.cc-avatar,
.cc-avatar.mine{
  background:color-mix(in oklab, var(--accent) 18%, var(--card) 82%);
  color:var(--text);
  border-color:color-mix(in oklab, var(--accent) 40%, var(--border) 60%);
}
.cc-system-message,
#communicationCentreClosedMsg,
.cc-reply-target,
.cc-details #communicationCentreDrawerMeta,
.cc-assignment-hint{
  background:color-mix(in oklab, var(--card) 88%, var(--bg) 12%);
  color:var(--muted) !important;
  border-color:var(--border);
}
.cc-reply-target strong,
.cc-reply-target span{
  color:var(--text);
}
.cc-reply-target span{
  color:var(--muted);
}
.communication-centre-modal .modal-content,
.communication-centre-modal .header,
.communication-centre-modal form,
.communication-centre-modal .filter-row{
  color:var(--text);
  border-color:var(--border);
}
.communication-centre-error{
  color:var(--danger);
}
.communication-centre-module .chip,
.communication-centre-modal .chip,
.cc-participant-chip{
  background:var(--chip);
  color:var(--text);
  border-color:var(--border);
}
.cc-status-chip{
  background:color-mix(in oklab, var(--ok) 18%, var(--card) 82%);
  color:var(--text);
}
.cc-priority-chip{
  background:color-mix(in oklab, var(--warn) 18%, var(--card) 82%);
  color:var(--text);
}
.cc-unread-chip{
  background:color-mix(in oklab, var(--accent) 18%, var(--card) 82%);
  color:var(--text);
}
.communication-centre-module .btn.primary,
.communication-centre-module .btn:not(.ghost),
#communicationCentreNewBtn,
#communicationCentreReplyBtn{
  color:#fff;
}
.communication-centre-module .btn.ghost,
#communicationCentreExportPdfBtn,
.cc-filters .btn{
  background:var(--chip);
  color:var(--text);
  border-color:var(--border);
}
.communication-centre-module .btn.ghost:hover,
#communicationCentreExportPdfBtn:hover,
.cc-filters .btn:hover,
.cc-filters .btn.active{
  background:color-mix(in oklab, var(--chip) 72%, var(--accent) 28%);
  border-color:color-mix(in oklab, var(--border) 60%, var(--accent) 40%);
  color:var(--text);
}

@media (max-width:767px){
  .communication-centre-module .cc-sidebar-top{
    background:var(--card);
  }
}


.payment-reminder-settings {
  display: grid;
  gap: 6px;
  min-width: 220px;
}
.payment-reminder-settings .checkline {
  align-items: center;
  display: flex;
  gap: 6px;
  font-size: 12px;
  white-space: nowrap;
}
.payment-reminder-days {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
}
.payment-reminder-settings select[multiple] {
  min-height: 74px;
}

/* Client scheduled payments status badges */
.chip.ok{border-color:var(--ok);color:var(--ok);background:rgba(34,197,94,.12)}
.chip.warn{border-color:var(--warn);color:#b45309;background:rgba(245,158,11,.14)}
.chip.danger{border-color:var(--danger);color:var(--danger);background:rgba(239,68,68,.12)}
.chip.info{border-color:var(--accent);color:var(--accent);background:rgba(59,130,246,.12)}

/* Document footers belong to isolated preview/print documents, never app modules. */
#app .document-footer,
#app .app-footer,
#app .preview-footer,
#app .invoice-footer,
#app .receipt-footer,
#app .credit-note-footer,
#app .a4-footer,
#paymentForecastView footer,
.payment-forecast-module footer,
.payment-forecast-table footer {
  display:none !important;
}

/* Payment Forecast */
.payment-forecast-summary {
  margin: 4px 0 16px;
}
.payment-forecast-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}
.payment-forecast-summary-card {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 118px;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 18px 18px 16px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .06);
}
.payment-forecast-summary-card::before {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: transparent;
}
.payment-forecast-summary-card.is-highlighted::before {
  background: rgba(37, 99, 235, .72);
}
.payment-forecast-summary-card.is-overdue {
  border-color: rgba(239, 68, 68, .32);
  box-shadow: 0 8px 24px rgba(127, 29, 29, .08);
}
.payment-forecast-summary-card.is-overdue::before {
  background: rgba(239, 68, 68, .8);
}
.payment-forecast-summary-card .summary-label {
  color: var(--muted, #64748b);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .1em;
  line-height: 1.25;
  text-transform: uppercase;
}
.payment-forecast-summary-card .summary-value {
  color: var(--text, #0f172a);
  font-size: clamp(26px, 2.4vw, 32px);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.1;
  overflow-wrap: anywhere;
}
.payment-forecast-summary-card .summary-subtitle {
  color: var(--muted, #64748b);
  font-size: 12px;
  line-height: 1.35;
}
@media (max-width: 980px) {
  .payment-forecast-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .payment-forecast-summary-grid {
    grid-template-columns: 1fr;
  }
}
.payment-forecast-analytics { margin: 12px 0; }
.pf-analytics-card { min-height: 150px; }
.pf-analytics-card strong { display:block; margin-bottom:8px; }
.pf-mini-row { display:flex; justify-content:space-between; gap:12px; padding:6px 0; border-bottom:1px solid var(--border, #e5e7eb); font-size:13px; }
.pf-mini-row:last-child { border-bottom:0; }
.pf-mini-row span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pf-mini-row strong { white-space:nowrap; margin:0; }
.status-badge.bad { background:#fee2e2; color:#991b1b; border-color:#fecaca; }
.status-badge.warn { background:#fef3c7; color:#92400e; border-color:#fde68a; }
.status-badge.ok { background:#dcfce7; color:#166534; border-color:#bbf7d0; }
#paymentForecastTable .num { text-align:right; white-space:nowrap; }
#paymentForecastTable .actions-cell { white-space:nowrap; }

/* Receivables control center */
.pf-page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}.pf-page-header h2{margin:4px 0 5px;font-size:28px}.pf-eyebrow{color:var(--accent,#2563eb);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.pf-header-actions,.pf-actions{display:flex;flex-wrap:wrap;gap:6px}.pf-tabs{display:flex;gap:5px;padding:5px;margin-bottom:16px;overflow-x:auto;background:#f1f5f9;border:1px solid #e2e8f0;border-radius:12px}.pf-tabs button{padding:9px 13px;white-space:nowrap;background:transparent;border:0;border-radius:8px;color:#475569;font-weight:700;cursor:pointer}.pf-tabs button.active{background:#fff;color:#0f172a;box-shadow:0 1px 4px rgba(15,23,42,.12)}.payment-forecast-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:12px;margin-bottom:16px}.payment-forecast-summary-grid.is-hidden{display:none}.payment-forecast-summary-card{min-height:112px}.payment-forecast-summary-card.is-positive::before{background:#22c55e}.payment-forecast-summary-card.is-info::before{background:#3b82f6}.payment-forecast-summary-card.is-warning::before{background:#f59e0b}.pf-filter-panel{padding:14px;margin-bottom:12px}.pf-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:9px}.pf-quick-filters{display:flex;align-items:center;flex-wrap:wrap;gap:14px;margin-top:12px;color:#475569;font-size:13px}.pf-quick-filters label{display:flex;align-items:center;gap:5px}.pf-state{margin:10px 0}.pf-content .table-scroll{max-height:64vh;border:1px solid #e2e8f0;border-radius:12px;background:#fff}.pf-content table{min-width:1250px;margin:0}.pf-content thead th{position:sticky;top:0;z-index:1;background:#f8fafc}.pf-overdue-row td{background:rgba(254,226,226,.55)}.pf-overdue-row td:first-child{box-shadow:inset 4px 0 #ef4444}.pf-due-soon-row td{background:rgba(254,243,199,.42)}.pf-empty{text-align:center;padding:34px!important}.status-badge.info{background:#dbeafe;color:#1d4ed8;border-color:#bfdbfe}.pf-content .actions-cell,.pf-actions{min-width:210px}@media(max-width:900px){.pf-page-header{flex-direction:column}.pf-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.pf-filter-grid{grid-template-columns:1fr}.payment-forecast-summary-grid{grid-template-columns:1fr 1fr}.pf-header-actions{width:100%}.pf-header-actions .btn{flex:1}}
.pf-notes-cell{min-width:220px;max-width:340px;white-space:normal;line-height:1.45}

.pf-pagination{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px;padding:12px 2px 4px;color:#475569;font-size:13px}.pf-pagination label{display:flex;align-items:center;gap:7px}.pf-pagination .select{width:auto;min-width:72px;padding-block:7px}.pf-pagination-showing{margin-right:auto;font-weight:700}@media(max-width:600px){.pf-pagination{justify-content:center}.pf-pagination-showing{width:100%;margin-right:0;text-align:center}}
.pf-summary-message{grid-column:1/-1;padding:18px;border:1px solid var(--border,#e2e8f0);border-radius:12px;background:#fff}.pf-error{color:#b91c1c;background:#fef2f2;border-color:#fecaca}.pf-overview-helper{display:flex;flex-direction:column;gap:6px;padding:18px;border:1px solid var(--border,#cbd5e1);border-radius:12px;background:#f8fafc}.pf-overview-helper strong{color:var(--text,#0f172a)}.pf-overview-helper span{color:var(--muted,#64748b)}

/* Payment Forecast follow-up activity */
body.pf-modal-open{overflow:hidden}.pf-activity-modal[hidden],.pf-note-modal[hidden]{display:none}.pf-activity-modal{position:fixed;inset:0;z-index:1000;display:flex;justify-content:flex-end}.pf-activity-backdrop{position:absolute;inset:0;width:100%;border:0;background:rgba(15,23,42,.48);cursor:pointer}.pf-activity-drawer{position:relative;display:flex;flex-direction:column;width:min(920px,94vw);height:100%;padding:22px;background:#fff;box-shadow:-18px 0 45px rgba(15,23,42,.2);overflow:hidden}.pf-activity-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:1px solid #e2e8f0}.pf-activity-header h2{margin:4px 0 0}.pf-activity-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:16px 0}.pf-activity-summary>div{display:flex;flex-direction:column;gap:5px;padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc}.pf-activity-summary span{color:#64748b;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.pf-activity-content{min-height:0;flex:1;overflow:auto}.pf-activity-content .table-scroll{max-height:none}.pf-activity-table{min-width:820px}.pf-activity-table th{position:sticky;top:0;z-index:1;background:#f8fafc}.pf-activity-state{padding:28px;border:1px solid #e2e8f0;border-radius:10px;text-align:center}@media(max-width:700px){.pf-activity-drawer{width:100%;padding:16px}.pf-activity-summary{grid-template-columns:1fr}.pf-activity-header h2{font-size:22px}}

.pf-activity-summary{grid-template-columns:repeat(5,minmax(0,1fr))}.pf-activity-timeline{display:flex;flex-direction:column;gap:0;padding:4px 0}.pf-activity-entry{position:relative;margin-left:10px;padding:0 0 24px 28px;border-left:2px solid #dbeafe}.pf-activity-entry:last-child{padding-bottom:4px}.pf-activity-entry::before{content:"";position:absolute;top:4px;left:-7px;width:12px;height:12px;border:2px solid #fff;border-radius:50%;background:#2563eb;box-shadow:0 0 0 2px #bfdbfe}.pf-activity-entry-time{margin-bottom:5px;color:#64748b;font-size:12px;font-weight:700}.pf-activity-entry-title{display:flex;align-items:center;flex-wrap:wrap;gap:7px;color:#0f172a;font-weight:800}.pf-activity-entry-status.status-badge{margin-left:2px;padding:3px 8px;font-size:11px;line-height:1.2}.pf-activity-entry-status-change{display:flex;align-items:center;gap:7px;margin-top:7px;color:#475569;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.pf-activity-entry-note{margin:8px 0 0;padding:10px 12px;border-radius:8px;background:#f8fafc;color:#334155;white-space:pre-wrap}.pf-note-modal{position:fixed;inset:0;z-index:1010;display:grid;place-items:center;padding:18px}.pf-note-backdrop{position:absolute;inset:0;width:100%;border:0;background:rgba(15,23,42,.52)}.pf-note-dialog{position:relative;width:min(520px,100%);padding:20px;border-radius:14px;background:#fff;box-shadow:0 20px 55px rgba(15,23,42,.28)}.pf-note-dialog header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.pf-note-dialog h2{margin:4px 0 0}.pf-note-dialog label{display:block;margin-bottom:7px;font-weight:800}.pf-note-dialog textarea{width:100%;resize:vertical}.pf-note-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}@media(max-width:900px){.pf-activity-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Payment Forecast drill-down drawer */
.payment-forecast-summary-card[data-drilldown-metric],.pf-clickable-row{cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.payment-forecast-summary-card[data-drilldown-metric]:hover,.payment-forecast-summary-card[data-drilldown-metric]:focus-visible{transform:translateY(-2px);box-shadow:0 8px 22px rgba(15,23,42,.14)}.pf-clickable-row:hover td{background:#eff6ff}.pf-clickable-row:focus-visible{outline:2px solid #2563eb;outline-offset:-2px}.payment-forecast-details-drawer[hidden]{display:none}.payment-forecast-details-drawer{position:fixed;inset:0;z-index:1200;display:flex;justify-content:flex-end}.payment-forecast-details-backdrop{position:absolute;inset:0;border:0;background:rgba(15,23,42,.48);cursor:pointer}.payment-forecast-details-panel{position:relative;width:min(1120px,96vw);height:100%;overflow:auto;background:#f8fafc;box-shadow:-12px 0 36px rgba(15,23,42,.24)}.payment-forecast-details-header{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding:20px 24px;border-bottom:1px solid #e2e8f0;background:rgba(255,255,255,.97)}.payment-forecast-details-header h2{margin:3px 0 4px}.payment-forecast-details-header p{margin:0}.payment-forecast-details-content{padding:20px 24px 36px}.payment-forecast-details-section{margin-bottom:18px;padding:16px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;box-shadow:0 1px 2px rgba(15,23,42,.04)}.payment-forecast-details-section h3{margin:0 0 12px;font-size:16px}.payment-forecast-details-grid{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:10px}.payment-forecast-details-card{padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc}.payment-forecast-details-card span{display:block;color:#64748b;font-size:11px;font-weight:800;text-transform:uppercase}.payment-forecast-details-card strong{display:block;margin-top:5px;font-size:17px}.payment-forecast-mini-table{max-width:100%;overflow:auto;border:1px solid #e2e8f0;border-radius:10px}.payment-forecast-mini-table table{width:100%;min-width:850px;border-collapse:collapse}.payment-forecast-mini-table th,.payment-forecast-mini-table td{padding:9px 10px;border-bottom:1px solid #e2e8f0;text-align:left;font-size:12px;vertical-align:top}.payment-forecast-mini-table th{background:#f8fafc;color:#475569;white-space:nowrap}.payment-forecast-log-timeline{display:grid;gap:10px}.payment-forecast-log-item{padding:11px 12px;border-left:3px solid #3b82f6;border-radius:6px;background:#f8fafc}.payment-forecast-log-item strong,.payment-forecast-log-item span{margin-right:8px}.payment-forecast-detail-actions{display:flex;flex-wrap:wrap;gap:8px}.pf-detail-loading,.pf-detail-empty{padding:30px;text-align:center;color:#64748b}@media(max-width:800px){.payment-forecast-details-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payment-forecast-details-content{padding:14px}.payment-forecast-details-header{padding:15px}}

/* Biners payable module */
.biners-module .pf-page-header,
.biners-page-header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.biners-header-actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.biners-summary-card { min-height:118px; }
.biners-overview-card { margin-bottom:12px; }
.biners-table-wrap { background:#fff; border-radius:14px; border:1px solid #e5e7eb; overflow:auto; }
.biners-table th, .biners-table td { white-space:nowrap; vertical-align:middle; }
.biners-table td:first-child, .biners-table th:first-child { padding-left:16px; }
.biners-modal[hidden] { display:none !important; }
.biners-modal { position:fixed; inset:0; z-index:9999; display:flex; align-items:center; justify-content:center; padding:24px; }
.biners-modal-backdrop { position:absolute; inset:0; border:0; background:rgba(15,23,42,.45); cursor:pointer; }
.biners-dialog { position:relative; z-index:1; width:min(1100px,96vw); max-height:92vh; overflow:auto; background:#fff; border:1px solid #e5e7eb; border-radius:18px; box-shadow:0 24px 70px rgba(15,23,42,.24); padding:20px; }
.biners-payment-dialog { width:min(680px,94vw); }
.biners-dialog-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding-bottom:12px; border-bottom:1px solid #e5e7eb; margin-bottom:14px; }
.biners-dialog-header h2 { margin:4px 0 0; }
.biners-form-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.biners-form-grid label { display:flex; flex-direction:column; gap:6px; font-size:12px; color:#4b5563; font-weight:700; letter-spacing:.03em; }
.biners-form-grid .biners-full { grid-column:1 / -1; }
.biners-schedule-builder { margin-top:18px; border:1px solid #e5e7eb; border-radius:14px; padding:14px; background:#f8fafc; }
.biners-schedule-rows { display:flex; flex-direction:column; gap:10px; margin-top:12px; }
.biners-schedule-row { display:grid; grid-template-columns:70px 1fr 1fr 1fr auto; gap:8px; align-items:end; background:#fff; border:1px solid #e5e7eb; border-radius:12px; padding:10px; }
.biners-schedule-row label { display:flex; flex-direction:column; gap:4px; font-size:11px; color:#6b7280; font-weight:700; }
.biners-dialog-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:18px; padding-top:14px; border-top:1px solid #e5e7eb; }
.biners-module .pf-pagination { display:flex; align-items:center; justify-content:flex-end; gap:10px; flex-wrap:wrap; margin:12px 0; }
@media (max-width: 900px) {
  .biners-page-header { flex-direction:column; }
  .biners-form-grid { grid-template-columns:1fr; }
  .biners-schedule-row { grid-template-columns:1fr; }
}

/* Biners monthly forecast and drill-down */
.biners-clickable-row { cursor:pointer; transition:background .15s ease; }
.biners-clickable-row:hover, .biners-clickable-row:focus { background:#f1f5f9; outline:none; }
.biners-row-actions { display:flex; gap:6px; }
.biners-forecast-tabs { display:flex; gap:8px; margin-bottom:12px; }
.biners-location-rows { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.biners-location-row { display:grid; grid-template-columns:1fr 1fr auto; gap:8px; }
.biners-details-drawer[hidden] { display:none !important; }
.biners-details-drawer { position:fixed; inset:0; z-index:10000; display:flex; justify-content:flex-end; }
.biners-drawer-backdrop { position:absolute; inset:0; border:0; background:rgba(15,23,42,.45); }
.biners-drawer-panel { position:relative; width:min(760px,96vw); height:100%; overflow:auto; background:#f8fafc; padding:20px; box-shadow:-18px 0 50px rgba(15,23,42,.22); }
.biners-details-content { display:flex; flex-direction:column; gap:14px; }
.biners-drawer-summary { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.biners-drawer-summary article, .biners-drawer-section { background:#fff; border:1px solid #e5e7eb; border-radius:14px; padding:14px; }
.biners-drawer-summary span { display:block; color:#64748b; font-size:11px; font-weight:700; text-transform:uppercase; }
.biners-drawer-summary strong { display:block; margin-top:6px; font-size:17px; }
.biners-drawer-section h3 { margin:0 0 12px; }
.biners-detail-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:0; }
.biners-detail-list div { padding:10px; border-radius:10px; background:#f8fafc; }
.biners-detail-list dt { color:#64748b; font-size:11px; font-weight:700; text-transform:uppercase; }
.biners-detail-list dd { margin:4px 0 0; }
.biners-drawer-actions { margin-top:12px; display:flex; justify-content:flex-end; }
@media (max-width:700px) { .biners-drawer-summary,.biners-detail-list { grid-template-columns:1fr; } .biners-location-row { grid-template-columns:1fr; } }

/* Biners bulk payment and enhanced drawer helpers */
.biners-bulk-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  margin: 0 0 10px;
  border: 1px solid #dbeafe;
  border-radius: 14px;
  background: #eff6ff;
}
.biners-bulk-toolbar .muted { margin-left: 6px; }
.biners-table input[type="checkbox"] { width: 16px; height: 16px; }
.biners-drawer-section .biners-table-wrap { max-height: 360px; }


/* Lifecycle status history drawer */
.lifecycle-history-btn { margin-top: 8px; align-self: flex-start; }
.lifecycle-history-modal { justify-content: flex-end; align-items: stretch; }
.lifecycle-history-drawer { width: min(720px, 96vw); max-width: none; height: 100vh; max-height: none; margin: 0; border-radius: 16px 0 0 16px; overflow-y: auto; }
.lifecycle-history-body { padding-top: 14px; }
.lifecycle-history-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 18px; }
.lifecycle-history-cards .value { font-size: 16px; overflow-wrap: anywhere; }
.lifecycle-history-list { position: relative; display: grid; gap: 12px; padding-left: 18px; }
.lifecycle-history-list::before { content: ''; position: absolute; inset: 6px auto 6px 5px; width: 2px; background: var(--border); }
.lifecycle-history-entry { position: relative; border: 1px solid var(--border); border-radius: 12px; padding: 12px; background: var(--card); }
.lifecycle-history-entry::before { content: ''; position: absolute; left: -19px; top: 17px; width: 10px; height: 10px; border-radius: 50%; background: var(--primary); box-shadow: 0 0 0 3px var(--bg); }
.lifecycle-history-entry__date { color: var(--muted); font-size: 12px; margin-bottom: 5px; }
.lifecycle-history-empty { padding: 24px; text-align: center; border: 1px dashed var(--border); border-radius: 12px; }
@media (max-width: 720px) { .lifecycle-history-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lifecycle-history-drawer { border-radius: 0; } }
.cc-edited-label{font-size:11px;font-weight:700;color:#64748b}
.cc-delete-message-btn{color:#b42318;border-color:#fecaca}.cc-delete-message-btn:hover{background:#fef2f2;border-color:#fca5a5;color:#991b1b}

/* Biners entry validation and save feedback */
.biners-entry-error { margin-bottom:12px; padding:10px 12px; border:1px solid #fecaca; border-radius:10px; background:#fef2f2; color:#991b1b; font-size:13px; font-weight:600; }
.biners-entry-error[hidden] { display:none; }
.biners-field-error { color:#b91c1c; font-size:11px; font-weight:600; letter-spacing:0; }
#binersEntryForm [aria-invalid="true"] { border-color:#dc2626; box-shadow:0 0 0 2px rgba(220,38,38,.12); }

/* Communication Centre Message Info */
.cc-message-time-link,
.cc-message-info-trigger {
  border: 0;
  background: transparent;
  color: inherit;
  cursor: pointer;
  padding: 0;
  font: inherit;
  text-decoration: underline;
  text-decoration-style: dotted;
}
.cc-message-status.cc-message-info-trigger {
  display: inline-flex;
  gap: 4px;
  margin-top: 4px;
  text-decoration: none;
}
.cc-message-status.read { color: #0b7ec2; }
.cc-message-status.received { color: #475569; }
.cc-message-status.sent { color: #64748b; }
.cc-message-info-drawer[hidden] { display: none; }
.cc-message-info-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.35);
  z-index: 1050;
}
.cc-message-info-panel {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(460px, 100vw);
  overflow: auto;
  background: #fff;
  box-shadow: -18px 0 40px rgba(15, 23, 42, 0.22);
  z-index: 1051;
  padding: 20px;
}
.cc-message-info-panel header,
.cc-message-info-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.cc-message-info-preview,
.cc-message-info-meta,
.cc-message-info-section {
  border-top: 1px solid #e5e7eb;
  margin-top: 16px;
  padding-top: 16px;
}
.cc-message-info-meta div,
.cc-message-info-row {
  margin-bottom: 12px;
}
.cc-message-info-meta dt {
  color: #64748b;
  font-size: 12px;
}
.cc-message-info-meta dd {
  margin: 2px 0 0;
}
.cc-message-info-row strong,
.cc-message-info-row span,
.cc-message-info-row small,
.cc-message-info-row time {
  display: block;
}
.cc-message-info-row time {
  color: #64748b;
  font-size: 12px;
  text-align: right;
  margin-top: 4px;
}
.cc-message-info-badge.failed { color: #b42318; background: #fee4e2; }
.cc-message-info-badge.read { color: #1d4ed8; background: #dbeafe; }
.cc-message-info-badge.delivered { color: #166534; background: #dcfce7; }
.cc-message-info-badge.sent { color: #475569; background: #f1f5f9; }

/* Leads right-side details drawer */
#leadsTable tbody tr[data-lead-row]{cursor:pointer;transition:background .15s ease,box-shadow .15s ease;}
#leadsTable tbody tr[data-lead-row]:hover td{background:#eff6ff;}
#leadsTable tbody tr[data-lead-row]:focus-visible{outline:2px solid #2563eb;outline-offset:-2px;}
#leadsTable tbody tr[data-lead-row].is-selected td{background:#e0f2fe;}
.lead-details-panel{width:min(980px,96vw);}
.lead-details-content{display:grid;gap:16px;}
.lead-details-fields{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:10px;}
.lead-details-field{padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;min-width:0;}
.lead-details-field span{display:block;color:#64748b;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;}
.lead-details-field strong{display:block;margin-top:5px;color:#0f172a;font-size:14px;line-height:1.35;word-break:break-word;}
.lead-details-notes{white-space:pre-wrap;color:#334155;line-height:1.55;}
.lead-details-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.lead-details-status-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#eef2ff;color:#3730a3;font-size:12px;font-weight:800;text-transform:capitalize;}
@media(max-width:800px){.lead-details-fields{grid-template-columns:1fr}.lead-details-panel{width:min(100vw,100%);}}

/* Shared CRM/commercial right-side details drawer */
.record-details-panel{width:min(1040px,96vw);}
.record-details-content{display:grid;gap:16px;}
.record-details-fields{display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:10px;}
.record-details-field{padding:12px;border:1px solid #e2e8f0;border-radius:10px;background:#f8fafc;min-width:0;}
.record-details-field span{display:block;color:#64748b;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;}
.record-details-field strong{display:block;margin-top:5px;color:#0f172a;font-size:14px;line-height:1.35;word-break:break-word;}
.record-details-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.entity-clickable-row{cursor:pointer;transition:background .15s ease,box-shadow .15s ease;}
.entity-clickable-row:hover td{background:#eff6ff;}
.entity-clickable-row:focus-visible{outline:2px solid #2563eb;outline-offset:-2px;}
.entity-clickable-row.is-selected td{background:#eef2ff;}
@media(max-width:800px){.record-details-fields{grid-template-columns:1fr}.record-details-panel{width:100%;}}

/* Grouped left module menu */
@media (min-width:1025px){
  .content-layout{
    grid-template-columns:280px minmax(0,1fr);
  }
}
.view-menu{
  overflow:hidden;
}
.view-menu-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  margin-bottom:12px;
  padding:2px 2px 10px;
  border-bottom:1px solid var(--border);
}
.view-menu-subtitle{
  margin-top:2px;
  font-size:12px;
  color:var(--muted);
}
.grouped-view-tabs{
  gap:12px;
}
.view-menu-group{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:16px;
  background:linear-gradient(180deg, rgba(148,163,184,.08), rgba(148,163,184,.025));
  box-shadow:0 10px 24px rgba(15,23,42,.06);
  transition:border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.view-menu-group.is-expanded{
  border-color:rgba(37,99,235,.22);
  background:linear-gradient(180deg, rgba(37,99,235,.08), rgba(148,163,184,.025));
}
.view-menu-group.is-collapsed{
  box-shadow:0 6px 16px rgba(15,23,42,.04);
}
.view-menu-group-title{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  padding:5px 8px 8px;
  margin:0 0 2px;
  color:var(--text);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.12em;
  border:0;
  border-bottom:1px solid rgba(148,163,184,.18);
  background:transparent;
  cursor:pointer;
  font:inherit;
  text-align:left;
}
.view-menu-group-title:hover{
  color:var(--accent);
}
.view-menu-group-title:focus-visible{
  outline:2px solid rgba(37,99,235,.35);
  outline-offset:2px;
  border-radius:10px;
}
.view-menu-group-label{
  display:inline-flex;
  align-items:center;
  min-width:0;
  gap:8px;
}
.view-menu-group-chevron{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:22px;
  height:22px;
  border-radius:8px;
  background:rgba(148,163,184,.12);
  color:var(--muted);
  font-size:13px;
  line-height:1;
  transition:transform .18s ease, background .18s ease, color .18s ease;
}
.view-menu-group.is-expanded .view-menu-group-chevron{
  transform:rotate(180deg);
  background:rgba(37,99,235,.12);
  color:var(--accent);
}
.view-menu-group-body{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.view-menu-group:not(.is-expanded) .view-menu-group-body,
.view-menu-group-body[hidden]{
  display:none !important;
}
.view-menu-group-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  border-radius:9px;
  background:rgba(37,99,235,.12);
  font-size:13px;
  letter-spacing:0;
}
.grouped-view-tabs .view-tab{
  position:relative;
  min-height:38px;
  padding:9px 10px;
  border-radius:12px;
  color:var(--muted);
  font-weight:650;
  line-height:1.2;
  transition:background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}
.grouped-view-tabs .view-tab .icon{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 22px;
  border-radius:8px;
  background:rgba(148,163,184,.12);
  font-size:14px;
}
.grouped-view-tabs .view-tab:not(.active):hover{
  background:rgba(148,163,184,.10);
  border-color:rgba(148,163,184,.28);
  color:var(--text);
  transform:translateX(2px);
}
.grouped-view-tabs .view-tab.active{
  background:linear-gradient(135deg, var(--accent), var(--brand-secondary));
  color:#fff;
  border-color:transparent;
  box-shadow:0 12px 24px rgba(37,99,235,.24);
}
.grouped-view-tabs .view-tab.active .icon{
  background:rgba(255,255,255,.20);
}
.grouped-view-tabs .view-tab[style*="display:none"]{
  display:none !important;
}

@media (max-width:1024px){
  .view-menu-header{
    margin-bottom:10px;
    padding:0 2px 8px;
  }
  .view-tabs.grouped-view-tabs{
    flex-direction:row;
    overflow:auto;
    gap:10px;
    padding:2px 0 6px;
  }
  .view-menu-group{
    min-width:250px;
    flex:0 0 250px;
  }
  .grouped-view-tabs .view-tab:not(.active):hover{
    transform:none;
  }
}
@media (max-width:640px){
  .view-menu-subtitle{
    display:none;
  }
  .view-menu-group{
    min-width:225px;
  }
  .view-menu-group-title{
    font-size:10px;
  }
}

/* Company module refreshed UI - 2026-06-26 */
#companyView.company-workspace{
  background:#f8fafc;
  color:#0f172a;
  min-height:calc(100vh - 88px);
  padding:0;
}
#companyView .company-page-shell{
  display:grid;
  gap:18px;
  padding:20px 24px 28px;
}
#companyView .company-page-header{
  position:static;
  top:auto;
  z-index:auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
#companyView .company-page-header h1{
  margin:0;
  color:#0f172a;
  font-size:34px;
  line-height:1.05;
  letter-spacing:-.04em;
}
#companyView .company-page-header p{
  margin-top:6px;
  color:#64748b;
  font-size:15px;
}
#companyView .company-add-btn{
  min-height:42px;
  padding:0 18px;
  border:0;
  border-radius:8px;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;
  font-weight:800;
  box-shadow:0 10px 24px rgba(37,99,235,.28);
}
#companyView .company-add-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(37,99,235,.32);
}
#companyView .company-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
#companyView .company-summary-card{
  min-height:110px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:22px 24px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.04),0 10px 28px rgba(15,23,42,.04);
}
#companyView .company-summary-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  border-radius:12px;
  font-size:26px;
  font-weight:900;
}
#companyView .company-summary-card--violet .company-summary-icon{background:#ede9fe;color:#6d28d9;}
#companyView .company-summary-card--green .company-summary-icon{background:#dcfce7;color:#059669;}
#companyView .company-summary-card--lime .company-summary-icon{background:#ecfccb;color:#65a30d;}
#companyView .company-summary-card--blue .company-summary-icon{background:#dbeafe;color:#2563eb;}
#companyView .company-summary-card span{
  display:block;
  color:#475569;
  font-size:15px;
  font-weight:700;
}
#companyView .company-summary-card strong{
  display:block;
  margin-top:2px;
  color:#0f172a;
  font-size:28px;
  line-height:1;
  letter-spacing:-.03em;
}
#companyView .company-panel{
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.04),0 10px 28px rgba(15,23,42,.04);
}
#companyView .company-filter-card{
  padding:18px 20px 20px;
}
#companyView .company-panel-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
}
#companyView .company-panel-title h2{
  margin:0;
  color:#0f172a;
  font-size:18px;
  line-height:1;
}
#companyView .company-panel-icon{
  color:#2563eb;
  font-size:22px;
  line-height:1;
}
#companyView .company-filter-grid{
  display:grid;
  grid-template-columns:1.35fr 1fr 1fr 1fr 1fr 1fr;
  gap:12px 18px;
  align-items:end;
}
#companyView .company-filter-field{
  display:grid;
  gap:7px;
  min-width:0;
}
#companyView .company-filter-field > span{
  color:#334155;
  font-size:13px;
  font-weight:700;
}
#companyView .company-filter-search{grid-column:span 1;}
#companyView .company-filter-clear{align-self:end;}
#companyView .company-input-shell{
  display:flex;
  align-items:center;
  gap:8px;
  height:42px;
  padding:0 12px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#94a3b8;
}
#companyView .company-input-shell .input{
  height:auto;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent;
}
#companyView .input,
#companyView .select{
  width:100%;
  height:42px;
  padding:0 14px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-size:14px;
  box-shadow:none;
}
#companyView .input::placeholder{color:#94a3b8;}
#companyView .input:focus,
#companyView .select:focus,
#companyView .company-input-shell:focus-within{
  border-color:#93c5fd;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
  outline:0;
}
#companyView .company-filter-clear .btn,
#companyView .company-export-btn{
  height:42px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-weight:800;
  box-shadow:none;
}
#companyView .company-table-panel{overflow:visible;}
#companyView .company-table-toolbar,
#companyView .company-table-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 18px;
}
#companyView .company-table-toolbar-left{
  display:flex;
  align-items:center;
  gap:20px;
  min-width:0;
}
#companyView .company-page-info,
#companyView .company-footer-info{
  color:#64748b;
  font-size:13px;
  white-space:nowrap;
}
#companyView .company-rows-control{
  display:flex;
  align-items:center;
  gap:10px;
  color:#334155;
  font-size:13px;
  font-weight:700;
}
#companyView .company-rows-control .select{
  width:74px;
  height:42px;
  border-radius:8px;
  padding:0 10px;
}
#companyView .company-table-wrap{
  max-height:none;
  overflow:visible;
  margin:0 12px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#fff;
}
#companyView .company-table-wrap table{
  min-width:1260px;
  border-collapse:separate;
  border-spacing:0;
  color:#172033;
  font-size:13px;
}
#companyView .company-table-wrap thead th{
  position:static;
  padding:15px 14px;
  border-bottom:1px solid #e2e8f0;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:800;
  cursor:default;
  white-space:nowrap;
}
#companyView .company-table-wrap tbody td{
  padding:13px 14px;
  border-bottom:1px solid #edf2f7;
  color:#1e293b;
  vertical-align:middle;
  background:#fff;
}
#companyView .company-table-wrap tbody tr:last-child td{border-bottom:0;}
#companyView .company-row:hover td,
#companyView .company-row.is-selected td{background:#f8fbff;}
#companyView .company-row.is-selected td:first-child{box-shadow:inset 3px 0 #2563eb;}
#companyView .company-id-cell,
#companyView .company-name-cell{font-weight:800;}
#companyView .company-country-cell{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
#companyView .chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:26px;
  padding:4px 10px;
  border:1px solid #e2e8f0;
  border-radius:999px;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
}
#companyView .company-row-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-width:110px;
}
#companyView .company-view-btn{
  height:38px;
  padding:0 16px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  background:#fff;
  color:#2563eb;
  font-weight:800;
  cursor:pointer;
}
#companyView .company-view-btn:hover{background:#eff6ff;}
#companyView .company-actions-menu{position:relative;}
#companyView .company-more-btn{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
#companyView .company-more-btn:hover{background:#f8fafc;}
#companyView .company-actions-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:20;
  display:none;
  min-width:160px;
  padding:6px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#fff;
  box-shadow:0 18px 38px rgba(15,23,42,.16);
}
#companyView .company-actions-menu.is-open .company-actions-popover{display:grid;gap:2px;}
#companyView .company-actions-popover button,
#companyView .company-actions-popover .company-no-actions{
  width:100%;
  padding:9px 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#0f172a;
  text-align:left;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
#companyView .company-actions-popover button:hover{background:#f1f5f9;}
#companyView .company-actions-popover button.danger{color:#dc2626;}
#companyView .company-actions-popover .company-no-actions{color:#94a3b8;cursor:default;}
#companyView .company-pagination{
  display:flex;
  align-items:center;
  gap:8px;
}
#companyView .company-page-btn{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid #e2e8f0;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-weight:800;
  cursor:pointer;
}
#companyView .company-page-btn.is-active{
  border-color:#2563eb;
  color:#2563eb;
  box-shadow:0 0 0 2px rgba(37,99,235,.10);
}
#companyView .company-page-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
#companyView .company-page-ellipsis{
  color:#64748b;
  font-weight:800;
  padding:0 4px;
}
@media(max-width:1300px){
  #companyView .company-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #companyView .company-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  #companyView .company-table-wrap{overflow:auto;}
}
@media(max-width:760px){
  #companyView .company-page-shell{padding:14px;}
  #companyView .company-page-header,
  #companyView .company-table-toolbar,
  #companyView .company-table-footer{align-items:stretch;flex-direction:column;}
  #companyView .company-add-btn{width:100%;justify-content:center;}
  #companyView .company-summary-grid,
  #companyView .company-filter-grid{grid-template-columns:1fr;}
  #companyView .company-table-toolbar-left{align-items:stretch;flex-direction:column;gap:10px;}
  #companyView .company-rows-control{justify-content:space-between;}
}

/* Contacts module refreshed UI - 2026-06-26 */
#contactsView.contacts-workspace{
  background:#f8fafc;
  color:#0f172a;
  min-height:calc(100vh - 88px);
  padding:0;
}
#contactsView .contacts-page-shell{
  display:grid;
  gap:18px;
  padding:20px 24px 28px;
}
#contactsView .contacts-page-header{
  position:static;
  top:auto;
  z-index:auto;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
}
#contactsView .contacts-page-header h1{
  margin:0;
  color:#0f172a;
  font-size:34px;
  line-height:1.05;
  letter-spacing:-.04em;
}
#contactsView .contacts-page-header p{
  margin-top:6px;
  color:#64748b;
  font-size:15px;
}
#contactsView .contacts-add-btn{
  min-height:42px;
  padding:0 18px;
  border:0;
  border-radius:8px;
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;
  font-weight:800;
  box-shadow:0 10px 24px rgba(37,99,235,.28);
}
#contactsView .contacts-add-btn:hover{
  transform:translateY(-1px);
  box-shadow:0 14px 28px rgba(37,99,235,.32);
}
#contactsView .contacts-summary-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
#contactsView .contacts-summary-card{
  min-height:118px;
  display:flex;
  align-items:center;
  gap:18px;
  padding:22px 24px;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.04),0 10px 28px rgba(15,23,42,.04);
}
#contactsView .contacts-summary-icon{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:12px;
  font-size:25px;
  font-weight:900;
}
#contactsView .contacts-summary-card--violet .contacts-summary-icon{background:#ede9fe;color:#6d28d9;}
#contactsView .contacts-summary-card--green .contacts-summary-icon{background:#dcfce7;color:#059669;}
#contactsView .contacts-summary-card--orange .contacts-summary-icon{background:#ffedd5;color:#ea580c;}
#contactsView .contacts-summary-card--blue .contacts-summary-icon{background:#dbeafe;color:#2563eb;}
#contactsView .contacts-summary-card span{
  display:block;
  color:#475569;
  font-size:15px;
  font-weight:700;
}
#contactsView .contacts-summary-card strong{
  display:block;
  margin-top:2px;
  color:#0f172a;
  font-size:28px;
  line-height:1;
  letter-spacing:-.03em;
}
#contactsView .contacts-summary-card small{
  display:block;
  margin-top:10px;
  color:#64748b;
  font-size:13px;
  font-weight:700;
}
#contactsView .contacts-summary-card--green small{color:#059669;}
#contactsView .contacts-summary-card--orange small{color:#ea580c;}
#contactsView .contacts-summary-card--blue small{color:#2563eb;}
#contactsView .contacts-panel{
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
  box-shadow:0 1px 3px rgba(15,23,42,.04),0 10px 28px rgba(15,23,42,.04);
}
#contactsView .contacts-filter-card{
  padding:18px 20px 20px;
}
#contactsView .contacts-panel-title{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
}
#contactsView .contacts-panel-title h2{
  margin:0;
  color:#0f172a;
  font-size:18px;
  line-height:1;
}
#contactsView .contacts-panel-icon{
  color:#2563eb;
  font-size:22px;
  line-height:1;
}
#contactsView .contacts-filter-grid{
  display:grid;
  grid-template-columns:1.35fr 1.15fr 1fr 1fr 1fr;
  gap:14px 18px;
  align-items:end;
}
#contactsView .contacts-filter-field{
  display:grid;
  gap:7px;
  min-width:0;
}
#contactsView .contacts-filter-field > span{
  color:#334155;
  font-size:13px;
  font-weight:700;
}
#contactsView .contacts-filter-clear{align-self:end;}
#contactsView .contacts-input-shell{
  display:flex;
  align-items:center;
  gap:8px;
  height:42px;
  padding:0 12px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#94a3b8;
}
#contactsView .contacts-input-shell .input{
  height:auto;
  min-height:0;
  padding:0;
  border:0;
  border-radius:0;
  box-shadow:none;
  background:transparent;
}
#contactsView .input,
#contactsView .select{
  width:100%;
  height:42px;
  padding:0 14px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-size:14px;
  box-shadow:none;
}
#contactsView .input::placeholder{color:#94a3b8;}
#contactsView .input:focus,
#contactsView .select:focus,
#contactsView .contacts-input-shell:focus-within{
  border-color:#93c5fd;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
  outline:0;
}
#contactsView .contacts-filter-clear .btn,
#contactsView .contacts-export-btn{
  height:42px;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-weight:800;
  box-shadow:none;
}
#contactsView .contacts-table-panel{overflow:visible;}
#contactsView .contacts-table-toolbar,
#contactsView .contacts-table-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:14px 18px;
}
#contactsView .contacts-table-toolbar-left{
  display:flex;
  align-items:center;
  gap:20px;
  min-width:0;
}
#contactsView .contacts-page-info,
#contactsView .contacts-footer-info{
  color:#64748b;
  font-size:13px;
  white-space:nowrap;
}
#contactsView .contacts-rows-control{
  display:flex;
  align-items:center;
  gap:10px;
  color:#334155;
  font-size:13px;
  font-weight:700;
}
#contactsView .contacts-rows-control .select{
  width:74px;
  height:42px;
  border-radius:8px;
  padding:0 10px;
}
#contactsView .contacts-table-wrap{
  max-height:none;
  overflow:visible;
  margin:0 12px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#fff;
}
#contactsView .contacts-table-wrap table{
  min-width:1180px;
  border-collapse:separate;
  border-spacing:0;
  color:#172033;
  font-size:13px;
}
#contactsView .contacts-table-wrap thead th{
  position:static;
  padding:15px 14px;
  border-bottom:1px solid #e2e8f0;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:800;
  cursor:default;
  white-space:nowrap;
}
#contactsView .contacts-table-wrap tbody td{
  padding:13px 14px;
  border-bottom:1px solid #edf2f7;
  color:#1e293b;
  vertical-align:middle;
  background:#fff;
}
#contactsView .contacts-table-wrap tbody tr:last-child td{border-bottom:0;}
#contactsView .contact-row:hover td,
#contactsView .contact-row.is-selected td{background:#f8fbff;}
#contactsView .contact-row.is-selected td:first-child{box-shadow:inset 3px 0 #2563eb;}
#contactsView .contact-id-cell,
#contactsView .contact-name-cell{font-weight:800;}
#contactsView .contact-name-wrap{
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-width:0;
  white-space:nowrap;
}
#contactsView .contact-avatar{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
}
#contactsView .contact-avatar--violet{background:#ede9fe;color:#7c3aed;}
#contactsView .contact-avatar--blue{background:#dbeafe;color:#2563eb;}
#contactsView .contact-avatar--green{background:#dcfce7;color:#16a34a;}
#contactsView .contact-avatar--orange{background:#ffedd5;color:#ea580c;}
#contactsView .contact-email-cell{word-break:break-word;}
#contactsView .contacts-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:26px;
  padding:4px 10px;
  border:1px solid #e2e8f0;
  border-radius:999px;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:800;
  line-height:1;
  white-space:nowrap;
}
#contactsView .contacts-chip--success{background:#dcfce7;border-color:#bbf7d0;color:#16a34a;}
#contactsView .contacts-chip--danger{background:#fee2e2;border-color:#fecaca;color:#dc2626;}
#contactsView .contacts-chip--warning{background:#fef3c7;border-color:#fde68a;color:#b45309;}
#contactsView .contacts-chip--neutral{background:#f1f5f9;border-color:#e2e8f0;color:#475569;}
#contactsView .contact-row-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-width:110px;
}
#contactsView .contact-view-btn{
  height:38px;
  padding:0 16px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  background:#fff;
  color:#2563eb;
  font-weight:800;
  cursor:pointer;
}
#contactsView .contact-view-btn:hover{background:#eff6ff;}
#contactsView .contact-actions-menu{position:relative;}
#contactsView .contact-more-btn{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid #d9e2ef;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
#contactsView .contact-more-btn:hover{background:#f8fafc;}
#contactsView .contact-actions-popover{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  z-index:20;
  display:none;
  min-width:160px;
  padding:6px;
  border:1px solid #e2e8f0;
  border-radius:10px;
  background:#fff;
  box-shadow:0 18px 38px rgba(15,23,42,.16);
}
#contactsView .contact-actions-menu.is-open .contact-actions-popover{display:grid;gap:2px;}
#contactsView .contact-actions-popover button,
#contactsView .contact-actions-popover .contact-no-actions{
  width:100%;
  padding:9px 10px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#0f172a;
  text-align:left;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
#contactsView .contact-actions-popover button:hover{background:#f1f5f9;}
#contactsView .contact-actions-popover button.danger{color:#dc2626;}
#contactsView .contact-actions-popover .contact-no-actions{color:#94a3b8;cursor:default;}
#contactsView .contacts-pagination{
  display:flex;
  align-items:center;
  gap:8px;
}
#contactsView .contacts-page-btn{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid #e2e8f0;
  border-radius:8px;
  background:#fff;
  color:#0f172a;
  font-weight:800;
  cursor:pointer;
}
#contactsView .contacts-page-btn.is-active{
  border-color:#2563eb;
  color:#2563eb;
  box-shadow:0 0 0 2px rgba(37,99,235,.10);
}
#contactsView .contacts-page-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
#contactsView .contacts-page-ellipsis{
  color:#64748b;
  font-weight:800;
  padding:0 4px;
}
@media(max-width:1300px){
  #contactsView .contacts-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #contactsView .contacts-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  #contactsView .contacts-table-wrap{overflow:auto;}
}
@media(max-width:760px){
  #contactsView .contacts-page-shell{padding:14px;}
  #contactsView .contacts-page-header,
  #contactsView .contacts-table-toolbar,
  #contactsView .contacts-table-footer{align-items:stretch;flex-direction:column;}
  #contactsView .contacts-add-btn{width:100%;justify-content:center;}
  #contactsView .contacts-summary-grid,
  #contactsView .contacts-filter-grid{grid-template-columns:1fr;}
  #contactsView .contacts-table-toolbar-left{align-items:stretch;flex-direction:column;gap:10px;}
  #contactsView .contacts-rows-control{justify-content:space-between;}
}

/* Modern Leads workspace */
#leadsView.leads-modern-workspace{
  background:linear-gradient(180deg,#f8fbff 0%,#f6f8fb 100%);
  color:#0f172a;
  padding:0;
}
#leadsView .leads-page-shell{
  display:grid;
  gap:18px;
  padding:24px;
  min-height:calc(100vh - 120px);
}
#leadsView .leads-page-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
#leadsView .leads-page-header h1{
  margin:0;
  font-size:30px;
  line-height:1.1;
  letter-spacing:-.04em;
  font-weight:850;
  color:#0f172a;
}
#leadsView .leads-page-header p{
  margin:6px 0 0;
  color:#64748b;
  font-size:14px;
}
#leadsView .leads-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
#leadsView .leads-primary-btn,
#leadsView .leads-primary-btn.btn{
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;
  border:0;
  border-radius:10px;
  min-height:42px;
  padding:0 18px;
  font-weight:800;
  box-shadow:0 12px 22px rgba(37,99,235,.25);
}
#leadsView .leads-soft-btn,
#leadsView .leads-soft-btn.btn{
  background:#fff;
  color:#0f172a;
  border:1px solid #e2e8f0;
  border-radius:10px;
  min-height:40px;
  padding:0 14px;
  font-weight:750;
  box-shadow:0 8px 18px rgba(15,23,42,.04);
}
#leadsView .leads-soft-btn:hover,
#leadsView .leads-primary-btn:hover{
  transform:translateY(-1px);
}
#leadsView .leads-analytics{
  display:block;
  margin:0;
}
#leadsView .leads-analytics-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}
#leadsView .leads-kpi-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:18px;
  min-height:112px;
  padding:20px 22px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  box-shadow:0 16px 34px rgba(15,23,42,.07);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  overflow:hidden;
}
#leadsView .leads-kpi-card:hover{
  transform:translateY(-2px);
  border-color:#bfdbfe;
  box-shadow:0 20px 38px rgba(37,99,235,.10);
}
#leadsView .leads-kpi-card.kpi-filter-active{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.14),0 18px 38px rgba(37,99,235,.12);
}
#leadsView .leads-kpi-icon{
  flex:0 0 58px;
  width:58px;
  height:58px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:26px;
  font-weight:850;
}
#leadsView .leads-kpi-content{min-width:0;}
#leadsView .leads-kpi-card .label{
  color:#475569;
  font-size:13px;
  font-weight:800;
  text-transform:none;
  letter-spacing:0;
}
#leadsView .leads-kpi-card .value{
  margin-top:4px;
  font-size:28px;
  line-height:1.12;
  color:#0f172a;
  font-weight:850;
  letter-spacing:-.03em;
  word-break:break-word;
}
#leadsView .leads-kpi-card .sub{
  margin-top:6px;
  color:#64748b;
  font-size:12px;
  font-weight:600;
}
#leadsView .leads-kpi-card--violet .leads-kpi-icon{background:#ede9fe;color:#7c3aed;}
#leadsView .leads-kpi-card--amber .leads-kpi-icon{background:#fef3c7;color:#d97706;}
#leadsView .leads-kpi-card--green .leads-kpi-icon{background:#dcfce7;color:#16a34a;}
#leadsView .leads-kpi-card--blue .leads-kpi-icon{background:#dbeafe;color:#2563eb;}
#leadsView .leads-kpi-card--sky .leads-kpi-icon{background:#e0f2fe;color:#0284c7;}
#leadsView .leads-kpi-card--rose .leads-kpi-icon{background:#fee2e2;color:#dc2626;}
#leadsView .leads-kpi-card--orange .leads-kpi-icon{background:#ffedd5;color:#ea580c;}
#leadsView .leads-kpi-card--money .leads-kpi-icon{background:#dcfce7;color:#15803d;}
#leadsView .leads-kpi-card--percent .leads-kpi-icon{background:#f3e8ff;color:#9333ea;}
#leadsView .leads-filter-card,
#leadsView .leads-status-card,
#leadsView .leads-table-panel{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  box-shadow:0 16px 34px rgba(15,23,42,.06);
}
#leadsView .leads-filter-card{
  padding:22px;
}
#leadsView .leads-panel-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
}
#leadsView .leads-panel-title h2{
  margin:0;
  font-size:20px;
  line-height:1;
  font-weight:850;
  letter-spacing:-.02em;
  color:#0f172a;
}
#leadsView .leads-panel-icon{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  color:#2563eb;
  font-weight:850;
  font-size:20px;
}
#leadsView .leads-filter-grid{
  display:grid;
  grid-template-columns:1.2fr repeat(3,minmax(150px,1fr));
  gap:16px;
  align-items:end;
}
#leadsView .leads-filter-field{
  display:grid;
  gap:8px;
  color:#334155;
  font-weight:800;
  font-size:13px;
}
#leadsView .leads-filter-field > span{
  color:#334155;
}
#leadsView .leads-input-shell{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  padding:0 12px;
  background:#fff;
  color:#94a3b8;
  transition:border-color .18s ease,box-shadow .18s ease;
}
#leadsView .leads-input-shell .input{
  border:0;
  box-shadow:none;
  padding:0;
  min-height:unset;
  width:100%;
  background:transparent;
}
#leadsView .input,
#leadsView .select{
  min-height:44px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  padding:0 14px;
  font-size:14px;
  box-shadow:none;
}
#leadsView .input::placeholder{color:#94a3b8;}
#leadsView .input:focus,
#leadsView .select:focus,
#leadsView .leads-input-shell:focus-within{
  outline:none;
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.13);
}
#leadsView .leads-filter-clear{align-self:end;}
#leadsView .leads-filter-clear .btn{width:100%;justify-content:center;}
#leadsView .leads-status-card{
  padding:20px 22px;
}
#leadsView .leads-status-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  margin:0 0 12px;
  flex-wrap:wrap;
}
#leadsView .leads-status-head .leads-panel-title{margin:0;}
#leadsView .leads-status-head .muted,
#leadsView .leads-page-info{
  color:#64748b;
  font-size:13px;
  font-weight:650;
}
#leadsView .leads-status-bars{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px 42px;
}
#leadsView .leads-status-row{
  display:grid;
  grid-template-columns:170px 42px minmax(140px,1fr) 52px;
  gap:10px;
  align-items:center;
}
#leadsView .leads-status-label{
  display:flex;
  align-items:center;
  gap:8px;
  color:#475569;
  font-size:13px;
  font-weight:750;
}
#leadsView .leads-status-count{
  color:#0f172a;
  font-size:13px;
  font-weight:850;
  text-align:right;
}
#leadsView .leads-status-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#94a3b8;
}
#leadsView .leads-status-track{
  height:8px;
  border-radius:999px;
  background:#e5eaf0;
  overflow:hidden;
}
#leadsView .leads-status-fill{
  display:block;
  height:100%;
  border-radius:inherit;
  background:#2563eb;
}
#leadsView .leads-status-meta{
  color:#64748b;
  text-align:right;
  font-size:12px;
  font-weight:700;
}
#leadsView .leads-status-row[data-status="qualified"] .leads-status-dot,
#leadsView .leads-status-row[data-status="qualified"] .leads-status-fill{background:#16a34a;}
#leadsView .leads-status-row[data-status="negotiation"] .leads-status-dot,
#leadsView .leads-status-row[data-status="negotiation"] .leads-status-fill{background:#60a5fa;}
#leadsView .leads-status-row[data-status="not available"] .leads-status-dot,
#leadsView .leads-status-row[data-status="not available"] .leads-status-fill{background:#2563eb;}
#leadsView .leads-status-row[data-status="lost"] .leads-status-dot,
#leadsView .leads-status-row[data-status="lost"] .leads-status-fill{background:#ef4444;}
#leadsView .leads-status-row[data-status="not contacted yet"] .leads-status-dot,
#leadsView .leads-status-row[data-status="not contacted yet"] .leads-status-fill{background:#94a3b8;}
#leadsView .leads-status-row[data-status="total"] .leads-status-dot,
#leadsView .leads-status-row[data-status="total"] .leads-status-fill{background:#2563eb;}
#leadsView .leads-table-panel{
  overflow:visible;
}
#leadsView .leads-table-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  padding:16px 18px 12px;
}
#leadsView .leads-table-toolbar-left{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  width:100%;
}
#leadsView #leadsPaginationControls{
  margin-left:auto;
}
#leadsView #leadsPaginationControls > .pagination{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
#leadsView #leadsPaginationControls .chip-btn{
  border:1px solid #e2e8f0;
  background:#fff;
  color:#0f172a;
  border-radius:10px;
  min-height:36px;
  padding:0 12px;
  font-weight:750;
}
#leadsView #leadsPaginationControls .chip-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
#leadsView #leadsPaginationControls .input{
  min-height:36px;
  border-radius:10px;
  padding:0 10px;
}
#leadsView .leads-table-wrap{
  margin:0 12px 12px;
  overflow:auto;
  border:1px solid #e2e8f0;
  border-radius:12px;
  background:#fff;
}
#leadsView .leads-table-wrap table{
  width:100%;
  min-width:1520px;
  border-collapse:separate;
  border-spacing:0;
  background:#fff;
}
#leadsView .leads-table-wrap thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:#f8fafc;
  color:#475569;
  border-bottom:1px solid #e2e8f0;
  font-size:12px;
  font-weight:850;
  text-align:left;
  padding:14px 12px;
  white-space:nowrap;
}
#leadsView .leads-table-wrap tbody td{
  border-bottom:1px solid #e2e8f0;
  color:#0f172a;
  font-size:13px;
  font-weight:600;
  padding:14px 12px;
  vertical-align:middle;
}
#leadsView .leads-table-wrap tbody tr:last-child td{border-bottom:0;}
#leadsView .lead-clickable-row:hover td,
#leadsView .lead-clickable-row.is-selected td{
  background:#f8fbff;
}
#leadsView .lead-clickable-row.is-selected td:first-child{
  box-shadow:inset 3px 0 #2563eb;
}
#leadsView .lead-id-cell,
#leadsView .lead-name-cell{
  font-weight:850;
}
#leadsView .lead-name-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:160px;
}
#leadsView .lead-avatar{
  display:inline-grid;
  place-items:center;
  flex:0 0 32px;
  width:32px;
  height:32px;
  border-radius:999px;
  font-weight:850;
  font-size:13px;
}
#leadsView .lead-avatar--violet{background:#ede9fe;color:#7c3aed;}
#leadsView .lead-avatar--blue{background:#dbeafe;color:#2563eb;}
#leadsView .lead-avatar--green{background:#dcfce7;color:#16a34a;}
#leadsView .lead-avatar--orange{background:#ffedd5;color:#ea580c;}
#leadsView .lead-email-cell,
#leadsView .lead-notes-cell{
  max-width:240px;
  white-space:normal;
  word-break:break-word;
}
#leadsView .lead-money-cell{font-weight:850;}
#leadsView .lead-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  border-radius:999px;
  border:1px solid transparent;
  padding:3px 10px;
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
  text-transform:capitalize;
}
#leadsView .lead-chip--success{background:#dcfce7;border-color:#bbf7d0;color:#16a34a;}
#leadsView .lead-chip--danger{background:#fee2e2;border-color:#fecaca;color:#dc2626;}
#leadsView .lead-chip--warning{background:#fef3c7;border-color:#fde68a;color:#b45309;}
#leadsView .lead-chip--info{background:#dbeafe;border-color:#bfdbfe;color:#2563eb;}
#leadsView .lead-chip--neutral{background:#f1f5f9;border-color:#e2e8f0;color:#475569;}
#leadsView .lead-assignee-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
#leadsView .lead-assignee-pill span{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:999px;
  background:#2563eb;
  color:#fff;
  font-size:11px;
  font-weight:850;
}
#leadsView .lead-row-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-width:110px;
}
#leadsView .lead-view-btn{
  border:1px solid #bfdbfe;
  background:#fff;
  color:#2563eb;
  border-radius:8px;
  min-height:34px;
  padding:0 14px;
  font-weight:850;
  cursor:pointer;
}
#leadsView .lead-view-btn:hover{background:#eff6ff;}
#leadsView .lead-actions-menu{
  position:relative;
}
#leadsView .lead-actions-menu summary{
  list-style:none;
}
#leadsView .lead-actions-menu summary::-webkit-details-marker{display:none;}
#leadsView .lead-more-btn{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid #e2e8f0;
  border-radius:9px;
  background:#fff;
  color:#0f172a;
  font-size:20px;
  font-weight:850;
  cursor:pointer;
}
#leadsView .lead-more-btn:hover{background:#f8fafc;}
#leadsView .lead-actions-popover{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  z-index:20;
  display:grid;
  gap:2px;
  min-width:170px;
  padding:6px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  box-shadow:0 18px 42px rgba(15,23,42,.16);
}
#leadsView .lead-menu-item{
  appearance:none;
  border:0;
  background:transparent;
  color:#0f172a;
  text-align:left;
  border-radius:8px;
  padding:9px 10px;
  font-size:13px;
  font-weight:750;
  cursor:pointer;
}
#leadsView .lead-menu-item:hover{background:#f1f5f9;}
#leadsView .lead-menu-item.danger{color:#dc2626;}
#leadsView .leads-empty-row{
  padding:34px !important;
  text-align:center !important;
  color:#64748b !important;
  font-weight:750;
}
@media(max-width:1500px){
  #leadsView .leads-analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  #leadsView .leads-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:1100px){
  #leadsView .leads-analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #leadsView .leads-status-bars{grid-template-columns:1fr;}
}
@media(max-width:720px){
  #leadsView .leads-page-shell{padding:14px;}
  #leadsView .leads-page-header,
  #leadsView .leads-table-toolbar-left{align-items:stretch;flex-direction:column;}
  #leadsView .leads-header-actions,
  #leadsView .leads-primary-btn,
  #leadsView .leads-soft-btn{width:100%;justify-content:center;}
  #leadsView .leads-analytics-grid,
  #leadsView .leads-filter-grid{grid-template-columns:1fr;}
  #leadsView .leads-status-row{grid-template-columns:1fr;gap:6px;}
  #leadsView .leads-status-count,
  #leadsView .leads-status-meta{text-align:left;}
  #leadsView #leadsPaginationControls{margin-left:0;}
}


/* Modern Deals workspace */
#dealsView.deals-modern-workspace{
  background:linear-gradient(180deg,#f8fbff 0%,#f6f8fb 100%);
  color:#0f172a;
  padding:0;
}
#dealsView .deals-page-shell{
  display:grid;
  gap:18px;
  padding:24px;
  min-height:calc(100vh - 120px);
}
#dealsView .deals-page-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
#dealsView .deals-page-header h1{
  margin:0;
  font-size:30px;
  line-height:1.1;
  letter-spacing:-.04em;
  font-weight:850;
  color:#0f172a;
}
#dealsView .deals-page-header p{
  margin:6px 0 0;
  color:#64748b;
  font-size:14px;
}
#dealsView .deals-header-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
#dealsView .deals-primary-btn,
#dealsView .deals-primary-btn.btn{
  background:linear-gradient(135deg,#2563eb,#1d4ed8);
  color:#fff;
  border:0;
  border-radius:10px;
  min-height:42px;
  padding:0 18px;
  font-weight:800;
  box-shadow:0 12px 22px rgba(37,99,235,.25);
}
#dealsView .deals-soft-btn,
#dealsView .deals-soft-btn.btn{
  background:#fff;
  color:#0f172a;
  border:1px solid #e2e8f0;
  border-radius:10px;
  min-height:40px;
  padding:0 14px;
  font-weight:750;
  box-shadow:0 8px 18px rgba(15,23,42,.04);
}
#dealsView .deals-soft-btn:hover,
#dealsView .deals-primary-btn:hover{transform:translateY(-1px);}
#dealsView .deals-analytics{display:block;margin:0;}
#dealsView .deals-analytics-grid{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:14px;
}
#dealsView .deals-kpi-card{
  position:relative;
  display:flex;
  align-items:center;
  gap:16px;
  min-height:104px;
  padding:18px 20px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  box-shadow:0 16px 34px rgba(15,23,42,.07);
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  overflow:hidden;
}
#dealsView .deals-kpi-card:hover{
  transform:translateY(-2px);
  border-color:#bfdbfe;
  box-shadow:0 20px 38px rgba(37,99,235,.10);
}
#dealsView .deals-kpi-card.kpi-filter-active{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.14),0 18px 38px rgba(37,99,235,.12);
}
#dealsView .deals-kpi-icon{
  flex:0 0 54px;
  width:54px;
  height:54px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:24px;
  font-weight:850;
}
#dealsView .deals-kpi-content{min-width:0;}
#dealsView .deals-kpi-card .label{
  color:#475569;
  font-size:12px;
  font-weight:800;
  text-transform:none;
  letter-spacing:0;
}
#dealsView .deals-kpi-card .value{
  margin-top:4px;
  font-size:24px;
  line-height:1.12;
  color:#0f172a;
  font-weight:850;
  letter-spacing:-.03em;
  word-break:break-word;
}
#dealsView .deals-kpi-card .sub{
  margin-top:5px;
  color:#64748b;
  font-size:12px;
  font-weight:600;
}
#dealsView .deals-kpi-card--violet .deals-kpi-icon{background:#ede9fe;color:#7c3aed;}
#dealsView .deals-kpi-card--blue .deals-kpi-icon{background:#dbeafe;color:#2563eb;}
#dealsView .deals-kpi-card--green .deals-kpi-icon{background:#dcfce7;color:#16a34a;}
#dealsView .deals-kpi-card--rose .deals-kpi-icon{background:#fee2e2;color:#dc2626;}
#dealsView .deals-kpi-card--orange .deals-kpi-icon{background:#ffedd5;color:#ea580c;}
#dealsView .deals-kpi-card--money .deals-kpi-icon{background:#dcfce7;color:#15803d;}
#dealsView .deals-kpi-card--purple .deals-kpi-icon{background:#f3e8ff;color:#9333ea;}
#dealsView .deals-kpi-card--percent .deals-kpi-icon{background:#e0f2fe;color:#0284c7;}
#dealsView .deals-kpi-card--amber .deals-kpi-icon{background:#fef3c7;color:#d97706;}
#dealsView .deals-kpi-card--teal .deals-kpi-icon{background:#ccfbf1;color:#0f766e;}
#dealsView .deals-filter-card,
#dealsView .deals-breakdown-card,
#dealsView .deals-table-panel{
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:16px;
  box-shadow:0 16px 34px rgba(15,23,42,.06);
}
#dealsView .deals-filter-card{padding:22px;}
#dealsView .deals-panel-title{
  display:flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
}
#dealsView .deals-panel-title h2{
  margin:0;
  font-size:18px;
  line-height:1;
  font-weight:850;
  letter-spacing:-.02em;
  color:#0f172a;
}
#dealsView .deals-panel-icon{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  color:#2563eb;
  font-weight:850;
  font-size:20px;
}
#dealsView .deals-filter-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:16px;
  align-items:end;
}
#dealsView .deals-filter-field{
  display:grid;
  gap:8px;
  color:#334155;
  font-size:13px;
  font-weight:800;
}
#dealsView .deals-filter-search{grid-column:span 2;}
#dealsView .deals-input-shell{
  position:relative;
  display:flex;
  align-items:center;
}
#dealsView .deals-input-shell > span{
  position:absolute;
  left:14px;
  color:#94a3b8;
  font-size:18px;
  pointer-events:none;
}
#dealsView .deals-input-shell .input{padding-left:38px;}
#dealsView .deals-filter-card .input,
#dealsView .deals-filter-card .select{
  width:100%;
  min-height:44px;
  border:1px solid #dbe3ef;
  border-radius:10px;
  background:#fff;
  color:#0f172a;
  box-shadow:0 1px 2px rgba(15,23,42,.03);
}
#dealsView .deals-filter-card .input:focus,
#dealsView .deals-filter-card .select:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.12);
}
#dealsView .deals-filter-clear{align-self:end;}
#dealsView .deals-breakdown-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1.25fr;
  gap:14px;
}
#dealsView .deals-breakdown-card{padding:18px 20px;}
#dealsView .deals-status-bars{
  display:grid;
  gap:11px;
}
#dealsView .deals-source-bars{
  margin-top:12px;
  padding-top:12px;
  border-top:1px dashed #e2e8f0;
}
#dealsView .deals-status-row{
  display:grid;
  grid-template-columns:minmax(120px,1fr) 44px minmax(120px,2.3fr) 56px;
  gap:12px;
  align-items:center;
  color:#475569;
  font-size:12px;
  font-weight:750;
}
#dealsView .deals-status-label{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  color:#334155;
}
#dealsView .deals-status-dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.10);
}
#dealsView .deals-status-count,
#dealsView .deals-status-meta{text-align:right;color:#64748b;}
#dealsView .deals-status-track{
  height:7px;
  overflow:hidden;
  background:#e9eef5;
  border-radius:999px;
}
#dealsView .deals-status-fill{
  display:block;
  height:100%;
  min-width:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#2563eb,#7c3aed);
}
#dealsView .deals-table-panel{overflow:hidden;}
#dealsView .deals-table-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid #e2e8f0;
}
#dealsView .deals-table-toolbar-left{
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
  width:100%;
}
#dealsView .deals-page-info{
  color:#64748b;
  font-size:13px;
  font-weight:700;
}
#dealsView #dealsPaginationControls{
  margin-left:auto;
}
#dealsView .deals-table-wrap{
  width:100%;
  overflow:auto;
  background:#fff;
}
#dealsView #dealsTable{
  width:100%;
  min-width:1680px;
  border-collapse:separate;
  border-spacing:0;
  margin:0;
}
#dealsView #dealsTable thead th{
  position:sticky;
  top:0;
  z-index:2;
  padding:14px 16px;
  background:#f8fafc;
  color:#475569;
  font-size:12px;
  font-weight:850;
  text-align:left;
  border-bottom:1px solid #e2e8f0;
  white-space:nowrap;
}
#dealsView #dealsTable tbody td{
  padding:16px;
  color:#1e293b;
  font-size:13px;
  line-height:1.35;
  border-bottom:1px solid #edf2f7;
  vertical-align:middle;
  background:#fff;
}
#dealsView #dealsTable tbody tr:hover td{background:#f8fbff;}
#dealsView #dealsTable tbody tr.is-selected td{background:#eff6ff;}
#dealsView .deal-clickable-row{cursor:pointer;}
#dealsView .deal-id-cell{font-weight:850;color:#0f172a;white-space:nowrap;}
#dealsView .deal-name-cell{min-width:190px;}
#dealsView .deal-name-wrap{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:750;
}
#dealsView .deal-avatar{
  flex:0 0 32px;
  width:32px;
  height:32px;
  border-radius:999px;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:850;
}
#dealsView .deal-avatar--violet{background:#ede9fe;color:#7c3aed;}
#dealsView .deal-avatar--blue{background:#dbeafe;color:#2563eb;}
#dealsView .deal-avatar--green{background:#dcfce7;color:#16a34a;}
#dealsView .deal-avatar--orange{background:#ffedd5;color:#ea580c;}
#dealsView .deal-email-cell,
#dealsView .deal-notes-cell{
  max-width:260px;
  white-space:normal;
  word-break:break-word;
}
#dealsView .deal-money-cell{font-weight:850;color:#0f172a;white-space:nowrap;}
#dealsView .deal-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid transparent;
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
}
#dealsView .deal-chip--success{background:#dcfce7;color:#15803d;border-color:#bbf7d0;}
#dealsView .deal-chip--info{background:#dbeafe;color:#2563eb;border-color:#bfdbfe;}
#dealsView .deal-chip--warning{background:#fef3c7;color:#b45309;border-color:#fde68a;}
#dealsView .deal-chip--danger{background:#fee2e2;color:#dc2626;border-color:#fecaca;}
#dealsView .deal-chip--neutral{background:#f1f5f9;color:#475569;border-color:#e2e8f0;}
#dealsView .deal-assignee-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
#dealsView .deal-assignee-pill > span{
  width:28px;
  height:28px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:#2563eb;
  color:#fff;
  font-size:11px;
  font-weight:850;
  box-shadow:0 6px 14px rgba(37,99,235,.22);
}
#dealsView .deal-row-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-width:96px;
}
#dealsView .deal-view-btn{
  min-height:34px;
  padding:0 14px;
  border:1px solid #bfdbfe;
  border-radius:9px;
  background:#fff;
  color:#2563eb;
  font-size:12px;
  font-weight:850;
  cursor:pointer;
}
#dealsView .deal-view-btn:hover{background:#eff6ff;}
#dealsView .deal-actions-menu{position:relative;}
#dealsView .deal-actions-menu summary{list-style:none;}
#dealsView .deal-actions-menu summary::-webkit-details-marker{display:none;}
#dealsView .deal-more-btn{
  display:grid;
  place-items:center;
  width:36px;
  height:36px;
  border:1px solid #e2e8f0;
  border-radius:9px;
  background:#fff;
  color:#0f172a;
  font-size:20px;
  font-weight:850;
  cursor:pointer;
}
#dealsView .deal-more-btn:hover{background:#f8fafc;}
#dealsView .deal-actions-popover{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  z-index:20;
  display:grid;
  gap:2px;
  min-width:180px;
  padding:6px;
  background:#fff;
  border:1px solid #e2e8f0;
  border-radius:12px;
  box-shadow:0 18px 42px rgba(15,23,42,.16);
}
#dealsView .deal-menu-item{
  appearance:none;
  border:0;
  background:transparent;
  color:#0f172a;
  text-align:left;
  border-radius:8px;
  padding:9px 10px;
  font-size:13px;
  font-weight:750;
  cursor:pointer;
}
#dealsView .deal-menu-item:hover{background:#f1f5f9;}
#dealsView .deal-menu-item.danger{color:#dc2626;}
#dealsView .deal-menu-item:disabled{opacity:.55;cursor:not-allowed;}
#dealsView .deals-empty-row{
  padding:34px !important;
  text-align:center !important;
  color:#64748b !important;
  font-weight:750;
}
#dealsView .deals-empty-breakdown{padding:12px 0;font-weight:700;}
@media(max-width:1500px){
  #dealsView .deals-analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  #dealsView .deals-filter-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
  #dealsView .deals-filter-search{grid-column:span 1;}
  #dealsView .deals-breakdown-grid{grid-template-columns:1fr;}
}
@media(max-width:1100px){
  #dealsView .deals-analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media(max-width:720px){
  #dealsView .deals-page-shell{padding:14px;}
  #dealsView .deals-page-header,
  #dealsView .deals-table-toolbar-left{align-items:stretch;flex-direction:column;}
  #dealsView .deals-header-actions,
  #dealsView .deals-primary-btn,
  #dealsView .deals-soft-btn{width:100%;justify-content:center;}
  #dealsView .deals-analytics-grid,
  #dealsView .deals-filter-grid{grid-template-columns:1fr;}
  #dealsView .deals-status-row{grid-template-columns:1fr;gap:6px;}
  #dealsView .deals-status-count,
  #dealsView .deals-status-meta{text-align:left;}
  #dealsView #dealsPaginationControls{margin-left:0;}
}

/* Proposal + Agreement modern commercial workspace */
.commercial-modern-workspace {
  background: #f6f8fb;
  color: #0f172a;
}
.commercial-page-shell {
  display: grid;
  gap: 18px;
  padding: 24px 28px;
  min-height: calc(100vh - 96px);
}
.commercial-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.commercial-title-row {
  display: flex;
  align-items: center;
  gap: 14px;
}
.commercial-title-icon {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #dbeafe, #eef2ff);
  color: #0b7ec2;
  font-size: 20px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(37, 99, 235, .12);
}
.commercial-title-icon--agreement {
  background: linear-gradient(135deg, #e0f2fe, #eef2ff);
}
.commercial-page-header h1 {
  margin: 0;
  color: #0f172a;
  font-size: 30px;
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -.03em;
}
.commercial-page-header p {
  margin: 7px 0 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 650;
}
.commercial-header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.commercial-soft-btn,
.commercial-primary-btn {
  min-height: 42px;
  border-radius: 10px;
  font-weight: 850;
  letter-spacing: -.01em;
}
.commercial-primary-btn {
  padding: 0 18px;
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  border: 1px solid #1d4ed8 !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(37, 99, 235, .22);
}
.commercial-soft-btn {
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  color: #0f172a !important;
}
.commercial-kpi-grid {
  display: grid;
  gap: 14px;
}
.commercial-kpi-grid--proposals {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}
.commercial-kpi-grid--agreements {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.commercial-kpi-card {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 112px;
  padding: 22px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.commercial-kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(15, 23, 42, .10);
}
.commercial-kpi-card.kpi-filter-active {
  border-color: #2563eb;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, .16), 0 18px 42px rgba(37, 99, 235, .13);
}
.commercial-kpi-icon {
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  font-size: 22px;
  font-weight: 950;
  background: #eff6ff;
  color: #2563eb;
}
.commercial-kpi-card .label {
  color: #475569;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
  text-transform: none;
  letter-spacing: -.01em;
}
.commercial-kpi-card .value {
  margin-top: 5px;
  color: #0f172a;
  font-size: 25px;
  line-height: 1.08;
  font-weight: 950;
  letter-spacing: -.03em;
}
.commercial-kpi-card .sub {
  margin-top: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}
.commercial-kpi-card--violet .commercial-kpi-icon { background: #ede9fe; color: #7c3aed; }
.commercial-kpi-card--sky .commercial-kpi-icon { background: #e0f2fe; color: #0284c7; }
.commercial-kpi-card--green .commercial-kpi-icon { background: #dcfce7; color: #16a34a; }
.commercial-kpi-card--rose .commercial-kpi-icon { background: #fee2e2; color: #dc2626; }
.commercial-kpi-card--amber .commercial-kpi-icon { background: #fef3c7; color: #d97706; }
.commercial-kpi-card--teal .commercial-kpi-icon { background: #ccfbf1; color: #0f766e; }
.commercial-kpi-card--indigo .commercial-kpi-icon { background: #e0e7ff; color: #4f46e5; }
.commercial-kpi-card--orange .commercial-kpi-icon { background: #ffedd5; color: #ea580c; }
.commercial-kpi-card--money .commercial-kpi-icon { background: #dcfce7; color: #16a34a; }
.commercial-filter-card,
.commercial-breakdown-card,
.commercial-table-panel {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}
.commercial-filter-card {
  padding: 18px 20px 20px;
}
.commercial-panel-title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}
.commercial-panel-title h2 {
  margin: 0;
  color: #0f172a;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -.02em;
}
.commercial-panel-icon {
  color: #2563eb;
  font-size: 18px;
  font-weight: 900;
}
.commercial-filter-grid {
  display: grid;
  gap: 14px 18px;
  align-items: end;
}
.commercial-filter-grid--proposals {
  grid-template-columns: minmax(260px, 1.15fr) minmax(220px, 1fr) minmax(180px, .75fr) auto;
}
.commercial-filter-grid--agreements {
  grid-template-columns: minmax(280px, 1.2fr) minmax(190px, .85fr) minmax(230px, 1fr) minmax(220px, .95fr) auto;
}
.commercial-filter-field {
  display: grid;
  gap: 8px;
  min-width: 0;
}
.commercial-filter-field > span {
  color: #334155;
  font-size: 12px;
  font-weight: 850;
}
.commercial-filter-card .input,
.commercial-filter-card .select,
.commercial-input-shell {
  min-height: 42px;
  width: 100%;
  border-radius: 10px !important;
  border-color: #cbd5e1 !important;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: none !important;
}
.commercial-input-shell {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
}
.commercial-input-shell > span {
  color: #94a3b8;
  font-weight: 900;
}
.commercial-input-shell .input {
  min-height: 40px;
  padding: 0;
  border: 0 !important;
}
.commercial-filter-clear {
  display: flex;
  align-items: end;
}
.commercial-filter-clear .btn {
  width: 100%;
  justify-content: center;
}
.commercial-breakdown-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
}
.commercial-breakdown-card {
  padding: 18px 20px;
}
.commercial-breakdown-title {
  margin-bottom: 14px;
  color: #0f172a;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: -.01em;
}
.commercial-status-bars {
  display: grid;
  gap: 11px;
}
.commercial-status-row {
  display: grid;
  grid-template-columns: minmax(120px, .9fr) minmax(160px, 1.65fr) minmax(76px, auto);
  gap: 12px;
  align-items: center;
  color: #475569;
  font-size: 12px;
  font-weight: 800;
}
.commercial-status-label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  color: #334155;
}
.commercial-status-dot {
  flex: 0 0 8px;
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: #2563eb;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .10);
}
.commercial-status-track {
  height: 7px;
  overflow: hidden;
  background: #e9eef5;
  border-radius: 999px;
}
.commercial-status-fill {
  display: block;
  height: 100%;
  min-width: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #2563eb, #7c3aed);
}
.commercial-status-meta {
  color: #64748b;
  text-align: right;
  white-space: nowrap;
}
.commercial-status-row--green .commercial-status-dot { background: #16a34a; box-shadow: 0 0 0 3px rgba(22, 163, 74, .10); }
.commercial-status-row--green .commercial-status-fill { background: linear-gradient(90deg, #16a34a, #22c55e); }
.commercial-status-row--violet .commercial-status-dot { background: #7c3aed; box-shadow: 0 0 0 3px rgba(124, 58, 237, .10); }
.commercial-status-row--violet .commercial-status-fill { background: linear-gradient(90deg, #2563eb, #7c3aed); }
.commercial-status-row--amber .commercial-status-dot { background: #d97706; box-shadow: 0 0 0 3px rgba(217, 119, 6, .12); }
.commercial-status-row--amber .commercial-status-fill { background: linear-gradient(90deg, #f59e0b, #ea580c); }
.commercial-status-row--rose .commercial-status-dot { background: #dc2626; box-shadow: 0 0 0 3px rgba(220, 38, 38, .10); }
.commercial-status-row--rose .commercial-status-fill { background: linear-gradient(90deg, #f43f5e, #dc2626); }
.commercial-status-row--teal .commercial-status-dot { background: #0f766e; box-shadow: 0 0 0 3px rgba(15, 118, 110, .10); }
.commercial-status-row--teal .commercial-status-fill { background: linear-gradient(90deg, #14b8a6, #0f766e); }
.commercial-table-panel {
  overflow: hidden;
}
.commercial-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid #e2e8f0;
}
.commercial-table-toolbar-left {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}
.commercial-page-info {
  color: #334155;
  font-size: 14px;
  font-weight: 850;
}
.commercial-table-wrap {
  width: 100%;
  overflow: auto;
  background: #fff;
}
.commercial-table {
  width: 100%;
  min-width: 1500px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}
#agreementsTable.commercial-table { min-width: 1700px; }
.commercial-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 14px 16px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
  text-align: left;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
}
.commercial-table tbody td {
  padding: 15px 16px;
  color: #1e293b;
  font-size: 13px;
  line-height: 1.35;
  border-bottom: 1px solid #edf2f7;
  vertical-align: middle;
  background: #fff;
}
.commercial-table tbody tr:hover td { background: #f8fbff; }
.commercial-table tbody tr.is-selected td { background: #eff6ff; }
.commercial-clickable-row { cursor: pointer; }
.commercial-id-cell {
  color: #2563eb;
  font-weight: 900;
  white-space: nowrap;
}
.commercial-name-cell { min-width: 220px; }
.commercial-name-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 800;
}
.commercial-avatar {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
}
.commercial-avatar--proposal { background: #e0e7ff; color: #4f46e5; }
.commercial-avatar--agreement { background: #dbeafe; color: #2563eb; }
.commercial-money-cell {
  color: #0f172a;
  font-weight: 900;
  white-space: nowrap;
}
.commercial-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 12px;
  font-weight: 900;
  white-space: nowrap;
}
.commercial-chip--success { background: #dcfce7; color: #15803d; border-color: #bbf7d0; }
.commercial-chip--info { background: #dbeafe; color: #2563eb; border-color: #bfdbfe; }
.commercial-chip--warning { background: #fef3c7; color: #b45309; border-color: #fde68a; }
.commercial-chip--danger { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.commercial-chip--neutral { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.commercial-row-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 96px;
}
.commercial-view-btn {
  min-height: 34px;
  padding: 0 14px;
  border: 1px solid #bfdbfe;
  border-radius: 9px;
  background: #fff;
  color: #2563eb;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}
.commercial-view-btn:hover { background: #eff6ff; }
.commercial-actions-menu { position: relative; }
.commercial-actions-menu summary { list-style: none; }
.commercial-actions-menu summary::-webkit-details-marker { display: none; }
.commercial-more-btn {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid #e2e8f0;
  border-radius: 9px;
  background: #fff;
  color: #0f172a;
  font-size: 20px;
  font-weight: 900;
  cursor: pointer;
}
.commercial-more-btn:hover { background: #f8fafc; }
.commercial-actions-popover {
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  z-index: 30;
  display: grid;
  gap: 2px;
  min-width: 190px;
  padding: 6px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .16);
}
.commercial-menu-item {
  appearance: none;
  border: 0;
  background: transparent;
  color: #0f172a;
  text-align: left;
  border-radius: 8px;
  padding: 9px 10px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}
.commercial-menu-item:hover { background: #f1f5f9; }
.commercial-menu-item.danger { color: #dc2626; }
.commercial-menu-item:disabled,
.commercial-menu-item.is-disabled { opacity: .55; cursor: not-allowed; }
.commercial-empty-breakdown {
  color: #64748b;
  font-size: 13px;
  font-weight: 700;
  padding: 4px 0;
}
#proposalsPaginationControls,
#agreementsPagination {
  margin: 12px 16px 16px;
}
#proposalsState + #proposalsPaginationControls {
  margin: 0;
}
@media (max-width: 1680px) {
  .commercial-kpi-grid--proposals { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .commercial-kpi-grid--agreements { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 1300px) {
  .commercial-kpi-grid--proposals,
  .commercial-kpi-grid--agreements { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .commercial-breakdown-grid { grid-template-columns: 1fr; }
  .commercial-filter-grid--proposals,
  .commercial-filter-grid--agreements { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .commercial-filter-clear { align-items: stretch; }
}
@media (max-width: 760px) {
  .commercial-page-shell { padding: 16px; }
  .commercial-page-header,
  .commercial-header-actions,
  .commercial-table-toolbar { align-items: stretch; flex-direction: column; }
  .commercial-soft-btn,
  .commercial-primary-btn { width: 100%; justify-content: center; }
  .commercial-kpi-grid--proposals,
  .commercial-kpi-grid--agreements,
  .commercial-filter-grid--proposals,
  .commercial-filter-grid--agreements { grid-template-columns: 1fr; }
  .commercial-status-row { grid-template-columns: 1fr; gap: 6px; }
  .commercial-status-meta { text-align: left; }
}


/* Product / Proposal Catalog modern UI - 2026-06-26 */
#proposalCatalogView.catalog-modern-workspace {
  background: #f6f8fb;
  color: #0f172a;
}
.catalog-page-shell {
  display: grid;
  gap: 18px;
  padding: 24px 28px;
  min-height: calc(100vh - 96px);
}
.catalog-page-header,
.catalog-table-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
}
.catalog-title-row {
  display: flex;
  align-items: center;
  gap: 14px;
}
.catalog-title-icon {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  background: linear-gradient(135deg, #ede9fe, #dbeafe);
  color: #6d28d9;
  font-size: 20px;
  font-weight: 950;
  box-shadow: 0 12px 28px rgba(109, 40, 217, .12);
}
.catalog-page-header h1 {
  margin: 0;
  color: #0f172a;
  font-size: 30px;
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -.03em;
}
.catalog-page-header p,
.catalog-title-block p {
  margin: 7px 0 0;
  color: #64748b;
  font-size: 14px;
  font-weight: 650;
}
.catalog-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.catalog-kpi-card {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 112px;
  padding: 22px 20px;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.catalog-kpi-card:hover {
  transform: translateY(-2px);
  border-color: #bfdbfe;
  box-shadow: 0 18px 42px rgba(15, 23, 42, .10);
}
.catalog-kpi-icon {
  flex: 0 0 54px;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  font-size: 22px;
  font-weight: 950;
  background: #eff6ff;
  color: #2563eb;
}
.catalog-kpi-card .label {
  color: #475569;
  font-size: 13px;
  font-weight: 850;
  line-height: 1.25;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.catalog-kpi-card .value {
  margin-top: 5px;
  color: #0f172a;
  font-size: 28px;
  line-height: 1.05;
  font-weight: 950;
  letter-spacing: -.03em;
}
.catalog-kpi-card .sub {
  margin-top: 6px;
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}
.catalog-kpi-card--violet .catalog-kpi-icon { background: #ede9fe; color: #7c3aed; }
.catalog-kpi-card--green .catalog-kpi-icon { background: #dcfce7; color: #16a34a; }
.catalog-kpi-card--blue .catalog-kpi-icon { background: #dbeafe; color: #2563eb; }
.catalog-kpi-card--amber .catalog-kpi-icon { background: #ffedd5; color: #ea580c; }
.catalog-kpi-card--indigo .catalog-kpi-icon { background: #e0e7ff; color: #4f46e5; }
.catalog-table-panel {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .06);
}
.catalog-table-header {
  padding: 20px 22px 12px;
}
.catalog-title-block h2 {
  margin: 0;
  color: #0f172a;
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -.02em;
}
.catalog-toolbar {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}
.catalog-search-field {
  min-height: 42px;
  width: min(330px, 100%);
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 12px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #94a3b8;
}
.catalog-search-field .input {
  min-height: 40px;
  width: 100%;
  border: 0 !important;
  background: transparent !important;
  color: #0f172a !important;
  padding: 0;
  box-shadow: none !important;
}
.catalog-toolbar .select {
  min-height: 42px;
  min-width: 145px;
  border-radius: 10px !important;
  border-color: #cbd5e1 !important;
  background: #fff !important;
  color: #0f172a !important;
  box-shadow: none !important;
}
.catalog-soft-btn,
.catalog-primary-btn {
  min-height: 42px;
  border-radius: 10px;
  padding: 0 14px;
  font-weight: 850;
  letter-spacing: -.01em;
  cursor: pointer;
}
.catalog-soft-btn {
  background: #fff;
  border: 1px solid #e2e8f0;
  color: #0f172a;
}
.catalog-soft-btn:hover { background: #f8fafc; }
.catalog-primary-btn {
  background: linear-gradient(135deg, #7c3aed, #4f46e5);
  border: 1px solid #6d28d9;
  color: #fff;
  box-shadow: 0 12px 24px rgba(124, 58, 237, .22);
}
.catalog-primary-btn:hover { transform: translateY(-1px); box-shadow: 0 16px 30px rgba(124, 58, 237, .26); }
.catalog-state {
  padding: 0 22px 14px;
  color: #475569;
  font-size: 14px;
  font-weight: 750;
}
.catalog-table-wrap {
  width: 100%;
  overflow: auto;
  background: #fff;
  border-top: 1px solid #e2e8f0;
}
.catalog-table {
  width: 100%;
  min-width: 1500px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}
.catalog-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 14px 16px;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  font-weight: 900;
  text-align: left;
  border-bottom: 1px solid #e2e8f0;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .03em;
}
.catalog-table tbody td {
  padding: 15px 16px;
  color: #1e293b;
  font-size: 13px;
  line-height: 1.35;
  border-bottom: 1px solid #edf2f7;
  vertical-align: middle;
  background: #fff;
}
.catalog-table tbody tr:hover td { background: #f8fbff; }
.catalog-id-cell {
  color: #2563eb;
  font-weight: 900;
  white-space: nowrap;
}
.catalog-item-cell { min-width: 260px; }
.catalog-item-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 850;
}
.catalog-avatar {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: #ede9fe;
  color: #7c3aed;
  font-size: 11px;
  font-weight: 950;
}
.catalog-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 11px;
  font-weight: 900;
  white-space: nowrap;
  text-transform: uppercase;
  letter-spacing: .02em;
}
.catalog-chip--active { background: #dcfce7; color: #15803d; border-color: #bbf7d0; }
.catalog-chip--inactive { background: #fee2e2; color: #dc2626; border-color: #fecaca; }
.catalog-chip--blue { background: #dbeafe; color: #2563eb; border-color: #bfdbfe; }
.catalog-chip--amber { background: #ffedd5; color: #ea580c; border-color: #fed7aa; }
.catalog-chip--indigo { background: #e0e7ff; color: #4f46e5; border-color: #c7d2fe; }
.catalog-chip--neutral { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.catalog-money-cell {
  color: #6d28d9 !important;
  font-weight: 950;
  white-space: nowrap;
}
.catalog-date-cell {
  display: grid;
  gap: 3px;
  color: #334155;
  font-weight: 750;
  white-space: nowrap;
}
.catalog-date-cell span {
  color: #64748b;
  font-size: 12px;
  font-weight: 650;
}
.catalog-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 180px;
}
.catalog-action-btn {
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid #e2e8f0;
  border-radius: 9px;
  background: #fff;
  color: #0f172a;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
}
.catalog-action-btn:hover { background: #f8fafc; border-color: #cbd5e1; }
.catalog-action-btn--edit {
  color: #7c3aed;
  border-color: #ddd6fe;
}
.catalog-action-btn--edit:hover { background: #f5f3ff; }
#proposalCatalogPagination {
  margin: 12px 16px 16px;
}
#proposalCatalogPagination > .pagination {
  justify-content: space-between;
  width: 100%;
}
#proposalCatalogPagination .chip-btn {
  border-color: #e2e8f0;
  background: #fff;
  color: #0f172a;
}
#proposalCatalogPagination .chip-btn:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #2563eb;
}
@media (max-width: 1600px) {
  .catalog-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1180px) {
  .catalog-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-table-header { flex-direction: column; align-items: stretch; }
  .catalog-toolbar { justify-content: flex-start; }
  .catalog-search-field { width: 100%; }
}
@media (max-width: 760px) {
  .catalog-page-shell { padding: 16px; }
  .catalog-page-header { flex-direction: column; }
  .catalog-kpi-grid { grid-template-columns: 1fr; }
  .catalog-toolbar { flex-direction: column; align-items: stretch; }
  .catalog-toolbar .select,
  .catalog-soft-btn,
  .catalog-primary-btn { width: 100%; }
}

/* Proposal catalog item modal */
.proposal-catalog-form-modal{
  background:rgba(15,23,42,.58);
  padding:24px;
}
.proposal-catalog-modal-content{
  width:min(94vw,960px);
  max-width:960px !important;
  max-height:min(92vh,920px);
  padding:0;
  overflow:hidden;
  border:1px solid rgba(226,232,240,.9);
  border-radius:20px;
  background:#fff;
  box-shadow:0 28px 80px rgba(15,23,42,.24);
}
.proposal-catalog-modal-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  padding:24px 28px 20px;
  border-bottom:1px solid #eef2f7;
  background:linear-gradient(135deg,#fff 0%,#f8fbff 58%,#f5f3ff 100%);
}
.proposal-catalog-modal-heading{display:flex;align-items:center;gap:14px;min-width:0}
.proposal-catalog-modal-icon{
  display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:16px;
  color:#fff;font-size:22px;font-weight:800;
  background:linear-gradient(135deg,#2563eb,#7c3aed);
  box-shadow:0 12px 24px rgba(37,99,235,.22);
}
.proposal-catalog-modal-heading h2{margin:0;color:#0f172a;font-size:24px;line-height:1.15;letter-spacing:-.02em}
.proposal-catalog-modal-heading p{margin:6px 0 0;color:#64748b;font-size:14px;line-height:1.45}
.proposal-catalog-modal-close{
  display:grid;place-items:center;width:40px;height:40px;border:1px solid #e2e8f0;border-radius:12px;
  background:#fff;color:#64748b;font-size:18px;transition:all .18s ease;
}
.proposal-catalog-modal-close:hover{border-color:#cbd5e1;color:#0f172a;box-shadow:0 8px 18px rgba(15,23,42,.08)}
.proposal-catalog-form{display:flex;flex-direction:column;max-height:calc(92vh - 1px);overflow:auto}
.proposal-catalog-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:24px 28px 18px}
.proposal-catalog-field{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0}
.proposal-catalog-field-full{grid-column:1 / -1}
.proposal-catalog-field label,.proposal-catalog-label-row label{color:#334155;font-size:13px;font-weight:800;letter-spacing:.01em}
.required-mark{color:#ef4444}
.proposal-catalog-field .input,.proposal-catalog-field .select{
  width:100%;min-height:48px;padding:0 14px;border:1px solid #dbe3ef;border-radius:12px;
  background:#fff;color:#0f172a;font-size:14px;box-shadow:0 1px 2px rgba(15,23,42,.04);transition:all .18s ease;
}
.proposal-catalog-field textarea.input{min-height:112px;padding:12px 14px;resize:vertical;line-height:1.5}
.proposal-catalog-field-with-prefix .input{padding-left:42px}
.proposal-catalog-input-prefix{position:absolute;left:14px;bottom:14px;color:#64748b;font-weight:800;pointer-events:none}
.proposal-catalog-field .input:focus,.proposal-catalog-field .select:focus{
  outline:none;border-color:#6366f1;box-shadow:0 0 0 4px rgba(99,102,241,.14),0 8px 18px rgba(37,99,235,.08);
}
.proposal-catalog-field-highlight .input{border-color:#bfdbfe;background:linear-gradient(180deg,#fff,#fbfdff)}
.proposal-catalog-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.proposal-catalog-counter{color:#94a3b8;font-size:12px;font-weight:700}
.proposal-catalog-info-callout{display:flex;align-items:flex-start;gap:10px;margin:0 28px 22px;padding:14px 16px;border:1px solid #dbeafe;border-radius:16px;background:linear-gradient(135deg,#eff6ff,#f5f3ff);color:#334155}
.proposal-catalog-info-callout span{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:999px;background:#2563eb;color:#fff;font-weight:900;font-size:13px}
.proposal-catalog-info-callout p{margin:1px 0 0;line-height:1.45}
.proposal-catalog-modal-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 28px;border-top:1px solid #eef2f7;background:#fff}
.proposal-catalog-footer-actions{display:flex;justify-content:flex-end;gap:10px;margin-left:auto}
.proposal-catalog-cancel-btn{border:1px solid #cbd5e1;background:#fff;color:#334155}
.proposal-catalog-save-btn{border:0;background:linear-gradient(135deg,#2563eb,#7c3aed);box-shadow:0 12px 24px rgba(37,99,235,.22);color:#fff}
.proposal-catalog-save-btn:hover{filter:brightness(1.03);transform:translateY(-1px)}
@media(max-width:720px){
  .proposal-catalog-form-modal{padding:12px;align-items:flex-start}
  .proposal-catalog-modal-content{width:100%;max-height:94vh}
  .proposal-catalog-modal-header,.proposal-catalog-form-grid,.proposal-catalog-modal-footer{padding-left:18px;padding-right:18px}
  .proposal-catalog-form-grid{grid-template-columns:1fr;gap:14px}
  .proposal-catalog-modal-footer{align-items:stretch;flex-direction:column}
  .proposal-catalog-footer-actions{width:100%;margin-left:0;flex-direction:column-reverse}
  .proposal-catalog-footer-actions .btn,.proposal-catalog-modal-footer>.btn{width:100%}
}

/* Modern Create/Edit Agreement modal */
.agreement-modern-modal.open{display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(15,23,42,.52);backdrop-filter:blur(6px)}
.agreement-modern-content{width:min(1200px,calc(100vw - 32px));max-width:1200px!important;max-height:90vh;padding:0!important;overflow:hidden;border:1px solid rgba(37,99,235,.12);border-radius:22px;background:#f8fafc;box-shadow:0 28px 80px rgba(15,23,42,.28)}
.agreement-modal-header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 28px;background:linear-gradient(180deg,#fff,#f8fbff);border-bottom:1px solid #e2e8f0}
.agreement-header-left{display:flex;align-items:center;gap:16px;min-width:0}.agreement-header-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#2563eb;font-size:24px;font-weight:800;box-shadow:inset 0 0 0 1px rgba(37,99,235,.14)}
.agreement-modal-header h2{margin:0;color:#0f172a;font-size:26px;line-height:1.15;font-weight:800;letter-spacing:-.03em}.agreement-modal-header p{margin:6px 0 0;color:#64748b;font-size:14px;line-height:1.45}.agreement-close-btn{width:40px;height:40px;border-radius:12px;border:1px solid #e2e8f0;background:#fff;color:#475569;box-shadow:0 4px 12px rgba(15,23,42,.06)}
.agreement-modern-form{display:flex;flex-direction:column;min-height:0;max-height:calc(90vh - 102px)}.agreement-scroll-body{overflow:auto;padding:22px 28px 8px;display:flex;flex-direction:column;gap:18px}.agreement-section-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(15,23,42,.05)}
.agreement-section-title{margin:0 0 16px;display:flex;align-items:center;gap:10px;color:#0f172a;font-size:16px;font-weight:800}.agreement-section-title span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#eff6ff;color:#2563eb;font-size:15px}.agreement-form-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}.agreement-span-2{grid-column:1/-1!important}
.agreement-modern-modal .filter-row{display:flex;flex-direction:column;gap:7px}.agreement-modern-modal label.muted,.agreement-modern-modal .filter-row>label{color:#334155!important;font-size:12px;font-weight:800;letter-spacing:.01em}.agreement-modern-modal .input,.agreement-modern-modal .select,.agreement-modern-modal textarea{min-height:46px;border:1px solid #cbd5e1!important;border-radius:12px!important;background:#fff;color:#0f172a;padding:10px 12px;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:border-color .15s,box-shadow .15s,background .15s}.agreement-modern-modal textarea{min-height:112px;resize:vertical;line-height:1.5}.agreement-modern-modal .agreement-large-textarea{min-height:160px}.agreement-modern-modal .input:focus,.agreement-modern-modal .select:focus,.agreement-modern-modal textarea:focus{outline:0;border-color:#2563eb!important;box-shadow:0 0 0 4px rgba(37,99,235,.14)}.agreement-modern-modal .readonly-field,.agreement-readonly-grid .input[readonly]{background:#f1f5f9!important;color:#475569}.agreement-field-help{margin-top:6px;font-size:12px;color:#64748b}.agreement-warning{margin-top:5px;font-size:12px;color:#b45309!important}.agreement-danger{margin-top:5px;font-size:12px;color:#b91c1c!important}.agreement-party-card{border-color:#bfdbfe;background:linear-gradient(180deg,#fff,#f8fbff)}.agreement-provider-card{background:#eff6ff;border-color:#bfdbfe}.agreement-provider-card .agreement-section-title span{background:#dbeafe}.agreement-toggle-row{align-self:end;padding:12px 14px;border:1px solid #dbeafe;border-radius:14px;background:#f8fbff}.agreement-toggle-row label{display:flex;align-items:center;gap:10px;color:#1e3a8a;font-weight:800}.agreement-toggle-row input{accent-color:#2563eb;width:18px;height:18px}.agreement-toggle-row p{margin:5px 0 0;color:#64748b;font-size:12px}.agreement-poc-panel{margin-top:16px;padding-top:16px;border-top:1px dashed #bfdbfe}.agreement-subsection-note{padding:12px 14px;border-radius:14px;background:#f8fafc;border:1px solid #e2e8f0;display:flex;flex-direction:column;gap:4px}.agreement-subsection-note span{color:#64748b;font-size:12px}
.agreement-items-panel{border:1px solid #e2e8f0;border-radius:16px;overflow:hidden;margin-top:14px;background:#fff}.agreement-items-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.agreement-items-header strong{font-size:14px;color:#0f172a}.agreement-table-wrap{margin:0!important;border:0!important;overflow-x:auto}.agreement-table-wrap table{min-width:900px}.agreement-modern-modal table th{background:#eff6ff!important;color:#1e3a8a!important;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.agreement-modern-modal table td{vertical-align:middle}.agreement-summary-card{width:min(420px,100%);margin:18px 0 0 auto;padding:18px;border:1px solid #bfdbfe;border-radius:18px;background:linear-gradient(180deg,#fff,#eff6ff);box-shadow:0 10px 24px rgba(37,99,235,.08)}.agreement-summary-card>strong{display:block;margin-bottom:12px;color:#0f172a}.agreement-summary-card div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-top:1px solid #dbeafe;color:#475569}.agreement-summary-card div:first-of-type{border-top:0}.agreement-summary-card b{color:#0f172a}.agreement-grand-total{margin-top:4px;font-size:18px;color:#1d4ed8!important}.agreement-grand-total b{color:#1d4ed8!important}
.agreement-signature-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.agreement-signature-grid .signatory-column{border:1px solid #dbeafe;border-radius:16px;background:#f8fbff;padding:16px}.agreement-signature-grid h4{margin:0 0 12px;color:#1d4ed8;font-size:14px}.agreement-signature-subtitle{margin:12px 0 8px;padding-top:10px;border-top:1px dashed #bfdbfe;color:#2563eb;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.agreement-doc-actions{justify-content:flex-start;gap:10px;flex-wrap:wrap}.agreement-lock-card{padding:14px 16px;border:1px solid #fed7aa;border-radius:16px;background:#fff7ed;color:#9a3412}
.btn-incheck-primary{border:1px solid #1d4ed8!important;background:linear-gradient(135deg,#2563eb,#1d4ed8)!important;color:#fff!important;box-shadow:0 10px 20px rgba(37,99,235,.22)}.btn-incheck-primary:hover{filter:brightness(.98);transform:translateY(-1px)}.btn-incheck-outline{border:1px solid #bfdbfe!important;background:#fff!important;color:#1d4ed8!important}.btn-incheck-outline:hover{background:#eff6ff!important}.agreement-danger-btn{border:1px solid #fecaca!important;background:#fff!important;color:#b91c1c!important}.agreement-modal-footer{position:sticky;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 28px;background:rgba(255,255,255,.96);border-top:1px solid #e2e8f0;box-shadow:0 -12px 28px rgba(15,23,42,.06);backdrop-filter:blur(8px)}.agreement-footer-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
@media (max-width: 760px){.agreement-modern-modal.open{padding:10px}.agreement-modern-content{width:calc(100vw - 20px);max-height:94vh;border-radius:18px}.agreement-modern-form{max-height:calc(94vh - 96px)}.agreement-modal-header{padding:18px}.agreement-scroll-body{padding:16px}.agreement-form-grid,.agreement-signature-grid{grid-template-columns:1fr!important}.agreement-span-2{grid-column:auto!important}.agreement-modal-footer{align-items:stretch;flex-direction:column;padding:14px 16px}.agreement-footer-actions{width:100%}.agreement-footer-actions .btn{flex:1 1 auto}.agreement-modal-header h2{font-size:22px}}

/* Modern proposal create/edit modal - InCheck blue SaaS form style */
.proposal-modern-modal {
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(15, 23, 42, 0.52);
  backdrop-filter: blur(6px);
}

.proposal-modern-content {
  width: min(1180px, calc(100vw - 32px));
  max-width: 1180px !important;
  max-height: 90vh;
  padding: 0;
  overflow: hidden;
  border: 1px solid rgba(191, 219, 254, 0.8);
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.28);
}

.proposal-modal-header {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 22px 26px;
  border-bottom: 1px solid #e5e7eb;
  background: linear-gradient(180deg, #fff 0%, #f8fbff 100%);
}
.proposal-header-mark {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: 0 0 auto;
  border-radius: 16px;
  color: #fff;
  background: #2563eb;
  box-shadow: 0 10px 22px rgba(37, 99, 235, 0.24);
}
.proposal-header-copy { flex: 1; min-width: 0; }
.proposal-header-copy h2 { margin: 0; color: #0f172a; font-size: 24px; line-height: 1.2; }
.proposal-header-copy p { margin: 5px 0 0; color: #64748b; font-size: 14px; }
.proposal-close-btn {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  border: 1px solid #dbeafe;
  background: #fff;
  color: #334155;
}
.proposal-close-btn:hover { color: #1d4ed8; background: #eff6ff; }

.proposal-modern-form { display: flex; flex-direction: column; max-height: calc(90vh - 1px); }
.proposal-modal-scroll {
  overflow: auto;
  padding: 22px 26px 24px;
  background: #f8fafc;
}
.proposal-section-card,
.proposal-info-card,
.proposal-summary-card {
  margin: 0 0 18px;
  padding: 20px;
  border: 1px solid #e2e8f0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
}
.proposal-section-title,
.proposal-item-heading {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.proposal-section-title > .btn,
.proposal-item-heading > .btn {
  margin-left: auto;
  flex: 0 0 auto;
}
.proposal-section-heading-left {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 12px;
  min-width: 0;
}
.proposal-section-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border-radius: 11px;
  background: #eff6ff;
  color: #2563eb;
}
.proposal-section-title h3,
.proposal-item-heading h3 { margin: 0; color: #0f172a; font-size: 16px; }
.proposal-section-title p,
.proposal-item-heading p { margin: 3px 0 0; color: #64748b; font-size: 12px; line-height: 1.45; }
.proposal-form-grid,
.proposal-signatory-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}
.proposal-span-2 { grid-column: 1 / -1; }
.proposal-modern-modal .filter-row { gap: 7px; }
.proposal-modern-modal label.muted,
.proposal-modern-modal .filter-row > label {
  color: #334155;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .01em;
}
.proposal-modern-modal .input,
.proposal-modern-modal .select,
.proposal-modern-modal textarea.input {
  min-height: 46px;
  border: 1px solid #cbd5e1;
  border-radius: 12px;
  background: #fff;
  color: #0f172a;
  transition: border-color .16s ease, box-shadow .16s ease, background .16s ease;
}
.proposal-modern-modal textarea.input { min-height: 118px; padding-top: 12px; resize: vertical; }
.proposal-modern-modal .input:focus,
.proposal-modern-modal .select:focus,
.proposal-modern-modal textarea.input:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14);
  outline: none;
}
.proposal-modern-modal .readonly-field,
.proposal-modern-modal [readonly] { background: #f1f5f9; border-color: #dbeafe; color: #475569; }
.required-star { color: #dc2626; }
.proposal-poc-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid #bfdbfe;
  border-radius: 16px;
  background: #eff6ff;
  cursor: pointer;
}
.proposal-poc-toggle span { display: grid; gap: 4px; color: #1e3a8a; }
.proposal-poc-toggle small { color: #475569; font-weight: 500; }
.proposal-poc-toggle input { width: 22px; height: 22px; accent-color: #2563eb; }
.proposal-poc-details { margin-top: 14px; }
.proposal-signatory-column {
  display: grid;
  gap: 12px;
  padding: 16px;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
}
.proposal-signatory-column h4 { margin: 0; color: #1d4ed8; }
.proposal-info-card { border-color: #bfdbfe; background: #eff6ff; color: #1e3a8a; }
.proposal-info-card p { margin: 6px 0 0; color: #334155; }
.proposal-info-card a { color: #1d4ed8; font-weight: 700; }
.proposal-inline-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.proposal-item-heading { flex-wrap: wrap; }
.proposal-item-group + .proposal-item-group { margin-top: 20px; padding-top: 18px; border-top: 1px solid #e2e8f0; }
.proposal-table-wrap { border: 1px solid #e2e8f0; border-radius: 14px; overflow-x: auto; background: #fff; }
.proposal-items-panel table { min-width: 920px; border-collapse: separate; border-spacing: 0; }
.proposal-items-panel thead th { background: #eff6ff; color: #1e3a8a; font-size: 12px; font-weight: 800; }
.proposal-items-panel tbody td { border-top: 1px solid #e2e8f0; padding: 10px; }
.proposal-summary-card { width: min(420px, 100%); margin-left: auto; }
.proposal-summary-card strong { display: block; margin-bottom: 10px; color: #0f172a; }
.proposal-summary-card div { display: flex; justify-content: space-between; padding: 8px 0; color: #475569; }
.proposal-summary-card b { color: #0f172a; }
.proposal-grand-total { margin-top: 8px; padding: 14px !important; border-radius: 14px; background: #eff6ff; color: #1d4ed8 !important; }
.proposal-grand-total b { color: #2563eb; font-size: 20px; }
.proposal-modal-footer {
  position: sticky;
  bottom: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 26px;
  border-top: 1px solid #e2e8f0;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
}
.proposal-footer-spacer { flex: 1; }
.btn-incheck-primary,
.proposal-modern-modal .btn-incheck-primary {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.20);
}
.btn-incheck-primary:hover { border-color: #1d4ed8; background: #1d4ed8; }
.btn-incheck-outline,
.proposal-modern-modal .btn-incheck-outline { border-color: #bfdbfe; background: #fff; color: #1d4ed8; }
.btn-incheck-outline:hover { background: #eff6ff; border-color: #2563eb; }
.proposal-danger-btn { border-color: #fecaca; background: #fff5f5; color: #b91c1c; }
.proposal-danger-btn:hover { background: #fee2e2; }

@media (max-width: 760px) {
  .proposal-modern-modal { padding: 10px; }
  .proposal-modern-content { width: calc(100vw - 20px); border-radius: 18px; }
  .proposal-modal-header, .proposal-modal-scroll, .proposal-modal-footer { padding-left: 16px; padding-right: 16px; }
  .proposal-form-grid, .proposal-signatory-grid { grid-template-columns: 1fr; }
  .proposal-span-2 { grid-column: auto; }
  .proposal-modal-footer { flex-wrap: wrap; }
  .proposal-footer-spacer { display: none; }
  .proposal-modal-footer .btn { flex: 1 1 140px; }
}

/* Modern CRM create/edit modals - Company, Contact, Lead, Deal */
.modern-crm-modal{align-items:center;justify-content:center;padding:24px;background:rgba(15,23,42,.52);backdrop-filter:blur(6px)}
.modern-crm-modal[aria-hidden="false"]{display:flex!important}.modern-crm-modal-content{width:min(1040px,calc(100vw - 32px));max-width:1040px!important;max-height:90vh;padding:0!important;overflow:hidden;border:1px solid rgba(191,219,254,.9);border-radius:22px;background:#f8fafc;box-shadow:0 28px 80px rgba(15,23,42,.28)}.modern-crm-modal-content--wide{width:min(1180px,calc(100vw - 32px));max-width:1180px!important}.modern-crm-modal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:24px 28px;background:linear-gradient(180deg,#fff,#f8fbff);border-bottom:1px solid #e2e8f0}.modern-crm-header-left{display:flex;align-items:center;gap:16px;min-width:0}.modern-crm-modal-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#2563eb;font-size:24px;font-weight:800;box-shadow:inset 0 0 0 1px rgba(37,99,235,.14)}.modern-crm-modal-title{margin:0;color:#0f172a;font-size:26px;line-height:1.15;font-weight:800;letter-spacing:-.03em}.modern-crm-modal-subtitle{margin:6px 0 0;color:#64748b;font-size:14px;line-height:1.45}.modern-crm-close{width:40px;height:40px;border-radius:12px!important;border:1px solid #e2e8f0!important;background:#fff!important;color:#475569!important;box-shadow:0 4px 12px rgba(15,23,42,.06)}.modern-crm-form{display:flex;flex-direction:column;min-height:0;max-height:calc(90vh - 102px)}.modern-crm-scroll-body{overflow:auto;padding:22px 28px 8px;display:flex;flex-direction:column;gap:18px}.modern-crm-section-card{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(15,23,42,.05)}.modern-crm-section-title{margin:0 0 16px;display:flex;align-items:center;gap:10px;color:#0f172a;font-size:16px;font-weight:800}.modern-crm-section-title span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:#eff6ff;color:#2563eb;font-size:15px}.modern-crm-form-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}.crm-field-full{grid-column:1/-1!important}.crm-field{display:flex;flex-direction:column;gap:7px;min-width:0}.crm-field label,.modern-crm-modal label.muted{color:#334155!important;font-size:12px;font-weight:800;letter-spacing:.01em}.crm-field small,.crm-field .muted{color:#64748b;font-size:12px}.modern-crm-modal .input,.modern-crm-modal .select,.modern-crm-modal textarea{width:100%;min-height:46px;border:1px solid #cbd5e1!important;border-radius:12px!important;background:#fff;color:#0f172a;padding:10px 12px;box-shadow:0 1px 2px rgba(15,23,42,.03);transition:border-color .15s,box-shadow .15s,background .15s}.modern-crm-modal textarea{min-height:112px;resize:vertical;line-height:1.5}.modern-crm-modal .input:focus,.modern-crm-modal .select:focus,.modern-crm-modal textarea:focus{outline:0;border-color:#2563eb!important;box-shadow:0 0 0 4px rgba(37,99,235,.14)}.modern-crm-modal .input[readonly],.modern-crm-modal .readonly,.modern-crm-modal .readonly-field,.modern-crm-modal .locked-field{background:#f1f5f9!important;color:#475569!important}.modern-crm-readonly-card,.modern-crm-modal .form-section{background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(15,23,42,.05)}.modern-crm-info-callout{margin:0 0 14px;padding:14px 16px;border:1px solid #bfdbfe;border-radius:16px;background:#eff6ff;color:#1e3a8a}.modern-crm-notes-card{grid-column:1/-1;background:#fff;border:1px solid #e2e8f0;border-radius:18px;padding:18px;box-shadow:0 12px 30px rgba(15,23,42,.05)}.crm-empty-state{color:#64748b}.crm-multiselect{min-height:150px!important;overflow:auto}.crm-chip-row{display:flex;gap:8px;flex-wrap:wrap;min-height:34px;padding:8px;border:1px dashed #bfdbfe;border-radius:14px;background:#eff6ff}.crm-chip,.crm-chip-row span:not(.muted){display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:12px;font-weight:800}.crm-checkbox-field{justify-content:end;padding:12px 14px;border:1px solid #dbeafe;border-radius:14px;background:#f8fbff}.crm-checkbox-field label{display:flex!important;align-items:center;gap:10px;color:#1e3a8a!important}.crm-checkbox-field input{accent-color:#2563eb;width:18px;height:18px}.modern-crm-modal-footer{position:sticky;bottom:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 28px;background:rgba(255,255,255,.96);border-top:1px solid #e2e8f0;box-shadow:0 -12px 28px rgba(15,23,42,.06);backdrop-filter:blur(8px)}.modern-crm-footer-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap;margin-left:auto}.btn-incheck-primary{border:1px solid #1d4ed8!important;background:#2563eb!important;color:#fff!important;box-shadow:0 10px 20px rgba(37,99,235,.22)}.btn-incheck-primary:hover{background:#1d4ed8!important;transform:translateY(-1px)}.btn-incheck-outline{border:1px solid #bfdbfe!important;background:#fff!important;color:#1d4ed8!important}.btn-incheck-outline:hover{background:#eff6ff!important}.modern-crm-modal .form-section-header h3{color:#0f172a}.modern-crm-modal .form-section-header p{color:#64748b}.modern-crm-modal .lead-notes-history-list:empty::before{content:'No note history yet.';color:#64748b}.modern-crm-modal select[multiple] option{padding:8px;border-radius:8px}.modern-crm-modal select[multiple] option:checked{background:#2563eb;color:#fff}
@media (max-width:760px){.modern-crm-modal{padding:10px;align-items:flex-start}.modern-crm-modal-content{width:calc(100vw - 20px);max-height:94vh;border-radius:18px}.modern-crm-form{max-height:calc(94vh - 96px)}.modern-crm-modal-header{padding:18px}.modern-crm-scroll-body{padding:16px}.modern-crm-form-grid{grid-template-columns:1fr!important}.crm-field-full{grid-column:auto!important}.modern-crm-modal-footer{align-items:stretch;flex-direction:column;padding:14px 16px}.modern-crm-footer-actions{width:100%}.modern-crm-footer-actions .btn{flex:1 1 auto}.modern-crm-modal-title{font-size:22px}}

/* CRM responsive hardening - 2026-06-26
   Layout-only improvements for modern CRM modules and forms. */
*, *::before, *::after { box-sizing: border-box; }
img, svg { max-width: 100%; }
body { overflow-x: hidden; }

.crm-modern-workspace,
.company-workspace,
.contacts-workspace,
.leads-modern-workspace,
.deals-modern-workspace,
.commercial-modern-workspace,
.catalog-modern-workspace,
.company-page-shell,
.contacts-page-shell,
.leads-page-shell,
.deals-page-shell,
.commercial-page-shell,
.catalog-page-shell {
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
}

.company-page-header,
.contacts-page-header,
.leads-page-header,
.deals-page-header,
.commercial-page-header,
.catalog-page-header,
.catalog-table-header,
.company-table-toolbar,
.contacts-table-toolbar,
.leads-table-toolbar,
.deals-table-toolbar,
.commercial-table-toolbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  min-width: 0;
}

.company-page-header > div,
.contacts-page-header > div,
.leads-page-header > div,
.deals-page-header > div,
.commercial-title-block,
.catalog-title-block,
.company-table-toolbar-left,
.contacts-table-toolbar-left,
.leads-table-toolbar-left,
.deals-table-toolbar-left,
.commercial-table-toolbar-left {
  min-width: 0;
}

.company-page-header h1,
.contacts-page-header h1,
.leads-page-header h1,
.deals-page-header h1,
.commercial-page-header h1,
.catalog-page-header h1,
.catalog-title-block h2 {
  overflow-wrap: anywhere;
}

.company-header-actions,
.contacts-header-actions,
.leads-header-actions,
.deals-header-actions,
.commercial-header-actions,
.catalog-toolbar,
.company-table-toolbar-left,
.contacts-table-toolbar-left,
.leads-table-toolbar-left,
.deals-table-toolbar-left,
.commercial-table-toolbar-right,
.commercial-actions,
.catalog-actions,
.company-actions,
.contacts-actions,
.leads-actions,
.deals-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  min-width: 0;
}

.company-summary-grid,
.contacts-summary-grid,
.contacts-kpi-grid,
.leads-analytics-grid,
.deals-analytics-grid,
.commercial-kpi-grid,
.catalog-kpi-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)) !important;
  gap: 16px !important;
  width: 100%;
}

.company-filter-card,
.contacts-filter-card,
.leads-filter-card,
.deals-filter-card,
.commercial-filter-card,
.catalog-filter-card,
.company-panel,
.contacts-panel,
.leads-status-card,
.deals-breakdown-card,
.commercial-breakdown-card,
.catalog-table-panel {
  max-width: 100%;
  min-width: 0;
}

.company-filter-grid,
.contacts-filter-grid,
.leads-filter-grid,
.deals-filter-grid,
.commercial-filter-grid,
.catalog-toolbar {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(230px, 100%), 1fr)) !important;
  gap: 14px !important;
  align-items: end;
  width: 100%;
}

.company-filter-field,
.contacts-filter-field,
.leads-filter-field,
.deals-filter-field,
.commercial-filter-field,
.catalog-search-field,
.company-filter-search,
.contacts-filter-search,
.leads-filter-search,
.deals-filter-search,
.commercial-filter-search {
  min-width: 0 !important;
  width: 100%;
}

.company-filter-clear,
.contacts-filter-clear,
.leads-filter-clear,
.deals-filter-clear,
.commercial-filter-clear {
  display: flex;
  align-items: end;
  justify-content: flex-start;
  min-width: 0;
}

.company-filter-card input,
.company-filter-card select,
.contacts-filter-card input,
.contacts-filter-card select,
.leads-filter-card input,
.leads-filter-card select,
.deals-filter-card input,
.deals-filter-card select,
.commercial-filter-card input,
.commercial-filter-card select,
.catalog-toolbar input,
.catalog-toolbar select,
.modern-crm-modal input,
.modern-crm-modal select,
.modern-crm-modal textarea,
.proposal-modern-modal input,
.proposal-modern-modal select,
.proposal-modern-modal textarea,
.agreement-modern-modal input,
.agreement-modern-modal select,
.agreement-modern-modal textarea {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.modern-table-scroll,
.table-wrap,
.company-table-wrap,
.contacts-table-wrap,
.leads-table-wrap,
.deals-table-wrap,
.commercial-table-wrap,
.catalog-table-wrap,
.proposal-table-wrap,
.agreement-table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.company-table-wrap table,
.contacts-table-wrap table,
.leads-table-wrap table,
.deals-table-wrap table,
.commercial-table-wrap table,
.catalog-table-wrap table,
.modern-table-scroll table { min-width: 1100px; }
.proposal-table-wrap table,
.agreement-table-wrap table { min-width: 920px; }

.company-table-wrap th,
.company-table-wrap td,
.contacts-table-wrap th,
.contacts-table-wrap td,
.leads-table-wrap th,
.leads-table-wrap td,
.deals-table-wrap th,
.deals-table-wrap td,
.commercial-table-wrap th,
.commercial-table-wrap td,
.catalog-table-wrap th,
.catalog-table-wrap td {
  white-space: normal;
  overflow-wrap: anywhere;
  vertical-align: top;
}

.company-table-wrap td:last-child,
.contacts-table-wrap td:last-child,
.leads-table-wrap td:last-child,
.deals-table-wrap td:last-child,
.commercial-table-wrap td:last-child,
.catalog-table-wrap td:last-child {
  white-space: nowrap;
}

.deals-breakdown-grid,
.commercial-breakdown-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)) !important;
  gap: 16px !important;
}

.modern-crm-modal,
.proposal-modern-modal,
.agreement-modern-modal {
  overflow-x: hidden;
}
.modern-crm-modal-content,
.proposal-modern-content,
.agreement-modern-content {
  width: min(95vw, 1200px) !important;
  max-width: 1200px !important;
  max-height: 90vh !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
}
.modern-crm-modal-body,
.modern-crm-scroll-body,
.proposal-modal-body,
.proposal-modal-scroll,
.agreement-modal-body,
.agreement-scroll-body {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 0;
}
.modern-crm-form-grid,
.proposal-form-grid,
.agreement-form-grid,
.proposal-signatory-grid,
.agreement-signature-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
}
.crm-field-full,
.form-field-full,
.proposal-span-2,
.agreement-span-2 { grid-column: 1 / -1 !important; }

.modern-section-header,
.modern-crm-section-header,
.modern-crm-section-title,
.proposal-section-header,
.proposal-section-title,
.proposal-item-heading,
.agreement-section-header,
.agreement-section-title,
.agreement-items-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.modern-section-heading-left,
.modern-crm-section-heading-left,
.proposal-section-heading-left,
.agreement-section-heading-left {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  min-width: 0;
}

.payment-forecast-details-drawer,
.lead-details-drawer,
.deal-details-drawer,
.proposal-details-drawer,
.agreement-details-drawer {
  max-width: min(100vw, 520px);
  overflow-y: auto;
  overflow-x: hidden;
}

@media (max-width: 1200px) {
  .company-summary-grid,
  .contacts-summary-grid,
  .contacts-kpi-grid,
  .leads-analytics-grid,
  .deals-analytics-grid,
  .commercial-kpi-grid,
  .catalog-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

@media (max-width: 992px) {
  .company-filter-grid,
  .contacts-filter-grid,
  .leads-filter-grid,
  .deals-filter-grid,
  .commercial-filter-grid,
  .catalog-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .payment-forecast-details-drawer,
  .lead-details-drawer,
  .deal-details-drawer,
  .proposal-details-drawer,
  .agreement-details-drawer {
    inset: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
  }
}

@media (max-width: 768px) {
  .company-page-header,
  .contacts-page-header,
  .leads-page-header,
  .deals-page-header,
  .commercial-page-header,
  .catalog-page-header,
  .catalog-table-header {
    flex-direction: column;
    align-items: stretch;
  }
  .company-header-actions,
  .contacts-header-actions,
  .leads-header-actions,
  .deals-header-actions,
  .commercial-header-actions,
  .catalog-toolbar { width: 100%; }
  .company-summary-grid,
  .contacts-summary-grid,
  .contacts-kpi-grid,
  .leads-analytics-grid,
  .deals-analytics-grid,
  .commercial-kpi-grid,
  .catalog-kpi-grid,
  .company-filter-grid,
  .contacts-filter-grid,
  .leads-filter-grid,
  .deals-filter-grid,
  .commercial-filter-grid,
  .catalog-toolbar,
  .modern-crm-form-grid,
  .proposal-form-grid,
  .agreement-form-grid,
  .proposal-signatory-grid,
  .agreement-signature-grid { grid-template-columns: 1fr !important; }
  .crm-field-full,
  .form-field-full,
  .proposal-span-2,
  .agreement-span-2 { grid-column: auto !important; }
  .modern-crm-modal-content,
  .proposal-modern-content,
  .agreement-modern-content {
    width: calc(100vw - 20px) !important;
    max-height: 94vh !important;
    border-radius: 18px !important;
  }
  .modern-crm-modal-footer,
  .proposal-modal-footer,
  .agreement-modal-footer {
    align-items: stretch !important;
    flex-direction: column !important;
    padding: 14px 16px !important;
  }
  .modern-crm-footer-actions,
  .proposal-footer-actions,
  .agreement-footer-actions { width: 100%; }
  .modern-crm-modal-footer .btn,
  .proposal-modal-footer .btn,
  .agreement-modal-footer .btn { flex: 1 1 auto; }
}

@media (max-width: 560px) {
  .company-page-shell,
  .contacts-page-shell,
  .leads-page-shell,
  .deals-page-shell,
  .commercial-page-shell,
  .catalog-page-shell { padding-left: 10px !important; padding-right: 10px !important; }
  .company-header-actions > *,
  .contacts-header-actions > *,
  .leads-header-actions > *,
  .deals-header-actions > *,
  .commercial-header-actions > *,
  .catalog-toolbar > *,
  .company-filter-clear .btn,
  .contacts-filter-clear .btn,
  .leads-filter-clear .btn,
  .deals-filter-clear .btn,
  .commercial-filter-clear .btn { width: 100%; justify-content: center; }
  .company-table-wrap th,
  .company-table-wrap td,
  .contacts-table-wrap th,
  .contacts-table-wrap td,
  .leads-table-wrap th,
  .leads-table-wrap td,
  .deals-table-wrap th,
  .deals-table-wrap td,
  .commercial-table-wrap th,
  .commercial-table-wrap td,
  .catalog-table-wrap th,
  .catalog-table-wrap td { padding: 8px 10px !important; font-size: 12px !important; }
  .modern-crm-modal-header,
  .proposal-modal-header,
  .agreement-modal-header { padding: 16px !important; }
  .modern-crm-scroll-body,
  .proposal-modal-scroll,
  .agreement-scroll-body { padding: 14px !important; }
}

/* Keep CRM accents in InCheck blue (no purple accents in scoped CRM modules). */
#companyView .company-summary-card--violet .company-summary-icon,
#contactsView .contacts-summary-card--violet .contacts-summary-icon,
#contactsView .contact-avatar--violet,
#leadsView .leads-kpi-card--violet .leads-kpi-icon,
#leadsView .leads-kpi-card--percent .leads-kpi-icon,
#leadsView .lead-avatar--violet,
#dealsView .deals-kpi-card--violet .deals-kpi-icon,
#dealsView .deals-kpi-card--purple .deals-kpi-icon,
#dealsView .deal-avatar--violet,
.commercial-modern-workspace .commercial-kpi-card--violet .commercial-kpi-icon,
.catalog-modern-workspace .catalog-kpi-card--violet .catalog-kpi-icon {
  background: #dbeafe !important;
  color: #1d4ed8 !important;
}
.commercial-modern-workspace .commercial-status-row--violet .commercial-status-dot {
  background: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, .12) !important;
}
.commercial-modern-workspace .commercial-status-row--violet .commercial-status-fill,
#dealsView .deals-status-fill,
#leadsView .leads-status-fill {
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
}
.proposal-catalog-save-btn,
.catalog-primary-btn,
.commercial-primary-btn,
.leads-primary-btn,
.deals-primary-btn {
  background: linear-gradient(135deg, #2563eb, #1d4ed8) !important;
  border-color: #1d4ed8 !important;
}

/* Modern topbar overrides for legacy shared button/badge styles. */
#appHeader .topbar-icon-btn.theme-toggle-btn{
  width:46px;
  height:46px;
  min-width:46px;
  padding:0;
  border-radius:14px;
}
#appHeader .topbar-badge.notification-unread-badge{
  background:#ef4444;
  font-size:10px;
  font-weight:800;
}
@media (max-width:560px){
  #appHeader .topbar-icon-btn.theme-toggle-btn{
    width:40px;
    height:40px;
    min-width:40px;
    border-radius:13px;
  }
}

/* Shared create/edit modal viewport scrolling fix */
body.modal-open { overflow: hidden; }

.modal.modern-crm-modal[aria-hidden="true"],
.modal.proposal-modern-modal[aria-hidden="true"],
.modal.agreement-modern-modal[aria-hidden="true"],
.modal.proposal-catalog-form-modal[aria-hidden="true"] {
  display: none !important;
}

.modal.modern-crm-modal[aria-hidden="false"],
.modal.proposal-modern-modal[aria-hidden="false"],
.modal.agreement-modern-modal.open,
.modal.proposal-catalog-form-modal[aria-hidden="false"] {
  display: flex !important;
}

.modal-overlay,
.crm-modal-overlay,
.modern-modal-overlay,
.proposal-modal-overlay,
.agreement-modal-overlay,
.modal.modern-crm-modal,
.modal.proposal-modern-modal,
.modal.agreement-modern-modal,
.modal.proposal-catalog-form-modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(15, 23, 42, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  overflow: hidden;
}

.modern-crm-modal-content,
.modern-crm-modal .modern-crm-modal-content,
.modern-modal,
.proposal-modern-content,
.agreement-modern-content,
.proposal-catalog-modal-content,
.catalog-modern-modal {
  width: min(96vw, 1200px);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #ffffff;
  border-radius: 20px;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.22);
}

.modern-crm-modal-header,
.modern-modal-header,
.proposal-modal-header,
.agreement-modal-header,
.proposal-catalog-modal-header {
  flex: 0 0 auto;
}

.modern-crm-form,
.proposal-modern-form,
.agreement-modern-form,
.proposal-catalog-form {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  max-height: none;
}

.modern-crm-modal-body,
.modern-crm-scroll-body,
.modern-modal-body,
.proposal-modal-body,
.proposal-modal-scroll,
.agreement-modal-body,
.agreement-scroll-body,
.catalog-modal-body,
.proposal-catalog-form-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 20px 24px;
  -webkit-overflow-scrolling: touch;
}

.modern-crm-modal-footer,
.modern-modal-footer,
.proposal-modal-footer,
.agreement-modal-footer,
.proposal-catalog-modal-footer {
  flex: 0 0 auto;
  position: static;
  border-top: 1px solid #e5e7eb;
  background: #ffffff;
  padding: 16px 24px;
}

.proposal-catalog-info-callout { flex: 0 0 auto; }

.modal-table-scroll,
.agreement-items-scroll,
.proposal-items-scroll,
.proposal-table-wrap,
.agreement-table-wrap {
  width: 100%;
  overflow-x: auto !important;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
}

.modal-table-scroll table,
.agreement-items-scroll table,
.proposal-items-scroll table,
.proposal-table-wrap table,
.agreement-table-wrap table {
  min-width: 900px;
}

@media (max-width: 768px) {
  .modal-overlay,
  .crm-modal-overlay,
  .modern-modal-overlay,
  .proposal-modal-overlay,
  .agreement-modal-overlay,
  .modal.modern-crm-modal,
  .modal.proposal-modern-modal,
  .modal.agreement-modern-modal,
  .modal.proposal-catalog-form-modal {
    align-items: stretch;
    padding: 10px;
  }

  .modern-crm-modal-content,
  .modern-modal,
  .proposal-modern-content,
  .agreement-modern-content,
  .proposal-catalog-modal-content,
  .catalog-modern-modal {
    width: 100% !important;
    max-height: calc(100vh - 20px) !important;
    border-radius: 16px;
  }

  .modern-crm-modal-body,
  .modern-crm-scroll-body,
  .modern-modal-body,
  .proposal-modal-body,
  .proposal-modal-scroll,
  .agreement-modal-body,
  .agreement-scroll-body,
  .catalog-modal-body,
  .proposal-catalog-form-grid {
    padding: 16px;
  }

  .modern-crm-modal-footer,
  .modern-modal-footer,
  .proposal-modal-footer,
  .agreement-modal-footer,
  .proposal-catalog-modal-footer {
    padding: 12px 16px;
  }
}

/* Company modal stacking: edit stays below verification when both are open. */
.company-edit-modal-backdrop,
.modal-backdrop.company-edit-backdrop {
  z-index: 4000;
}

.company-edit-modal,
.modal.company-edit-modal {
  z-index: 4010;
}

.company-verification-modal-backdrop,
.modal-backdrop.company-verification-backdrop {
  z-index: 5000;
}

.company-verification-modal,
.modal.company-verification-modal {
  z-index: 5010;
}

/* =========================================================
   INVOICES MODULE - MODERN DASHBOARD + FORM UI
   ========================================================= */
.invoices-workspace{
  --invoice-blue:#2563eb;
  --invoice-blue-dark:#1d4ed8;
  --invoice-blue-soft:#eff6ff;
  --invoice-green:#16a34a;
  --invoice-red:#ef4444;
  --invoice-amber:#f59e0b;
  --invoice-purple:#7c3aed;
  --invoice-slate:#64748b;
}
.invoices-page-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
}
.invoices-title-block{
  display:flex;
  align-items:center;
  gap:12px;
}
.invoices-title-icon,
.invoice-form-title-icon{
  width:38px;height:38px;border-radius:12px;
  display:inline-flex;align-items:center;justify-content:center;
  background:#eff6ff;color:#2563eb;border:1px solid #dbeafe;
  font-weight:900;
}
.invoices-title-block h2{
  margin:0;color:var(--text);font-size:28px;letter-spacing:-.04em;font-weight:900;
}
.invoices-title-block p{
  margin:4px 0 0;color:var(--muted);font-size:13px;
}
.invoices-page-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end;}
.invoice-modern-btn{border-radius:12px;min-height:40px;font-weight:800;box-shadow:0 10px 24px rgba(15,23,42,.08);}
.invoice-modern-primary{background:#2563eb!important;color:#fff!important;border-color:#2563eb!important;box-shadow:0 16px 28px rgba(37,99,235,.24)!important;}
.invoice-kpi-grid{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin-bottom:14px;
}
.invoice-kpi-card{
  min-height:104px;border:1px solid #e2e8f0;border-radius:16px;background:var(--card);
  display:flex;align-items:center;gap:14px;padding:18px 20px;
  box-shadow:0 10px 28px rgba(15,23,42,.06);cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.invoice-kpi-card:hover{transform:translateY(-2px);border-color:#93c5fd;box-shadow:0 18px 36px rgba(15,23,42,.10);}
.invoice-kpi-card.kpi-filter-active{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.16),0 18px 36px rgba(15,23,42,.10);}
.invoice-kpi-icon{
  width:50px;height:50px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:900;flex:0 0 auto;
}
.invoice-kpi-card--blue .invoice-kpi-icon{background:#eff6ff;color:#2563eb;}
.invoice-kpi-card--green .invoice-kpi-icon{background:#dcfce7;color:#16a34a;}
.invoice-kpi-card--amber .invoice-kpi-icon{background:#fef3c7;color:#d97706;}
.invoice-kpi-card--purple .invoice-kpi-icon{background:#ede9fe;color:#7c3aed;}
.invoice-kpi-card--red .invoice-kpi-icon{background:#fee2e2;color:#ef4444;}
.invoice-kpi-copy{display:grid;gap:2px;min-width:0;}
.invoice-kpi-label{font-size:12px;font-weight:800;color:#475569;}
.invoice-kpi-value{font-size:28px;line-height:1;font-weight:950;color:#0f172a;}
.invoice-kpi-sub{font-size:12px;color:#64748b;}
:root:not([data-theme="light"]) .invoice-kpi-value{color:#f8fafc;}
:root:not([data-theme="light"]) .invoice-kpi-label,
:root:not([data-theme="light"]) .invoice-kpi-sub{color:#cbd5e1;}
.invoice-filter-card,
.invoice-table-card,
.invoice-insight-card{
  border:1px solid #e2e8f0;border-radius:16px;background:var(--card);
  box-shadow:0 10px 28px rgba(15,23,42,.06);
}
.invoice-filter-card{padding:18px;margin-bottom:14px;}
.invoice-filter-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:18px;}
.invoice-filter-grid{display:grid;grid-template-columns:minmax(260px,1.4fr) minmax(180px,.7fr) minmax(180px,.65fr);gap:14px;align-items:end;}
.invoice-filter-field{display:grid;gap:7px;}
.invoice-filter-field span{font-size:12px;font-weight:800;color:#334155;}
.invoice-modern-input,.invoice-modern-select,.invoice-filter-card .input,.invoice-filter-card .select{
  min-height:42px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;color:#0f172a;
}
.invoice-clear-filters-btn{min-height:42px;border-radius:10px;font-weight:800;}
.invoice-insight-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.invoice-insight-card{padding:16px 18px;}
.invoice-insight-title{font-size:14px;font-weight:900;color:var(--text);margin-bottom:12px;}
.invoice-insight-body{display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center;}
.invoice-mini-donut{
  --invoice-donut-color:#16a34a;
  width:100px;height:100px;border-radius:999px;display:grid;place-items:center;align-content:center;
  background:conic-gradient(var(--invoice-donut-color) calc(var(--invoice-donut-pct)*1%), #e5e7eb 0);
  position:relative;color:#0f172a;font-weight:900;
}
.invoice-insight-card--blue .invoice-mini-donut{--invoice-donut-color:#2563eb;}
.invoice-mini-donut::after{content:"";position:absolute;inset:14px;border-radius:inherit;background:var(--card);}
.invoice-mini-donut strong,.invoice-mini-donut span{position:relative;z-index:1;display:block;text-align:center;}
.invoice-mini-donut strong{font-size:22px;line-height:1;}
.invoice-mini-donut span{font-size:11px;color:#64748b;margin-top:2px;}
.invoice-insight-list{display:grid;gap:10px;}
.invoice-insight-row{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;}
.invoice-insight-row span{display:inline-flex;align-items:center;gap:8px;color:#334155;}
.invoice-insight-row strong{font-weight:800;color:#334155;}
.invoice-dot{width:8px;height:8px;border-radius:999px;display:inline-block;background:#64748b;}
.invoice-dot--green{background:#16a34a}.invoice-dot--blue{background:#2563eb}.invoice-dot--purple{background:#7c3aed}.invoice-dot--orange{background:#f97316}.invoice-dot--slate{background:#94a3b8}.invoice-dot--teal{background:#14b8a6}.invoice-dot--amber{background:#f59e0b}
.invoice-table-card{overflow:hidden;}
.invoice-table-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:16px 18px;border-bottom:1px solid #e2e8f0;}
.invoice-table-header strong{font-size:16px;font-weight:900;color:var(--text);}
.invoice-table-meta{font-size:12px;color:#64748b;}
.invoice-table-wrap{border:0;border-radius:0;max-height:560px;}
.invoice-modern-table{width:100%;border-collapse:separate;border-spacing:0;}
.invoice-modern-table thead th{position:sticky;top:0;background:#f8fafc;color:#475569;font-size:11px;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid #e2e8f0;z-index:2;}
.invoice-modern-table tbody td{padding:14px 12px;border-bottom:1px solid #e5e7eb;color:#0f172a;vertical-align:middle;}
.invoice-modern-table tbody tr:hover{background:#f8fbff;}
.invoice-number-link{color:#2563eb;font-weight:900;text-decoration:none;}
.invoice-number-link:hover{text-decoration:underline;}
.invoice-balance-cell{color:#ef4444;font-weight:800;}
.invoice-status-pill{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:900;line-height:1;background:#e2e8f0;color:#334155;white-space:nowrap;}
.invoice-status-pill--issued,.invoice-status-pill--sent{background:#dbeafe;color:#1d4ed8;}
.invoice-status-pill--paid,.invoice-status-pill--fully-paid{background:#dcfce7;color:#166534;}
.invoice-status-pill--partially-paid{background:#fef3c7;color:#92400e;}
.invoice-status-pill--overdue,.invoice-status-pill--not-paid{background:#fee2e2;color:#991b1b;}
.invoice-status-pill--draft{background:#f1f5f9;color:#475569;}
.invoice-row-actions{display:flex;gap:8px;align-items:center;flex-wrap:nowrap;}
.invoice-action-view{border-color:#bfdbfe!important;color:#2563eb!important;border-radius:9px!important;font-weight:900!important;}
.invoice-icon-action{min-width:34px!important;width:34px!important;padding:6px!important;border-radius:9px!important;}

/* Invoice modal/form */
.invoice-modern-modal{z-index:160;align-items:flex-start;overflow:auto;padding:18px;background:rgba(15,23,42,.62);backdrop-filter:blur(8px);}
.invoice-modern-form-content{width:min(1180px,96vw)!important;max-width:min(1180px,96vw)!important;max-height:none!important;margin:0 auto 24px;border-radius:18px!important;background:#fff!important;color:#0f172a!important;box-shadow:0 28px 80px rgba(15,23,42,.28)!important;padding:0!important;overflow:hidden!important;}
.invoice-form-shell-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 22px;border-bottom:1px solid #e2e8f0;background:linear-gradient(135deg,#fff 0%,#f8fbff 65%,#eff6ff 100%);}
.invoice-form-title-wrap{display:flex;gap:12px;align-items:flex-start;}
.invoice-form-title-wrap h2{margin:0;font-size:20px;font-weight:950;letter-spacing:-.03em;color:#0f172a;}
.invoice-form-title-wrap p{margin:4px 0 0;color:#64748b;font-size:12px;}
.invoice-form-close{width:34px;height:34px;border:1px solid #cbd5e1!important;border-radius:999px!important;background:#fff!important;display:inline-flex;align-items:center;justify-content:center;font-size:16px!important;}
.invoice-modern-form{padding:18px 20px 0;display:grid;gap:12px;max-height:calc(100vh - 90px);overflow:auto;}
.invoice-form-section{border:1px solid #e2e8f0;border-radius:14px;background:#fff;padding:14px;box-shadow:0 8px 20px rgba(15,23,42,.04);}
.invoice-form-section-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px;}
.invoice-form-section-title>span{width:28px;height:28px;border-radius:9px;background:#eff6ff;color:#2563eb;border:1px solid #dbeafe;display:inline-flex;align-items:center;justify-content:center;font-weight:900;flex:0 0 auto;}
.invoice-form-section-title strong{display:block;font-size:14px;font-weight:950;color:#0f172a;margin:0;}
.invoice-form-section-title p{margin:2px 0 0;color:#64748b;font-size:11px;}
.invoice-form-grid{display:grid;gap:12px;}
.invoice-form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr));}
.invoice-span-2{grid-column:1 / -1;}
.invoice-modern-form .filter-row{display:grid;gap:6px;}
.invoice-modern-form label.muted{font-size:11px;font-weight:800;color:#475569;}
.invoice-modern-form .input,.invoice-modern-form .select{min-height:38px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;color:#0f172a;}
.invoice-modern-form .readonly-field,.invoice-modern-form input[readonly]{background:#f8fafc;color:#334155;}
.invoice-customer-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px;padding:12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fbff;}
.invoice-sub-card{padding:12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc;margin-bottom:12px;display:grid;gap:8px;}
.invoice-sub-card label{font-size:12px;color:#334155;display:flex;gap:8px;align-items:center;}
.invoice-table-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 8px;}
.invoice-table-section-head strong{font-size:13px;color:#0f172a;font-weight:900;}
.invoice-form-table-wrap{max-height:260px;border-color:#e2e8f0;border-radius:12px;background:#fff;}
.invoice-form-table-wrap table th{background:#f8fafc;color:#64748b;text-transform:none;font-size:11px;}
.invoice-form-table-wrap table td{border-bottom:1px solid #e5e7eb;color:#0f172a;}
.invoice-items-block + .invoice-items-block{margin-top:10px;}
.invoice-totals-grid .filter-row{position:relative;}
.invoice-grand-total-input{font-weight:950!important;color:#2563eb!important;}
.invoice-conclusion-field{display:flex;align-items:center;min-height:38px;background:#f8fafc!important;color:#0f172a!important;}
.invoice-schedule-control-grid{align-items:end;}
.invoice-manual-row{justify-content:end;}
.invoice-schedule-state{margin:0 0 8px;}
.invoice-form-footer-actions{position:sticky;bottom:0;display:flex;justify-content:space-between;gap:12px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid #e2e8f0;margin:6px -20px 0;padding:14px 20px;z-index:5;}
.invoice-form-footer-actions>div{display:flex;gap:10px;align-items:center;}
.invoice-form-footer-actions .btn{border-radius:10px;font-weight:900;min-height:38px;}
@media(max-width:1280px){.invoice-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr));}.invoice-insight-grid{grid-template-columns:1fr;}.invoice-filter-grid{grid-template-columns:1fr 1fr;}.invoice-clear-filters-btn{grid-column:1 / -1;}}
@media(max-width:760px){.invoices-page-header,.invoice-table-header,.invoice-form-footer-actions{flex-direction:column;align-items:stretch}.invoice-kpi-grid,.invoice-form-grid.two,.invoice-customer-summary,.invoice-filter-grid{grid-template-columns:1fr}.invoice-insight-body{grid-template-columns:1fr}.invoice-modern-modal{padding:8px}.invoice-modern-form{padding:12px;}.invoice-form-footer-actions{margin-left:-12px;margin-right:-12px;padding:12px}.invoice-form-footer-actions>div{width:100%;justify-content:space-between;}}

/* =========================================================
   Invoice action menu + responsive invoice form refinements
   ========================================================= */
.invoice-row-actions{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  min-width:118px;
}
.invoice-action-view{
  min-width:72px!important;
  justify-content:center!important;
  white-space:nowrap!important;
}
.invoice-action-more{
  width:36px!important;
  min-width:36px!important;
  height:36px!important;
  padding:0!important;
  border-radius:10px!important;
  font-size:18px!important;
  line-height:1!important;
  color:#334155!important;
  border-color:#cbd5e1!important;
  background:#fff!important;
}
.invoice-action-more:hover,
.invoice-row-menu.is-open .invoice-action-more{
  border-color:#2563eb!important;
  color:#2563eb!important;
  background:#eff6ff!important;
}
.invoice-row-menu{position:relative;display:inline-flex;align-items:center;z-index:10;}
.invoice-row-menu-panel{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  width:190px;
  display:none;
  padding:6px;
  border:1px solid #dbeafe;
  border-radius:12px;
  background:#fff;
  box-shadow:0 18px 45px rgba(15,23,42,.16);
  z-index:9999;
}
.invoice-row-menu.is-open .invoice-row-menu-panel{display:grid;gap:2px;}
.invoice-row-menu-item{
  width:100%;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#0f172a;
  padding:9px 10px;
  text-align:left;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.invoice-row-menu-item:hover{background:#eff6ff;color:#1d4ed8;}
.invoice-row-menu-item.danger{color:#dc2626;}
.invoice-row-menu-item.danger:hover{background:#fee2e2;color:#991b1b;}
.invoice-row-menu-empty{display:block;padding:9px 10px;color:#64748b;font-size:12px;}
.invoice-row-actions .communication-source-create-btn,
.invoice-number-link + .communication-source-create-btn{display:none!important;}
.invoice-modern-table td:last-child,
.invoice-modern-table th:last-child{position:sticky;right:0;background:inherit;z-index:3;box-shadow:-8px 0 16px rgba(255,255,255,.82);}
.invoice-modern-table thead th:last-child{z-index:4;background:#f8fafc;}
.invoice-modern-table tbody tr:hover td:last-child{background:#f8fbff;}

.invoice-modern-modal.open,
.invoice-modern-modal[aria-hidden="false"]{display:flex;}
.invoice-modern-modal{align-items:flex-start;justify-content:center;}
.invoice-modern-form-content{
  width:min(1220px,calc(100vw - 28px))!important;
  max-width:min(1220px,calc(100vw - 28px))!important;
}
.invoice-modern-form{
  max-height:calc(100dvh - 92px);
  overflow:auto;
  overscroll-behavior:contain;
}
.invoice-modern-form .input,
.invoice-modern-form .select,
.invoice-modern-form textarea{width:100%;max-width:100%;box-sizing:border-box;}
.invoice-form-table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;max-width:100%;}
.invoice-form-table-wrap table{min-width:760px;}
.invoice-form-section--schedule .invoice-form-table-wrap table{min-width:860px;}
.invoice-form-section--items .invoice-form-table-wrap table{min-width:920px;}
.invoice-customer-summary{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.invoice-totals-grid{grid-template-columns:repeat(2,minmax(0,1fr));}

@media(max-width:980px){
  .invoice-modern-form-content{width:calc(100vw - 18px)!important;max-width:calc(100vw - 18px)!important;border-radius:16px!important;}
  .invoice-form-grid.two,.invoice-totals-grid,.invoice-schedule-control-grid{grid-template-columns:1fr!important;}
  .invoice-form-section{padding:12px;}
  .invoice-table-header{gap:10px;}
  .invoice-row-menu-panel{right:0;}
}
@media(max-width:640px){
  .invoice-modern-modal{padding:0!important;align-items:stretch!important;}
  .invoice-modern-form-content{width:100vw!important;max-width:100vw!important;min-height:100dvh!important;margin:0!important;border-radius:0!important;}
  .invoice-form-shell-header{position:sticky;top:0;z-index:8;padding:14px 16px;}
  .invoice-form-title-wrap h2{font-size:18px;}
  .invoice-modern-form{padding:12px!important;gap:10px;max-height:calc(100dvh - 64px);}
  .invoice-form-section-title{align-items:flex-start;}
  .invoice-form-section-title p{display:none;}
  .invoice-customer-summary{grid-template-columns:1fr;}
  .invoice-form-footer-actions{position:sticky;bottom:0;margin:6px -12px 0!important;padding:12px!important;display:grid!important;grid-template-columns:1fr;gap:8px;}
  .invoice-form-footer-actions>div{width:100%;display:grid!important;grid-template-columns:1fr 1fr;gap:8px;}
  .invoice-form-footer-actions .btn{width:100%;justify-content:center;}
  .invoice-form-table-wrap{max-height:220px;}
}

/* Invoice actions dropdown must escape table/card clipping and stack above rows. */
.invoice-table-card,
.invoice-table-panel,
.invoice-table-container,
.invoice-table-wrapper,
.invoice-list-shell,
.invoice-card,
.invoice-grid-card,
.invoice-list-card,
.crm-table-card{
  position:relative;
  overflow:visible!important;
}
.invoice-table-wrap,
.invoice-table-scroll,
.invoice-table-responsive,
.table-responsive{
  overflow-x:auto!important;
  overflow-y:visible!important;
  position:relative;
}
.invoice-modern-table tbody,
.invoice-modern-table tr,
.invoice-modern-table td,
.invoice-actions-cell{
  overflow:visible!important;
}
.invoice-actions-cell{
  position:relative;
  z-index:5;
}
.invoice-actions-trigger,
.invoice-actions-more-btn,
.invoice-row-menu-trigger{
  position:relative;
  z-index:20;
}
.invoice-actions-dropdown,
.invoice-actions-menu,
.row-actions-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  min-width:190px;
  background:#ffffff;
  border:1px solid #dbe3f0;
  border-radius:14px;
  box-shadow:0 18px 42px rgba(15,23,42,0.18);
  padding:8px;
  z-index:9999;
  overflow:hidden;
}
.invoice-actions-menu.floating,
.invoice-row-menu-panel.floating{
  position:fixed!important;
  right:auto!important;
  top:auto;
  display:grid!important;
  gap:2px;
  z-index:99999!important;
}
.invoice-actions-dropdown button,
.invoice-actions-menu button,
.row-actions-dropdown button,
.invoice-actions-dropdown a,
.invoice-actions-menu a,
.row-actions-dropdown a{
  display:flex;
  align-items:center;
  width:100%;
  min-height:40px;
  padding:10px 12px;
  border:0;
  background:transparent;
  border-radius:10px;
  text-align:left;
  font-size:13px;
  font-weight:600;
  color:#1e293b;
  cursor:pointer;
}
.invoice-actions-dropdown button:hover,
.invoice-actions-menu button:hover,
.row-actions-dropdown button:hover,
.invoice-actions-dropdown a:hover,
.invoice-actions-menu a:hover,
.row-actions-dropdown a:hover{
  background:#f8fbff;
}
.invoice-actions-dropdown .danger,
.invoice-actions-menu .danger,
.row-actions-dropdown .danger{
  color:#dc2626;
}

/* Receipts modern dashboard + modal */
.receipts-modern-page{--receipt-blue:#2563eb;--receipt-blue-soft:#eff6ff;--receipt-border:#dbe3f0;--receipt-muted:#64748b;}
.receipts-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px;}
.receipts-title-block{display:flex;gap:12px;align-items:center}.receipts-title-icon,.receipt-form-title-icon{width:40px;height:40px;border-radius:14px;background:#eff6ff;color:#2563eb;border:1px solid #dbeafe;display:inline-flex;align-items:center;justify-content:center;font-weight:900}.receipts-title-block h2{margin:0;font-size:28px;font-weight:950;letter-spacing:-.04em}.receipts-title-block p{margin:4px 0 0;color:#64748b;font-size:13px}.receipts-page-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.receipt-modern-btn{border-radius:12px;min-height:40px;font-weight:850}.receipt-modern-primary{background:#2563eb!important;border-color:#2563eb!important;color:#fff!important;box-shadow:0 14px 26px rgba(37,99,235,.22)!important}
.receipt-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}.receipt-kpi-card{min-height:104px;border:1px solid #e2e8f0;border-radius:16px;background:#fff;display:flex;align-items:center;gap:14px;padding:18px 20px;box-shadow:0 10px 28px rgba(15,23,42,.06);cursor:pointer;transition:.16s}.receipt-kpi-card:hover{transform:translateY(-2px);border-color:#93c5fd}.receipt-kpi-card.kpi-filter-active{border-color:#2563eb;box-shadow:0 0 0 2px rgba(37,99,235,.16),0 18px 36px rgba(15,23,42,.10)}.receipt-kpi-icon{width:50px;height:50px;border-radius:16px;display:inline-flex;align-items:center;justify-content:center;font-size:22px;font-weight:900}.receipt-kpi-card--blue .receipt-kpi-icon{background:#eff6ff;color:#2563eb}.receipt-kpi-card--green .receipt-kpi-icon{background:#dcfce7;color:#16a34a}.receipt-kpi-card--purple .receipt-kpi-icon{background:#ede9fe;color:#7c3aed}.receipt-kpi-card--amber .receipt-kpi-icon{background:#fef3c7;color:#d97706}.receipt-kpi-copy{display:grid;gap:2px}.receipt-kpi-label{font-size:12px;font-weight:850;color:#475569}.receipt-kpi-value{font-size:28px;line-height:1;font-weight:950;color:#0f172a}.receipt-kpi-sub{font-size:12px;color:#64748b}
.receipt-filter-card,.receipt-analytics-card,.receipt-table-card{border:1px solid #e2e8f0;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.06)}.receipt-filter-card{padding:18px;margin-bottom:14px}.receipt-filter-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;font-size:18px}.receipt-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr)) auto;gap:14px;align-items:end}.receipt-filter-field{display:grid;gap:7px}.receipt-filter-field span{font-size:12px;font-weight:850;color:#334155}.receipt-filter-card .input,.receipt-filter-card .select{min-height:42px;border-radius:10px;border-color:#cbd5e1}.receipt-clear-filters-btn{min-height:42px;border-radius:10px;font-weight:850}.receipt-analytics-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:14px}.receipt-analytics-card{padding:16px 18px}.receipt-analytics-card>strong{font-size:14px;font-weight:950}.receipt-progress-list{display:grid;gap:10px;margin-top:12px}.receipt-progress-row>div:first-child{display:flex;justify-content:space-between;font-size:13px;color:#334155}.receipt-progress-track{height:8px;border-radius:999px;background:#e5e7eb;overflow:hidden;margin-top:5px}.receipt-progress-track span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#60a5fa,#2563eb)}
.receipt-table-card{position:relative;overflow:visible!important}.receipt-table-header{display:flex;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #e2e8f0}.receipt-table-header strong{font-size:16px;font-weight:950}.receipt-table-meta{font-size:12px;color:#64748b}.receipt-table-wrap{border:0;border-radius:0;max-height:560px;overflow-x:auto!important;overflow-y:visible!important;position:relative}.receipt-modern-table{width:100%;border-collapse:separate;border-spacing:0}.receipt-modern-table thead th{position:sticky;top:0;background:#f8fafc;color:#475569;font-size:11px;letter-spacing:.04em;text-transform:uppercase;border-bottom:1px solid #e2e8f0;z-index:2}.receipt-modern-table tbody td{padding:14px 12px;border-bottom:1px solid #e5e7eb;color:#0f172a;vertical-align:middle}.receipt-modern-table tbody tr:hover{background:#f8fbff}.receipt-number-link{color:#2563eb;font-weight:900;text-decoration:none}.receipt-number-link:hover{text-decoration:underline}.receipt-status-pill{display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;font-size:12px;font-weight:900;line-height:1;background:#f1f5f9;color:#475569;white-space:nowrap}.receipt-status-pill--issued{background:#dcfce7;color:#166534}.receipt-status-pill--received{background:#dbeafe;color:#1d4ed8}.receipt-status-pill--settlement{background:#e0f2fe;color:#075985}.receipt-status-pill--cancelled{background:#fee2e2;color:#991b1b}.receipt-row-actions{min-width:118px}.receipt-action-view{border-color:#bfdbfe!important;color:#2563eb!important;border-radius:9px!important;font-weight:900!important}.receipt-action-more{width:36px!important;min-width:36px!important;height:36px!important;padding:0!important;border-radius:10px!important;font-size:18px!important}.receipt-actions-floating{z-index:100000!important}
.receipt-modern-modal{z-index:160;align-items:flex-start;justify-content:center;overflow:auto;padding:18px;background:rgba(15,23,42,.62);backdrop-filter:blur(8px)}.receipt-modern-modal.open,.receipt-modern-modal[aria-hidden="false"]{display:flex}.receipt-modern-form-content{width:min(1220px,calc(100vw - 28px))!important;max-width:min(1220px,calc(100vw - 28px))!important;margin:0 auto 24px!important;border-radius:18px!important;background:#fff!important;color:#0f172a!important;box-shadow:0 28px 80px rgba(15,23,42,.28)!important;padding:0!important;overflow:hidden!important}.receipt-form-shell-header{display:flex;justify-content:space-between;gap:16px;padding:18px 22px;border-bottom:1px solid #e2e8f0;background:linear-gradient(135deg,#fff 0%,#f8fbff 65%,#eff6ff 100%)}.receipt-form-title-wrap{display:flex;gap:12px}.receipt-form-title-wrap h2{margin:0;font-size:20px;font-weight:950}.receipt-form-title-wrap p{margin:4px 0 0;color:#64748b;font-size:12px}.receipt-form-header-actions{display:flex;align-items:center;gap:10px}.receipt-id-badge{border:1px solid #bfdbfe;background:#eff6ff;color:#1d4ed8;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:900}.receipt-form-close{width:34px;height:34px;border:1px solid #cbd5e1!important;border-radius:999px!important;background:#fff!important}.receipt-modern-form{padding:18px 20px 0;display:grid;gap:12px;max-height:calc(100dvh - 92px);overflow:auto;overscroll-behavior:contain}.receipt-form-section{border:1px solid #e2e8f0;border-radius:14px;background:#fff;padding:14px;box-shadow:0 8px 20px rgba(15,23,42,.04)}.receipt-form-section-title{display:flex;gap:10px;align-items:flex-start;margin-bottom:12px}.receipt-form-section-title>span{width:28px;height:28px;border-radius:9px;background:#eff6ff;color:#2563eb;border:1px solid #dbeafe;display:inline-flex;align-items:center;justify-content:center;font-weight:900;flex:0 0 auto}.receipt-form-section-title strong{display:block;font-size:14px;font-weight:950}.receipt-form-section-title p{margin:2px 0 0;color:#64748b;font-size:11px}.receipt-form-grid{display:grid;gap:12px}.receipt-form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}.receipt-span-2{grid-column:1/-1}.receipt-modern-form .filter-row{display:grid;gap:6px}.receipt-modern-form label.muted{font-size:11px;font-weight:850;color:#475569}.receipt-modern-form .input,.receipt-modern-form .select,.receipt-modern-form textarea{width:100%;max-width:100%;box-sizing:border-box;min-height:38px;border-radius:10px;border:1px solid #cbd5e1;background:#fff;color:#0f172a}.receipt-modern-form input[readonly]{background:#f8fafc;color:#334155}.receipt-form-table-wrap{overflow:auto;-webkit-overflow-scrolling:touch;max-width:100%;max-height:270px;border-color:#e2e8f0;border-radius:12px;background:#fff}.receipt-form-table-wrap table{min-width:920px}.receipt-form-table-wrap table th{background:#f8fafc;color:#64748b;font-size:11px}.receipt-form-table-wrap table td{border-bottom:1px solid #e5e7eb;color:#0f172a}.receipt-section-subtotal{text-align:right;margin-top:10px;font-weight:950;color:#0f172a}.receipt-helper-text{font-size:11px}.receipt-form-footer-actions{position:sticky;bottom:0;display:flex;justify-content:space-between;gap:12px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-top:1px solid #e2e8f0;margin:6px -20px 0;padding:14px 20px;z-index:5}.receipt-form-footer-actions>div{display:flex;gap:10px;align-items:center}.receipt-form-footer-actions .btn{border-radius:10px;font-weight:900;min-height:38px}
@media(max-width:1180px){.receipt-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.receipt-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.receipt-clear-filters-btn{grid-column:1/-1}.receipt-analytics-grid{grid-template-columns:1fr}}
@media(max-width:760px){.receipts-page-header,.receipt-form-footer-actions{flex-direction:column;align-items:stretch}.receipt-kpi-grid,.receipt-filter-grid,.receipt-form-grid.two{grid-template-columns:1fr}.receipt-modern-modal{padding:0!important;align-items:stretch!important}.receipt-modern-form-content{width:100vw!important;max-width:100vw!important;min-height:100dvh!important;margin:0!important;border-radius:0!important}.receipt-form-shell-header{position:sticky;top:0;z-index:8;padding:14px 16px}.receipt-modern-form{padding:12px!important;max-height:calc(100dvh - 64px)}.receipt-form-section{padding:12px}.receipt-form-section-title p{display:none}.receipt-form-footer-actions{margin:6px -12px 0!important;padding:12px!important;display:grid!important;grid-template-columns:1fr}.receipt-form-footer-actions>div{width:100%;display:grid!important;grid-template-columns:1fr 1fr}.receipt-form-footer-actions .btn{width:100%;justify-content:center}.receipt-form-table-wrap{max-height:220px}}

/* Responsive receipt form modal shell */
.receipt-modal-backdrop,
.modal-backdrop.receipt-modal-backdrop,
.receipt-modern-modal {
  position: fixed;
  inset: 0;
  z-index: 6000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(15, 23, 42, 0.45);
  overflow: hidden;
}

.receipt-modern-modal.open,
.receipt-modern-modal[aria-hidden="false"] {
  display: flex;
}

.receipt-modal,
.modal.receipt-modal,
.receipt-modern-form-content {
  max-height: calc(100vh - 32px);
  overflow: hidden;
}

.receipt-form-modal-shell {
  display: flex;
  flex-direction: column;
  width: min(1180px, calc(100vw - 32px));
  max-width: min(1180px, calc(100vw - 32px)) !important;
  max-height: calc(100vh - 32px);
  background: #ffffff;
  border-radius: 18px;
  overflow: hidden;
}

.receipt-form-modal-header {
  flex: 0 0 auto;
  padding: 18px 22px;
  border-bottom: 1px solid #dbe3f0;
  background: #f8fbff;
}

.receipt-modern-form {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
}

.receipt-form-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 18px 22px 22px;
}

.receipt-form-modal-footer {
  flex: 0 0 auto;
  position: sticky;
  bottom: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 22px;
  border-top: 1px solid #dbe3f0;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(8px);
}

.receipt-form-footer-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  position: static;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  backdrop-filter: none;
}

.btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 16px;
  border: 0;
  border-radius: 10px;
  background: #2563eb;
  color: #ffffff;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.btn-primary:hover { background: #1d4ed8; }

.btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 16px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.btn-secondary:hover {
  background: #f8fafc;
  border-color: #94a3b8;
}

.receipt-form-section {
  border: 1px solid #dbe3f0;
  border-radius: 14px;
  background: #ffffff;
  padding: 14px;
  margin-bottom: 14px;
}

.receipt-section-table-wrap {
  width: 100%;
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
}

.receipt-section-table {
  width: 100%;
  border-collapse: collapse;
}

.receipt-section-table th,
.receipt-section-table td {
  padding: 10px 12px;
  border-bottom: 1px solid #e5e7eb;
  font-size: 12px;
  white-space: nowrap;
}

.receipt-section-subtotal {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 10px;
  font-size: 14px;
  font-weight: 900;
}

@media (max-width: 900px) {
  .receipt-form-modal-shell {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100vh - 16px);
    border-radius: 14px;
  }

  .receipt-form-modal-header { padding: 14px 16px; }
  .receipt-form-modal-body { padding: 14px 16px 18px; }
  .receipt-form-modal-footer { padding: 12px 16px; }

  .receipt-form-section-grid,
  .receipt-form-grid,
  .receipt-form-two-col {
    grid-template-columns: 1fr !important;
  }

  .receipt-form-table-wrap,
  .receipt-section-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .receipt-form-table,
  .receipt-section-table { min-width: 760px; }
}

@media (max-width: 520px) {
  .receipt-modern-modal { padding: 0; }

  .receipt-form-modal-shell {
    width: 100vw;
    max-width: 100vw !important;
    height: 100vh;
    max-height: 100vh;
    border-radius: 0;
  }

  .receipt-form-modal-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .receipt-form-footer-actions {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .receipt-form-modal-footer > .btn-secondary,
  .receipt-form-footer-actions .btn-secondary,
  .receipt-form-footer-actions .btn-primary { width: 100%; }
}

.receipt-form-modal-shell.receipt-modern-form-content {
  min-height: 0 !important;
}
.receipt-form-modal-shell.receipt-modern-form-content {
  margin: 0 !important;
}

/* Clear, always-visible module table footers for invoice and receipt pagination. */
.module-table-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border-top: 1px solid #e2e8f0;
  background: #ffffff;
  position: relative;
  z-index: 5;
}

.module-table-count {
  color: #64748b;
  font-size: 13px;
  font-weight: 600;
}

.module-pagination {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.module-pagination button {
  min-height: 36px;
  padding: 8px 12px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.module-pagination button:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #2563eb;
  color: #2563eb;
}

.module-pagination button:disabled {
  opacity: 0.45;
  cursor: not-allowed;
  background: #f8fafc;
}

.module-page-size {
  min-height: 36px;
  padding: 8px 10px;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  background: #ffffff;
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
}

.module-page-indicator {
  padding: 0 8px;
  color: #334155;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
}

.invoice-table-card,
.receipt-table-card,
.invoice-list-card,
.receipt-list-card,
.module-table-card {
  overflow: visible;
}

.invoice-table-scroll,
.receipt-table-scroll,
.table-responsive {
  overflow-x: auto;
  overflow-y: visible;
}

@media (max-width: 760px) {
  .module-table-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .module-pagination {
    justify-content: space-between;
    width: 100%;
  }

  .module-pagination button,
  .module-page-size {
    flex: 1;
  }

  .module-page-indicator {
    text-align: center;
    width: 100%;
    order: -1;
    padding-bottom: 6px;
  }
}

.sortable-table-header {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 800;
  text-transform: inherit;
  letter-spacing: inherit;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 0;
  cursor: pointer;
}

.sortable-table-header:hover,
.sortable-table-header.is-active {
  color: #2563eb;
}

.sortable-table-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14px;
  color: #64748b;
  font-size: 11px;
}

.sortable-table-header.is-active .sortable-table-icon {
  color: #2563eb;
}

.table-filter-row th {
  padding: 8px;
  background: #f8fafc;
  border-bottom: 1px solid #e2e8f0;
}

.table-column-filter {
  width: 100%;
  min-height: 32px;
  border: 1px solid #dbe3f0;
  border-radius: 8px;
  padding: 6px 8px;
  font-size: 12px;
  background: #ffffff;
}

/* Client module modern UI (isolated Client-specific selectors only) */
.clients-page-shell {
  --client-surface: rgba(15, 23, 42, 0.78);
  --client-surface-strong: rgba(15, 23, 42, 0.92);
  --client-border: rgba(148, 163, 184, 0.22);
  --client-accent: #38bdf8;
  --client-accent-strong: #2563eb;
  --client-muted: #94a3b8;
}

.clients-modern-card,
.client-detail-card {
  border: 1px solid var(--client-border);
  border-radius: 22px;
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.84));
  box-shadow: 0 20px 50px rgba(2, 6, 23, 0.22);
  overflow: hidden;
}

.clients-modern-header {
  padding: 4px 2px 16px;
  border-bottom: 1px solid var(--client-border);
}

.clients-modern-header strong,
.client-detail-modern h3 {
  letter-spacing: -0.02em;
}

.client-list-state,
.client-global-renewals {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 12px 8px 8px 0;
  padding: 7px 11px;
  border: 1px solid rgba(56, 189, 248, 0.2);
  border-radius: 999px;
  background: rgba(14, 165, 233, 0.08);
  color: #cbd5e1;
}

.client-table-modern {
  border-collapse: separate;
  border-spacing: 0 8px;
}

.client-table-modern thead th {
  color: #cbd5e1;
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-bottom: 0;
}

.client-table-modern tbody tr {
  background: rgba(15, 23, 42, 0.72);
  border: 1px solid var(--client-border);
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease;
}

.client-table-modern tbody tr:hover,
.client-table-row-active {
  transform: translateY(-1px);
  background: rgba(37, 99, 235, 0.12) !important;
  border-color: rgba(96, 165, 250, 0.42);
}

.client-table-modern tbody td {
  border-top: 1px solid var(--client-border);
  border-bottom: 1px solid var(--client-border);
  vertical-align: middle;
}

.client-table-modern tbody td:first-child {
  border-left: 1px solid var(--client-border);
  border-radius: 14px 0 0 14px;
}

.client-table-modern tbody td:last-child {
  border-right: 1px solid var(--client-border);
  border-radius: 0 14px 14px 0;
}

.client-table-subtext {
  margin-top: 3px;
  color: var(--client-muted);
  font-size: 12px;
}

.client-status-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 5px 10px;
  background: rgba(34, 197, 94, 0.12);
  color: #bbf7d0;
  border: 1px solid rgba(34, 197, 94, 0.26);
  font-size: 12px;
  font-weight: 700;
}

.client-detail-modern {
  display: block;
}

.client-detail-modern > div:first-child {
  padding: 18px;
  margin: -4px -4px 14px;
  border: 1px solid rgba(56, 189, 248, 0.18);
  border-radius: 20px;
  background: radial-gradient(circle at top left, rgba(56, 189, 248, 0.16), transparent 36%), rgba(15, 23, 42, 0.76);
}

.client-detail-tabs {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
  overflow-x: auto;
  padding: 6px 2px 12px;
  scrollbar-width: thin;
}

.client-detail-tab {
  white-space: nowrap;
  border-radius: 999px !important;
}

.client-detail-tab-active {
  background: linear-gradient(135deg, var(--client-accent-strong), var(--client-accent)) !important;
  color: #fff !important;
  border-color: transparent !important;
}

.client-detail-tab-panel {
  border: 1px solid var(--client-border);
  border-radius: 20px;
  padding: 14px;
  background: rgba(2, 6, 23, 0.18);
}

.client-overview-modern details,
.client-overview-modern > div,
.client-communications-card,
.client-renewals-modern,
.client-scheduled-modern,
.client-statement-modern {
  border-radius: 18px;
}

.client-kpi-grid {
  gap: 10px !important;
}

.client-kpi-grid > * {
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.8), rgba(15, 23, 42, 0.82)) !important;
}

.client-communications-card {
  border: 1px solid rgba(56, 189, 248, 0.2) !important;
  background: rgba(14, 165, 233, 0.07) !important;
}

.client-communications-title {
  color: #e0f2fe;
}

.client-communications-empty,
.client-empty-card {
  padding: 14px;
  border-radius: 14px;
  color: #cbd5e1;
  background: rgba(15, 23, 42, 0.46);
  border: 1px dashed rgba(148, 163, 184, 0.28);
}

.client-scheduled-filter-chips {
  padding: 8px;
  border: 1px solid var(--client-border);
  border-radius: 16px;
  background: rgba(15, 23, 42, 0.38);
}

.client-loading-card,
.client-loading-row {
  border-radius: 14px;
  background: linear-gradient(90deg, rgba(148, 163, 184, 0.12), rgba(148, 163, 184, 0.24), rgba(148, 163, 184, 0.12));
  background-size: 200% 100%;
  animation: client-loading-shimmer 1.2s ease-in-out infinite;
}

.client-loading-card {
  min-height: 72px;
}

.client-loading-row {
  min-height: 34px;
}

@keyframes client-loading-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

@media (max-width: 760px) {
  .clients-modern-header {
    gap: 12px;
  }

  .client-detail-modern > div:first-child {
    padding: 14px;
  }

  .client-detail-tab-panel {
    padding: 10px;
  }
}
/* Client module light mode clarity overrides (Client-specific only) */
:root[data-theme="light"] {
  --client-bg: #f4f7fb;
  --client-card-bg: #ffffff;
  --client-card-soft: #f8fafc;
  --client-border: #dbe3f0;
  --client-border-strong: #cbd5e1;
  --client-text: #0f172a;
  --client-muted: #64748b;
  --client-muted-strong: #475569;
  --client-primary: #2563eb;
  --client-primary-soft: #eff6ff;
  --client-success: #16a34a;
  --client-success-soft: #dcfce7;
  --client-warning: #f59e0b;
  --client-warning-soft: #fef3c7;
  --client-danger: #dc2626;
  --client-danger-soft: #fee2e2;
  --client-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

:root[data-theme="light"] .clients-page-shell,
:root[data-theme="light"] .client-detail-shell,
:root[data-theme="light"] .client-module-shell {
  --client-border: #dbe3f0;
  --client-muted: #64748b;
  --client-accent: var(--client-primary);
  --client-accent-strong: var(--client-primary);
  background: var(--client-bg);
  color: var(--client-text);
}

:root[data-theme="light"] .client-card,
:root[data-theme="light"] .clients-modern-card,
:root[data-theme="light"] .client-kpi-card,
:root[data-theme="light"] .client-detail-card,
:root[data-theme="light"] .client-communications-card,
:root[data-theme="light"] .client-renewals-card,
:root[data-theme="light"] .client-renewals-modern,
:root[data-theme="light"] .client-scheduled-card,
:root[data-theme="light"] .client-scheduled-modern,
:root[data-theme="light"] .client-statement-card,
:root[data-theme="light"] .client-statement-modern {
  background: var(--client-card-bg) !important;
  color: var(--client-text);
  border: 1px solid var(--client-border) !important;
  box-shadow: var(--client-shadow);
}

:root[data-theme="light"] .client-card:hover,
:root[data-theme="light"] .clients-modern-card:hover,
:root[data-theme="light"] .client-kpi-card:hover,
:root[data-theme="light"] .client-detail-card:hover {
  border-color: #bfdbfe !important;
  background: #ffffff !important;
  box-shadow: 0 16px 34px rgba(37, 99, 235, 0.12);
}

:root[data-theme="light"] .client-title,
:root[data-theme="light"] .client-detail-title,
:root[data-theme="light"] .client-section-title,
:root[data-theme="light"] .client-panel-title,
:root[data-theme="light"] .client-table-title,
:root[data-theme="light"] .client-detail-modern h3,
:root[data-theme="light"] .client-communications-title {
  color: var(--client-text);
}

:root[data-theme="light"] .client-subtitle,
:root[data-theme="light"] .client-muted,
:root[data-theme="light"] .client-helper,
:root[data-theme="light"] .client-meta,
:root[data-theme="light"] .client-empty-state,
:root[data-theme="light"] .client-table-subtext,
:root[data-theme="light"] .client-communications-empty {
  color: var(--client-muted);
}

:root[data-theme="light"] .client-meta strong,
:root[data-theme="light"] .client-kpi-value,
:root[data-theme="light"] .client-card-value {
  color: var(--client-text);
}

:root[data-theme="light"] .client-filter-card input,
:root[data-theme="light"] .client-filter-card select,
:root[data-theme="light"] .client-filter-card textarea,
:root[data-theme="light"] .clients-filter-card input,
:root[data-theme="light"] .clients-filter-card select,
:root[data-theme="light"] .clients-filter-card textarea {
  background: #ffffff;
  color: var(--client-text);
  border: 1px solid var(--client-border-strong);
}

:root[data-theme="light"] .client-filter-card input::placeholder,
:root[data-theme="light"] .clients-filter-card input::placeholder {
  color: #94a3b8;
}

:root[data-theme="light"] .client-filter-card input:focus,
:root[data-theme="light"] .client-filter-card select:focus,
:root[data-theme="light"] .clients-filter-card input:focus,
:root[data-theme="light"] .clients-filter-card select:focus {
  border-color: var(--client-primary);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.12);
  outline: none;
}

:root[data-theme="light"] .client-table,
:root[data-theme="light"] .clients-table,
:root[data-theme="light"] .client-table-modern {
  background: #ffffff;
  color: var(--client-text);
}

:root[data-theme="light"] .client-table th,
:root[data-theme="light"] .clients-table th,
:root[data-theme="light"] .client-table-modern thead th {
  background: #f8fafc;
  color: #334155;
  border-bottom: 1px solid var(--client-border);
}

:root[data-theme="light"] .client-table td,
:root[data-theme="light"] .clients-table td,
:root[data-theme="light"] .client-table-modern tbody td {
  color: var(--client-text);
  border-bottom: 1px solid #edf2f7;
}

:root[data-theme="light"] .client-table tr:hover,
:root[data-theme="light"] .clients-table tr:hover,
:root[data-theme="light"] .client-table-modern tbody tr:hover {
  background: #f8fbff;
}

:root[data-theme="light"] .client-table .amount,
:root[data-theme="light"] .clients-table .amount,
:root[data-theme="light"] .client-amount {
  color: #0f172a;
  font-weight: 700;
}

:root[data-theme="light"] .client-detail-tabs {
  background: #ffffff;
  border: 1px solid var(--client-border);
}

:root[data-theme="light"] .client-detail-tab {
  color: var(--client-muted-strong);
  background: transparent;
}

:root[data-theme="light"] .client-detail-tab:hover {
  color: var(--client-primary);
  background: var(--client-primary-soft);
}

:root[data-theme="light"] .client-detail-tab-active,
:root[data-theme="light"] .client-detail-tab.is-active,
:root[data-theme="light"] .client-detail-tab[aria-selected="true"] {
  color: #ffffff !important;
  background: var(--client-primary) !important;
  border-color: var(--client-primary) !important;
}

:root[data-theme="light"] .client-badge,
:root[data-theme="light"] .client-pill,
:root[data-theme="light"] .client-status-badge {
  border: 1px solid var(--client-border);
  background: #f8fafc;
  color: #334155;
}

:root[data-theme="light"] .client-badge-success,
:root[data-theme="light"] .client-pill-success,
:root[data-theme="light"] .client-status-paid,
:root[data-theme="light"] .client-status-active {
  background: var(--client-success-soft);
  color: #166534;
  border-color: #86efac;
}

:root[data-theme="light"] .client-badge-warning,
:root[data-theme="light"] .client-pill-warning,
:root[data-theme="light"] .client-status-pending,
:root[data-theme="light"] .client-status-upcoming {
  background: var(--client-warning-soft);
  color: #92400e;
  border-color: #fcd34d;
}

:root[data-theme="light"] .client-badge-danger,
:root[data-theme="light"] .client-pill-danger,
:root[data-theme="light"] .client-status-overdue,
:root[data-theme="light"] .client-status-unpaid {
  background: var(--client-danger-soft);
  color: #991b1b;
  border-color: #fca5a5;
}

:root[data-theme="light"] .client-badge-info,
:root[data-theme="light"] .client-pill-info,
:root[data-theme="light"] .client-status-partial {
  background: var(--client-primary-soft);
  color: #1d4ed8;
  border-color: #93c5fd;
}

:root[data-theme="light"] .client-action-btn,
:root[data-theme="light"] .clients-action-btn {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid var(--client-border-strong);
}

:root[data-theme="light"] .client-action-btn:hover,
:root[data-theme="light"] .clients-action-btn:hover {
  background: var(--client-primary-soft);
  color: var(--client-primary);
  border-color: #93c5fd;
}

:root[data-theme="light"] .client-primary-btn,
:root[data-theme="light"] .clients-primary-btn {
  background: var(--client-primary);
  color: #ffffff;
  border-color: var(--client-primary);
}

:root[data-theme="light"] .client-primary-btn:hover,
:root[data-theme="light"] .clients-primary-btn:hover {
  background: #1d4ed8;
  color: #ffffff;
}

:root[data-theme="light"] .client-empty-card,
:root[data-theme="light"] .client-empty-state {
  background: #f8fafc;
  color: var(--client-muted);
  border: 1px dashed var(--client-border-strong);
}

:root[data-theme="light"] .client-timeline-item {
  background: #ffffff;
  border: 1px solid var(--client-border);
}

:root[data-theme="light"] .client-timeline-title {
  color: var(--client-text);
}

:root[data-theme="light"] .client-timeline-meta {
  color: var(--client-muted);
}

:root[data-theme="light"] .client-timeline-dot {
  background: var(--client-primary);
  border: 3px solid #dbeafe;
}

:root[data-theme="light"] .client-detail-modern > div:first-child,
:root[data-theme="light"] .client-detail-tab-panel,
:root[data-theme="light"] .client-kpi-grid > *,
:root[data-theme="light"] .client-scheduled-filter-chips {
  background: var(--client-card-bg) !important;
  color: var(--client-text);
  border-color: var(--client-border) !important;
}

:root[data-theme="light"] .client-table-modern tbody tr {
  background: #ffffff;
  border-color: var(--client-border);
}

/* Credit Notes modern module UI */
:root {
  --cn-bg: #0f172a;
  --cn-card: #111827;
  --cn-card-soft: #1f2937;
  --cn-border: #334155;
  --cn-border-strong: #475569;
  --cn-text: #f8fafc;
  --cn-muted: #cbd5e1;
  --cn-primary: #60a5fa;
  --cn-primary-soft: rgba(96, 165, 250, 0.16);
  --cn-success: #22c55e;
  --cn-success-soft: rgba(34, 197, 94, 0.16);
  --cn-warning: #f59e0b;
  --cn-warning-soft: rgba(245, 158, 11, 0.18);
  --cn-danger: #f87171;
  --cn-danger-soft: rgba(248, 113, 113, 0.16);
  --cn-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
}

:root[data-theme="light"] {
  --cn-bg: #f4f7fb;
  --cn-card: #ffffff;
  --cn-card-soft: #f8fafc;
  --cn-border: #dbe3f0;
  --cn-border-strong: #cbd5e1;
  --cn-text: #0f172a;
  --cn-muted: #64748b;
  --cn-primary: #2563eb;
  --cn-primary-soft: #eff6ff;
  --cn-success: #16a34a;
  --cn-success-soft: #dcfce7;
  --cn-warning: #f59e0b;
  --cn-warning-soft: #fef3c7;
  --cn-danger: #dc2626;
  --cn-danger-soft: #fee2e2;
  --cn-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.credit-notes-page-shell { background: var(--cn-bg); color: var(--cn-text); padding: 18px; border-radius: 24px; display: grid; gap: 16px; }
.credit-notes-header { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.credit-notes-header h1 { margin: 0; font-size: clamp(28px, 4vw, 40px); letter-spacing: -0.04em; color: var(--cn-text); }
.credit-notes-header p { margin: 6px 0 0; color: var(--cn-muted); max-width: 760px; line-height: 1.5; }
.credit-notes-eyebrow { margin: 0 !important; color: var(--cn-primary) !important; font-size: 12px; text-transform: uppercase; letter-spacing: 0.16em; font-weight: 800; }
.credit-notes-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.credit-notes-kpi-card { background: linear-gradient(135deg, var(--cn-card), var(--cn-card-soft)); border: 1px solid var(--cn-border); border-radius: 18px; padding: 18px; box-shadow: var(--cn-shadow); display: flex; gap: 14px; align-items: center; min-height: 104px; }
.credit-notes-kpi-icon { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: var(--cn-primary-soft); color: var(--cn-primary); font-size: 22px; }
.credit-notes-kpi-label { color: var(--cn-muted); font-size: 13px; font-weight: 700; }
.credit-notes-kpi-value { color: var(--cn-text); font-size: 24px; font-weight: 900; margin-top: 5px; }
.credit-notes-toolbar, .credit-notes-table-card { background: var(--cn-card); border: 1px solid var(--cn-border); border-radius: 20px; box-shadow: var(--cn-shadow); }
.credit-notes-toolbar { padding: 14px; display: grid; grid-template-columns: minmax(240px, 1fr) 180px auto auto; gap: 10px; align-items: center; }
.credit-notes-search-wrap { display: flex; align-items: center; gap: 8px; background: var(--cn-card-soft); border: 1px solid var(--cn-border-strong); border-radius: 14px; padding: 0 12px; }
.credit-notes-input, .credit-notes-select, .credit-note-input, .credit-notes-filter-row input, .credit-notes-filter-row select { width: 100%; min-height: 42px; border: 1px solid var(--cn-border-strong); background: var(--cn-card); color: var(--cn-text); border-radius: 12px; padding: 9px 11px; outline: none; }
.credit-notes-search-wrap .credit-notes-input { border: 0; background: transparent; padding-left: 0; }
.credit-notes-input::placeholder, .credit-note-input::placeholder, .credit-notes-filter-row input::placeholder { color: var(--cn-muted); opacity: 1; }
.credit-notes-action-btn, .credit-notes-primary-btn, .credit-note-secondary-btn, .credit-note-save-btn, .credit-notes-menu-btn { min-height: 40px; border-radius: 12px; border: 1px solid var(--cn-border-strong); padding: 0 14px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.credit-notes-action-btn, .credit-note-secondary-btn, .credit-notes-menu-btn { background: var(--cn-card); color: var(--cn-text); }
.credit-notes-primary-btn, .credit-note-save-btn { background: var(--cn-primary); color: #fff; border-color: var(--cn-primary); }
.credit-notes-table-card { overflow: visible; }
.credit-notes-table-header { padding: 16px 18px; border-bottom: 1px solid var(--cn-border); }
.credit-notes-table-header h2 { margin: 0; font-size: 18px; color: var(--cn-text); }
.credit-notes-state { color: var(--cn-muted); margin-top: 4px; }
.credit-notes-table-wrap { overflow-x: auto; }
.credit-notes-table { width: 100%; min-width: 1040px; border-collapse: separate; border-spacing: 0; color: var(--cn-text); }
.credit-notes-table th, .credit-notes-table td { padding: 13px 12px; text-align: left; border-bottom: 1px solid var(--cn-border); vertical-align: middle; }
.credit-notes-table th { background: var(--cn-card-soft); color: var(--cn-text); font-size: 12px; text-transform: uppercase; letter-spacing: 0.05em; }
.credit-notes-filter-row th { padding: 8px; background: var(--cn-card); }
.credit-notes-amount-filters { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.credit-notes-row-actions { display: flex; align-items: center; gap: 8px; position: relative; }
.credit-notes-menu { position: relative; }
.credit-notes-menu-list { display: none; position: absolute; right: 0; top: calc(100% + 6px); min-width: 190px; padding: 6px; background: var(--cn-card); border: 1px solid var(--cn-border); border-radius: 12px; box-shadow: var(--cn-shadow); z-index: 15; }
.credit-notes-menu:focus-within .credit-notes-menu-list, .credit-notes-menu:hover .credit-notes-menu-list { display: grid; gap: 4px; }
.credit-notes-menu-list button { text-align: left; border: 0; background: transparent; color: var(--cn-text); padding: 9px 10px; border-radius: 9px; cursor: pointer; }
.credit-notes-menu-list button:hover { background: var(--cn-primary-soft); color: var(--cn-primary); }
.cn-status-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 82px; padding: 6px 10px; border-radius: 999px; border: 1px solid; font-size: 12px; font-weight: 900; text-transform: capitalize; }
.cn-status-issued { background: var(--cn-success-soft); color: var(--cn-success); border-color: var(--cn-success); }
.cn-status-draft { background: var(--cn-primary-soft); color: var(--cn-primary); border-color: var(--cn-border-strong); }
.cn-status-cancelled, .cn-status-canceled { background: var(--cn-danger-soft); color: var(--cn-danger); border-color: var(--cn-danger); }
.credit-notes-pagination { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; color: var(--cn-muted); flex-wrap: wrap; }
.credit-notes-page-controls { display: flex; align-items: center; gap: 8px; }
.credit-notes-page-controls button, .credit-notes-page-controls select { border: 1px solid var(--cn-border-strong); background: var(--cn-card); color: var(--cn-text); border-radius: 10px; min-height: 36px; padding: 0 10px; }
.credit-notes-empty-state { padding: 34px; text-align: center; color: var(--cn-muted); background: var(--cn-card-soft); border: 1px dashed var(--cn-border-strong); border-radius: 16px; }
.credit-notes-skeleton-row span { display: block; height: 42px; border-radius: 12px; background: linear-gradient(90deg, var(--cn-card-soft), var(--cn-border), var(--cn-card-soft)); background-size: 220% 100%; animation: cn-shimmer 1.3s infinite; }
@keyframes cn-shimmer { to { background-position: -220% 0; } }
.credit-note-modal.open { display: flex; }
.credit-note-modal-shell { width: min(1100px, calc(100vw - 32px)); max-height: min(92dvh, 920px); background: var(--cn-card); color: var(--cn-text); border: 1px solid var(--cn-border); border-radius: 24px; box-shadow: var(--cn-shadow); display: flex; flex-direction: column; overflow: hidden; }
.credit-note-modal-header { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: center; padding: 18px 22px; border-bottom: 1px solid var(--cn-border); background: var(--cn-card-soft); }
.credit-note-modal-header h2 { margin: 0; color: var(--cn-text); font-size: 24px; }
.credit-note-modal-header p { margin: 4px 0 0; color: var(--cn-muted); }
.credit-note-modal-icon { width: 46px; height: 46px; border-radius: 16px; display: grid; place-items: center; background: var(--cn-primary-soft); color: var(--cn-primary); font-size: 24px; }
.credit-note-close-btn { border: 1px solid var(--cn-border-strong); background: var(--cn-card); color: var(--cn-text); width: 40px; height: 40px; border-radius: 12px; cursor: pointer; }
.credit-note-form-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(280px, 3fr); gap: 16px; padding: 18px; max-height: calc(92dvh - 154px); overflow: auto; }
.credit-note-form-main { display: grid; gap: 14px; }
.credit-note-form-section, .credit-note-summary-panel { background: var(--cn-card-soft); border: 1px solid var(--cn-border); border-radius: 18px; padding: 16px; }
.credit-note-form-section h3, .credit-note-summary-panel h3 { margin: 0 0 14px; color: var(--cn-text); font-size: 16px; }
.credit-note-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.credit-note-fields label { display: grid; gap: 6px; color: var(--cn-muted); font-weight: 800; font-size: 13px; }
.credit-note-field-wide { grid-column: 1 / -1; }
.credit-note-mini-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.credit-note-mini-card { background: var(--cn-card); border: 1px solid var(--cn-border); border-radius: 14px; padding: 12px; display: grid; gap: 5px; }
.credit-note-mini-card span, .credit-note-summary-row span { color: var(--cn-muted); font-size: 12px; }
.credit-note-mini-card strong, .credit-note-summary-row strong { color: var(--cn-text); overflow-wrap: anywhere; }
.credit-note-summary-panel { position: sticky; top: 0; align-self: start; }
.credit-note-summary-row { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--cn-border); }
.credit-note-summary-info { margin-top: 14px; padding: 12px; border-radius: 14px; background: var(--cn-primary-soft); color: var(--cn-text); border: 1px solid var(--cn-border); }
.credit-note-sticky-footer { position: sticky; bottom: 0; display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px; background: var(--cn-card); border-top: 1px solid var(--cn-border); }
.credit-note-input-error { border-color: var(--cn-danger) !important; box-shadow: 0 0 0 3px var(--cn-danger-soft); }
.credit-note-field-error { color: var(--cn-danger); font-size: 12px; font-weight: 800; }

@media (max-width: 1199px) {
  .credit-notes-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .credit-notes-toolbar { grid-template-columns: 1fr 1fr; }
  .credit-notes-search-wrap { grid-column: 1 / -1; }
  .credit-note-form-grid { grid-template-columns: 1fr; }
  .credit-note-summary-panel { position: static; }
  .credit-note-mini-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .credit-notes-page-shell { padding: 12px; border-radius: 16px; }
  .credit-notes-header { flex-direction: column; }
  .credit-notes-kpi-grid, .credit-notes-toolbar { grid-template-columns: 1fr; }
  .credit-notes-toolbar .credit-notes-action-btn, .credit-notes-toolbar .credit-notes-primary-btn { width: 100%; }
  .credit-note-modal { align-items: stretch; padding: 0; }
  .credit-note-modal-shell { width: 100%; height: 100dvh; max-height: 100dvh; border-radius: 0; }
  .credit-note-form-grid { max-height: calc(100dvh - 154px); padding: 12px; }
  .credit-note-fields, .credit-note-mini-grid { grid-template-columns: 1fr; }
  .credit-note-sticky-footer { justify-content: stretch; }
  .credit-note-sticky-footer button { flex: 1; padding-inline: 8px; }
}

@media (max-width: 520px) {
  .credit-notes-pagination, .credit-notes-page-controls { width: 100%; justify-content: space-between; }
  .credit-notes-row-actions { gap: 6px; }
  .credit-notes-action-btn, .credit-note-secondary-btn, .credit-note-save-btn { padding-inline: 10px; }
  .credit-note-modal-header { grid-template-columns: 1fr auto; }
  .credit-note-modal-icon { display: none; }
}

/* Payment Forecast dashboard refresh */
:root[data-theme="light"] {
  --pf-bg: #f4f7fb;
  --pf-card: #ffffff;
  --pf-card-soft: #f8fafc;
  --pf-border: #dbe3f0;
  --pf-border-strong: #cbd5e1;
  --pf-text: #0f172a;
  --pf-muted: #64748b;
  --pf-primary: #2563eb;
  --pf-primary-soft: #eff6ff;
  --pf-success: #16a34a;
  --pf-success-soft: #dcfce7;
  --pf-warning: #f59e0b;
  --pf-warning-soft: #fef3c7;
  --pf-danger: #dc2626;
  --pf-danger-soft: #fee2e2;
  --pf-purple: #7c3aed;
  --pf-purple-soft: #f3e8ff;
  --pf-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}
.payment-forecast-page{--pf-bg:var(--bg,#020617);--pf-card:var(--card,#020617);--pf-card-soft:rgba(148,163,184,.08);--pf-border:var(--border,#1f2937);--pf-border-strong:rgba(148,163,184,.35);--pf-text:var(--text,#e5e7eb);--pf-muted:var(--muted,#94a3b8);--pf-primary:var(--accent,#2563eb);--pf-primary-soft:rgba(37,99,235,.16);--pf-success:var(--ok,#16a34a);--pf-success-soft:rgba(22,163,74,.15);--pf-warning:var(--warn,#f59e0b);--pf-warning-soft:rgba(245,158,11,.16);--pf-danger:var(--danger,#dc2626);--pf-danger-soft:rgba(220,38,38,.14);--pf-purple:#7c3aed;--pf-purple-soft:rgba(124,58,237,.16);--pf-shadow:0 12px 28px rgba(0,0,0,.18);background:var(--pf-bg);color:var(--pf-text);padding:18px;border-radius:18px;overflow:hidden}.payment-forecast-page .pf-page-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:20px;border:1px solid var(--pf-border);border-radius:18px;background:linear-gradient(135deg,var(--pf-card),var(--pf-card-soft));box-shadow:var(--pf-shadow)}.payment-forecast-page .pf-page-header h2{margin:4px 0;font-size:clamp(26px,3vw,38px);color:var(--pf-text)}.payment-forecast-page .pf-page-header p,.payment-forecast-page .pf-state{color:var(--pf-muted)}.payment-forecast-page .pf-header-actions,.payment-forecast-page .pf-actions{display:flex;gap:8px;flex-wrap:wrap}.payment-forecast-page .pf-action-btn,.payment-forecast-page .pf-primary-btn,.payment-forecast-page .pf-ghost-btn{border:1px solid var(--pf-border-strong);border-radius:10px;padding:8px 11px;font-weight:800;font-size:12px;cursor:pointer;background:var(--pf-card);color:var(--pf-text);white-space:nowrap}.payment-forecast-page .pf-primary-btn{background:var(--pf-primary);border-color:var(--pf-primary);color:#fff}.payment-forecast-page .pf-ghost-btn{background:transparent;color:var(--pf-primary)}.payment-forecast-page .pf-action-btn:hover,.payment-forecast-page .pf-ghost-btn:hover{background:var(--pf-primary-soft)}.payment-forecast-page .pf-tabs{display:flex;gap:6px;overflow-x:auto;margin:16px 0;padding:6px;border:1px solid var(--pf-border);border-radius:999px;background:var(--pf-card-soft);scrollbar-width:thin}.payment-forecast-page .pf-tabs button{border:0;border-radius:999px;background:transparent;color:var(--pf-muted);padding:10px 16px;font-weight:900;white-space:nowrap;cursor:pointer}.payment-forecast-page .pf-tabs button.active{background:var(--pf-card);color:var(--pf-primary);box-shadow:var(--pf-shadow)}.payment-forecast-page .payment-forecast-summary-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin:16px 0}.payment-forecast-page .payment-forecast-summary-card,.payment-forecast-page .pf-tab-kpi,.payment-forecast-page .pf-panel,.payment-forecast-page .pf-widget,.payment-forecast-page .pf-filter-panel,.payment-forecast-page .pf-empty-card,.payment-forecast-page .pf-error-card{background:var(--pf-card);border:1px solid var(--pf-border);border-radius:16px;box-shadow:var(--pf-shadow);color:var(--pf-text)}.payment-forecast-page .payment-forecast-summary-card{min-height:130px;padding:16px}.payment-forecast-page .pf-kpi-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:var(--pf-primary-soft);font-size:18px}.payment-forecast-page .summary-label,.payment-forecast-page .pf-tab-kpi span{color:var(--pf-muted);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.payment-forecast-page .summary-value,.payment-forecast-page .pf-tab-kpi strong{display:block;color:var(--pf-text);font-size:clamp(22px,2vw,30px);font-weight:900;margin-top:8px}.payment-forecast-page .summary-subtitle,.payment-forecast-page .pf-tab-kpi small{color:var(--pf-muted)}.payment-forecast-page .pf-filter-panel{padding:16px;margin-bottom:12px}.payment-forecast-page .pf-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:10px}.payment-forecast-page .pf-input,.payment-forecast-page .pf-select{width:100%;border:1px solid var(--pf-border-strong);border-radius:10px;background:var(--pf-card);color:var(--pf-text);padding:10px 12px}.payment-forecast-page .pf-input::placeholder{color:var(--pf-muted)}.payment-forecast-page .pf-quick-filters{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:12px;color:var(--pf-text)}.payment-forecast-page .pf-quick-filters label{display:flex;align-items:center;gap:6px;font-weight:700}.payment-forecast-page .pf-tab-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin:0 0 14px}.payment-forecast-page .pf-tab-kpi{padding:14px}.payment-forecast-page .payment-forecast-overview-layout,.payment-forecast-page .payment-forecast-followup-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px}.payment-forecast-page .payment-forecast-risk-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px}.payment-forecast-page .pf-panel,.payment-forecast-page .pf-widget{padding:16px}.payment-forecast-page .pf-panel h3,.payment-forecast-page .pf-widget h3{margin:0 0 12px;color:var(--pf-text)}.payment-forecast-page .pf-widget-stack{display:grid;gap:14px}.payment-forecast-page .pf-widget-row{display:flex;justify-content:space-between;gap:10px;padding:7px 0;color:var(--pf-text)}.payment-forecast-page .pf-widget-row span{color:var(--pf-muted)}.payment-forecast-page .pf-widget-bar{height:7px;border-radius:999px;background:var(--pf-card-soft);overflow:hidden}.payment-forecast-page .pf-widget-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--pf-primary),var(--pf-purple));border-radius:inherit}.payment-forecast-page .payment-forecast-table-wrap{max-width:100%;overflow:auto;border:1px solid var(--pf-border);border-radius:14px;background:var(--pf-card)}.payment-forecast-page .payment-forecast-table{width:100%;min-width:1180px;border-collapse:separate;border-spacing:0}.payment-forecast-page .payment-forecast-table th{position:sticky;top:0;z-index:1;background:var(--pf-card-soft);color:var(--pf-muted);font-size:11px;text-align:left;text-transform:uppercase;letter-spacing:.06em}.payment-forecast-page .payment-forecast-table th,.payment-forecast-page .payment-forecast-table td{padding:12px 10px;border-bottom:1px solid var(--pf-border);vertical-align:top;color:var(--pf-text)}.payment-forecast-page .payment-forecast-table .num{text-align:right;white-space:nowrap}.payment-forecast-page .payment-forecast-table small{display:block;color:var(--pf-muted)}.payment-forecast-page .actions-cell{min-width:260px}.payment-forecast-page .pf-clickable-row:hover td{background:var(--pf-primary-soft)}.payment-forecast-page .pf-overdue-row td{background:var(--pf-danger-soft)}.payment-forecast-page .pf-critical-row td{background:rgba(220,38,38,.22)}.payment-forecast-page .pf-status-badge,.payment-forecast-page [class^="pf-priority-"]{display:inline-flex;align-items:center;border:1px solid transparent;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:900;white-space:nowrap}.payment-forecast-page .pf-status-paid,.payment-forecast-page .pf-followup-closed,.payment-forecast-page .pf-priority-low{background:var(--pf-success-soft);color:var(--pf-success);border-color:rgba(22,163,74,.25)}.payment-forecast-page .pf-status-partial,.payment-forecast-page .pf-status-due-soon,.payment-forecast-page .pf-followup-pending,.payment-forecast-page .pf-priority-medium{background:var(--pf-warning-soft);color:var(--pf-warning);border-color:rgba(245,158,11,.28)}.payment-forecast-page .pf-status-overdue,.payment-forecast-page .pf-priority-critical,.payment-forecast-page .pf-priority-high{background:var(--pf-danger-soft);color:var(--pf-danger);border-color:rgba(220,38,38,.28)}.payment-forecast-page .pf-status-unpaid,.payment-forecast-page .pf-status-upcoming,.payment-forecast-page .pf-followup-not-started{background:var(--pf-primary-soft);color:var(--pf-primary);border-color:rgba(37,99,235,.22)}.payment-forecast-page .pf-followup-in-progress{background:var(--pf-purple-soft);color:var(--pf-purple);border-color:rgba(124,58,237,.25)}.payment-forecast-page .pf-empty,.payment-forecast-page .pf-empty-card,.payment-forecast-page .pf-error-card{text-align:center;padding:34px;color:var(--pf-muted)}.payment-forecast-page .pf-error-card,.payment-forecast-page .pf-error-soft{background:var(--pf-danger-soft);border-color:rgba(220,38,38,.25);color:var(--pf-danger)}.payment-forecast-page .pf-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px;color:var(--pf-muted)}.payment-forecast-page .pf-pagination-showing{margin-right:auto;color:var(--pf-text);font-weight:900}.payment-forecast-page .payment-forecast-skeleton-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.payment-forecast-page .payment-forecast-skeleton-card,.payment-forecast-page .payment-forecast-skeleton-table{border-radius:16px;background:linear-gradient(90deg,var(--pf-card-soft),rgba(148,163,184,.18),var(--pf-card-soft));min-height:118px;animation:pf-shimmer 1.3s infinite}.payment-forecast-page .payment-forecast-skeleton-table{min-height:320px;margin-top:14px}@keyframes pf-shimmer{0%{opacity:.55}50%{opacity:1}100%{opacity:.55}}.payment-forecast-detail-drawer,.pf-detail-drawer,.payment-forecast-details-drawer{color:var(--pf-text)}
@media (max-width:1199px){.payment-forecast-page .payment-forecast-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.payment-forecast-page .pf-tab-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.payment-forecast-page .payment-forecast-overview-layout,.payment-forecast-page .payment-forecast-followup-layout{grid-template-columns:1fr}.payment-forecast-page .pf-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.payment-forecast-page .payment-forecast-risk-grid{grid-template-columns:1fr 1fr}}
@media (max-width:767px){.payment-forecast-page{padding:10px}.payment-forecast-page .pf-page-header{flex-direction:column}.payment-forecast-page .pf-header-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.payment-forecast-page .payment-forecast-summary-grid,.payment-forecast-page .pf-tab-kpi-grid,.payment-forecast-page .pf-filter-grid,.payment-forecast-page .payment-forecast-risk-grid{grid-template-columns:1fr}.payment-forecast-page .pf-tabs{border-radius:14px}.payment-forecast-page .pf-quick-filters{display:grid;grid-template-columns:1fr}.payment-forecast-page .payment-forecast-details-panel{width:100vw}.payment-forecast-page .actions-cell{min-width:180px}.payment-forecast-page .pf-actions{display:grid;grid-template-columns:1fr 1fr}.payment-forecast-page .pf-action-btn,.payment-forecast-page .pf-primary-btn,.payment-forecast-page .pf-ghost-btn{width:100%;text-align:center}}
@media (max-width:520px){.payment-forecast-page .payment-forecast-summary-card,.payment-forecast-page .pf-tab-kpi,.payment-forecast-page .pf-panel,.payment-forecast-page .pf-widget{padding:12px}.payment-forecast-page .summary-subtitle,.payment-forecast-page .pf-tab-kpi small{display:none}.payment-forecast-page .pf-header-actions,.payment-forecast-page .pf-actions{grid-template-columns:1fr}.payment-forecast-page .pf-pagination{display:grid;grid-template-columns:1fr;text-align:center}.payment-forecast-page .pf-pagination-showing{margin:0}.payment-forecast-page .payment-forecast-table th,.payment-forecast-page .payment-forecast-table td{padding:9px 8px}}

/* Monthly Renewal Forecast dashboard refresh */
:root[data-theme="light"] {
  --rf-bg: #f4f7fb;
  --rf-card: #ffffff;
  --rf-card-soft: #f8fafc;
  --rf-border: #dbe3f0;
  --rf-border-strong: #cbd5e1;
  --rf-text: #0f172a;
  --rf-muted: #64748b;
  --rf-primary: #2563eb;
  --rf-primary-soft: #eff6ff;
  --rf-success: #16a34a;
  --rf-success-soft: #dcfce7;
  --rf-warning: #f59e0b;
  --rf-warning-soft: #fef3c7;
  --rf-danger: #dc2626;
  --rf-danger-soft: #fee2e2;
  --rf-purple: #7c3aed;
  --rf-purple-soft: #f3e8ff;
  --rf-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}
.renewal-forecast-page{--rf-bg:var(--bg,#020617);--rf-card:var(--card,#111827);--rf-card-soft:rgba(148,163,184,.08);--rf-border:var(--border,#1f2937);--rf-border-strong:rgba(148,163,184,.35);--rf-text:var(--text,#e5e7eb);--rf-muted:var(--muted,#94a3b8);--rf-primary:var(--accent,#2563eb);--rf-primary-soft:rgba(37,99,235,.16);--rf-success:var(--ok,#16a34a);--rf-success-soft:rgba(22,163,74,.15);--rf-warning:var(--warn,#f59e0b);--rf-warning-soft:rgba(245,158,11,.16);--rf-danger:var(--danger,#dc2626);--rf-danger-soft:rgba(220,38,38,.14);--rf-purple:#7c3aed;--rf-purple-soft:rgba(124,58,237,.16);--rf-shadow:0 12px 28px rgba(0,0,0,.18);background:var(--rf-bg);color:var(--rf-text);padding:18px;border-radius:18px;overflow:hidden}.renewal-forecast-page .renewal-forecast-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding:22px;border:1px solid var(--rf-border);border-radius:20px;background:linear-gradient(135deg,var(--rf-card),var(--rf-card-soft));box-shadow:var(--rf-shadow)}.renewal-forecast-page .renewal-forecast-eyebrow{display:inline-flex;color:var(--rf-primary);font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.renewal-forecast-page .renewal-forecast-header h2{margin:6px 0;color:var(--rf-text);font-size:clamp(26px,3vw,40px);line-height:1.1}.renewal-forecast-page .renewal-forecast-header p,.renewal-forecast-page .rf-state,.renewal-forecast-page .rf-muted{color:var(--rf-muted)}.renewal-forecast-page .renewal-forecast-header-actions,.renewal-forecast-page .rf-actions{display:flex;gap:8px;flex-wrap:wrap}.renewal-forecast-page .rf-action-btn,.renewal-forecast-page .rf-primary-btn,.renewal-forecast-page .rf-ghost-btn{border:1px solid var(--rf-border-strong);border-radius:12px;padding:9px 13px;font-weight:900;font-size:12px;cursor:pointer;background:var(--rf-card);color:var(--rf-text);white-space:nowrap;text-decoration:none}.renewal-forecast-page .rf-primary-btn{background:var(--rf-primary);border-color:var(--rf-primary);color:#fff}.renewal-forecast-page .rf-ghost-btn{background:var(--rf-primary-soft);border-color:rgba(37,99,235,.24);color:var(--rf-primary)}.renewal-forecast-page .rf-action-btn:hover,.renewal-forecast-page .rf-ghost-btn:hover{background:var(--rf-primary-soft);transform:translateY(-1px)}.renewal-forecast-page .rf-action-btn:disabled,.renewal-forecast-page .rf-primary-btn:disabled{opacity:.55;cursor:not-allowed}.renewal-forecast-page .renewal-forecast-kpi-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:14px;margin:16px 0}.renewal-forecast-page .rf-kpi-card{position:relative;display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;min-height:132px;padding:16px;background:var(--rf-card);border:1px solid var(--rf-border);border-left:5px solid var(--rf-primary);border-radius:18px;box-shadow:var(--rf-shadow);color:var(--rf-text);overflow:hidden}.renewal-forecast-page .rf-kpi-success{border-left-color:var(--rf-success)}.renewal-forecast-page .rf-kpi-warning{border-left-color:var(--rf-warning)}.renewal-forecast-page .rf-kpi-danger{border-left-color:var(--rf-danger)}.renewal-forecast-page .rf-kpi-purple{border-left-color:var(--rf-purple)}.renewal-forecast-page .rf-kpi-muted{border-left-color:var(--rf-border-strong)}.renewal-forecast-page .rf-kpi-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:14px;background:var(--rf-primary-soft);font-size:19px}.renewal-forecast-page .rf-kpi-label{color:var(--rf-muted);font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.renewal-forecast-page .rf-kpi-value{margin-top:8px;color:var(--rf-text);font-size:clamp(22px,2vw,31px);font-weight:950;line-height:1.05}.renewal-forecast-page .rf-kpi-helper{margin-top:7px;color:var(--rf-muted);font-size:12px;line-height:1.35}.renewal-forecast-page .rf-filter-card,.renewal-forecast-page .rf-table-card,.renewal-forecast-page .rf-error-card{background:var(--rf-card);border:1px solid var(--rf-border);border-radius:18px;box-shadow:var(--rf-shadow);color:var(--rf-text)}.renewal-forecast-page .rf-filter-card{padding:16px;margin-bottom:14px}.renewal-forecast-page .rf-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.renewal-forecast-page .rf-filter-field{display:grid;gap:6px;color:var(--rf-muted);font-size:12px;font-weight:900}.renewal-forecast-page .rf-input,.renewal-forecast-page .rf-select{width:100%;min-height:42px;border:1px solid var(--rf-border-strong);border-radius:12px;background:var(--rf-card);color:var(--rf-text);padding:9px 11px;font-weight:700}.renewal-forecast-page .rf-input:focus,.renewal-forecast-page .rf-select:focus{outline:3px solid var(--rf-primary-soft);border-color:var(--rf-primary)}.renewal-forecast-page .rf-filter-actions{display:flex;justify-content:flex-end;margin-top:12px}.renewal-forecast-page .rf-state{margin:12px 2px;font-weight:800}.renewal-forecast-page .rf-table-card{overflow:hidden}.renewal-forecast-page .rf-table-heading{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:18px 18px 12px;border-bottom:1px solid var(--rf-border);background:var(--rf-card-soft)}.renewal-forecast-page .rf-table-heading h3{margin:0;color:var(--rf-text);font-size:20px}.renewal-forecast-page .rf-table-heading p{margin:5px 0 0;color:var(--rf-muted)}.renewal-forecast-page .rf-table-wrap{max-width:100%;overflow:auto;background:var(--rf-card)}.renewal-forecast-page .rf-table{width:100%;min-width:1120px;border-collapse:separate;border-spacing:0}.renewal-forecast-page .rf-table th{position:sticky;top:0;z-index:1;background:var(--rf-card-soft);color:var(--rf-muted);font-size:11px;text-align:left;text-transform:uppercase;letter-spacing:.06em}.renewal-forecast-page .rf-table th,.renewal-forecast-page .rf-table td{padding:13px 12px;border-bottom:1px solid var(--rf-border);vertical-align:middle;color:var(--rf-text)}.renewal-forecast-page .rf-table td small{display:block;margin-top:3px;color:var(--rf-muted)}.renewal-forecast-page .rf-clickable-row{cursor:pointer}.renewal-forecast-page .rf-clickable-row:hover td{background:var(--rf-primary-soft)}.renewal-forecast-page .rf-money{font-weight:950;white-space:nowrap}.renewal-forecast-page .rf-status-badge{display:inline-flex;align-items:center;justify-content:center;min-width:28px;border:1px solid transparent;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:950;white-space:nowrap}.renewal-forecast-page .rf-status-renewed{background:var(--rf-success-soft);color:var(--rf-success);border-color:rgba(22,163,74,.28)}.renewal-forecast-page .rf-status-pending,.renewal-forecast-page .rf-status-upcoming{background:var(--rf-primary-soft);color:var(--rf-primary);border-color:rgba(37,99,235,.25)}.renewal-forecast-page .rf-status-overdue{background:var(--rf-danger-soft);color:var(--rf-danger);border-color:rgba(220,38,38,.28)}.renewal-forecast-page .rf-status-no-renewal,.renewal-forecast-page .rf-status-canceled{background:var(--rf-warning-soft);color:var(--rf-warning);border-color:rgba(245,158,11,.3)}.renewal-forecast-page .rf-empty,.renewal-forecast-page .rf-error-card{text-align:center;padding:34px;color:var(--rf-muted)}.renewal-forecast-page .rf-error-card{background:var(--rf-danger-soft);border-color:rgba(220,38,38,.25);color:var(--rf-danger);font-weight:900}.renewal-forecast-page .rf-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px 16px;color:var(--rf-muted);background:var(--rf-card)}.renewal-forecast-page .rf-pagination-showing{margin-right:auto;color:var(--rf-text);font-weight:900}.renewal-forecast-page .rf-page-number{color:var(--rf-text);font-weight:800}.renewal-forecast-page .rf-skeleton-card,.renewal-forecast-page .rf-skeleton-row td{background:linear-gradient(90deg,var(--rf-card-soft),rgba(148,163,184,.2),var(--rf-card-soft));animation:rf-shimmer 1.3s ease-in-out infinite}.renewal-forecast-page .rf-skeleton-row td{height:54px}.renewal-forecast-details-panel{background:var(--rf-card,#111827)!important;color:var(--rf-text,#e5e7eb)!important;border:1px solid var(--rf-border,#1f2937)!important}.renewal-forecast-details-header{background:var(--rf-card-soft,rgba(148,163,184,.08));border-bottom:1px solid var(--rf-border,#1f2937)}.renewal-forecast-details-panel .rf-detail-summary{display:grid;grid-template-columns:auto repeat(4,minmax(130px,1fr));gap:12px;align-items:stretch;margin:0 0 14px}.renewal-forecast-details-panel .rf-detail-summary>div,.renewal-forecast-details-panel .rf-detail-summary>button{background:var(--rf-card-soft,rgba(148,163,184,.08));border:1px solid var(--rf-border,#1f2937);border-radius:14px;padding:12px}.renewal-forecast-details-panel .rf-detail-summary span{display:block;color:var(--rf-muted,#94a3b8);font-size:11px;font-weight:900;text-transform:uppercase}.renewal-forecast-details-panel .rf-detail-summary strong{display:block;color:var(--rf-text,#e5e7eb);margin-top:5px}.renewal-forecast-details-panel .rf-table-wrap{border:1px solid var(--rf-border,#1f2937);border-radius:16px}.renewal-forecast-details-panel .rf-table{min-width:1250px;background:var(--rf-card,#111827);color:var(--rf-text,#e5e7eb)}.renewal-forecast-details-panel .rf-actions{display:flex;flex-wrap:wrap;gap:6px;min-width:220px}.renewal-forecast-details-panel .rf-action-btn,.renewal-forecast-details-panel .rf-primary-btn,.renewal-forecast-details-panel .rf-ghost-btn{border:1px solid var(--rf-border-strong,rgba(148,163,184,.35));border-radius:10px;padding:7px 9px;font-weight:900;font-size:11px;background:var(--rf-card,#111827);color:var(--rf-text,#e5e7eb);cursor:pointer}.renewal-forecast-details-panel .rf-primary-btn{background:var(--rf-primary,#2563eb);border-color:var(--rf-primary,#2563eb);color:#fff}.renewal-forecast-details-panel .rf-ghost-btn{background:var(--rf-primary-soft,rgba(37,99,235,.16));color:var(--rf-primary,#2563eb)}
@keyframes rf-shimmer{0%{opacity:.55}50%{opacity:1}100%{opacity:.55}}
@media (max-width:1199px){.renewal-forecast-page .renewal-forecast-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.renewal-forecast-page .rf-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.renewal-forecast-details-panel .rf-detail-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:767px){.renewal-forecast-page{padding:10px}.renewal-forecast-page .renewal-forecast-header{flex-direction:column}.renewal-forecast-page .renewal-forecast-header-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.renewal-forecast-page .renewal-forecast-kpi-grid,.renewal-forecast-page .rf-filter-grid{grid-template-columns:1fr}.renewal-forecast-page .rf-action-btn,.renewal-forecast-page .rf-primary-btn,.renewal-forecast-page .rf-ghost-btn{width:100%;text-align:center}.renewal-forecast-page .rf-actions{display:grid;grid-template-columns:1fr 1fr}.renewal-forecast-page .rf-pagination{display:grid;grid-template-columns:1fr;text-align:center}.renewal-forecast-page .rf-pagination-showing{margin:0}.renewal-forecast-details-panel .rf-detail-summary{grid-template-columns:1fr}.renewal-forecast-details-panel .rf-actions{display:grid;grid-template-columns:1fr 1fr}.renewal-forecast-details-panel .rf-action-btn,.renewal-forecast-details-panel .rf-primary-btn,.renewal-forecast-details-panel .rf-ghost-btn{width:100%}}
@media (max-width:520px){.renewal-forecast-page .renewal-forecast-header,.renewal-forecast-page .rf-filter-card,.renewal-forecast-page .rf-table-heading,.renewal-forecast-page .rf-kpi-card{padding:12px}.renewal-forecast-page .rf-kpi-helper{display:none}.renewal-forecast-page .renewal-forecast-header-actions,.renewal-forecast-page .rf-actions{grid-template-columns:1fr}.renewal-forecast-page .rf-table th,.renewal-forecast-page .rf-table td{padding:9px 8px}.renewal-forecast-page .rf-kpi-card{min-height:96px}}
.renewal-forecast-details-panel .rf-table th{background:var(--rf-card-soft,rgba(148,163,184,.08));color:var(--rf-muted,#94a3b8);font-size:11px;text-align:left;text-transform:uppercase;letter-spacing:.06em}.renewal-forecast-details-panel .rf-table th,.renewal-forecast-details-panel .rf-table td{padding:12px 10px;border-bottom:1px solid var(--rf-border,#1f2937);vertical-align:top;color:var(--rf-text,#e5e7eb)}.renewal-forecast-details-panel .rf-money{font-weight:950;white-space:nowrap}.renewal-forecast-details-panel .rf-status-badge{display:inline-flex;align-items:center;justify-content:center;border:1px solid transparent;border-radius:999px;padding:4px 9px;font-size:11px;font-weight:950;white-space:nowrap}.renewal-forecast-details-panel .rf-status-renewed{background:var(--rf-success-soft,rgba(22,163,74,.15));color:var(--rf-success,#16a34a);border-color:rgba(22,163,74,.28)}.renewal-forecast-details-panel .rf-status-pending,.renewal-forecast-details-panel .rf-status-upcoming{background:var(--rf-primary-soft,rgba(37,99,235,.16));color:var(--rf-primary,#2563eb);border-color:rgba(37,99,235,.25)}.renewal-forecast-details-panel .rf-status-overdue{background:var(--rf-danger-soft,rgba(220,38,38,.14));color:var(--rf-danger,#dc2626);border-color:rgba(220,38,38,.28)}.renewal-forecast-details-panel .rf-status-no-renewal,.renewal-forecast-details-panel .rf-status-canceled{background:var(--rf-warning-soft,rgba(245,158,11,.16));color:var(--rf-warning,#f59e0b);border-color:rgba(245,158,11,.3)}.renewal-forecast-details-panel .rf-empty{padding:28px;text-align:center;color:var(--rf-muted,#94a3b8)}.renewal-forecast-details-panel .rf-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap;padding:14px;color:var(--rf-muted,#94a3b8)}.renewal-forecast-details-panel .rf-pagination-showing{margin-right:auto;color:var(--rf-text,#e5e7eb);font-weight:900}.renewal-forecast-details-panel .rf-page-number{color:var(--rf-text,#e5e7eb);font-weight:800}

/* Agreement pagination: keep controls visible outside the table scroll area. */
.agreements-table-card {
  overflow: hidden;
}

.agreements-table-wrap {
  max-width: 100%;
  overflow: auto;
}

.agreements-pagination-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border-top: 1px solid var(--border);
  background: var(--card);
  position: relative;
  z-index: 2;
  flex-wrap: wrap;
}

.agreements-pagination-info,
.agreements-page-size {
  color: var(--muted);
  font-weight: 700;
}

.agreements-pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.agreements-pagination-controls span {
  color: var(--text);
  font-weight: 800;
  white-space: nowrap;
}

.agreements-pagination-controls button {
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  color: var(--text);
  cursor: pointer;
  font-weight: 800;
}

.agreements-pagination-controls button:not(:disabled):hover {
  border-color: var(--accent);
  color: var(--accent);
}

.agreements-pagination-controls button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.agreements-page-size {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.agreements-page-size select {
  min-height: 36px;
  min-width: 82px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  color: var(--text);
  padding: 0 10px;
}

:root[data-theme="light"] .agreements-pagination-footer {
  background: #ffffff;
  color: #0f172a;
  border-top: 1px solid #dbe3f0;
}

:root[data-theme="light"] .agreements-pagination-info,
:root[data-theme="light"] .agreements-page-size {
  color: #475569;
}

:root[data-theme="light"] .agreements-pagination-controls button {
  background: #ffffff;
  color: #0f172a;
  border: 1px solid #cbd5e1;
}

:root[data-theme="light"] .agreements-pagination-controls button:not(:disabled):hover {
  background: #eff6ff;
  color: #2563eb;
  border-color: #93c5fd;
}

@media (max-width: 767px) {
  .agreements-pagination-footer {
    flex-direction: column;
    align-items: stretch;
  }

  .agreements-pagination-controls {
    justify-content: space-between;
    width: 100%;
  }

  .agreements-page-size {
    width: 100%;
  }

  .agreements-page-size select {
    width: 100%;
  }
}

/* Statement of Account — customer-friendly activity and installment layout */
.statement-section-heading,
.statement-subsection-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.statement-section-heading {
  margin-bottom: 12px;
}

.statement-section-heading h3 {
  margin: 0;
  font-size: 20px;
  line-height: 1.25;
}

.statement-section-heading p,
.statement-subsection-heading span {
  display: block;
  margin: 4px 0 0;
  color: var(--client-muted, #94a3b8);
  font-size: 12px;
  line-height: 1.45;
}

.statement-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.statement-summary-card {
  position: relative;
  overflow: hidden;
  min-height: 104px;
  padding: 15px 16px !important;
}

.statement-summary-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  border-radius: 18px 0 0 18px;
  background: #3b82f6;
}

.statement-summary-card.statement-summary-paid::before { background: #22c55e; }
.statement-summary-card.statement-summary-due::before { background: #f59e0b; }
.statement-summary-card.statement-summary-scheduled::before { background: #8b5cf6; }

.statement-summary-card .label {
  font-size: 12px;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.statement-summary-card .value {
  margin-top: 7px;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.1;
}

.statement-summary-sub {
  margin-top: 7px;
  color: var(--client-muted, #94a3b8);
  font-size: 11px;
}

.statement-filter-bar {
  display: grid;
  grid-template-columns: minmax(150px, .9fr) repeat(2, minmax(145px, .75fr)) minmax(220px, 1.25fr) auto auto auto;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding: 10px;
  border: 1px solid var(--client-border, rgba(148, 163, 184, .22));
  border-radius: 14px;
  background: rgba(15, 23, 42, .22);
}

.statement-subsection-heading {
  margin: 18px 0 8px;
}

.statement-subsection-heading strong {
  font-size: 15px;
}

.statement-activity-table-wrap {
  margin-top: 0 !important;
  border-radius: 14px;
  border: 1px solid var(--client-border, rgba(148, 163, 184, .22));
}

.statement-activity-table {
  min-width: 1040px;
}

.statement-activity-table thead th {
  white-space: nowrap;
}

.statement-activity-table tbody tr td {
  vertical-align: middle;
}

.statement-activity-table tbody tr.statement-row-invoice td:first-child {
  border-left: 3px solid #3b82f6;
}

.statement-activity-table tbody tr.statement-row-receipt td:first-child {
  border-left: 3px solid #22c55e;
}

.statement-activity-table tbody tr.statement-row-credit td:first-child {
  border-left: 3px solid #06b6d4;
}

.statement-activity-cell {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.statement-activity-cell strong {
  font-size: 12px;
}

.statement-activity-cell span {
  color: var(--client-muted, #94a3b8);
  font-size: 10px;
}

.statement-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 24px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}

.statement-status-paid { background: rgba(34, 197, 94, .16); color: #4ade80; border: 1px solid rgba(34, 197, 94, .28); }
.statement-status-partial { background: rgba(245, 158, 11, .16); color: #fbbf24; border: 1px solid rgba(245, 158, 11, .28); }
.statement-status-overdue { background: rgba(239, 68, 68, .16); color: #f87171; border: 1px solid rgba(239, 68, 68, .28); }
.statement-status-scheduled { background: rgba(139, 92, 246, .16); color: #c4b5fd; border: 1px solid rgba(139, 92, 246, .28); }
.statement-status-credit { background: rgba(6, 182, 212, .16); color: #67e8f9; border: 1px solid rgba(6, 182, 212, .28); }
.statement-status-issued { background: rgba(59, 130, 246, .16); color: #93c5fd; border: 1px solid rgba(59, 130, 246, .28); }

.statement-schedule-section {
  margin-top: 18px;
  padding-top: 2px;
}

.statement-schedule-heading {
  align-items: center;
}

.statement-schedule-summary {
  display: flex;
  gap: 7px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.statement-schedule-summary > span {
  margin: 0;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid var(--client-border, rgba(148, 163, 184, .22));
  background: rgba(15, 23, 42, .28);
  font-size: 10px;
  white-space: nowrap;
}

.statement-schedule-list {
  display: grid;
  gap: 10px;
}

.statement-schedule-group {
  overflow: hidden;
  border: 1px solid var(--client-border, rgba(148, 163, 184, .22));
  border-radius: 15px;
  background: rgba(15, 23, 42, .25);
}

.statement-schedule-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  background: rgba(59, 130, 246, .08);
  border-bottom: 1px solid var(--client-border, rgba(148, 163, 184, .22));
}

.statement-schedule-invoice {
  font-size: 14px;
  font-weight: 800;
}

.statement-schedule-group-meta {
  margin-top: 3px;
  color: var(--client-muted, #94a3b8);
  font-size: 11px;
}

.statement-schedule-balance {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 2px;
}

.statement-schedule-balance span,
.statement-schedule-label {
  color: var(--client-muted, #94a3b8);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .05em;
}

.statement-schedule-balance strong {
  font-size: 15px;
}

.statement-schedule-rows {
  display: grid;
}

.statement-schedule-row {
  display: grid;
  grid-template-columns: minmax(210px, 1.45fr) repeat(3, minmax(120px, .85fr)) minmax(110px, .75fr);
  gap: 12px;
  align-items: center;
  padding: 11px 14px;
}

.statement-schedule-row + .statement-schedule-row {
  border-top: 1px solid var(--client-border, rgba(148, 163, 184, .18));
}

.statement-schedule-row > div:not(.statement-schedule-installment) {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.statement-schedule-installment {
  display: flex;
  flex-direction: column;
  gap: 3px;
}

.statement-schedule-installment strong {
  font-size: 12px;
}

.statement-schedule-installment span {
  color: var(--client-muted, #94a3b8);
  font-size: 11px;
}

.statement-schedule-empty {
  padding: 18px;
  border: 1px dashed var(--client-border, rgba(148, 163, 184, .28));
  border-radius: 14px;
  color: var(--client-muted, #94a3b8);
  text-align: center;
}

:root[data-theme="light"] .statement-filter-bar,
:root[data-theme="light"] .statement-schedule-summary > span,
:root[data-theme="light"] .statement-schedule-group {
  background: #f8fafc;
}

:root[data-theme="light"] .statement-schedule-group-head {
  background: #eff6ff;
}

:root[data-theme="light"] .statement-status-paid { color: #166534; background: #dcfce7; border-color: #bbf7d0; }
:root[data-theme="light"] .statement-status-partial { color: #92400e; background: #fef3c7; border-color: #fde68a; }
:root[data-theme="light"] .statement-status-overdue { color: #991b1b; background: #fee2e2; border-color: #fecaca; }
:root[data-theme="light"] .statement-status-scheduled { color: #5b21b6; background: #ede9fe; border-color: #ddd6fe; }
:root[data-theme="light"] .statement-status-credit { color: #155e75; background: #cffafe; border-color: #a5f3fc; }
:root[data-theme="light"] .statement-status-issued { color: #1e40af; background: #dbeafe; border-color: #bfdbfe; }

@media (max-width: 1080px) {
  .statement-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .statement-filter-bar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .statement-schedule-row { grid-template-columns: minmax(190px, 1.3fr) repeat(2, minmax(110px, .8fr)); }
  .statement-schedule-row > div:nth-child(4),
  .statement-schedule-row > div:nth-child(5) { grid-column: auto; }
}

@media (max-width: 680px) {
  .statement-summary-grid { grid-template-columns: 1fr !important; }
  .statement-filter-bar { grid-template-columns: 1fr; }
  .statement-section-heading,
  .statement-subsection-heading,
  .statement-schedule-group-head { flex-direction: column; align-items: stretch; }
  .statement-schedule-summary { justify-content: flex-start; }
  .statement-schedule-balance { align-items: flex-start; }
  .statement-schedule-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .statement-schedule-installment { grid-column: 1 / -1; }
}


/* Leads responsive hardening - 2026-08-16 */
/* Keep every Leads workspace child constrained to the available CRM content width. */
#leadsView,
#leadsView .leads-page-shell,
#leadsView .leads-page-header,
#leadsView .leads-analytics,
#leadsView .leads-filter-card,
#leadsView .leads-status-card,
#leadsView .leads-table-panel,
#leadsView .leads-table-toolbar,
#leadsView .leads-table-toolbar-left {
  min-width:0;
  max-width:100%;
}
#leadsView .leads-page-shell {
  width:100%;
  overflow-x:hidden;
}
#leadsView .leads-page-header > *,
#leadsView .leads-header-actions,
#leadsView .leads-filter-field,
#leadsView .leads-status-row > * {
  min-width:0;
}

/* Fluid cards avoid tablet squeeze caused by viewport-only breakpoints. */
#leadsView .leads-analytics-grid {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));
}
#leadsView .leads-filter-grid {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));
}
#leadsView .leads-filter-clear {
  min-width:0;
}

/* Status distribution may shrink without pushing the whole page sideways. */
#leadsView .leads-status-bars {
  min-width:0;
}
#leadsView .leads-status-row {
  grid-template-columns:minmax(120px,170px) minmax(34px,42px) minmax(90px,1fr) minmax(42px,52px);
}

/* The table itself stays wide, but scrolling is isolated to the table card. */
#leadsView .leads-table-panel {
  overflow:hidden;
}
#leadsView .leads-table-wrap {
  width:calc(100% - 24px);
  max-width:calc(100% - 24px);
  overflow-x:auto;
  overflow-y:visible;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-inline:contain;
  touch-action:pan-x pan-y;
}
#leadsView .leads-table-wrap table {
  max-width:none;
}
#leadsView #leadsPaginationControls {
  min-width:0;
  max-width:100%;
}
#leadsView #leadsPaginationControls > .pagination {
  max-width:100%;
}

/* Lead create/edit dialog: keep header, body and footer usable on tablets and phones. */
#leadFormModal .modern-crm-modal-content {
  max-width:min(1180px,calc(100vw - 24px))!important;
}
#leadFormModal .modern-crm-header-left,
#leadFormModal .modern-crm-header-left > div,
#leadFormModal .modern-crm-scroll-body,
#leadFormModal .modern-crm-section-card {
  min-width:0;
  max-width:100%;
}
#leadFormModal .modern-crm-modal-title,
#leadFormModal .modern-crm-modal-subtitle,
#leadFormModal .crm-field {
  overflow-wrap:anywhere;
}

@media (max-width:900px) {
  #leadsView .leads-page-shell { padding:18px; gap:14px; }
  #leadsView .leads-status-bars { grid-template-columns:1fr; gap:10px; }
  #leadsView .leads-table-toolbar-left { gap:10px; }
  #leadsView #leadsPaginationControls { margin-left:0; width:100%; }
  #leadsView #leadsPaginationControls > .pagination { justify-content:flex-start; }
}

@media (max-width:640px) {
  #leadsView .leads-page-shell { padding:10px; gap:12px; }
  #leadsView .leads-page-header h1 { font-size:26px; }
  #leadsView .leads-header-actions { display:grid; grid-template-columns:1fr; width:100%; }
  #leadsView .leads-header-actions > * { width:100%; }
  #leadsView .leads-filter-card,
  #leadsView .leads-status-card { padding:14px; border-radius:14px; }
  #leadsView .leads-kpi-card { min-height:96px; padding:14px; gap:12px; }
  #leadsView .leads-kpi-icon { width:48px; height:48px; flex-basis:48px; font-size:22px; }
  #leadsView .leads-kpi-card .value { font-size:24px; }
  #leadsView .leads-status-row {
    grid-template-columns:minmax(0,1fr) auto;
    gap:6px 10px;
  }
  #leadsView .leads-status-track { grid-column:1 / -1; grid-row:2; }
  #leadsView .leads-status-count { text-align:right; }
  #leadsView .leads-status-meta { grid-column:1 / -1; text-align:left; }
  #leadsView .leads-table-toolbar { padding:12px 10px 8px; }
  #leadsView .leads-table-wrap { margin:0 8px 8px; width:calc(100% - 16px); max-width:calc(100% - 16px); }
  #leadsView #leadsPaginationControls > .pagination { gap:6px; }
  #leadsView #leadsPaginationControls .chip-btn { flex:1 1 auto; min-width:0; padding:0 8px; }
  #leadsView #leadsPaginationControls .input { max-width:100%; }

  #leadFormModal.modern-crm-modal { padding:0; align-items:stretch; }
  #leadFormModal .modern-crm-modal-content {
    width:100vw;
    max-width:100vw!important;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
    border-left:0;
    border-right:0;
  }
  #leadFormModal .modern-crm-form { max-height:none; min-height:0; flex:1; }
  #leadFormModal .modern-crm-modal-header { padding:14px; gap:10px; }
  #leadFormModal .modern-crm-modal-icon { width:42px; height:42px; flex:0 0 42px; border-radius:12px; font-size:20px; }
  #leadFormModal .modern-crm-modal-title { font-size:20px; }
  #leadFormModal .modern-crm-modal-subtitle { font-size:12px; }
  #leadFormModal .modern-crm-close { flex:0 0 40px; }
  #leadFormModal .modern-crm-scroll-body { padding:12px; gap:12px; }
  #leadFormModal .modern-crm-section-card,
  #leadFormModal .modern-crm-readonly-card,
  #leadFormModal .form-section { padding:14px; border-radius:14px; }
  #leadFormModal .modern-crm-modal-footer { padding:10px 12px calc(10px + env(safe-area-inset-bottom)); }
  #leadFormModal .modern-crm-footer-actions { display:grid; grid-template-columns:1fr; gap:8px; }
  #leadFormModal .modern-crm-footer-actions .btn { width:100%; }
}

@media (max-width:380px) {
  #leadsView .leads-kpi-card { align-items:flex-start; }
  #leadsView .leads-table-wrap table { min-width:1320px; }
  #leadFormModal .modern-crm-modal-icon { display:none; }
}