/* Zelf-gehoste Inter (variable, latin-subset) — consistente letter op elk OS.
   Binnen CSP font-src 'self': bestand wordt vanaf hetzelfde domein geserveerd. */
@font-face{
  font-family:"Inter";
  src:url("/assets/fonts/inter-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

:root{
  --bg:#f3f5f9;
  --card:#ffffff;
  --text:#102038;
  --muted:#58677d;
  --line:rgba(16,32,56,.10);
  --accent:#1793e8;
  --accent-weak:rgba(23,147,232,.12);
  --radius:14px;
  --control-height:42px;
  --control-radius:12px;
  --shadow:0 1px 2px rgba(16,32,56,.04), 0 8px 24px rgba(16,32,56,.06);
}

*{ box-sizing:border-box; }
html, body{ height:100%; }
body{
  margin:0;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background:
    radial-gradient(1100px 420px at 100% -5%, rgba(23,147,232,.05), transparent 60%),
    var(--bg);
  color:var(--text);
}

a{ color:inherit; text-decoration:none; }

.wrap{ max-width:1320px; margin:0 auto; padding:18px; }
@media (max-width:1024px){
  .wrap{ max-width:980px; padding:14px; }
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:18px 0 22px 0;
}

.brand{
  font-weight:900;
  letter-spacing:.2px;
}
.brand-app{
  display:flex;
  align-items:center;
  gap:14px;
  text-decoration:none;
  color:var(--text);
}

.brand-app-logo{
  height:44px;
  width:auto;
  display:block;
}

.brand-app-text{
  font-weight:900;
  font-size:20px;
  letter-spacing:.2px;
}

.nav{ display:flex; gap:8px; flex-wrap:wrap; }
.nav-toggle{
  display:none;
  position:relative;
  min-height:40px;
  min-width:44px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:var(--text);
  font-size:20px;
  line-height:1;
  cursor:pointer;
}
.nav-toggle.has-alert{
  border-color:rgba(239,68,68,.35);
}
.nav-toggle-badge{
  position:absolute;
  top:-6px;
  right:-6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  background:#dc2626;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
  box-shadow:0 4px 12px rgba(220,38,38,.28);
}

.pill{
  display:inline-flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  min-height:var(--control-height);
  padding:0 18px;
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--muted);
  background:rgba(255,255,255,.88);
  font-size:13px;
  line-height:1;
  white-space:nowrap;
  font:inherit;
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
}
.pill[data-active="1"]{
  border-color: rgba(0,153,230,.55);
  box-shadow: 0 0 0 4px var(--accent-weak);
  color: var(--text);
}

.text-right{ text-align:right; }
.section-stack-xs{ margin-top:12px; }
.section-stack-sm{ margin-top:14px; }

.invoice-public-pay-title,
.quote-public-accept-title{
  margin:6px 0 0;
}

.invoice-public-pay-subtitle,
.quote-public-accept-subtitle{
  margin-top:6px;
}

.invoice-public-pay-grid,
.quote-public-accept-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
}

.invoice-public-pay-grid{
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}

.invoice-public-pay-value,
.quote-public-accept-value{
  margin-top:4px;
  font-weight:800;
}

.invoice-public-pay-value-strong,
.quote-public-accept-value{
  font-weight:900;
}

.quote-public-accept-shell{
  max-width:880px;
  margin:24px auto;
}

.quote-public-accept-tablewrap{
  margin-top:12px;
  overflow:auto;
}

.quote-public-accept-header{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,260px);
  gap:24px;
  align-items:start;
  padding-bottom:18px;
  border-bottom:1px solid rgba(16,32,56,.10);
  margin-bottom:18px;
}
.quote-public-accept-brand{
  display:flex;
  gap:14px;
  align-items:flex-start;
}
.quote-public-accept-logo{
  flex:0 0 auto;
  width:56px;
  height:56px;
  border-radius:12px;
  background:#f5f6f9;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.quote-public-accept-logo img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
.quote-public-accept-logo-fallback{
  font-size:24px;
  font-weight:800;
  color:#102038;
}
.quote-public-accept-brand-text{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.quote-public-accept-brand-name{
  font-weight:800;
  font-size:18px;
  margin-bottom:2px;
}
.quote-public-accept-meta{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.quote-public-accept-number{
  font-weight:800;
  font-size:18px;
}
.quote-public-accept-deal{
  margin-bottom:8px;
}
.quote-public-accept-client{
  font-weight:700;
}
.quote-public-accept-intro{
  margin:14px 0 4px;
  padding:14px 16px;
  background:#f5f6f9;
  border-radius:12px;
  line-height:1.55;
}
.quote-public-accept-totals{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(16,32,56,.10);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.quote-public-accept-totals-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
}
.quote-public-accept-totals-grand{
  margin-top:6px;
  padding-top:8px;
  border-top:1px solid rgba(16,32,56,.10);
  font-weight:800;
  font-size:17px;
}
.quote-public-accept-footer-text{
  margin:14px 0;
  padding:12px 16px;
  background:#f5f6f9;
  border-radius:12px;
  line-height:1.55;
  color:var(--muted, #5a6a82);
}
.quote-public-accept-actions{
  text-align:center;
  padding:18px 0;
}
.quote-public-accept-cta{
  font-size:17px;
  padding:14px 28px;
}
.quote-public-accept-trust{
  text-align:center;
  margin-top:18px;
  color:var(--muted, #5a6a82);
}
.quote-link-error-body{
  text-align:center;
  padding:28px 8px 8px;
}
.quote-link-error-icon{
  font-size:44px;
  line-height:1;
  margin-bottom:12px;
}
.quote-link-error-heading{
  margin:0 0 10px;
}
.quote-link-error-text{
  max-width:520px;
  margin:0 auto;
  line-height:1.55;
  color:var(--muted, #5a6a82);
}
.quote-link-error-contact{
  text-align:center;
}
.quote-link-error-contact-value{
  margin-top:6px;
}
.quote-link-error-actions{
  text-align:center;
}
@media (max-width:640px){
  .quote-public-accept-header{
    grid-template-columns:1fr;
  }
  .quote-public-accept-meta{
    text-align:left;
  }
}

.billing-signup-shell{
  max-width:960px;
  margin:24px auto;
}

.billing-signup-title{
  margin:0 0 8px;
}

.billing-signup-subtitle{
  margin-bottom:16px;
}

.billing-signup-explainer,
.billing-signup-card,
.billing-signup-cycle-row{
  margin-bottom:12px;
}

.billing-signup-card-title{
  font-weight:800;
  margin-bottom:6px;
}

.billing-signup-card-subtitle{
  font-weight:700;
  margin-bottom:8px;
}

.billing-signup-promo-list{
  display:grid;
  gap:8px;
}

.billing-signup-plan-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  margin-bottom:14px;
}

.billing-signup-plan-card{
  margin:0;
  cursor:pointer;
}

.billing-signup-plan-row{
  display:flex;
  gap:8px;
  align-items:flex-start;
}

.billing-signup-plan-name{
  font-weight:800;
}

.billing-signup-plan-price{
  margin-top:6px;
  font-weight:700;
}

.billing-signup-error-tight{
  margin-bottom:10px;
}

.billing-signup-cycle-row,
.billing-signup-submit-row{
  display:flex;
  gap:16px;
  align-items:center;
  flex-wrap:wrap;
}

.billing-signup-submit-row{
  margin-top:14px;
  gap:10px;
}

.billing-signup-addon-grid,
.billing-signup-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:8px;
}

.billing-signup-form-grid{
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:12px;
}

.billing-signup-addon-included{
  display:none;
  margin-left:6px;
}

.billing-signup-extra-seats{
  margin-top:8px;
}

.billing-signup-extra-seats-hint{
  margin-top:4px;
}

.deals-index-subtitle{
  margin-top:6px;
}

.deals-index-actions,
.deals-index-empty-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.deals-index-stats{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}

.deals-index-stat-value{
  font-weight:900;
  margin-top:4px;
}

.deals-index-filter-form{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:end;
}

.deals-index-field{
  margin:0;
}

.deals-index-field-220{ min-width:220px; }
.deals-index-field-190{ min-width:190px; }
.deals-index-field-160{ min-width:160px; }
.deals-index-field-grow{ flex:1; }

.deals-index-tablewrap{
  margin-top:12px;
  overflow:auto;
}

.deals-index-empty-block{
  padding:8px 0;
}

.deals-index-empty-title{
  font-weight:800;
}

.deals-index-empty-body{
  margin-top:6px;
}

.quote-show-inline-form{
  display:inline;
}

.quote-show-stack-bottom{
  margin-bottom:12px;
}

.quote-show-link-input{
  margin-top:8px;
  flex:1 1 560px;
  min-width:0;
  font-size:18px;
  line-height:1.4;
  padding:16px 20px;
  border-radius:24px;
}

.quote-show-link-row{
  display:flex;
  align-items:center;
  gap:12px;
  margin-top:8px;
}

.quote-show-copy-btn{
  flex:0 0 auto;
  min-height:66px;
  padding:0 18px;
  gap:10px;
}

.quote-show-copy-icon{
  width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.quote-show-copy-icon svg{
  width:22px;
  height:22px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.quote-show-copy-label{
  white-space:nowrap;
}

.quote-show-copy-feedback{
  min-height:20px;
  margin-top:6px;
}

@media (max-width: 760px){
  .quote-show-link-row{
    flex-direction:column;
    align-items:stretch;
  }

  .quote-show-link-input{
    font-size:16px;
    padding:14px 18px;
  }

  .quote-show-copy-btn{
    width:100%;
    justify-content:center;
  }
}

.quote-show-table .quote-show-col-qty,
.quote-show-table .quote-show-col-discount,
.quote-show-table .quote-show-col-type{
  width:120px;
}

.quote-show-table .quote-show-col-unit-price,
.quote-show-table .quote-show-col-total{
  width:160px;
}

.quote-show-amount{
  text-align:right;
  font-weight:800;
}

.quote-show-extra-title{
  margin-bottom:8px;
}

.quote-show-extra-row{
  margin-top:4px;
}

.platform-dashboard-heading,
.platform-dashboard-card-title{
  margin:0;
}

.platform-dashboard-card-title{
  font-size:18px;
}

.platform-dashboard-heading-copy,
.platform-dashboard-card-copy{
  margin-top:6px;
}

.platform-dashboard-actions,
.platform-dashboard-inline-form{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.platform-dashboard-acquisition-input{
  max-width:220px;
}

.platform-dashboard-bars{
  margin-top:14px;
}

.menu-dropdown-panel-wide{
  min-width:320px;
}

.menu-item-static{
  cursor:default;
}

.menu-item-strong,
.menu-item-title,
.onboarding-banner-title{
  font-weight:800;
}

.menu-item-muted{
  color:#667085;
}

.menu-item-block{
  display:block;
  white-space:normal;
}

.menu-item-copy{
  margin-top:4px;
}

.menu-item-actions{
  display:flex;
  gap:8px;
  margin-top:8px;
  flex-wrap:wrap;
}

.menu-dropdown-form{
  padding:10px 14px;
}

.menu-dropdown-footer{
  padding:0 14px 10px;
}

.command-palette-field{
  margin:0;
}

.command-palette-shortcut,
.flash-banner-stack{
  margin-top:10px;
}

.onboarding-banner{
  margin-top:10px;
  margin-bottom:14px;
  border:1px solid rgba(0,160,120,.35);
  background:rgba(0,160,120,.08);
}

.onboarding-banner-row,
.onboarding-banner-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.onboarding-banner-actions{
  justify-content:flex-start;
  gap:8px;
}

.leadforms-show-title,
.notifications-index-title{
  margin:0;
}

.leadforms-show-meta{
  margin-top:10px;
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.leadforms-show-toggle-form{
  margin-top:12px;
}

.leadforms-show-delete-form{
  margin-top:10px;
}

.leadforms-show-section-title{
  margin:0;
  font-size:18px;
}

.leadforms-show-field-top,
.leadforms-show-block-top{
  margin-top:10px;
}

.leadforms-show-field-row{
  padding:8px 0;
  border-bottom:1px solid rgba(15,23,42,.08);
}

.leadforms-show-tablewrap{
  margin-top:10px;
  overflow:auto;
}

.leadforms-show-payload{
  white-space:pre-wrap;
}

.free-quote-generator-shell{
  max-width:1080px;
  margin:24px auto;
}

.free-quote-generator-title{
  margin:0 0 8px;
}

.free-quote-generator-subtitle,
.free-quote-generator-steps{
  margin-bottom:16px;
}

.free-quote-generator-steps,
.free-quote-generator-submit{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.free-quote-generator-error{
  margin-bottom:12px;
}

.free-quote-generator-card{
  margin:0;
}

.free-quote-generator-copy{
  margin-bottom:12px;
}

.free-quote-generator-template-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  margin-bottom:16px;
}

.free-quote-generator-template-card{
  margin:0;
  cursor:pointer;
}

.free-quote-generator-template-row{
  display:flex;
  gap:8px;
  align-items:flex-start;
}

.free-quote-generator-template-name{
  font-weight:800;
}

.free-quote-generator-error-tight{
  margin-bottom:10px;
}

.free-quote-generator-submit{
  margin-top:16px;
  align-items:center;
}

.notifications-index-subtitle{
  margin-top:6px;
}

.notifications-index-filter-form{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
}

.notifications-index-field{
  margin:0;
}

.notifications-index-filter-actions{
  display:flex;
  gap:10px;
  align-items:end;
}

.notifications-index-list{
  display:grid;
  gap:10px;
}

.notifications-index-card{
  margin:0;
}

.notifications-index-row{
  align-items:flex-start;
}

.notifications-index-card-title{
  font-weight:800;
}

.notifications-index-card-copy,
.notifications-index-card-meta{
  margin-top:6px;
}

.notifications-index-card-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.report-render-shell{
  --paper:#fff;
  --ink:#101010;
  --muted:#5e5e5e;
  --line:#e3e3de;
  --shadow:0 18px 48px rgba(0,0,0,.12);
  --mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  --sans:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;
  --serif:ui-serif,Georgia,"Times New Roman",Times,serif;
  margin:0;
  background:#0b0b0b;
  font-family:var(--sans);
  color:var(--ink);
}

.report-render-shell .toolbar{
  max-width:210mm;
  margin:14px auto 0;
  display:flex;
  gap:8px;
}

.report-render-shell .toolbar .btn{
  display:inline-block;
  padding:9px 12px;
  border-radius:10px;
  border:1px solid #111;
  background:#111;
  color:#fff;
  text-decoration:none;
  font-weight:700;
}

.report-render-shell .toolbar .btn.secondary{
  background:#fff;
  color:#111;
  border-color:#ddd;
}

.report-render-shell .sheet{
  width:210mm;
  margin:18px auto;
  background:var(--paper);
  box-shadow:var(--shadow);
  border-radius:14px;
  overflow:hidden;
}

.report-render-shell .page{
  position:relative;
  width:100%;
  min-height:297mm;
  padding:16mm 18mm 22mm;
}

.report-render-shell .page + .page{
  border-top:1px solid #111;
}

.report-render-shell .grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:8mm 6mm;
  align-items:start;
}

.report-render-shell .span-12{grid-column:1/-1}
.report-render-shell .span-8{grid-column:1/span 8}
.report-render-shell .span-7{grid-column:1/span 7}
.report-render-shell .rspan-5{grid-column:8/-1}
.report-render-shell .rspan-4{grid-column:9/-1}

.report-render-shell .kicker{
  font-family:var(--mono);
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:10px;
  color:var(--muted);
}

.report-render-shell .title{
  margin:0;
  font-size:44px;
  line-height:1.02;
  letter-spacing:-.03em;
  font-weight:900;
}

.report-render-section-title{
  font-size:34px;
}

.report-render-shell .display{
  margin:0;
  font-family:var(--serif);
  font-size:56px;
  line-height:.98;
  letter-spacing:-.02em;
  font-weight:650;
}

.report-render-shell .lead{
  margin:10px 0 0;
  font-size:15px;
  line-height:1.6;
  color:var(--muted);
  max-width:64ch;
}

.report-render-shell .topbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12mm;
  padding-bottom:7mm;
  border-bottom:1px solid var(--line);
}

.report-render-shell .brand{
  display:flex;
  gap:10px;
  align-items:center;
}

.report-render-shell .logo-wrap{
  width:84px;
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.report-render-shell .logo-wrap img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}

.report-render-shell .brand .name{
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.10em;
  font-size:12px;
}

.report-render-shell .brand .tag,
.report-render-shell .meta .line{
  font-family:var(--mono);
  font-size:10px;
  color:var(--muted);
}

.report-render-shell .meta{
  text-align:right;
  display:grid;
  gap:3px;
}

.report-render-shell .meta strong{
  color:var(--ink);
  font-weight:900;
}

.report-render-shell .media{
  position:relative;
  border-radius:16px;
  overflow:hidden;
  border:1px solid var(--line);
  background:#f2f2ee;
}

.report-render-shell .media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.report-render-shell .crop-left,
.report-render-shell .crop-top{object-position:left center}
.report-render-shell .crop-center{object-position:center center}
.report-render-shell .crop-right,
.report-render-shell .crop-bottom{object-position:right center}

.report-render-shell .overlay{
  position:absolute;
  inset:auto 0 0 0;
  padding:10px 12px;
  background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.58));
  color:#fff;
  font-family:var(--mono);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.14em;
}

.report-render-shell .caption{
  margin-top:6px;
  font-family:var(--mono);
  font-size:9.5px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.14em;
}

.report-render-shell .card,
.report-render-shell .meetstaat-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:8mm;
  background:#fff;
}

.report-render-shell .divider{
  height:1px;
  background:var(--line);
  margin:8mm 0;
}

.report-render-shell .cover-quote{
  margin-top:12mm;
  padding-left:10mm;
  border-left:3px solid #111;
}

.report-render-shell .cover-quote .q{
  font-family:var(--serif);
  font-size:20px;
  line-height:1.25;
  font-weight:600;
}

.report-render-shell .cover-quote .qa{
  margin-top:4px;
  font-family:var(--mono);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:var(--muted);
}

.report-render-shell .toc-list{
  margin:8mm 0 0;
  padding:0;
  list-style:none;
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
}

.report-render-shell .toc-list li{
  display:flex;
  justify-content:space-between;
  gap:10mm;
  padding:11px 12px;
  border-bottom:1px solid var(--line);
}

.report-render-shell .toc-list li:last-child{border-bottom:none}
.report-render-shell .toc-list .label{font-weight:700}
.report-render-shell .toc-list .page-no{
  font-family:var(--mono);
  font-size:12px;
  color:#111;
}

.report-render-shell .project-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 20px;
}

.report-render-shell .project-cell{
  padding:8px 0;
  border-bottom:1px solid #262626;
}

.report-render-shell .project-cell .k{
  display:block;
  font-family:var(--mono);
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.20em;
  color:var(--muted);
  margin-bottom:6px;
}

.report-render-shell .project-cell .v{
  display:block;
  font-size:18px;
  line-height:1.2;
  font-weight:500;
}

.report-render-shell .rich{
  font-size:13px;
  line-height:1.6;
  color:#161616;
  white-space:normal;
  word-break:normal;
  overflow-wrap:break-word;
}

.report-render-shell .rich p,
.report-render-shell .rich div{margin:0 0 10px}
.report-render-shell .rich ul,
.report-render-shell .rich ol{
  margin:0 0 12px 22px;
  padding:0;
}
.report-render-shell .rich li{margin:0 0 4px}
.report-render-shell .rich strong,
.report-render-shell .rich b{font-weight:800}
.report-render-shell .rich h1,
.report-render-shell .rich h2,
.report-render-shell .rich h3{
  margin:2px 0 10px;
  line-height:1.28;
  font-weight:900;
  color:#111;
}
.report-render-shell .rich h3{font-size:16px}

.report-render-shell .meetstaat-layer{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}

.report-render-meetstaat-col-label{width:34%}
.report-render-meetstaat-col-value{width:13.2%}

.report-render-shell .meetstaat-layer th{
  padding:6px 8px;
  border-bottom:2px solid #141414;
  text-align:left;
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:.20em;
  text-transform:uppercase;
  color:var(--muted);
}

.report-render-shell .meetstaat-layer th:first-child{
  padding-left:14px;
  vertical-align:bottom;
  padding-bottom:16px;
}

.report-render-shell .meetstaat-layer th.vcol{
  height:180px;
  vertical-align:bottom;
  text-align:center;
}

.report-render-shell .meetstaat-layer th.vcol > span{
  display:inline-block;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  line-height:1.05;
  letter-spacing:.16em;
}

.report-render-shell .meetstaat-layer td{
  padding:9px 8px;
  border-bottom:1px solid #bdbdb7;
  font-size:12.5px;
  vertical-align:middle;
  line-height:1.35;
}

.report-render-shell .meetstaat-layer td:first-child{
  padding-left:14px;
  font-size:14px;
  font-weight:400;
  line-height:1.2;
}

.report-render-shell .meetstaat-layer td:not(:first-child){
  text-align:center;
  font-weight:700;
  font-size:12.5px;
  white-space:nowrap;
}

.report-render-shell .meetstaat-layer td + td{
  border-left:1px solid #d3d3ce;
}

.report-render-shell .foot{
  position:absolute;
  left:18mm;
  right:18mm;
  bottom:8mm;
  display:flex;
  justify-content:space-between;
  gap:10mm;
  padding-top:4mm;
  border-top:1px solid var(--line);
  font-family:var(--mono);
  font-size:10px;
  color:var(--muted);
}

.report-render-cover-grid{
  margin-top:10mm;
}

.report-render-media-cover{height:210mm}
.report-render-media-project{height:150mm}
.report-render-media-page{height:198mm}
.report-render-media-explanation{height:168mm}
.report-render-card-intro{min-height:150mm}

.report-render-certificate-table{
  width:100%;
  border-collapse:collapse;
  margin:10px 0 14px;
}

.report-render-certificate-label{
  padding:3px 0;
}

.report-render-certificate-value{
  padding:3px 0;
  text-align:right;
}

.report-render-signature-wrap{
  margin-top:6mm;
}

.report-render-signature-image{
  max-width:64mm;
  max-height:24mm;
  width:auto;
  height:auto;
  object-fit:contain;
}

@media print{
  .report-render-shell{
    margin:0;
    padding:0;
    background:#fff;
  }
  .report-render-shell .toolbar{display:none}
  .report-render-shell .sheet{
    width:210mm;
    max-width:210mm;
    margin:0;
    box-shadow:none;
    border-radius:0;
    overflow:visible;
  }
  .report-render-shell .page{
    /* Vol vel-hoogte (297mm) zodat de paginavoet (position:absolute; bottom) op de
       onderrand van het A4 blijft. Geoptimaliseerd voor "Bewaar als PDF" (@page
       margin:0 -> printbaar vlak = 297mm). Content past binnen 297mm dankzij de
       compacte marge hieronder + kortere tekst-chunks in render.php (gemeten max
       ~291mm), dus overflow:hidden knipt niets af en er ontstaat geen blanco vel. */
    width:210mm;
    padding:10mm 18mm 10mm;
    height:297mm;
    min-height:297mm;
    max-height:297mm;
    overflow:hidden;
    display:block;
    break-inside:avoid;
    page-break-inside:avoid;
    break-before:page;
    page-break-before:always;
  }
  .report-render-shell .page:first-child{
    break-before:auto;
    page-break-before:auto;
  }
  .report-render-shell .page + .page{border-top:none}
  @page{size:A4;margin:0}
}

.print-app-shell{
  margin:0;
  background:#0b0b0b;
  color:#0f172a;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

.print-app-shell .sheet{
  width:210mm;
  margin:16px auto;
  background:#fff;
  box-shadow:0 18px 48px rgba(0,0,0,.12);
  border-radius:14px;
  overflow:hidden;
}

.print-app-shell .page{
  position:relative;
  width:100%;
  min-height:297mm;
  padding:16mm 18mm 22mm;
  break-inside:avoid;
  page-break-inside:avoid;
}

.print-app-shell .page + .page{
  border-top:1px solid #e5e7eb;
}

.print-app-shell .foot{
  position:absolute;
  left:18mm;
  right:18mm;
  bottom:8mm;
  display:flex;
  justify-content:space-between;
  gap:10mm;
  padding-top:4mm;
  border-top:1px solid #e5e7eb;
  font-size:10px;
  color:#64748b;
  letter-spacing:.06em;
}

.print-app-shell .foot::after{
  content:'Powered by Crumm CRM';
  margin-left:auto;
  color:#94a3b8;
}

.print-app-shell .kicker{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:#64748b;
  margin-bottom:8px;
}

.print-app-shell .kicker-inline-block{
  margin:0 0 8px;
}

.print-app-shell .print-table td.right,
.print-app-shell .print-table th.right,
.print-app-shell .print-table .amount{
  white-space:nowrap;
}

.print-app-shell .print-table td,
.print-app-shell .print-table th{
  page-break-inside:avoid;
  break-inside:avoid;
}

.print-app-shell .tablebox{
  break-inside:avoid;
  page-break-inside:avoid;
}

.print-app-shell .note-reset{
  margin:0;
}

.print-app-shell .note-tight-top{
  margin-top:10px;
}

.print-app-shell .print-note-heading{
  font-weight:700;
  margin-bottom:6px;
}

.print-app-shell .print-note-row{
  margin-top:4px;
}

.print-app-shell .print-approval-text-top{
  margin-top:10px;
}

.print-app-shell .print-table-quote .print-col-description{width:46%}
.print-app-shell .print-table-quote.has-line-discount .print-col-description{width:42%}
.print-app-shell .print-table-quote .print-col-qty{width:10%}
.print-app-shell .print-table-quote .print-col-unit-price{width:16%}
.print-app-shell .print-table-quote.has-line-discount .print-col-unit-price{width:13%}
.print-app-shell .print-table-quote .print-col-discount{width:11%}
.print-app-shell .print-table-quote .print-col-type{width:10%}
.print-app-shell .print-table-quote .print-col-total{width:18%}
.print-app-shell .print-table-quote.has-line-discount .print-col-total{width:14%}

.print-app-shell .print-table-invoice .print-col-description{width:46%}
.print-app-shell .print-table-invoice.has-line-discount .print-col-description{width:42%}
.print-app-shell .print-table-invoice .print-col-qty{width:9%}
.print-app-shell .print-table-invoice .print-col-unit-price{width:13%}
.print-app-shell .print-table-invoice .print-col-vat{width:10%}
.print-app-shell .print-table-invoice .print-col-discount{width:10%}
.print-app-shell .print-table-invoice .print-col-total{width:22%}
.print-app-shell .print-table-invoice.has-line-discount .print-col-total{width:16%}

@media print{
  @page{
    size:A4;
    margin:0;
  }
  .print-app-shell,
  .print-app-shell html,
  .print-app-shell body{
    margin:0;
    padding:0;
    background:#fff;
  }
  .print-app-shell .noprint,
  .print-app-shell .print-topbar{
    display:none !important;
  }
  .print-app-shell .sheet{
    width:210mm;
    max-width:210mm;
    margin:0;
    box-shadow:none;
    border-radius:0;
    overflow:visible;
  }
  .print-app-shell .page{
    /* Geen vaste paginahoogte in print: een blok dat exact zo hoog is als het
       vel loopt bij fysieke printers (die eigen marges toepassen en @page
       margin:0 negeren) net over de printbare hoogte. Die overloop belandt als
       lege pagina achter elke pagina. Met contenthoogte + een geforceerd
       pagina-einde per .page kan een blok het vel nooit overschrijden, dus
       geen lege tussenpagina's meer - ongeacht printer of marge-instelling. */
    width:210mm;
    min-height:0;
    height:auto;
    max-height:none;
    /* Footer verborgen -> krappere onder/boven-marge, meer inhoud past op 1 vel. */
    padding:10mm 18mm 10mm;
    overflow:visible;
    display:block;
    break-before:page;
    page-break-before:always;
  }
  .print-app-shell .page:first-child{
    break-before:auto;
    page-break-before:auto;
  }
  .print-app-shell .page + .page{
    border-top:none;
  }
  /* Footer niet gewenst in print. Verbergen scheelt meteen de hoogte die
     anders de pagina over de velrand duwde (bijna-lege vervolgpagina's). */
  .print-app-shell .foot{
    display:none;
  }
  /* Compacter in print zodat intro + tabel samen op 1 vel passen en de tabel
     niet naar een apart vel wordt geduwd. Alleen print; scherm blijft gelijk. */
  .print-app-shell .note{
    margin-top:8px;
    margin-bottom:8px;
  }
  .print-app-shell .tablebox{
    margin-top:8px;
    margin-bottom:8px;
  }
  .print-app-shell .print-two-col{
    margin:6px 0 8px;
  }
  .print-app-shell .print-table thead{
    display:table-header-group;
  }
  .print-app-shell .print-two-col{
    grid-template-columns:1fr 1fr !important;
  }
}

.menu-dropdown{
  position:relative;
}
.settings-trigger{
  gap:10px;
  min-width:var(--control-height);
  padding-inline:14px;
}
.locale-trigger{
  min-width:var(--control-height);
  padding-inline:12px;
}
.locale-flag,
.locale-menu-flag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
}
.locale-menu .menu-item{
  gap:10px;
}
.settings-trigger.has-unread{
  border-color:rgba(239,68,68,.35);
  background:rgba(239,68,68,.08);
  color:#991b1b;
}
.settings-trigger.has-unread:hover{
  background:rgba(239,68,68,.12);
}
.pill-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 6px;
  border-radius:999px;
  background:#dc2626;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1;
}
.settings-trigger .gear-icon{
  font-size:24px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.settings-trigger .settings-label{
  display:none;
}
.menu-dropdown-panel{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  min-width:190px;
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.97);
  box-shadow:var(--shadow);
  padding:6px;
  display:none;
  z-index:30;
}
.menu-dropdown-panel.is-open{
  display:block;
}
.command-palette{
  position:fixed;
  inset:0;
  z-index:60;
}
.command-palette-backdrop{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.42);
}
.command-palette-panel{
  position:relative;
  max-width:760px;
  margin:10vh auto 0;
  background:#fff;
  border:1px solid var(--line);
  border-radius:18px;
  box-shadow:var(--shadow);
  padding:16px;
}
.command-palette-list{
  display:grid;
  gap:8px;
  margin-top:12px;
  max-height:52vh;
  overflow:auto;
}
.command-palette-item{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
}
.command-palette-item:hover,
.command-palette-item.is-active{
  border-color:rgba(0,153,230,.55);
  box-shadow:0 0 0 4px var(--accent-weak);
}
.command-palette-item span{
  color:var(--muted);
  font-size:13px;
}
.menu-item{
  display:flex;
  align-items:center;
  width:100%;
  padding:9px 10px;
  border:0;
  border-radius:8px;
  color:var(--text);
  background:transparent;
  text-align:left;
  font:inherit;
  cursor:pointer;
}
.menu-item:hover{
  background:rgba(15,23,42,.05);
}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px;
  backdrop-filter:blur(8px);
  box-shadow: var(--shadow);
}

.onboarding-shell{
  max-width:980px;
  margin:24px auto;
  padding:32px;
}
.onboarding-hero{ text-align:center; padding:8px 0 28px; }
.onboarding-title{ margin:0 0 12px; font-size:32px; }
.onboarding-subtitle{ font-size:17px; color:#5a6a82; max-width:560px; margin:0 auto 12px; }
.onboarding-completed-pill{ display:inline-block; padding:6px 14px; border-radius:999px; }
.onboarding-section-heading{ margin:0 0 16px; font-size:20px; }
.onboarding-setup{
  background:#f5f6f9; border-radius:14px; padding:22px;
  margin-bottom:28px;
}
.onboarding-flow-hint{
  margin-top:14px; padding-top:14px;
  border-top:1px dashed rgba(16,32,56,.16);
  text-align:center; color:#5a6a82;
}
.onboarding-steps{ margin:0 0 28px; }
.onboarding-steps-grid{
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}
@media (max-width:760px){
  .onboarding-steps-grid{ grid-template-columns:1fr; }
}
.onboarding-step{
  background:#fff;
  border:2px solid var(--ink, #102038);
  border-radius:14px;
  padding:22px;
  display:flex; flex-direction:column; gap:10px;
}
.onboarding-step-number{
  display:inline-flex; width:36px; height:36px;
  align-items:center; justify-content:center;
  border-radius:50%;
  background:var(--ink, #102038); color:#fff;
  font-weight:800; font-size:18px;
}
.onboarding-step-title{ margin:0; font-size:17px; }
.onboarding-step-copy{ flex:1 1 auto; line-height:1.55; }
.onboarding-step .btn{ align-self:flex-start; }
.onboarding-secondary{
  margin:24px 0;
  padding:18px;
  background:#fafbfd;
  border-radius:12px;
}
.onboarding-secondary-label{ color:#5a6a82; margin-bottom:8px; }
.onboarding-secondary-links{ display:flex; flex-wrap:wrap; gap:18px; }
.onboarding-secondary-links a{
  color:#102038; font-weight:700;
  text-decoration:none;
  border-bottom:1px solid rgba(16,32,56,.2);
  padding-bottom:1px;
}
.onboarding-secondary-links a:hover{ border-bottom-color:#102038; }
.onboarding-section-card{
  margin:0 0 12px;
}
.onboarding-section-title{
  font-size:18px;
  margin:0 0 8px;
}
.onboarding-setup-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  align-items:end;
}
.onboarding-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
  margin-top:12px;
}
.onboarding-summary-card{
  margin:0;
}
.onboarding-strong{
  font-weight:800;
  margin-top:6px;
}
.onboarding-mfa-card{
  margin:0 0 12px;
}
.onboarding-mfa-card.is-enabled{
  border-color:rgba(0,160,120,.35);
  background:rgba(0,160,120,.06);
}
.onboarding-mfa-card.is-disabled{
  border-color:rgba(16,32,56,.12);
  background:#fff;
}
.onboarding-mfa-layout{
  display:flex;
  gap:12px;
  justify-content:space-between;
  align-items:flex-start;
  flex-wrap:wrap;
}
.onboarding-mfa-copy{
  max-width:620px;
}
.onboarding-mfa-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.onboarding-mfa-status{
  font-weight:800;
}
.onboarding-mfa-status.is-enabled{
  color:#0f766e;
}
.onboarding-mfa-status.is-disabled{
  color:var(--text);
}
.onboarding-grid-4{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:10px;
}
.onboarding-grid-3{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.onboarding-card-compact{
  margin:0;
}
.onboarding-card-title{
  font-weight:800;
}
.onboarding-card-copy{
  margin-top:6px;
}
.onboarding-card-action{
  margin-top:8px;
}
.onboarding-step-section{
  margin:12px 0;
}
.onboarding-step-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.onboarding-step-card{
  margin:0;
}
.onboarding-step-title{
  font-weight:800;
}
.onboarding-step-copy{
  margin-top:6px;
}
.onboarding-step-action{
  margin-top:10px;
}
.onboarding-footer-actions{
  margin-top:14px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}

.h1{ font-size:22px; margin:0 0 10px; letter-spacing:-.03em; }
.row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; }
.project-page-title{ margin:6px 0 0; }
.project-page-subtitle{ margin-top:6px; }
.project-page-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.project-page-form{ margin-top:12px; }
.project-page-form--delete{ margin-top:14px; }
.project-page-grid-240{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.project-page-field-compact{ margin-bottom:0; }
.project-page-form-actions{ margin-top:12px; }

.invoice-edit-title{ margin:6px 0 0; }
.invoice-edit-section{ margin-top:14px; }
.invoice-edit-section-title{ margin:0; font-size:18px; }
.invoice-edit-section-copy{ margin-top:6px; }
.invoice-edit-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.invoice-edit-inline-form{ display:inline; }
.invoice-edit-link-block{ margin-top:8px; }
.invoice-edit-stack{ margin-top:12px; }
.invoice-edit-form-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.invoice-edit-form-col{
  min-width:220px;
  flex:1;
}
.invoice-edit-form-col-sm{
  min-width:160px;
  flex:1;
}
.invoice-edit-form-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.invoice-edit-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.invoice-edit-field-inline{ margin-top:8px; }
.invoice-edit-scroll{ margin-top:10px; overflow:auto; }
.invoice-edit-text-right{ text-align:right; }
.invoice-edit-emphasis{ font-weight:800; }
.invoice-edit-value{
  display:block;
  margin-top:4px;
  font-weight:900;
}
.invoice-edit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:10px;
}
.invoice-edit-grid-form{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  margin-top:12px;
}
.invoice-edit-field-flush{ margin:0; }
.invoice-edit-button-wrap{
  display:flex;
  align-items:end;
}
.invoice-edit-total-wrap{
  margin-top:10px;
  display:flex;
  justify-content:flex-end;
}
.invoice-edit-total-card{
  min-width:300px;
}
.invoice-edit-total-row{
  justify-content:space-between;
}
.invoice-edit-total-row--spaced{
  justify-content:space-between;
  margin-top:8px;
}
.invoice-edit-total-row--spaced-lg{
  justify-content:space-between;
  margin-top:10px;
}
.invoice-edit-strong{ font-weight:900; }
.invoice-edit-table-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.invoice-show-title{ margin:6px 0 0; }
.invoice-show-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.invoice-show-section{
  margin-top:14px;
}
.invoice-show-section-title{
  margin:0;
  font-size:18px;
}
.invoice-show-copy-top{
  margin-top:8px;
}
.invoice-show-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:12px;
}
.invoice-show-meta-value{
  font-weight:800;
  margin-top:4px;
}
.invoice-show-width-90{ width:90px; }
.invoice-show-width-110{ width:110px; }
.invoice-show-width-130{ width:130px; }
.invoice-show-text-right{ text-align:right; }
.invoice-show-weight-800{ font-weight:800; }
.invoice-show-scroll{
  margin-top:12px;
  overflow:auto;
}
.invoice-show-payments-form{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
}
.invoice-show-field-flush{ margin:0; }
.invoice-show-button-end{
  display:flex;
  align-items:end;
}
.invoice-show-table-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.small{ color:var(--muted); font-size:13px; }
.err{ color:#b91c1c; font-size:13px; margin-top:4px; }
.ok{ color:#166534; font-size:13px; }
.card--spaced{ margin-bottom:16px; }
.auth-simple-wrap{
  max-width:640px;
  margin:18px auto 42px;
  padding:0 16px;
}
.auth-simple-brand{
  display:flex;
  align-items:center;
  gap:14px;
  margin:0 auto 18px;
  max-width:640px;
  padding-left:18px;
}
.auth-simple-brand img{
  width:72px;
  height:auto;
}
.auth-simple-brand-title{
  font-size:38px;
  line-height:1;
  font-weight:900;
  color:#16367f;
  letter-spacing:-0.04em;
}
.auth-simple-card{
  position:relative;
  max-width:640px;
  margin:0 auto;
  background:#fff;
  border:1px solid #dbe5ef;
  border-top:6px solid #2196f3;
  border-radius:12px;
  box-shadow:0 12px 36px rgba(15,47,109,.08);
  padding:30px 36px 26px;
}
.auth-simple-title{
  margin:0 0 10px;
}
.auth-simple-copy,
.auth-simple-flash{
  margin-bottom:12px;
}
.auth-simple-actions{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}
.auth-mfa-card{
  max-width:460px;
  margin:32px auto;
}
.auth-mfa-title{
  margin:0 0 10px;
}
.auth-mfa-copy,
.auth-mfa-account,
.auth-mfa-error{
  margin-bottom:12px;
}
.payment-complete-title{
  margin:0;
}
.payment-complete-status{
  margin-top:12px;
}
.payment-complete-summary{
  margin-top:14px;
}
.payment-complete-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
}
.payment-complete-value{
  font-weight:800;
  margin-top:4px;
}
.appointments-book-page{
  --bg:#f7fafc;
  --card:#fff;
  --line:rgba(15,23,42,.12);
  --text:#0f172a;
  --muted:#475569;
  --accent:#0099e6;
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.appointments-book-wrap{
  max-width:780px;
  margin:0 auto;
  padding:20px;
}
.appointments-book-card{
  margin-bottom:12px;
}
.appointments-book-title{
  margin:0 0 8px;
}
.appointments-book-hidden-field{
  display:none;
}
.account-shell{
  max-width:760px;
  margin:18px auto;
}
.account-title,
.account-section-title{
  margin:0 0 10px;
}
.account-intro,
.account-section-copy,
.account-status,
.account-error{
  margin-bottom:12px;
}
.account-stack{
  display:grid;
  gap:18px;
}
.account-preferences-field{
  max-width:280px;
  margin-bottom:12px;
}
.account-preferences-list{
  display:grid;
  gap:8px;
}
.account-preference-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.account-support-field{
  max-width:320px;
  margin-top:12px;
}
.account-actions{
  margin-top:10px;
}
.account-mfa-field-wide{
  max-width:320px;
}
.account-mfa-field-narrow{
  max-width:220px;
}
.account-mfa-setup-card{
  margin-top:14px;
  background:#f8fafc;
}
.account-mfa-title{
  margin:0 0 8px;
}
.account-mfa-title-tight{
  margin:0 0 8px;
}
.account-mfa-copy{
  margin-bottom:8px;
}
.account-mfa-copy-tight{
  margin-bottom:8px;
}
.account-mfa-secret-row{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.account-mfa-secret-input{
  flex:1 1 260px;
}
.account-mfa-mobile-help{
  margin-top:6px;
}
.account-mfa-codes-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(120px, 1fr));
  gap:8px;
}
.account-mfa-code{
  display:block;
  padding:8px;
  border:1px solid #d1d5db;
  border-radius:8px;
  background:#fff;
}
.account-mfa-confirm-form{
  margin-top:12px;
}
.account-mfa-stack{
  display:grid;
  gap:14px;
  margin-top:14px;
}
.account-mfa-card{
  margin:0;
}
.account-mfa-card--light{
  background:#f8fafc;
}
.account-mfa-card--warm{
  background:#fff7ed;
}
.row--start{ justify-content:flex-start; }
.row--stretch-top{ align-items:flex-start; gap:16px; }
.row--compact{ gap:10px; flex-wrap:wrap; }
.row--compact-start{ gap:10px; justify-content:flex-start; flex-wrap:wrap; }
.row--section{ margin-top:12px; }
.row--section-bottom{ margin-bottom:12px; }
.row--align-start{ align-items:flex-start; }
.row--gap-8{ gap:8px; }
.row--gap-10{ gap:10px; }
.row--gap-12{ gap:12px; }
.row--wrap{ flex-wrap:wrap; }
.tenant-flex-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.tenant-inline-actions{ display:inline-flex; gap:8px; align-items:center; }
.tenant-inline-actions + .tenant-inline-actions{ margin-left:8px; }
.tenant-title{ font-size:18px; margin:0 0 10px; }
.tenant-title-tight{ font-size:18px; margin:0 0 6px; }
.tenant-scroll{ overflow:auto; }
.tenant-scroll--top{ overflow:auto; margin-top:12px; }
.tenant-scroll--bottom{ overflow:auto; margin-bottom:12px; }
.tenant-stack-top{ margin-top:12px; }
.tenant-stack-top-lg{ margin-top:16px; }
.tenant-stack-bottom{ margin-bottom:10px; }
.tenant-stack-bottom-lg{ margin-bottom:12px; }
.tenant-field-sm{ max-width:320px; margin-top:12px; }
.tenant-badge-dynamic{
  background:var(--tenant-badge-bg, #f8fafc);
  border-color:var(--tenant-badge-border, rgba(71,85,105,.18));
  color:var(--tenant-badge-color, #475569);
}
.tenant-badge--active{
  --tenant-badge-bg:#ecfdf5;
  --tenant-badge-border:rgba(22,163,74,.20);
  --tenant-badge-color:#166534;
}
.tenant-badge--closed{
  --tenant-badge-bg:#fff7ed;
  --tenant-badge-border:rgba(249,115,22,.24);
  --tenant-badge-color:#9a3412;
}
.tenant-badge--neutral{
  --tenant-badge-bg:#f8fafc;
  --tenant-badge-border:rgba(71,85,105,.18);
  --tenant-badge-color:#475569;
}
.tenant-col-360{ flex:1 1 360px; min-width:320px; }
.tenant-col-440{ flex:1 1 440px; min-width:320px; }
.tenant-col-520{ flex:1 1 520px; min-width:320px; }
.tenant-col-160{ flex:1 1 160px; }
.tenant-col-180{ flex:1 1 180px; }
.tenant-col-260{ flex:1 1 260px; }
.tenant-form-actions{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.tenant-row-top{ display:flex; gap:12px; align-items:flex-start; flex-wrap:wrap; }
.tenant-inline-check{ display:flex; gap:8px; align-items:center; margin-bottom:12px; }
.tenant-error-top{ margin-top:10px; }
.tenant-card-top{ margin-top:14px; }
.tenant-card-bottom{ margin-bottom:14px; }
.tenant-card-bottom-lg{ margin-bottom:16px; }
.tenant-card-top-bottom{ margin-top:14px; margin-bottom:14px; }
.tenant-title-lg{ font-size:22px; margin:0; }
.tenant-title-md{ font-size:18px; margin:0 0 10px; }
.tenant-title-tight-sm{ font-size:18px; margin:0 0 6px; }
.tenant-copy-bottom{ margin-bottom:10px; }
.tenant-copy-bottom-lg{ margin-bottom:12px; }
.tenant-copy-success{ color:#166534; }
.tenant-scroll-top{ overflow:auto; margin-top:10px; }
.tenant-scroll-bottom{ overflow:auto; margin-bottom:12px; }
.tenant-summary-box{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  background:#f8fafc;
}
.tenant-confirm-box{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(185,28,28,.18);
  border-radius:14px;
  background:#fef2f2;
}
.tenant-weight-800{ font-weight:800; }
.tenant-danger-box{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(185,28,28,.18);
  border-radius:14px;
  background:#fef2f2;
}
.tenant-danger-title{ font-weight:800; color:#991b1b; margin-bottom:8px; }
.tenant-danger-copy{ margin-bottom:10px; color:#7f1d1d; }
.tenant-success-copy{ color:#166534; }
.tenant-neutral-box{
  margin-top:16px;
  padding:14px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  background:#f8fafc;
}
.tenant-section-label{ font-weight:800; margin-bottom:8px; }
.tenant-danger-btn{ background:#991b1b; border-color:#991b1b; color:#fff; }

.settings-stack-top-6{ margin-top:6px; }
.settings-stack-top-10{ margin-top:10px; }
.settings-stack-top-12{ margin-top:12px; }
.settings-stack-top-14{ margin-top:14px; }
.settings-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.settings-row--top-10{ margin-top:10px; }
.settings-row--top-12{ margin-top:12px; }
.settings-row--top-14{ margin-top:14px; }
.settings-row--compact{
  gap:10px;
  align-items:center;
}
.settings-field{
  min-width:260px;
  flex:1;
}
.settings-field--flush{ margin:0; }
.settings-card{
  margin-top:14px;
}
.settings-subcard{
  margin-top:12px;
}
.settings-title{
  margin:0;
  font-size:18px;
}
.settings-subtitle{
  margin:0;
  font-size:16px;
}
.settings-inline-upload{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.settings-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.settings-file-input{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.settings-logo-preview{
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:10px;
}
.settings-logo-image{
  height:34px;
  width:auto;
  border-radius:10px;
  background:rgba(255,255,255,0.06);
  padding:4px;
}
.settings-summary-grid{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:10px;
}
.settings-table-wrap{
  margin-top:10px;
  overflow:auto;
}
.settings-inline-help{
  display:block;
  margin-top:6px;
}
.settings-details{
  margin-top:10px;
}
.settings-summary-toggle{
  cursor:pointer;
}

.billing-plans-shell{
  max-width:1100px;
  margin:24px auto;
}
.billing-plans-title{
  margin:0 0 8px;
}
.billing-plans-subtitle{
  margin-bottom:14px;
}
.billing-plans-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:12px;
}
.billing-plans-grid-wide{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:12px;
  margin-top:10px;
}
.billing-plans-grid-compact{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:10px;
  margin-top:10px;
}
.billing-plans-card-reset{
  margin:0;
}
.billing-plans-section{
  margin-top:12px;
}
.billing-plans-section-title{
  font-size:18px;
  margin:0;
}
.billing-plans-price{
  font-weight:800;
  margin-top:6px;
}
.billing-plans-list{
  margin-top:8px;
}
.billing-plans-copy-top{
  margin-top:6px;
}
.billing-plans-copy-tight{
  margin-top:4px;
}
.billing-plans-label{
  font-weight:700;
}
.billing-plans-workflow{
  margin-top:8px;
}
.billing-plans-table-wrap{
  overflow:auto;
  margin-top:10px;
}
.billing-plans-actions{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.billing-settings-stack-top-4{ margin-top:4px; }
.billing-settings-stack-top-6{ margin-top:6px; }
.billing-settings-stack-top-8{ margin-top:8px; }
.billing-settings-stack-top-10{ margin-top:10px; }
.billing-settings-stack-top-12{ margin-top:12px; }
.billing-settings-stack-top-14{ margin-top:14px; }
.billing-settings-title{ margin:0; }
.billing-settings-actions{ margin-top:8px; }
.billing-settings-panel{ margin-top:12px; }
.billing-settings-panel-accent{
  margin-top:12px;
  border-color:rgba(23,147,232,.28);
  background:rgba(23,147,232,.05);
}
.billing-settings-box-danger{
  margin-top:8px;
  padding:10px 12px;
  border:1px solid rgba(220,38,38,.35);
  background:rgba(220,38,38,.08);
  border-radius:12px;
  color:#991b1b;
}
.billing-settings-list-quote{
  margin:10px 0 0 18px;
  padding:0;
}
.billing-settings-promo-list{
  display:grid;
  gap:8px;
}
.billing-settings-promo-card{
  padding:12px 14px;
  border:1px solid rgba(37,99,235,.18);
  background:rgba(37,99,235,.05);
  border-radius:14px;
}
.billing-settings-invoices-toolbar{
  display:grid;
  grid-template-columns:minmax(240px,1.8fr) repeat(2,minmax(140px,0.8fr));
  gap:10px;
  align-items:end;
}
.billing-settings-invoices-search,
.billing-settings-invoices-filter{
  margin:0;
}
.billing-settings-invoices-wrap{
  margin-top:10px;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:auto;
  max-height:480px;
  background:rgba(255,255,255,.94);
}
.billing-settings-invoices-table{
  margin:0;
  min-width:720px;
}
.billing-settings-invoices-table thead th{
  position:sticky;
  top:0;
  background:#fff;
  z-index:1;
}
.billing-settings-invoices-number{
  font-weight:800;
  white-space:nowrap;
}
.billing-settings-invoices-actions{
  white-space:nowrap;
}
.billing-settings-invoices-empty{
  padding:14px;
}
.billing-settings-invoices-desktop{ display:block; }
.entity-card-list.billing-settings-invoices-mobile{ display:none !important; }
.billing-settings-invoice-mobile-item{
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(255,255,255,.94);
  padding:12px 14px;
}
.billing-settings-invoice-mobile-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.billing-settings-invoice-mobile-title{
  font-weight:800;
  line-height:1.25;
  word-break:break-word;
}
.billing-settings-invoice-mobile-meta{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  color:var(--muted);
  margin-top:6px;
}
.billing-settings-invoice-mobile-btn{
  white-space:nowrap;
  flex-shrink:0;
}
.billing-settings-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.billing-settings-plan-label{
  margin:0;
  cursor:pointer;
}
.billing-settings-plan-layout{
  display:flex;
  gap:8px;
}
.billing-settings-weight-700{ font-weight:700; }
.billing-settings-weight-800{ font-weight:800; }
.billing-settings-cycle-row{
  display:flex;
  gap:16px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:10px;
}
.billing-settings-addons-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:8px;
}
.billing-settings-addon-included{
  display:none;
  margin-left:6px;
}
.billing-settings-field-sm{
  margin-top:8px;
  max-width:220px;
}
.billing-settings-input-sm{
  max-width:220px;
}

.contact-show-section{ margin-top:14px; }
.contact-show-section-lg{ margin-top:16px; }
.contact-show-section-top{ margin-top:12px; }
.contact-show-row-actions{ display:flex; gap:10px; flex-wrap:wrap; }
.contact-show-grid-240{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
.contact-show-grid-220{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.contact-show-grid-180{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.contact-show-grid-180-wide{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.contact-show-grid-220-wide{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.contact-show-grid-200{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:10px; }
.contact-show-scroll{ margin-top:12px; overflow:auto; }
.contact-show-title{ margin:0; }
.contact-show-h2{ margin:0; font-size:18px; }
.contact-show-subtitle{ margin-top:6px; }
.contact-show-note{ margin-top:4px; }
.contact-show-note-lg{ margin-top:6px; }
.contact-show-bold{ font-weight:700; }
.contact-show-semibold{ font-weight:800; }
.contact-show-black{ font-weight:900; }
.contact-show-size-20{ font-size:20px; }
.contact-show-size-28{ font-size:28px; }
.contact-show-padding-12{ padding:12px; }
.contact-show-text-right{ text-align:right; }
.contact-show-prewrap{ white-space:pre-wrap; }
.contact-show-margin-bottom-8{ margin-bottom:8px; }
.contact-show-margin-top-8{ margin-top:8px; }
.quote-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.text-right{ text-align:right; }
.deal-show-section{ margin-top:14px; }
.deal-show-section-sm{ margin-top:12px; }
.deal-show-section-lg{ margin-top:16px; }
.deal-show-flex-18{ display:flex; gap:18px; flex-wrap:wrap; }
.deal-show-grid-180{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:12px; margin-top:12px; }
.deal-show-grid-280{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:14px; margin-top:14px; }
.deal-show-grid-180-gap-14{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; }
.deal-show-scroll{ overflow:auto; }
.deal-show-card-muted{ border:1px solid rgba(15,23,42,.08); }
.deal-show-card-accent{ border:1px solid rgba(0,122,255,.22); background:rgba(0,122,255,.04); }
.deal-show-card-success{ border:1px solid rgba(0,160,120,.35); }
.deal-show-weight-800{ font-weight:800; }
.deal-show-weight-900{ font-weight:900; }
.deal-show-title{ margin:0; }
.deal-show-title-sm{ margin:0; font-size:18px; }
.deal-show-subtitle{ margin-top:6px; }
.deal-show-subtitle-6{ margin-top:6px; }
.deal-show-subtitle-8{ margin-top:8px; }
.deal-show-subtitle-10{ margin-top:10px; }
.deal-show-subtitle-12{ margin-top:12px; }
.deal-show-subtitle-14{ margin-top:14px; }
.deal-show-prewrap{ white-space:pre-wrap; }
.deal-show-items-end{ align-items:end; }
.deal-show-items-center{ align-items:center; }
.deal-show-items-flex-end{ align-items:flex-end; }
.deal-show-mobile-offset{ margin-top:10px; }
.deal-show-field-240{ margin:0; min-width:240px; }
.deal-show-panel{ margin-top:14px; }
.deal-show-panel-tight{ margin-top:12px; }
.deal-show-panel-plain{ margin-top:14px; }
.deal-show-preview-box{ margin-bottom:12px; }
.deal-show-preview-label{ font-weight:800; margin-top:6px; }
.deal-show-live-timer{ margin-top:6px; }
.deal-show-inline-block{ display:inline-block; }
.flash-banner{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  max-width:760px;
  margin-left:auto;
  margin-right:auto;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:18px;
  background:rgba(255,255,255,.94);
  box-shadow:var(--shadow);
}
.flash-banner.is-success{
  border-color:rgba(0,160,120,.35);
  background:rgba(0,160,120,.08);
}
.flash-banner.is-error{
  border-color:rgba(185,28,28,.18);
  background:rgba(185,28,28,.06);
}
.flash-banner-copy{
  font-weight:700;
  line-height:1.45;
}
.flash-banner-actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-shrink:0;
}
.flash-banner.is-success .flash-banner-copy{
  color:var(--text);
}
.flash-banner.is-error .flash-banner-copy{
  color:#991b1b;
}
.flash-banner-close{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:36px;
  min-height:36px;
  border:1px solid rgba(16,32,56,.10);
  border-radius:12px;
  background:rgba(255,255,255,.82);
  color:var(--muted);
  font:inherit;
  font-size:22px;
  line-height:1;
  cursor:pointer;
}
  .flash-banner-close:hover{
  background:#fff;
  color:var(--text);
}
.mfa-setup-card{
  max-width:560px;
}
.mfa-setup-grid{
  display:grid;
  grid-template-columns:168px minmax(0, 1fr);
  gap:14px;
  align-items:start;
}
.mfa-qr-panel{
  display:grid;
  gap:8px;
}
.mfa-qr-frame{
  display:flex;
  align-items:center;
  justify-content:center;
  width:168px;
  min-height:168px;
  padding:8px;
  border:1px solid rgba(16,32,56,.12);
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 28px rgba(16,32,56,.08);
}
.mfa-qr-canvas{
  display:flex;
  align-items:center;
  justify-content:center;
  width:148px;
  height:148px;
}
.mfa-qr-canvas img,
.mfa-qr-canvas canvas,
.mfa-qr-canvas svg{
  display:block;
  width:148px;
  height:148px;
}
.mfa-setup-fields{
  min-width:0;
}
.live-timer{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:112px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(0,153,230,.10);
  border:1px solid rgba(0,153,230,.28);
  color:var(--text);
  font-weight:900;
  letter-spacing:.08em;
  font-variant-numeric:tabular-nums;
}

/* Buttons */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.92);
  color:var(--text);
  font-weight:700;
  font-size:14px;
  line-height:1;
  cursor:pointer;
  transition:all .18s ease;
}
.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(2,8,23,.10);
}
.btn:active{ transform:translateY(0); }

/* Primary */
.btn.primary{
  background:var(--accent);
  color:#fff;
  border-color:var(--accent);
  box-shadow:0 12px 30px rgba(23,147,232,.22);
}
.btn.primary:hover{ filter:brightness(1.02); }

.btn.is-active-filter{
  background:#fff;
  color:var(--accent);
  border-color:rgba(0,153,230,.55);
  box-shadow:0 0 0 4px var(--accent-weak);
}

.btn.small{
  padding:6px 10px;
  font-size:13px;
  min-width:72px;
}

.btn.danger{
  border-color: rgba(239,68,68,.5);
  color:#b91c1c;
  background:#fff;
}
.btn.danger:hover{
  box-shadow:0 10px 22px rgba(239,68,68,.10);
}

/* Forms */
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:12px; }
.field--compact{ margin-bottom:0; }
label{ color:var(--muted); font-size:13px; }

input, textarea, select{
  padding:10px 12px;
  border-radius:var(--control-radius);
  border:1px solid var(--line);
  background:#fff;
  color:var(--text);
  outline:none;
  font:inherit;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select{
  min-height:var(--control-height);
  height:var(--control-height);
  line-height:1.2;
}
select{
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  padding-right:38px;
  border-radius:var(--control-radius);
  background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%23475569' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 12px center;
  background-size:14px 14px;
}
input:focus, textarea:focus, select:focus{
  border-color: rgba(0,153,230,.80);
  box-shadow:0 0 0 4px var(--accent-weak);
}

.availability-rule-row{
  display:grid;
  grid-template-columns:90px 120px 120px 95px;
  gap:8px;
  align-items:end;
  justify-content:start;
}
.availability-rule-row .field{
  margin:0;
}

/* Support */
.support-hero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.support-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));
  gap:12px;
}
.support-card{
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--card);
  padding:16px 18px;
  box-shadow:0 1px 2px rgba(16,32,56,.04);
}
.support-card summary{
  display:flex;
  flex-direction:column;
  gap:3px;
  cursor:pointer;
  list-style:none;
}
.support-card summary strong{ font-size:15px; font-weight:700; letter-spacing:-.01em; }
.support-card summary .small{ color:var(--muted); }
.support-card summary::-webkit-details-marker{
  display:none;
}
.support-card[open] summary{
  margin-bottom:13px;
}
.support-card ol,
.support-section > ol{
  list-style:none;
  margin:0;
  padding:0;
  counter-reset:support-step;
  display:grid;
  gap:9px;
}
.support-card ol li,
.support-section > ol li{
  position:relative;
  padding-left:30px;
  margin:0;
  font-size:14px;
  line-height:1.5;
  counter-increment:support-step;
}
.support-card ol li::before,
.support-section > ol li::before{
  content:counter(support-step);
  position:absolute;
  left:0;
  top:1px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:var(--accent-weak);
  color:var(--accent);
  font-size:11px;
  font-weight:700;
  display:flex;
  align-items:center;
  justify-content:center;
}
.support-section-head{ margin:24px 2px 12px; }
.support-section-head h2{ font-size:17px; font-weight:750; letter-spacing:-.01em; margin:0; }
.support-section-head .small{ color:var(--muted); font-size:14px; margin-top:4px; }
.support-link-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}
.support-link{
  min-width:140px;
}
.support-link.is-available{
  color:var(--accent);
  border-color:rgba(23,147,232,.45);
  background:rgba(255,255,255,.96);
  box-shadow:0 0 0 3px rgba(23,147,232,.08);
}
.support-link.is-available:hover{
  box-shadow:0 10px 22px rgba(23,147,232,.12);
}
.support-link.is-upgrade{
  color:var(--text);
  border-color:var(--line);
  background:rgba(255,255,255,.92);
}
.support-upgrade-note{
  margin-top:10px;
  color:var(--muted);
}
.support-section{
  margin-bottom:14px;
}
.support-section-top{
  margin-top:14px;
}
.support-title{
  margin:6px 0 0;
}
.support-title-section{
  margin:0;
  font-size:18px;
}
.support-title-lg{
  margin:0;
  font-size:22px;
}
.support-copy-top-4{ margin-top:4px; }
.support-copy-top-6{ margin-top:6px; }
.support-copy-top-8{ margin-top:8px; }
.support-copy-top-12{ margin-top:12px; }
.support-copy-danger{ color:#b91c1c; }
.support-copy-success{ color:#0f766e; }
.support-form{
  margin-top:12px;
}
.support-score-grid{
  display:grid;
  grid-template-columns:repeat(11,minmax(0,1fr));
  gap:8px;
}
.support-score-option{
  padding:0;
  min-height:46px;
}
.support-radio-hidden{
  display:none;
}
.support-field-top{
  margin-top:12px;
}
.support-action-top{
  margin-top:12px;
}
.support-grid-form{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:10px;
}
.support-field-flush{
  margin:0;
}

/* Table */
.table{ width:100%; border-collapse:collapse; }
.table th,.table td{
  text-align:left;
  padding:10px;
  border-bottom:1px solid var(--line);
  vertical-align:top;
}
.table th{ color:var(--muted); font-weight:800; }
.table tr[data-row-link]{ cursor:pointer; }
.table tr[data-row-link]:hover td{ background:rgba(0,153,230,.04); }
.desktop-only{ display:block; }
.mobile-only{ display:none; }
.entity-card-list{
  display:grid;
  gap:10px;
}
.entity-card{
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background:rgba(255,255,255,.94);
  box-shadow:var(--shadow);
}
.entity-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.entity-card-title{ font-weight:900; }
.entity-card-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 12px;
  margin-top:12px;
}
.entity-card-meta .k{ color:var(--muted); font-size:12px; }
.entity-card-meta .v{ font-weight:700; margin-top:2px; }
.entity-card-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}
.split-form{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.form-section-title{
  margin:0 0 6px;
  font-size:18px;
  font-weight:900;
  letter-spacing:-.02em;
}
.step-chip{
  display:inline-flex;
  align-items:center;
  min-height:32px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(23,147,232,.10);
  border:1px solid rgba(23,147,232,.18);
  color:var(--text);
  font-weight:800;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.05em;
}
.appointments-admin-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
}
.appointments-admin-card{
  min-width:0;
}
.appointments-inline-fields{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.appointments-inline-fields.two{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.appointments-index-header{
  margin-bottom:14px;
}
.appointments-index-title{
  margin:0;
}
.appointments-index-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.appointments-index-filter{
  margin-bottom:12px;
}
.appointments-index-filter-row{
  gap:10px;
  align-items:flex-end;
}
.appointments-index-field-sm{
  margin:0;
  min-width:160px;
}
.appointments-index-field-md{
  margin:0;
  min-width:180px;
}
.appointments-index-table-wrap{
  margin-bottom:16px;
  overflow:auto;
}
.appointments-index-mobile{
  margin-bottom:16px;
}
.appointments-index-admin{
  align-items:flex-start;
  margin-top:16px;
}
.appointments-index-section-title{
  font-size:18px;
  margin:0 0 10px;
}
.appointments-index-form{
  display:grid;
  gap:8px;
}
.appointments-index-field-flush{
  margin:0;
}
.appointments-index-copy-bottom{
  margin-bottom:8px;
}
.appointments-index-copy-bottom-lg{
  margin-bottom:10px;
}
.appointments-index-copy-top{
  margin-top:8px;
}
.appointments-index-source-divider{
  border:none;
  border-top:1px solid var(--line);
  margin:12px 0;
}
.appointments-index-source-card{
  padding:10px;
  margin-bottom:8px;
}
.appointments-index-inline-actions{
  display:flex;
  gap:8px;
  margin-top:8px;
  flex-wrap:wrap;
}
.appointments-index-pages{
  margin-top:16px;
}
.appointments-index-page-card{
  padding:10px;
  margin-bottom:10px;
}
.appointments-index-page-head{
  margin-bottom:8px;
}
.appointments-index-page-field{
  margin-top:8px;
}
.appointments-index-copy-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:6px;
  flex-wrap:wrap;
}
.appointments-index-update-grid{
  display:grid;
  gap:8px;
}
.appointments-index-row{
  gap:8px;
  align-items:flex-end;
}
.appointments-index-save-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.appointments-index-delete-form{
  margin-top:8px;
}
.appointments-book-page{
  --bg:#f7fafc;
  --card:#fff;
  --line:rgba(15,23,42,.12);
  --text:#0f172a;
  --muted:#475569;
  --accent:#0099e6;
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.appointments-book-page .appointments-book-wrap{
  max-width:780px;
  margin:0 auto;
  padding:20px;
}
.appointments-book-page .appointments-book-card{
  margin-bottom:12px;
}
.appointments-book-page .appointments-book-title{
  margin:0 0 8px;
}
.appointments-book-page .appointments-book-hidden-field{
  display:none;
}
.appointments-book-page .card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  margin-bottom:12px;
}
.appointments-book-page .field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:10px;
}
.appointments-book-page label{
  font-size:13px;
  color:var(--muted);
}
.appointments-book-page input,
.appointments-book-page select,
.appointments-book-page textarea{
  padding:10px;
  border:1px solid var(--line);
  border-radius:10px;
}
.appointments-book-page button{
  background:var(--accent);
  color:#fff;
  border:0;
  border-radius:10px;
  padding:11px 14px;
  font-weight:700;
  cursor:pointer;
}
.appointments-book-page .small{
  font-size:13px;
  color:var(--muted);
}
.appointments-book-page .ok{
  color:#166534;
}
.appointments-book-page .err{
  color:#b91c1c;
}
.time-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:#fff;
  box-shadow:var(--shadow);
}
.time-card + .time-card{ margin-top:10px; }
.time-index-title{ margin:6px 0 0; }
.time-index-heading{ margin:0; font-size:18px; }
.time-index-section{ margin-top:14px; }
.time-index-stack-top-4{ margin-top:4px; }
.time-index-stack-top-6{ margin-top:6px; }
.time-index-stack-top-8{ margin-top:8px; }
.time-index-stack-top-10{ margin-top:10px; }
.time-index-stack-top-12{ margin-top:12px; }
.time-index-filter-form{
  margin-top:12px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-end;
}
.time-index-field-wide{
  min-width:220px;
  flex:1;
}
.time-index-field-narrow{ min-width:180px; }
.time-index-active-card{
  margin-top:0;
  border:1px solid rgba(0,160,120,.35);
}
.time-index-strong-top{
  font-weight:900;
  margin-top:4px;
}
.time-index-grid-main{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:14px;
  margin-top:14px;
}
.time-index-card-reset{ margin:0; }
.time-index-form-top{ margin-top:12px; }
.time-index-grid-180{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
}
.time-index-metric-value{
  font-weight:900;
  margin-top:4px;
}
.time-index-table-wrap{
  margin-top:10px;
  overflow:auto;
}
.time-index-text-right{ text-align:right; }
.time-index-empty{ padding:8px 0; }
.time-index-empty-title{ font-weight:800; }
.time-index-empty-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.time-index-mobile-list{ margin-top:10px; }
.dashboard-view-title{ margin:0; }
.dashboard-view-heading{ margin:0; font-size:18px; }
.dashboard-view-stack-top-6{ margin-top:6px; }
.dashboard-view-stack-top-10{ margin-top:10px; }
.dashboard-view-section{ margin-top:14px; }
.dashboard-view-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.dashboard-view-section-label{
  margin-top:14px;
  font-weight:700;
}
.dashboard-view-section-label-alt{
  margin-top:16px;
  font-weight:700;
}
.dashboard-view-metrics-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:8px;
}
.dashboard-view-metric-value{
  font-weight:900;
  margin-top:4px;
}
.dashboard-view-focus-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:14px;
}
.dashboard-view-card-reset{ margin:0; }
.dashboard-view-strong-top{
  font-weight:800;
  margin-top:6px;
}
.dashboard-view-bars{
  margin-top:8px;
  display:grid;
  gap:8px;
}
.dashboard-view-bar-track{
  height:8px;
  background:#e5e7eb;
  border-radius:999px;
  overflow:hidden;
}
.dashboard-view-bar-fill{
  display:block;
  height:8px;
  border-radius:999px;
  color:transparent;
  white-space:nowrap;
}
.dashboard-view-bar-fill--blue{ background:#0ea5e9; }
.dashboard-view-bar-fill--purple{ background:#8b5cf6; }
.dashboard-view-bar-fill--red{ background:#ef4444; }
.dashboard-view-section-actions{ margin-top:14px; }
.email-settings-panel{ margin-bottom:14px; }
.email-settings-title{ margin:6px 0 0; }
.email-settings-heading{ font-size:18px; margin:14px 0 10px; }
.email-settings-heading-tight{ font-size:18px; margin:0 0 10px; }
.email-settings-stack-top-10{ margin-top:10px; }
.email-settings-form-top{ margin-top:12px; }
.email-settings-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.email-settings-field-wide{
  min-width:220px;
  flex:1;
}
.email-settings-field-port{
  min-width:120px;
  flex:1;
}
.email-settings-field-security{
  min-width:160px;
  flex:1;
}
.email-settings-field-large{
  min-width:260px;
  flex:1;
}
.email-settings-test-form{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-end;
}
.email-settings-test-field{
  min-width:280px;
  margin-bottom:0;
}
.client-portal-title{ margin:6px 0 0; }
.client-portal-heading{ font-size:20px; margin:0; }
.client-portal-stack-top-6{ margin-top:6px; }
.client-portal-section{ margin-top:14px; }
.client-portal-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:14px;
  margin-top:14px;
}
.client-portal-stat-value{
  font-size:30px;
  font-weight:900;
  margin-top:8px;
}
.client-portal-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.client-portal-text-right{ text-align:right; }
.client-portal-columns{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);
  gap:14px;
  margin-top:14px;
}
.client-portal-messages{
  margin-top:12px;
  display:grid;
  gap:10px;
}
.client-portal-message-card{ padding:12px; }
.client-portal-message-subject{
  font-weight:800;
  margin-top:6px;
}
.client-portal-message-body{
  margin-top:6px;
  white-space:pre-wrap;
}
.client-portal-form-top{ margin-top:12px; }
.client-portal-label-top{ margin-top:10px; }
.client-portal-button-top{ margin-top:12px; }
.projects-index-title{ margin:0; }
.projects-index-heading{ margin:0; font-size:18px; }
.projects-index-stack-top-4{ margin-top:4px; }
.projects-index-stack-top-6{ margin-top:6px; }
.projects-index-stack-top-12{ margin-top:12px; }
.projects-index-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}
.projects-index-stat-value{
  font-weight:900;
  margin-top:4px;
}
.projects-index-filter-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
}
.projects-index-field-reset{ margin:0; }
.projects-index-filter-actions{
  display:flex;
  gap:10px;
  align-items:end;
}
.projects-index-team-card{ margin-top:12px; }
.projects-index-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.projects-index-mobile-top{ margin-top:12px; }
.projects-index-label-strong{ font-weight:700; }
.projects-index-overdue-list{
  display:grid;
  gap:8px;
  margin-top:8px;
}
.projects-index-card-reset{ margin:0; }
.projects-index-empty{ padding:8px 0; }
.projects-index-empty-title{ font-weight:800; }
.projects-index-empty-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.project-show-flash{ margin-bottom:12px; }
.project-show-title{ margin:6px 0 0; }
.project-show-stack-top-6{ margin-top:6px; }
.project-show-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.project-show-template-form{
  display:flex;
  gap:8px;
  align-items:end;
}
.project-show-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}
.project-show-strong-top{
  font-weight:800;
  margin-top:4px;
}
.project-show-description{
  margin-top:12px;
  white-space:pre-wrap;
}
.project-show-status-form{
  margin-top:12px;
  display:flex;
  gap:10px;
  align-items:end;
  flex-wrap:wrap;
}
.project-show-field-reset{ margin:0; }
.project-show-field-wide{ min-width:220px; }
.project-show-status-actions{
  margin-top:12px;
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.project-show-section{ margin-top:14px; }
.project-show-heading{ margin:0; font-size:18px; }
.project-show-task-form{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
}
.project-show-field-full{ grid-column:1 / -1; }
.project-show-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.project-show-text-right{ text-align:right; }
.project-show-table-actions{
  display:flex;
  gap:8px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
}
.project-show-status-select{ min-width:120px; }
.project-show-mobile-top{ margin-top:12px; }
.appointment-view-header{ margin-bottom:14px; }
.appointment-view-title{ margin:0; }
.appointment-view-actions{
  display:flex;
  gap:8px;
}
.appointment-view-layout{
  align-items:flex-start;
  gap:16px;
}
.appointment-view-main{
  flex:1 1 520px;
  min-width:320px;
}
.appointment-view-status{
  font-size:20px;
  font-weight:700;
  margin-bottom:10px;
}
.appointment-view-value{ margin-bottom:10px; }
.appointment-view-notes{ white-space:pre-wrap; }
.appointment-view-custom{ margin-top:14px; }
.appointment-view-custom-row{ margin-top:6px; }
.appointment-view-side{
  flex:1 1 320px;
  min-width:320px;
}
.appointment-view-heading{
  font-size:18px;
  margin:0 0 10px;
}
.appointment-view-form{
  display:grid;
  gap:8px;
}
.appointment-view-divider{
  border:none;
  border-top:1px solid var(--line);
  margin:12px 0;
}
.appointment-view-hint{ margin-top:8px; }
.appointment-form-header{ margin-bottom:14px; }
.appointment-form-title{ margin:0; }
.appointment-form-grid{
  display:grid;
  gap:10px;
}
.appointment-form-row{
  gap:10px;
  align-items:flex-end;
}
.appointment-form-field-reset{ margin:0; }
.appointment-form-field-260{
  flex:1 1 260px;
  margin:0;
}
.appointment-form-field-220{
  flex:1 1 220px;
  margin:0;
}
.appointment-form-field-240{
  flex:1 1 240px;
  margin:0;
}
.appointment-form-field-200{
  flex:1 1 200px;
  margin:0;
}
.appointment-form-field-180-flex{
  flex:1 1 180px;
  margin:0;
}
.appointment-form-field-170{
  min-width:170px;
  margin:0;
}
.appointment-form-field-180{
  min-width:180px;
  margin:0;
}
.appointment-form-field-190{
  min-width:190px;
  margin:0;
}
.appointment-form-field-150{
  min-width:150px;
  margin:0;
}
.appointment-form-actions{
  display:flex;
  gap:8px;
  margin-top:8px;
}
.users-index-panel{ margin-bottom:16px; }
.users-index-title{ margin:0 0 10px; }
.users-index-heading{ font-size:18px; margin:0 0 10px; }
.users-index-heading-tight{ font-size:18px; margin:0 0 12px; }
.users-index-copy-gap{ margin-bottom:12px; }
.users-index-field-no-bottom{ margin-bottom:0; }
.users-index-row-top{ align-items:flex-start; }
.users-index-field-260{ flex:1 1 260px; }
.users-index-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.users-index-inline-check-sm{
  display:flex;
  gap:6px;
  align-items:center;
}
.users-index-stack-top-6{ margin-top:6px; }
.users-index-stack-top-10{ margin-top:10px; }
.users-index-table-wrap{ overflow:auto; }
.users-index-inline-form{
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.users-index-password-inline{ min-width:220px; }
.users-index-mobile-top{ margin-top:12px; }
.users-index-mobile-form{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.custom-fields-panel{ margin-bottom:14px; }
.custom-fields-title{ margin:6px 0 0; }
.custom-fields-heading{ font-size:18px; margin:0 0 10px; }
.custom-fields-copy-gap{ margin-bottom:10px; }
.custom-fields-stack-top-10{ margin-top:10px; }
.custom-fields-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.custom-fields-field-wide{
  min-width:220px;
  flex:1;
}
.custom-fields-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
  margin-top:28px;
}
.custom-fields-table-wrap{ overflow:auto; }
.custom-fields-actions-stack{
  display:grid;
  gap:8px;
}
.custom-fields-edit-form{
  display:grid;
  gap:6px;
}
.custom-fields-input-wide{ min-width:170px; }
.custom-fields-inline-check-sm{
  display:flex;
  gap:6px;
  align-items:center;
}
.custom-fields-input-sort{ max-width:90px; }
.integrations-view-title{ margin:6px 0 0; }
.integrations-view-heading{ margin:0; font-size:18px; }
.integrations-view-stack-top-6{ margin-top:6px; }
.integrations-view-stack-top-8{ margin-top:8px; }
.integrations-view-section{ margin-top:14px; }
.integrations-view-copy-grid{
  margin-top:8px;
  display:grid;
  gap:6px;
}
.integrations-view-form-top{ margin-top:14px; }
.integrations-view-field-top{ margin-top:12px; }
.integrations-view-checklist{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.integrations-view-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.integrations-view-language-field{
  max-width:320px;
  margin-top:12px;
}
.integrations-view-actions{
  display:flex;
  gap:10px;
  margin-top:14px;
  flex-wrap:wrap;
  align-items:center;
}
.orders-view-title{ margin:6px 0 0; }
.orders-view-stack-top-6{ margin-top:6px; }
.orders-view-stack-top-12{ margin-top:12px; }
.orders-view-actions{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
}
.orders-view-status-form{
  margin-top:12px;
  display:flex;
  gap:10px;
  align-items:end;
  flex-wrap:wrap;
}
.orders-view-field-reset{ margin:0; }
.orders-view-field-wide{ min-width:220px; }
.orders-view-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}
.orders-view-stat-value{
  font-weight:900;
  margin-top:4px;
}
.orders-view-section{ margin-top:14px; }
.orders-view-heading{ margin:0; font-size:18px; }
.orders-view-item-form{
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
}
.orders-view-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.orders-view-text-right{ text-align:right; }
.orders-index-title{ margin:0; }
.orders-index-stack-top-6{ margin-top:6px; }
.orders-index-stack-top-10{ margin-top:10px; }
.orders-index-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}
.orders-index-stat-value{
  font-weight:900;
  margin-top:4px;
}
.orders-index-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.orders-index-text-right{ text-align:right; }
.orders-index-empty{ padding:8px 0; }
.orders-index-empty-title{ font-weight:800; }
.orders-index-empty-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.orders-index-mobile-top{ margin-top:12px; }
.products-index-title{ margin:0; }
.products-index-stack-top-4{ margin-top:4px; }
.products-index-stack-top-6{ margin-top:6px; }
.products-index-stack-top-12{ margin-top:12px; }
.products-index-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.products-index-stats-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:12px;
}
.products-index-stat-value{
  font-weight:900;
  margin-top:4px;
}
.products-index-import-form{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:flex-end;
}
.products-index-import-field{
  margin-bottom:0;
  min-width:280px;
}
.products-index-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.products-index-empty{ padding:8px 0; }
.products-index-empty-title{ font-weight:800; }
.products-index-text-right{ text-align:right; }
.time-card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}
.time-card-title{ font-weight:900; }
.time-card-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px 12px;
  margin-top:10px;
}
.time-card-grid .k{ color:var(--muted); font-size:12px; }
.time-card-grid .v{ font-weight:700; margin-top:2px; }
.time-card-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:12px;
}

/* Pipeline board */
.pipeline{
  display:grid;
  grid-auto-flow:column;
  grid-auto-columns:minmax(260px, 1fr);
  gap:14px;
  overflow:auto;
  padding-bottom:10px;
}
.pipe-col{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  min-height:220px;
  box-shadow: var(--shadow);
}
.pipe-head{
  padding:12px 12px 10px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
}
.pipe-list{
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.pipe-card{
  border:1px solid var(--line);
  border-radius:14px;
  padding:12px;
  background:#fff;
}
.pipe-empty{
  padding:10px;
  border:1px dashed rgba(15,23,42,.18);
  border-radius:14px;
}
.pipe-card select{ width:100%; margin-top:6px; }

@media (max-width:820px){
  .auth-simple-brand{
    justify-content:center;
    padding-left:0;
  }
  .auth-simple-brand img{
    width:58px;
  }
  .auth-simple-brand-title{
    font-size:30px;
  }
  .auth-simple-card{
    padding:24px 20px;
  }
  .topbar{
    align-items:flex-start;
  }
  .nav-toggle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
  }
  .nav{
    display:none;
    width:100%;
    margin-top:10px;
    padding-top:10px;
    border-top:1px solid var(--line);
    flex-direction:column;
    align-items:stretch;
  }
  .nav.is-open{
    display:flex;
  }
  .nav .pill{
    width:100%;
    justify-content:flex-start;
  }
  .menu-dropdown{
    width:100%;
  }
  .menu-dropdown .pill{
    width:100%;
  }
  .settings-trigger{
    justify-content:flex-start;
    min-height:44px;
    font-size:15px;
  }
  .settings-trigger.has-unread{
    background:rgba(239,68,68,.08);
  }
  .settings-trigger .gear-icon{
    font-size:22px;
  }
  .settings-trigger .settings-label{
    display:inline;
  }
  .menu-dropdown-panel{
    position:static;
    margin-top:6px;
    width:100%;
  }
  .nav-toggle-badge{
    top:-4px;
    right:-4px;
  }
  .pipeline{
    grid-auto-flow:row;
    grid-auto-columns:unset;
    grid-template-columns:1fr;
    overflow:visible;
    padding-bottom:0;
  }
  .pipe-col{ min-height:auto; }
  .pipe-list{ padding:10px; }
  .appointments-admin-grid{
    grid-template-columns:1fr;
  }
  .split-form{
    grid-template-columns:1fr;
  }
}
@media (min-width:821px){
  .pipeline{ scroll-snap-type:x mandatory; }
  .pipe-col{ scroll-snap-align:start; }
}
.pipe-card.is-dragging{ opacity:.55; }
.pipe-list.is-over{
  outline:2px dashed rgba(0,153,230,.55);
  outline-offset:6px;
  border-radius:14px;
}

/* ==========================
   Quote (customer-facing)
========================== */
.quote-doc{
  max-width:980px;
  margin:0 auto;
  padding:18px;
}

.quote-toolbar{
  display:flex;
  gap:12px;
  justify-content:flex-end;
  flex-wrap:wrap;
  margin-bottom:16px;
}
.quote-toolbar .btn{ min-width:130px; }

.quote-header{
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:18px;
  border-radius:var(--radius);
  border:1px solid var(--line);
  background:#fff;
  box-shadow: var(--shadow);
}

.quote-brand{
  display:flex;
  gap:14px;
  align-items:flex-start;
}

.quote-logo-badge{
  width:64px;
  height:64px;
  border-radius:16px;
  background:#fff;
  border:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.quote-logo-img{
  max-height:54px;
  max-width:54px;
  width:auto;
  height:auto;
  display:block;
}
.quote-logo-fallback{
  font-weight:900;
  font-size:20px;
  color:var(--text);
}

.quote-brand-text{ min-width:260px; }
.quote-brand-name{ font-weight:900; font-size:18px; line-height:1.1; }
.quote-brand-line{
  margin-top:3px;
  line-height:1.25;
  color:var(--muted);
  font-size:12.5px;
}

.quote-meta{ text-align:right; min-width:220px; }
.quote-number{ font-size:18px; font-weight:900; }
.quote-meta-row{ margin-bottom:6px; color:var(--muted); }
.quote-meta-row .quote-number,
.quote-meta-row .quote-date{ color:var(--text); }

.quote-badge{
  display:inline-flex;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  font-weight:800;
  margin-top:10px;
  color:var(--text);
}

.quote-badge[data-status="draft"]{
  background:#fff;
  border-color: rgba(15,23,42,.16);
}

.quote-badge[data-status="accepted"]{
  background:#16a34a;
  color:#fff;
  border:none;
}

.quote-badge[data-status="rejected"]{
  background:#dc2626;
  color:#fff;
  border:none;
}

.quote-panels{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-top:14px;
}
@media (max-width:820px){
  .quote-panels{ grid-template-columns:1fr; }
}

.quote-panel{
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow: var(--shadow);
}
.quote-panel-title{
  padding:12px 12px 10px;
  border-bottom:1px solid var(--line);
  font-weight:900;
}
.quote-panel-body{ padding:12px; }
.quote-strong{ font-weight:900; margin-bottom:6px; }

.quote-subject{ margin:12px 2px 0; color:var(--muted); }

.quote-text{
  margin-top:12px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  padding:12px;
  box-shadow: var(--shadow);
}
.quote-text p{ margin:0; color:var(--text); }

.quote-table{ margin-top:14px; }
.quote-sum-row td{ border-bottom:none; }
.quote-total td{
  padding-top:14px;
  border-top:1px solid var(--line);
  font-size:16px;
}

.quote-footer{
  margin-top:14px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#fff;
  box-shadow: var(--shadow);
}

.quote-edit-title{ margin:6px 0 0; }
.quote-edit-heading{ margin:0; font-size:18px; }
.quote-edit-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.quote-edit-actions-align{ align-items:center; }
.quote-edit-inline-form{ display:inline; }
.quote-edit-stack-top-8{ margin-top:8px; }
.quote-edit-stack-top-10{ margin-top:10px; }
.quote-edit-stack-top-12{ margin-top:12px; }
.quote-edit-section{ margin-top:14px; }
.quote-edit-grid-220{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:12px;
}
.quote-edit-card-reset{ margin:0; }
.quote-edit-strong-top{
  font-weight:800;
  margin-top:4px;
}
.quote-edit-small-top{ margin-top:6px; }
.quote-edit-table-wrap{
  margin-top:10px;
  overflow:auto;
}
.quote-edit-cell-actions{ text-align:right; }
.quote-edit-cell-action-group{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  flex-wrap:wrap;
}
.quote-edit-form-top{ margin-top:12px; }
.quote-edit-field-grid,
.quote-edit-field-grid-wide{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.quote-edit-field-flex{
  min-width:160px;
  flex:1;
}
.quote-edit-field-wide{
  min-width:220px;
  flex:1;
}
.quote-edit-inline-check{
  display:flex;
  gap:8px;
  align-items:center;
}
.quote-edit-totals-wrap{
  margin-top:10px;
  display:flex;
  justify-content:flex-end;
}
.quote-edit-totals-card{ min-width:280px; }
.quote-edit-row-space{ justify-content:space-between; }
.quote-edit-strong-total{ font-weight:900; }
.quote-edit-template-form{
  display:flex;
  gap:8px;
  align-items:end;
  flex-wrap:wrap;
}
.quote-edit-save-state{ margin-left:auto; }

.reports-heading-main{ margin:0; }
.reports-heading-section{ font-size:18px; margin:0; }
.reports-stack-top-6{ margin-top:6px; }
.reports-section{ margin-top:14px; }
.reports-field-reset{ margin:0; }
.reports-filter-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:10px;
  margin-top:12px;
}
.reports-filter-actions{
  display:flex;
  gap:10px;
  align-items:end;
  flex-wrap:wrap;
}
.reports-period-row{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
  margin-top:12px;
}
.reports-ticket-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:10px;
  margin-top:12px;
}
.reports-ticket-card{
  border:1px solid #ecece8;
  border-radius:14px;
  padding:14px;
}
.reports-ticket-title{
  font-weight:800;
  margin-top:4px;
}
.reports-kpi-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-top:12px;
}
.reports-kpi-card {
  border:1px solid #ecece8;
  border-radius:16px;
  padding:16px;
  min-width:0;
}
.reports-kpi-value {
  margin-top:8px;
  font-size:24px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:-0.03em;
  overflow-wrap:anywhere;
  word-break:break-word;
}
.reports-kpi-meta { margin-top:10px; }
.reports-kpi-prev { margin-top:6px; }
.reports-secondary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
  margin-top:14px;
}
.reports-stat-value{
  font-weight:900;
  margin-top:4px;
}
.reports-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.reports-text-right{ text-align:right; }

.report-sheet{
  max-width:1240px;
  margin:0 auto;
  background:#fff;
  border:1px solid #e3e3de;
  border-radius:14px;
  padding:24px;
}
.report-top{
  display:flex;
  justify-content:space-between;
  gap:16px;
  align-items:center;
  border-bottom:1px solid #e3e3de;
  padding-bottom:14px;
}
.report-title{
  margin:0;
  font-size:32px;
  letter-spacing:-.02em;
}
.report-muted{ color:#5e5e5e; }
.report-top-actions{ display:flex; gap:8px; flex-wrap:wrap; }
.report-notice{
  margin:0 0 12px;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid #d6eadf;
  background:#f3fbf6;
  color:#1f5130;
}
.report-notice-locked{
  border-color:#e6cfa6;
  background:#fff7e8;
  color:#5a3b08;
}
.report-sheet:has(.report-notice-locked) #report-form{
  pointer-events:none;
  opacity:.65;
  filter:grayscale(.2);
}
.report-sheet:has(.report-notice-locked) #report-form input,
.report-sheet:has(.report-notice-locked) #report-form select,
.report-sheet:has(.report-notice-locked) #report-form textarea,
.report-sheet:has(.report-notice-locked) #report-form button{
  cursor:not-allowed;
}
.report-lock-form{
  margin-top:18px;
  padding-top:18px;
  border-top:1px dashed rgba(16,32,56,.16);
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.report-lock-btn{
  background:#5a3b08;
  border-color:#5a3b08;
  color:#fff;
}
.report-lock-btn:hover{ filter:brightness(1.1); }

/* Pipeline-stages settings */
#pipeline-stages-table td,
#pipeline-stages-table th{ vertical-align:middle; }
.pipeline-stages-handle-col{ width:32px; }
.pipeline-stages-handle{
  cursor:grab;
  user-select:none;
  color:rgba(16,32,56,.4);
  font-weight:800;
  letter-spacing:-1px;
}
.pipeline-stages-handle:active{ cursor:grabbing; }
.pipeline-stages-dragging{ opacity:.45; background:#f5f6f9; }
.pipeline-stages-inline-form,
.pipeline-stages-delete-form{ display:inline-flex; gap:6px; align-items:center; flex-wrap:wrap; }
.pipeline-stages-prob-input{ width:64px; text-align:right; }
.pipeline-stages-delete-btn{ color:#a23a3a; }

/* Deal activities timeline */
.deal-activities{ padding:18px; }
.deal-activities-form{
  background:#f5f6f9; padding:14px; border-radius:12px;
  display:flex; flex-direction:column; gap:10px;
}
.deal-activities-form-row{
  display:grid;
  grid-template-columns:140px 1fr 200px 200px;
  gap:10px;
}
@media (max-width:720px){
  .deal-activities-form-row{ grid-template-columns:1fr; }
}
.deal-activities-form textarea{ width:100%; resize:vertical; }
.deal-activities-list{
  list-style:none; margin:0; padding:0;
  display:flex; flex-direction:column; gap:12px;
}
.deal-activity{
  padding:12px 14px;
  border:1px solid rgba(16,32,56,.10);
  border-radius:10px;
  background:#fff;
  display:flex; flex-direction:column; gap:6px;
}
.deal-activity--done{ opacity:.65; background:#fafbfd; }
.deal-activity--overdue{ border-left:4px solid #a23a3a; }
.deal-activity-meta{
  display:flex; flex-wrap:wrap; gap:6px;
  align-items:center; color:#5a6a82; font-size:13px;
}
.deal-activity-type{
  display:inline-block; padding:2px 8px;
  border-radius:999px; background:#eaf2ff;
  color:#102038; font-weight:700; font-size:12px;
}
.deal-activity[data-type="task"] .deal-activity-type{ background:#fff7e8; color:#5a3b08; }
.deal-activity[data-type="call"] .deal-activity-type{ background:#e8f7ee; color:#1f5130; }
.deal-activity[data-type="email"] .deal-activity-type{ background:#f1ebfb; color:#3a2470; }
.deal-activity-title{ font-weight:700; }
.deal-activity-body{ color:#222; line-height:1.5; }
.deal-activity-actions{
  display:flex; gap:8px; flex-wrap:wrap;
  margin-top:4px;
}
.deal-activity-inline{ display:inline; }
.deal-activity-delete{ color:#a23a3a; }

/* Dashboard "my tasks" widget */
.dashboard-my-tasks{ padding:18px; }
.dashboard-my-tasks-list{
  list-style:none; margin:14px 0 0; padding:0;
  display:flex; flex-direction:column; gap:8px;
}
.dashboard-my-task{
  display:flex; align-items:flex-start; gap:12px;
  padding:10px 12px;
  border:1px solid rgba(16,32,56,.10);
  border-radius:10px;
  background:#fff;
}
.dashboard-my-task--overdue{ border-left:4px solid #a23a3a; background:#fff8f7; }
.dashboard-my-task-toggle{ margin:0; flex:0 0 auto; }
.dashboard-my-task-check{
  width:32px; height:32px; padding:0;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:8px; font-weight:800;
}
.dashboard-my-task-text{ flex:1 1 auto; min-width:0; }
.dashboard-my-task-title{ font-weight:700; color:inherit; text-decoration:none; }
.dashboard-my-task-title:hover{ text-decoration:underline; }
.dashboard-my-task-meta{ margin-top:4px; color:#5a6a82; }
.dashboard-my-task-due{ font-weight:700; }
.dashboard-my-task--overdue .dashboard-my-task-due{ color:#a23a3a; }

/* Quote items: drag-reorder */
.quote-items-handle-col{ width:28px; }
.quote-items-handle{
  cursor:grab; user-select:none;
  color:rgba(16,32,56,.4);
  font-weight:800; letter-spacing:-1px;
  padding-left:8px; padding-right:8px;
}
.quote-items-handle:active{ cursor:grabbing; }
.quote-items-dragging{ opacity:.45; background:#f5f6f9; }

/* Quote catalog typeahead */
.quote-catalog-typeahead{ position:relative; }
.quote-catalog-results{
  position:absolute; left:0; right:0; top:100%;
  z-index:30;
  background:#fff;
  border:1px solid rgba(16,32,56,.16);
  border-radius:10px;
  box-shadow:0 10px 24px rgba(16,32,56,.10);
  max-height:280px; overflow-y:auto;
  margin-top:4px;
}
.quote-catalog-result{
  padding:10px 12px;
  cursor:pointer;
  border-bottom:1px solid rgba(16,32,56,.06);
  display:flex; flex-direction:column; gap:2px;
}
.quote-catalog-result:last-child{ border-bottom:none; }
.quote-catalog-result:hover{ background:#f5f6f9; }

/* Invoice index inline actions + status pills */
.invoices-index-actions{
  display:flex; gap:6px; flex-wrap:wrap;
  justify-content:flex-end; align-items:center;
}
.invoices-index-inline{ display:inline; margin:0; }
/* Gedeelde status-badge component (deals, offertes, facturen, ...) */
.badge{
  display:inline-flex; align-items:center; gap:6px;
  height:22px; padding:0 10px;
  border-radius:999px;
  font-size:12.5px; font-weight:650; line-height:1;
  white-space:nowrap; vertical-align:middle;
}
.badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; }
.badge--neutral{ background:#eef1f5; color:#54617a; }
.badge--info{    background:#eaf1ff; color:#1b5fd9; }
.badge--ok{      background:#e4f4ec; color:#0f7a54; }
.badge--warn{    background:#fbefda; color:#8a5a11; }
.badge--bad{     background:#fbe8e4; color:#c23a2a; }
.badge--violet{  background:#eee9fb; color:#5b45c9; }
.badge--muted{   background:#f0f0f0; color:#777; }

/* Factuur-status pills — visueel gelijk aan .badge */
.invoices-index-status-pill{
  display:inline-flex; align-items:center; gap:6px;
  height:22px; padding:0 10px;
  border-radius:999px; font-weight:650; font-size:12.5px; line-height:1;
  white-space:nowrap; vertical-align:middle;
  background:#eef1f5; color:#54617a;
}
.invoices-index-status-pill::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; flex:none; }
.invoices-index-status--draft{ background:#eef1f5; color:#54617a; }
.invoices-index-status--sent{ background:#eaf1ff; color:#1b5fd9; }
.invoices-index-status--paid{ background:#e4f4ec; color:#0f7a54; }
.invoices-index-status--overdue{ background:#fbe8e4; color:#c23a2a; }
.invoices-index-status--cancelled{ background:#f0f0f0; color:#777; text-decoration:line-through; }

/* Report room photos */
.report-room-photos-cell{ min-width:180px; }
.report-room-photos-thumbs{
  display:flex; flex-wrap:wrap; gap:6px;
  margin-bottom:6px;
}
.report-room-photo-thumb{
  position:relative;
  width:48px; height:48px;
  border-radius:6px; overflow:hidden;
  background:#f0f0f0;
  cursor:default;
  display:block;
}
.report-room-photo-thumb img{
  width:100%; height:100%; object-fit:cover;
}
.report-room-photo-remove{
  position:absolute; top:2px; right:2px;
  background:rgba(0,0,0,.55); color:#fff;
  border-radius:50%; width:18px; height:18px;
  display:flex; align-items:center; justify-content:center;
  font-size:14px; line-height:1;
  cursor:pointer;
}
.report-room-photo-remove input{
  position:absolute; opacity:0; pointer-events:none;
}
.report-room-photo-remove:has(input:checked) { background:#a23a3a; }
.report-room-photos-input{
  display:block; width:100%; font-size:12px;
}

/* Report versions list (Sprint C+) */
.report-notice-versions{ background:#eef3fb; border-color:#c7d6ec; color:#1f3d70; }
.report-versions-list{ margin:8px 0 0; padding-left:18px; display:grid; gap:4px; }
.report-versions-list li{ line-height:1.6; }
.report-versions-list code{ background:rgba(255,255,255,.6); padding:1px 4px; border-radius:3px; font-size:12px; }

/* Report rooms editor */
.report-rooms-table input.report-input-narrow{ width:80px; padding-left:6px; padding-right:6px; }
.report-room-area{
  font-weight:700;
  background:#f5f6f9;
  text-align:right;
  padding:6px 10px;
  min-width:64px;
}
.report-rooms-table th, .report-rooms-table td{ vertical-align:middle; }
.report-rooms-table tr:has([data-room-area-display]:not(:empty)) [data-room-area-display]{ color:#1f5130; }
.report-render-rooms-block{ margin-bottom:18px; }
.report-render-rooms-layer-title{ margin:0 0 8px; font-size:14pt; }
.report-render-rooms-table{ width:100%; }
.report-render-rooms-col-name{ width:22%; }
.report-render-rooms-col-cat{ width:14%; }
.report-render-rooms-col-num{ width:10.66%; }
.report-render-shell .report-render-rooms-table td:first-child,
.report-render-shell .report-render-rooms-table td:nth-child(2){
  white-space:normal;
  word-break:break-word;
  text-align:left;
  font-weight:400;
}
.report-render-shell .report-render-rooms-table td.total-row,
.report-render-shell .report-render-rooms-table tr.total-row td{ font-weight:600; }

/* Foto's per ruimte — één foto per A4-pagina, gecentreerd, behoudt aspect ratio. */
.report-render-room-photos-title{ margin:0 0 10mm; font-size:11pt; font-weight:600; color:#1f2937; }
.report-render-room-photo-page{ break-inside:avoid; page-break-inside:avoid; }
.report-render-room-photo{
  display:block;
  width:100%;
  margin:0;
  text-align:center;
}
.report-render-room-photo img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:215mm;
  object-fit:contain;
  margin:0 auto;
}
@media screen{
  /* Cosmetisch alleen in browser-preview; mPDF crasht op border-radius/background
     bij borderdraws (raakt _setBorderLine intern) → niet in PDF render. */
  .report-render-room-photo img{ border-radius:4px; background:#f5f5f3; }
}
.report-render-room-photo figcaption{
  font-size:9pt;
  color:#475569;
  margin-top:6mm;
  line-height:1.3;
  text-align:center;
}
@media print{
  .report-render-room-photo img{ max-height:200mm; }
}
.report-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:14px;
  margin-top:16px;
}
.report-field{
  grid-column:span 6;
  display:grid;
  gap:6px;
}
.report-field.third{ grid-column:span 4; }
.report-field.full{ grid-column:1/-1; }
.report-label{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#5e5e5e;
}
.report-input,
.report-textarea,
.report-select{
  padding:11px 12px;
  border:1px solid #e3e3de;
  border-radius:10px;
  font:inherit;
  background:#fff;
}
.report-textarea{
  min-height:110px;
  resize:vertical;
}
.report-section{
  margin-top:18px;
  border-top:1px solid #e3e3de;
  padding-top:18px;
}
.report-table{
  width:100%;
  border-collapse:collapse;
  min-width:1450px;
}
.report-table th,
.report-table td{
  text-align:left;
  padding:8px;
  border-bottom:1px solid #e3e3de;
  vertical-align:top;
}
.report-table th{
  font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#5e5e5e;
}
.report-table-wrap{
  overflow:auto;
  border:1px solid #e3e3de;
  border-radius:10px;
}
.report-photo-row,
.report-page-row{
  display:grid;
  grid-template-columns:120px 1fr auto;
  gap:10px;
  margin-bottom:10px;
  align-items:start;
}
.report-thumb{
  width:120px;
  height:78px;
  object-fit:cover;
  border-radius:8px;
  border:1px solid #e3e3de;
}
.report-new-photo-row{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(260px,1fr) 220px;
  gap:10px;
  margin-bottom:10px;
  align-items:center;
}
.report-new-photo-row.has-remove{
  grid-template-columns:minmax(0,2fr) minmax(260px,1fr) 220px 150px;
}
.report-new-page-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.8fr) minmax(0,1fr) 150px;
  gap:8px;
  margin-bottom:8px;
  align-items:center;
}
.report-new-photo-row > *,
.report-new-page-row > *{
  min-width:0;
  max-width:100%;
}
.report-actions{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.report-autocomplete{ position:relative; }
.report-autocomplete-list{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 6px);
  max-height:220px;
  overflow:auto;
  background:#fff;
  border:1px solid #e3e3de;
  border-radius:10px;
  box-shadow:0 10px 22px rgba(2,8,23,.10);
  z-index:20;
}
.report-autocomplete-item{
  display:block;
  width:100%;
  text-align:left;
  padding:9px 11px;
  border:0;
  background:#fff;
  cursor:pointer;
  font:inherit;
}
.report-autocomplete-item:hover{ background:#f6f8fb; }
.report-autocomplete-empty{ padding:9px 11px; color:#64748b; font-size:14px; }
.report-signature-preview{
  margin-top:8px;
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}
.report-signature-image{
  height:70px;
  max-width:260px;
  object-fit:contain;
  border:1px solid #e3e3de;
  border-radius:8px;
  padding:6px;
  background:#fff;
}
.report-measurement-inline{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  align-items:center;
}
.report-measurement-total-row{
  font-weight:700;
  background:#fff9b0;
}
.report-photo-meta-grid{
  display:grid;
  grid-template-columns:1fr 140px;
  gap:8px;
}
.report-page-meta-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.report-delete-btn{
  border-color:#d44;
  color:#b91c1c;
}

/* Reports index */
.reports-head{
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}
.reports-head-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.reports-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  table-layout:fixed;
}
.reports-table th,
.reports-table td{
  padding:10px 8px;
  vertical-align:middle;
  border-bottom:1px solid #ecece8;
}
.reports-table thead th{
  font-size:13px;
  text-align:left;
}
.reports-table th:nth-child(1),
.reports-table td:nth-child(1){ width:58px; }
.reports-table th:nth-child(2),
.reports-table td:nth-child(2){ width:26%; }
.reports-table th:nth-child(3),
.reports-table td:nth-child(3){ width:140px; }
.reports-table th:nth-child(4),
.reports-table td:nth-child(4){ width:20%; }
.reports-table th:nth-child(5),
.reports-table td:nth-child(5){ width:34%; }
.reports-table th:nth-child(6),
.reports-table td:nth-child(6){ width:320px; }
.reports-ellipsis{
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.reports-actions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}
.reports-actions form{ margin:0; }
.reports-actions .btn{ white-space:nowrap; }
.reports-mobile-meta{ display:none; }
.reports-delete-btn{
  border-color:#d44;
  color:#b91c1c;
}

@media (max-width:900px){
  .report-field,
  .report-field.third{ grid-column:1/-1; }
  .report-photo-row,
  .report-page-row,
  .report-new-page-row,
  .report-new-photo-row{ grid-template-columns:1fr; }
}

@media (max-width:820px){
  .reports-head{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .reports-head .btn{ width:100%; }

  .reports-table{ table-layout:auto; }
  .reports-table thead{ display:none; }
  .reports-table,
  .reports-table tbody,
  .reports-table tr,
  .reports-table td{
    display:block;
    width:100%;
  }

  .reports-table tbody tr{
    border:1px solid #e5e7eb;
    border-radius:12px;
    padding:10px 12px;
    margin:0 0 10px;
    background:#fff;
  }
  .reports-table th,
  .reports-table td{
    border-bottom:0;
    padding:4px 0;
  }

  .reports-table td:nth-child(1),
  .reports-table td:nth-child(3),
  .reports-table td:nth-child(4),
  .reports-table td:nth-child(5){
    display:none;
  }
  .reports-table td:nth-child(2),
  .reports-table td:nth-child(6){
    width:100% !important;
    max-width:none;
  }

  .reports-table td:nth-child(2){
    font-size:18px;
    font-weight:700;
    line-height:1.3;
    margin-bottom:2px;
  }
  .reports-table td:nth-child(2) .reports-ellipsis{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    line-height:1.25;
    margin-bottom:6px;
  }
  .reports-mobile-meta{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    color:#475569;
    font-weight:500;
    margin-bottom:8px;
    white-space:nowrap;
  }
  .reports-mobile-meta b{
    color:#0f172a;
    font-weight:700;
    margin-right:0;
  }
  .reports-table td:nth-child(6){
    margin-top:4px;
  }
  .reports-actions{
    justify-content:flex-start;
    gap:6px;
  }
  .reports-actions .btn{
    min-height:36px;
    padding:0 12px;
    font-size:13px;
  }
}

@media (max-width:700px){
  .desktop-only{ display:none !important; }
  .mobile-only{ display:block; }
  .billing-settings-invoices-toolbar{
    grid-template-columns:1fr;
  }
  .billing-settings-invoices-desktop{ display:none !important; }
  .entity-card-list.billing-settings-invoices-mobile{ display:grid !important; }
  .billing-settings-invoice-mobile-item{
    padding:10px 12px;
  }
  .billing-settings-invoice-mobile-top{
    align-items:center;
  }
  .billing-settings-invoice-mobile-title{
    font-size:15px;
  }
  .billing-settings-invoice-mobile-btn{
    min-height:36px;
    padding:0 12px;
    font-size:13px;
  }
  .entity-card-meta,
  .time-card-grid,
  .appointments-inline-fields,
  .appointments-inline-fields.two{
    grid-template-columns:1fr;
  }
  .availability-rule-row{
    grid-template-columns:1fr 1fr;
  }
  .topbar{
    gap:12px;
  }
  .flash-banner{
    flex-direction:column;
    align-items:stretch;
  }
  .mfa-setup-card{
    max-width:none;
  }
  .mfa-setup-grid{
    grid-template-columns:1fr;
  }
  .mfa-qr-frame{
    width:100%;
    max-width:168px;
  }
  .flash-banner-actions{
    justify-content:flex-start;
  }
  .wrap{
    padding:14px;
  }
  .brand-app-text{
    font-size:18px;
  }
  .appointments-book-wrap{
    padding:14px;
  }
}
@media (min-width:1200px){
  .reports-kpi-value{ font-size:28px; }
}

.platform-dashboard{
  max-width:1100px;
  margin:0 auto;
}
.platform-dashboard-section{
  margin-top:16px;
}
.platform-kpi-grid,
.platform-chart-grid,
.platform-ops-grid{
  display:grid;
  gap:12px;
}
.platform-kpi-grid{
  grid-template-columns:repeat(auto-fit, minmax(210px, 1fr));
}
.platform-chart-grid{
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
}
.platform-ops-grid{
  grid-template-columns:repeat(auto-fit, minmax(240px, 1fr));
}
.platform-kpi-card{
  padding:18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fff;
  box-shadow:var(--shadow);
}
.platform-kpi-value{
  margin-top:8px;
  font-size:30px;
  font-weight:900;
  letter-spacing:-.04em;
}
.platform-bars{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(72px, 1fr));
  gap:10px;
  align-items:end;
}
.platform-bars-double{
  grid-template-columns:repeat(auto-fit, minmax(82px, 1fr));
}
.platform-bar-group{
  display:grid;
  gap:8px;
  align-items:end;
}
.platform-bar-double{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  align-items:end;
}
.platform-bar-stack{
  display:grid;
  gap:6px;
}
.platform-bar-value{
  min-height:32px;
  color:var(--muted);
  font-size:12px;
  line-height:1.3;
}
.platform-bar-track{
  display:flex;
  align-items:flex-end;
  justify-content:center;
  border-radius:16px;
  background:rgba(16,32,56,.06);
  padding:8px;
}
.platform-bar-track-tall{
  min-height:172px;
}
.platform-bar-track-medium{
  min-height:148px;
}
.platform-bar{
  width:100%;
  border-radius:12px;
}
.platform-bar-svg{
  width:100%;
  display:block;
}
.platform-bar-svg-tall{
  height:150px;
}
.platform-bar-svg-medium{
  height:130px;
}
.platform-bar-accent{
  background:linear-gradient(180deg, #5bb9f7 0%, #1793e8 100%);
  fill:#1793e8;
}
.platform-bar-secondary{
  background:linear-gradient(180deg, #1cc6a3 0%, #0f9f8a 100%);
  fill:#0f9f8a;
}
.platform-bar-positive{
  background:linear-gradient(180deg, #49c98a 0%, #199f63 100%);
  fill:#199f63;
}
.platform-bar-negative{
  background:linear-gradient(180deg, #f39886 0%, #ee5c4d 100%);
  fill:#ee5c4d;
}
.platform-bar-label{
  color:var(--muted);
  font-size:12px;
}
.platform-metric-list{
  display:grid;
  gap:10px;
  margin-top:14px;
}
.platform-metric-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:10px 0;
  border-bottom:1px solid rgba(16,32,56,.08);
}
.platform-metric-row:last-child{
  border-bottom:0;
  padding-bottom:0;
}
.platform-metric-row span{
  color:var(--muted);
}
@media (max-width:760px){
  .platform-chart-grid,
  .platform-ops-grid,
  .platform-kpi-grid{
    grid-template-columns:1fr;
  }
}

.quotes-start-title,
.quotes-index-title,
.deals-pipeline-title,
.support-ticket-title{
  margin:0;
}
.quotes-start-errors,
.quotes-start-grid,
.deals-pipeline-filters,
.deals-pipeline-board,
.quotes-index-summary-grid,
.quotes-index-filters,
.quotes-index-table-wrap,
.quotes-index-mobile-list,
.support-ticket-meta,
.support-ticket-card-spaced{
  margin-top:12px;
}
.quotes-start-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
  gap:14px;
  margin-top:14px;
}
.quotes-start-card{ margin:0; }
.quotes-start-card-title{
  margin:0;
  font-size:18px;
}
.quotes-start-card-copy,
.deals-pipeline-copy,
.support-ticket-status,
.deals-pipeline-card-company{
  margin-top:6px;
}
.quotes-start-form,
.deals-pipeline-stage-form{
  margin-top:12px;
}
.quotes-start-form-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:10px;
}
.quotes-start-field-full{
  grid-column:1 / -1;
}
.deals-pipeline-actions,
.quotes-index-filters{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.deals-pipeline-filters{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:14px;
}
.deals-pipeline-summary{ margin-left:auto; }
.deals-pipeline-board{ margin-top:14px; }
.deals-pipeline-stage-title,
.deals-pipeline-card-title{
  font-weight:800;
}
.deals-pipeline-card-link{
  display:block;
  color:inherit;
  text-decoration:none;
}
.deals-pipeline-card-value{ margin-top:8px; }
.quotes-index-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}
.quotes-index-summary-value{
  margin-top:4px;
  font-weight:900;
}
.quotes-index-table-wrap{
  overflow:auto;
}
.quotes-index-text-right{ text-align:right; }
.quotes-index-amount-cell{
  text-align:right;
  font-weight:800;
}
.support-ticket-shell{
  max-width:980px;
  margin:24px auto;
}
.support-ticket-header-row{
  align-items:flex-start;
}
.support-ticket-message-admin{
  background:rgba(23,147,232,.05);
}
.support-ticket-message-body{
  margin-top:6px;
  white-space:pre-wrap;
}
.support-ticket-message-time{ margin-top:8px; }
.audit-logs-card-spaced{ margin-bottom:16px; }
.audit-logs-title{
  margin:0 0 10px;
}
.audit-logs-filter-row{
  align-items:flex-end;
  gap:12px;
}
.audit-logs-field{
  margin-bottom:0;
}
.audit-logs-field-medium{ min-width:180px; }
.audit-logs-field-date{ min-width:170px; }
.audit-logs-field-limit{ min-width:110px; }
.audit-logs-table-wrap,
.contacts-index-table-wrap,
.invoices-index-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.billing-complete-shell{
  max-width:760px;
  margin:32px auto;
}
.billing-complete-title{
  margin:0 0 8px;
}
.billing-complete-stack{ margin-top:14px; }
.billing-complete-sim-card{ margin-bottom:10px; }
.billing-complete-sim-copy{ margin-bottom:8px; }
.billing-complete-actions-stack,
.billing-complete-actions-row{
  margin-top:10px;
}
.billing-complete-actions-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.billing-complete-error{ margin-top:12px; }
.contacts-index-title,
.invoices-index-title{
  margin:0;
}
.contacts-index-copy{ margin-top:6px; }
.contacts-index-filters{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:end;
  margin-top:12px;
}
.contacts-index-field{
  margin:0;
}
.contacts-index-field-wide{
  min-width:220px;
}
.contacts-index-field-medium{
  min-width:180px;
}
.contacts-index-field-value{
  min-width:200px;
  flex:1;
}
.contacts-index-field-sort{ min-width:160px; }
.contacts-index-field-presence{ min-width:190px; }
.contacts-index-field-wide.contacts-index-field{
  flex:1;
}
.contacts-form-title,
.deals-edit-title,
.products-edit-title{
  margin:0;
}
.contacts-form,
.deals-edit-form,
.order-item-edit-form,
.products-edit-form,
.products-edit-delete-form{
  margin-top:12px;
}
.contacts-form-address-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.contacts-form-address-field{
  min-width:160px;
  flex:1;
}
.deals-edit-contact-grid{
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  margin-top:10px;
}
.deals-edit-contact-value{
  margin-top:6px;
  font-weight:800;
}
.order-item-edit-title{
  margin:6px 0 0;
}
.order-item-edit-actions,
.order-item-edit-actions-row,
.products-edit-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.order-item-edit-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
  gap:12px;
}
.order-item-edit-actions-row,
.products-edit-delete-note{
  margin-top:12px;
}
.products-edit-delete-note{ margin-top:8px; }
.invoices-index-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
  margin-top:12px;
}
.invoices-index-summary-value{
  margin-top:4px;
  font-weight:900;
}
.invoices-index-text-right{ text-align:right; }
.invoices-bulk-form{ margin:0; padding:0; }
.invoices-bulk-bar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0;
  padding:10px 12px;
  background:var(--surface-2, #f6f7f9);
  border:1px solid var(--border, #e3e6ea);
  border-radius:8px;
}
.invoices-bulk-bar[hidden]{ display:none; }
.invoices-bulk-count{ font-weight:600; }
.invoices-bulk-cell{ width:32px; text-align:center; }
.deals-bulk-form{ margin:0; padding:0; }
.deals-bulk-bar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0;
  padding:10px 12px;
  background:var(--surface-2, #f6f7f9);
  border:1px solid var(--border, #e3e6ea);
  border-radius:8px;
}
.deals-bulk-bar[hidden]{ display:none; }
.deals-bulk-count{ font-weight:600; }
.deals-bulk-cell{ width:32px; text-align:center; }
.contacts-bulk-form{ margin:0; padding:0; }
.contacts-bulk-bar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin:12px 0;
  padding:10px 12px;
  background:var(--surface-2, #f6f7f9);
  border:1px solid var(--border, #e3e6ea);
  border-radius:8px;
}
.contacts-bulk-bar[hidden]{ display:none; }
.contacts-bulk-count{ font-weight:600; }
.contacts-bulk-cell{ width:32px; text-align:center; }
.invoices-index-amount-cell{
  text-align:right;
  font-weight:800;
}
.item-edit-title{
  margin:0;
}
.item-edit-form{
  margin-top:12px;
}
.item-edit-grid{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.item-edit-field{
  min-width:160px;
  flex:1;
}
.item-edit-free-field{
  margin-top:8px;
}
.item-edit-free-label{
  display:flex;
  gap:8px;
  align-items:center;
}
.leadforms-new-title,
.quote-item-edit-title{
  margin:0;
}
.leadforms-new-form,
.quote-item-edit-form,
.time-entry-edit-form,
.time-entry-edit-delete-form{
  margin-top:12px;
}
.leadforms-new-field-error{ margin-bottom:8px; }
.leadforms-new-option-row{
  display:flex;
  gap:10px;
  align-items:center;
  margin-top:6px;
}
.leadforms-new-option-label{
  display:flex;
  gap:8px;
  align-items:center;
}
.leadforms-new-option-label-wide{ min-width:180px; }
.leadforms-index-title,
.products-edit-title{
  margin:0;
}
.leadforms-index-table-wrap{
  margin-top:12px;
  overflow:auto;
}
.custom-fields-block{ margin-top:14px; }
.custom-fields-title{ margin-bottom:8px; }
.custom-fields-checkbox{
  display:flex;
  gap:8px;
  align-items:center;
  margin-bottom:10px;
}
.quote-item-edit-grid{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}
.quote-item-edit-field{
  min-width:160px;
  flex:1;
}
.time-entry-edit-title{
  margin:6px 0 0;
}
.time-entry-edit-actions,
.time-entry-edit-actions-row{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.auth-classic-wrap{
  max-width:780px;
  margin:18px auto 42px;
  padding:0 16px;
}
.auth-classic-brand{
  display:flex;
  align-items:center;
  gap:16px;
  margin:0 auto 18px;
  max-width:780px;
  padding-left:26px;
}
.auth-classic-brand img{
  width:92px;
  height:auto;
}
.auth-classic-brand-title{
  font-size:48px;
  line-height:1;
  font-weight:900;
  color:#16367f;
  letter-spacing:-0.04em;
}
.auth-classic-shell{
  position:relative;
  max-width:780px;
  margin:0 auto;
  background:#fff;
  border:1px solid #dbe5ef;
  border-top:6px solid #2196f3;
  border-radius:12px;
  box-shadow:0 12px 36px rgba(15,47,109,.08);
  padding:34px 48px 28px;
}
.auth-classic-tab{
  position:absolute;
  top:-6px;
  right:0;
  background:#2196f3;
  color:#fff;
  padding:20px 34px;
  border-radius:0 12px 0 20px;
  font-size:18px;
  font-weight:900;
  letter-spacing:.02em;
}
.auth-classic-title{
  font-size:15px;
  color:#64748b;
  margin:0 0 18px;
  max-width:560px;
}
.auth-classic-field{ margin:0 0 20px; }
.auth-classic-label{
  display:block;
  font-size:15px;
  color:#6b7280;
  font-weight:800;
  margin-bottom:10px;
}
.auth-classic-input,
.auth-classic-select{
  width:100%;
  min-height:58px;
  border:1px solid #d7e1ec;
  border-radius:12px;
  padding:14px 16px;
  font-size:16px;
  background:#fff;
}
.auth-classic-divider{
  height:1px;
  background:#e5edf5;
  margin:8px 0 20px;
}
.auth-classic-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:6px;
}
.auth-classic-submit{
  background:#2196f3;
  color:#fff;
  border:none;
  border-radius:14px;
  padding:14px 24px;
  font-size:16px;
  font-weight:800;
  box-shadow:0 10px 24px rgba(33,150,243,.22);
}
.auth-classic-links{
  margin-top:24px;
  font-size:16px;
  color:#6b7280;
}
.auth-classic-links a{
  color:#1290f2;
  text-decoration:none;
  font-weight:700;
}
.auth-classic-signup-link{ margin-top:12px; }
.auth-classic-footer{
  margin-top:18px;
  text-align:center;
  color:#9aa4b2;
  font-size:14px;
}
.auth-classic-notice{ margin-bottom:16px; }
.embed-shell{
  margin:0;
  padding:16px;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  color:#0f172a;
  background:#fff;
}
.embed-shell *,
.embed-shell *::before,
.embed-shell *::after{
  box-sizing:border-box;
}
.embed-wrap{
  margin:0 auto;
  border:1px solid rgba(15,23,42,.14);
  border-radius:14px;
  padding:14px;
}
.appointment-embed-wrap{ max-width:760px; }
.leadform-embed-wrap{ max-width:680px; }
.embed-title{
  margin:0 0 10px;
  font-size:20px;
}
.embed-subtitle{
  margin-bottom:12px;
  color:#475569;
  font-size:13px;
}
.embed-wrap .field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
}
.embed-wrap input,
.embed-wrap select,
.embed-wrap textarea{
  width:100%;
  border:1px solid rgba(15,23,42,.14);
  border-radius:10px;
  padding:10px 12px;
}
.embed-wrap button{
  border:1px solid #0099e6;
  background:#0099e6;
  color:#fff;
  border-radius:10px;
  padding:11px 14px;
  font-weight:700;
  cursor:pointer;
}
.embed-message{
  border-radius:10px;
  padding:10px 12px;
  margin-bottom:12px;
  font-size:14px;
}
.embed-message.ok{
  border:1px solid #86efac;
  background:#f0fdf4;
  color:#166534;
}
.embed-message.err{
  border:1px solid #fecaca;
  background:#fef2f2;
  color:#991b1b;
}
.embed-honeypot{
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.projects-form-contact-error{ margin-bottom:12px; }
.projects-form-meta-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
}

/* Print: maak altijd wit */
@media print{
  .noprint{ display:none !important; }
  body{ background:#fff !important; color:#000 !important; }
  .card, .quote-header, .quote-panel, .quote-text, .quote-footer{
    box-shadow:none !important;
  }
  .quote-doc{ max-width:none; padding:0; }
}
@media (max-width: 820px){
  .auth-classic-wrap{ margin-top:8px; }
  .auth-classic-brand{
    justify-content:center;
    padding-left:0;
  }
  .auth-classic-brand img{ width:70px; }
  .auth-classic-brand-title{ font-size:34px; }
  .auth-classic-shell{ padding:68px 22px 24px; }
  .auth-classic-tab{
    left:50%;
    right:auto;
    top:-18px;
    transform:translateX(-50%);
    min-width:180px;
    border-radius:14px;
    padding:12px 24px;
    text-align:center;
  }
  .auth-classic-actions{ justify-content:flex-end; }
  .auth-classic-submit{
    width:auto;
    min-width:170px;
  }
}

/* =====================================================================
   App-shell: zijbalk-navigatie voor ingelogde pagina's (desktop).
   Puur CSS bovenop de bestaande .topbar/.nav; mobiel (<901px) valt terug
   op de bestaande topbalk + hamburger. Enige markup-wijziging: body.app-shell.
   ===================================================================== */
@media (min-width:901px){
  .app-shell .topbar{
    position:fixed;
    top:0; left:0; bottom:0;
    width:252px;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:4px;
    padding:18px 12px;
    margin:0;
    background:#fff;
    border-right:1px solid var(--line);
    overflow:visible;
    z-index:40;
  }
  .app-shell .wrap{
    max-width:1680px;
    margin:0;
    padding:24px 30px 56px calc(252px + 30px);
  }
  .app-shell .topbar > .brand-app{
    padding:4px 8px 14px;
    gap:11px;
  }
  .app-shell .brand-app-logo{ height:32px; }
  .app-shell .brand-app-text{ font-size:18px; font-weight:800; }

  .app-shell .nav{
    flex-direction:column;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:2px;
    width:100%;
  }
  .app-shell .nav .pill{
    width:100%;
    justify-content:flex-start;
    min-height:38px;
    padding:0 12px;
    border:1px solid transparent;
    border-radius:10px;
    background:transparent;
    color:var(--muted);
    font-size:14px;
    font-weight:550;
    box-shadow:none;
  }
  .app-shell .nav .pill:hover{
    background:rgba(16,32,56,.05);
    color:var(--text);
  }
  .app-shell .nav .pill[data-active="1"],
  .app-shell .nav .pill.has-active{
    background:var(--accent-weak);
    border-color:transparent;
    color:var(--text);
    box-shadow:none;
    font-weight:650;
  }

  /* Dropdowns in de zijbalk: trigger vult de breedte, paneel klapt naar rechts uit */
  .app-shell .nav .menu-dropdown{ width:100%; position:relative; }
  .app-shell .nav .menu-dropdown > .pill{ width:100%; }
  .app-shell .nav .menu-dropdown-panel{
    left:calc(100% + 8px);
    right:auto;
    top:auto;
    bottom:0;
  }
  .app-shell .nav .menu-dropdown-panel-wide{ min-width:280px; }
  .app-shell .nav .settings-trigger .settings-label{ display:inline-flex; }
  .app-shell .nav .settings-trigger .gear-icon{ font-size:18px; }
}

/* Stat-tiles: ontworpen KPI-tegels (dashboard) */
.stat-tiles{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:12px;
  margin-top:10px;
}
.stat-tile{
  border:1px solid var(--line);
  border-radius:12px;
  background:#f7f9fc;
  padding:14px 15px;
}
.stat-tile-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.stat-tile-label{ font-size:12.5px; color:var(--muted); font-weight:550; }
.stat-tile-ic{ width:28px; height:28px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; flex:none; }
.stat-tile-ic svg{ width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }
.stat-tile-value{ font-size:23px; font-weight:750; margin-top:9px; letter-spacing:-.01em; font-variant-numeric:tabular-nums; }
.stat-tile-foot{ font-size:12px; margin-top:4px; color:var(--muted); }
.stat-tile-foot .neg{ color:#c23a2a; font-weight:650; }
/* Icoon-washes via classes (CSP blokkeert inline styles) */
.stat-tile-ic--brand{ background:#eaf1ff; color:#1b5fd9; }
.stat-tile-ic--violet{ background:#eee9fb; color:#5b45c9; }
.stat-tile-ic--info{ background:#eaf1ff; color:#1b5fd9; }
.stat-tile-ic--bad{ background:#fbe8e4; color:#c23a2a; }

/* Initiaal-avatars + subtiele tabel-hover */
.avatar{
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; border-radius:50%;
  color:#fff; font-size:11px; font-weight:700; flex:none; line-height:1;
}
.avatar--0{ background:#1b5fd9; }
.avatar--1{ background:#5b45c9; }
.avatar--2{ background:#0f7a54; }
.avatar--3{ background:#b5761f; }
.avatar--4{ background:#c23a2a; }
.avatar--5{ background:#0e7490; }
.avatar--6{ background:#7c3aed; }
.avatar--7{ background:#be185d; }
.avatar--none{ background:#8494a8; }
.cell-name{ display:inline-flex; align-items:center; gap:10px; }
.table tbody tr{ transition:background .12s ease; }
.table tbody tr:hover{ background:rgba(16,32,56,.028); }

/* Topbar (app-shell, desktop) — zoekbalk + notificaties + primaire actie */
.app-top{ display:none; }
.app-top-search{
  display:inline-flex; align-items:center; gap:9px;
  height:38px; padding:0 13px; min-width:260px; max-width:440px; flex:1 1 340px;
  border:1px solid var(--line); border-radius:10px; background:var(--bg);
  color:var(--muted); font:inherit; font-size:13.5px; cursor:pointer; text-align:left;
}
.app-top-search svg{ width:15px; height:15px; stroke:currentColor; fill:none; stroke-width:1.9; flex:none; }
.app-top-search span{ flex:1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.app-top-search kbd{ font-size:11px; color:var(--muted); border:1px solid var(--line); border-radius:5px; padding:1px 6px; background:#fff; flex:none; }
.app-top-actions{ margin-left:auto; display:flex; align-items:center; gap:12px; }
.app-top-bell{
  position:relative; width:38px; height:38px; flex:none;
  border:1px solid var(--line); border-radius:10px; background:#fff;
  display:inline-flex; align-items:center; justify-content:center; color:var(--muted);
}
.app-top-bell svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:1.8; }
.app-top-bell.has-unread{ border-color:rgba(194,58,42,.4); }
.app-top-bell-badge{
  position:absolute; top:-5px; right:-5px;
  background:#c23a2a; color:#fff; font-size:10px; font-weight:700;
  min-width:17px; height:17px; border-radius:9px;
  display:flex; align-items:center; justify-content:center; padding:0 4px; border:2px solid #fff;
}
@media (min-width:901px){
  .app-shell .app-top{
    display:flex; align-items:center; gap:16px;
    margin:-24px -30px 22px calc((252px + 30px) * -1);
    padding:12px 30px;
    padding-left:calc(252px + 30px);
    border-bottom:1px solid var(--line);
    background:#fff;
  }
}

/* ===== Publieke boekingspagina (Calendly-stijl) ===== */
.booking-body [hidden]{ display:none !important; }
.booking-body{ min-height:100vh; padding:24px 16px; }
.booking-shell{
  display:grid; grid-template-columns:300px 1fr;
  max-width:940px; margin:20px auto; background:var(--card);
  border:1px solid var(--line); border-radius:16px; overflow:hidden; box-shadow:var(--shadow);
}
@media (max-width:720px){ .booking-shell{ grid-template-columns:1fr; } }
.booking-aside{ padding:26px 24px; border-right:1px solid var(--line); background:#f7f9fc; }
@media (max-width:720px){ .booking-aside{ border-right:0; border-bottom:1px solid var(--line); } }
.booking-brand{ display:flex; align-items:center; gap:9px; font-weight:800; font-size:15px; color:var(--text); }
.booking-brand-mark{ width:26px; height:26px; border-radius:8px; background:linear-gradient(150deg,var(--accent),#3f86ff); display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:14px; font-weight:800; }
.booking-brand-logo{ display:block; height:28px; max-width:150px; object-fit:contain; }
.booking-title{ font-size:22px; font-weight:750; letter-spacing:-.01em; margin:18px 0 0; }
.booking-meta{ list-style:none; margin:16px 0 0; padding:0; display:grid; gap:9px; }
.booking-meta li{ display:flex; align-items:center; gap:9px; color:var(--muted); font-size:14px; }
.booking-meta svg{ width:17px; height:17px; stroke:var(--muted); fill:none; stroke-width:1.7; flex:none; }
.booking-chosen{ margin-top:22px; padding:12px 14px; border-radius:10px; background:var(--accent-weak); }
.booking-chosen-label{ font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-weight:650; }
.booking-chosen-value{ font-weight:650; margin-top:3px; }
.booking-main{ padding:26px 26px 30px; min-height:420px; }
.booking-step-title{ font-size:17px; font-weight:720; margin:0 0 16px; }
.booking-days{ display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; }
.booking-day{ display:flex; flex-direction:column; gap:2px; padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:var(--card); cursor:pointer; text-align:left; font:inherit; transition:border-color .12s, box-shadow .12s; }
.booking-day:hover{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
.booking-day-wd{ font-size:12px; color:var(--muted); text-transform:capitalize; }
.booking-day-dm{ font-size:16px; font-weight:700; }
.booking-day-count{ font-size:11px; color:var(--muted); margin-top:2px; }
.booking-times{ display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:10px; }
.booking-time{ padding:11px 8px; border:1px solid var(--line); border-radius:10px; background:var(--card); cursor:pointer; font:inherit; font-size:15px; font-weight:650; color:var(--accent); font-variant-numeric:tabular-nums; transition:border-color .12s, box-shadow .12s; }
.booking-time:hover{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-weak); }
.booking-back{ border:0; background:none; color:var(--muted); font:inherit; font-size:13px; cursor:pointer; padding:0; margin-bottom:14px; }
.booking-back:hover{ color:var(--text); }
.booking-form{ display:grid; gap:14px; max-width:460px; }
.booking-form .field{ display:grid; gap:5px; }
.booking-form label{ font-size:13px; font-weight:600; color:var(--text); }
.booking-req{ color:#c23a2a; }
.booking-submit{ justify-self:start; margin-top:4px; }
.booking-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.booking-alert{ padding:11px 14px; border-radius:10px; background:#fbe8e4; color:#c23a2a; font-size:13.5px; margin-bottom:16px; font-weight:600; }
.booking-empty{ text-align:center; padding:40px 10px; }
.booking-empty h2{ font-size:18px; font-weight:720; }
.booking-empty p{ color:var(--muted); margin-top:8px; }
.booking-confirm{ text-align:center; padding:30px 10px; }
.booking-confirm-check{ width:60px; height:60px; border-radius:50%; background:#e4f4ec; color:#0f7a54; display:inline-flex; align-items:center; justify-content:center; margin-bottom:16px; }
.booking-confirm-check svg{ width:30px; height:30px; stroke:currentColor; fill:none; stroke-width:2.4; stroke-linecap:round; stroke-linejoin:round; }
.booking-confirm-title{ font-size:21px; font-weight:750; }
.booking-confirm-when{ font-size:16px; font-weight:650; color:var(--accent); margin-top:8px; }
.booking-confirm-copy{ color:var(--muted); margin-top:10px; }

/* Lege staten (index-lijsten) */
.empty-state{ text-align:center; padding:38px 16px; display:grid; gap:9px; justify-items:center; }
.empty-state-title{ font-size:16px; font-weight:700; }
.empty-state-sub{ color:var(--muted); font-size:14px; max-width:46ch; }
.empty-state .btn{ margin-top:4px; }

/* CSP-veilige balkbreedtes (0-100%, stappen van 5) */
.bar-w-0{ width:0%; }
.bar-w-5{ width:5%; }
.bar-w-10{ width:10%; }
.bar-w-15{ width:15%; }
.bar-w-20{ width:20%; }
.bar-w-25{ width:25%; }
.bar-w-30{ width:30%; }
.bar-w-35{ width:35%; }
.bar-w-40{ width:40%; }
.bar-w-45{ width:45%; }
.bar-w-50{ width:50%; }
.bar-w-55{ width:55%; }
.bar-w-60{ width:60%; }
.bar-w-65{ width:65%; }
.bar-w-70{ width:70%; }
.bar-w-75{ width:75%; }
.bar-w-80{ width:80%; }
.bar-w-85{ width:85%; }
.bar-w-90{ width:90%; }
.bar-w-95{ width:95%; }
.bar-w-100{ width:100%; }

/* Klikbare inline-links op detailpagina's */
.link-a{ color:var(--accent); }
.link-a:hover{ text-decoration:underline; }
/* Laadstatus op submit-knoppen (data-submit-once) */
.btn.is-busy, button.is-busy{ opacity:.75; cursor:progress; }

/* Sorteerbare kolomkoppen */
.th-sort{ display:inline-flex; align-items:center; gap:4px; color:inherit; cursor:pointer; }
.th-sort:hover{ color:var(--text); }
.th-sort.is-active{ color:var(--text); }
.th-sort-arrow{ font-size:11px; color:var(--accent); font-weight:700; }
/* Paginering */
.pagination{ display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:14px; flex-wrap:wrap; }
.pagination-count{ font-size:13px; color:var(--muted); }
.pagination-btns{ display:flex; align-items:center; gap:8px; }
.pagination-page{ font-size:13px; color:var(--muted); font-variant-numeric:tabular-nums; }
.pagination-btn{ display:inline-flex; align-items:center; height:34px; padding:0 13px; border:1px solid var(--line); border-radius:9px; background:var(--card); color:var(--text); font-size:13px; font-weight:600; }
.pagination-btn:hover{ border-color:var(--accent); }
.pagination-btn.is-disabled{ color:var(--faint,#8494a8); opacity:.5; pointer-events:none; }

/* Inline bewerken van offerte-/factuurregels (CSP-veilig: classes, geen inline styles) */
.quote-inline-input{
  width:100%;
  min-width:0;
  padding:6px 8px;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--text);
  font:inherit;
  transition:border-color .12s ease, background .12s ease, box-shadow .12s ease;
}
.quote-inline-input:hover{ border-color:var(--line); background:var(--card); }
.quote-inline-input:focus{ outline:none; border-color:var(--accent); background:var(--card); box-shadow:0 0 0 3px var(--accent-weak); }
.quote-inline-num{ text-align:right; max-width:110px; }
.quote-inline-desc{ min-width:200px; }
.quote-inline-status{ font-size:12px; color:var(--muted); white-space:nowrap; }
.quote-inline-status.is-saved{ color:#0f766e; }
.quote-inline-status.is-error{ color:#b91c1c; }

/* Factuur-overzicht: afgeleide status "Herinnerd" (herinnering verstuurd, wacht op betaling) */
.invoices-index-status--reminded{ background:#fdf0d5; color:#b45309; }

/* Managementrapport: melding wanneer de gekozen periode geen activiteit heeft */
.reports-empty-note{ background:var(--accent-weak); }

/* ===== Billing schedule (platform) — CSP-safe classes ===== */
.billing-schedule-warn{ color:#d97706; }
.billing-schedule-bad{ color:#dc2626; }
.billing-schedule-muted{ color:var(--muted); }
.billing-schedule-mono{ color:var(--muted); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:11px; }
.billing-schedule-attention{ border-left:4px solid #d97706; }
.billing-schedule-table-wrap{ margin-top:12px; overflow-x:auto; }
.billing-schedule-table{ min-width:840px; font-size:13px; }
.billing-schedule-table th,
.billing-schedule-table td{ padding:8px 10px; }
.billing-schedule-row--pastdue{ background:#fffbeb; }
.billing-schedule-row--suspended{ background:#fef2f2; }
.billing-schedule-empty{ padding:20px; text-align:center; color:var(--muted); }

/* ===== Settings › Billing — premium current-plan summary ===== */
.billing-settings-plan-summary{
  background:linear-gradient(180deg, rgba(23,147,232,.05), rgba(255,255,255,.9));
  border-color:rgba(23,147,232,.20);
}
.billing-settings-plan-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.billing-settings-plan-eyebrow{
  text-transform:uppercase;
  letter-spacing:.06em;
  font-size:11px;
  font-weight:700;
  color:var(--muted);
}
.billing-settings-plan-name{
  font-size:22px;
  font-weight:800;
  letter-spacing:-.01em;
  margin-top:2px;
}
.billing-settings-plan-cycle{
  color:var(--muted);
  margin-top:2px;
}
.billing-settings-plan-badge{
  margin-top:2px;
}
.billing-settings-plan-metrics{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:10px;
  margin-top:14px;
}
.billing-settings-metric{
  border:1px solid var(--line);
  border-radius:12px;
  background:rgba(255,255,255,.7);
  padding:12px 14px;
}
.billing-settings-metric-label{
  color:var(--muted);
  font-weight:550;
}
.billing-settings-metric-value{
  font-size:19px;
  font-weight:750;
  letter-spacing:-.01em;
  margin-top:4px;
  font-variant-numeric:tabular-nums;
}
.billing-settings-metric-foot{
  color:var(--muted);
  margin-top:2px;
}
.billing-settings-section-head{
  margin:22px 2px 4px;
}
.billing-settings-section-title{
  font-size:17px;
  font-weight:750;
  letter-spacing:-.01em;
  margin:0;
}
.billing-settings-section-copy{
  color:var(--muted);
  margin-top:4px;
}
.billing-settings-submit-label{ display:inline-flex; align-items:center; }

/* ===== Signup — premium hero, steps & trust ===== */
.billing-signup-hero{
  background:linear-gradient(180deg, rgba(23,147,232,.06), rgba(255,255,255,.92));
  border-color:rgba(23,147,232,.20);
}
.billing-signup-eyebrow{
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
  font-weight:700;
  color:var(--accent);
}
.billing-signup-hero .billing-signup-title{
  font-size:28px;
  letter-spacing:-.02em;
  margin:6px 0 8px;
}
.billing-signup-hero .billing-signup-subtitle{
  color:var(--muted);
  max-width:64ch;
  margin-bottom:0;
}
.billing-signup-trust{
  list-style:none;
  margin:16px 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:8px 16px;
}
.billing-signup-trust-item{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:14px;
  font-weight:600;
}
.billing-signup-trust-ic{
  width:20px;
  height:20px;
  flex:none;
  color:var(--good);
  border-radius:50%;
  background:rgba(15,118,110,.10);
  padding:2px;
}
.billing-signup-hero .billing-signup-explainer{
  margin:18px 0 0;
}
.billing-signup-feedback{
  margin:14px 0;
}
.billing-signup-promo{
  margin-bottom:14px;
  border-color:rgba(15,122,84,.22);
  background:rgba(228,244,236,.5);
}
.billing-signup-promo-head{
  display:flex;
  align-items:center;
  gap:10px;
}
.billing-signup-promo-badge{ flex:none; }
.billing-signup-promo-line{ line-height:1.5; }
.billing-signup-form{
  display:grid;
  gap:14px;
}
.billing-signup-section{ margin:0; }
.billing-signup-step{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-bottom:14px;
}
.billing-signup-step-num{
  width:28px;
  height:28px;
  flex:none;
  border-radius:50%;
  background:var(--accent-weak);
  color:var(--accent);
  font-weight:800;
  font-size:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.billing-signup-step-title{
  font-size:17px;
  font-weight:750;
  letter-spacing:-.01em;
  margin:2px 0 0;
}
.billing-signup-step-copy{
  color:var(--muted);
  margin-top:2px;
}
.billing-signup-plan-card{
  transition:border-color .15s ease, box-shadow .15s ease;
}
.billing-signup-plan-card:hover{
  border-color:rgba(23,147,232,.45);
  box-shadow:0 8px 22px rgba(23,147,232,.10);
}
.billing-signup-plan-card:has(input:checked){
  border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-weak);
}
.billing-signup-plan-body{ min-width:0; }
.billing-signup-plan-desc{ color:var(--muted); margin-top:2px; }
.billing-signup-plan-vat{ color:var(--muted); font-weight:600; }
.billing-signup-cycle-opt,
.billing-signup-addon-opt{
  display:flex;
  align-items:baseline;
  gap:8px;
  cursor:pointer;
}
.billing-signup-addon-opt{ align-items:flex-start; padding:6px 0; }
.billing-signup-addon-text{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.billing-signup-addon-name{ font-weight:600; }
.billing-signup-addon-price{ color:var(--muted); }
.billing-signup-checkout{
  background:linear-gradient(180deg, rgba(23,147,232,.05), rgba(255,255,255,.92));
  border-color:rgba(23,147,232,.20);
}
.billing-signup-trust-compact{
  margin-top:0;
  margin-bottom:14px;
}
.billing-signup-submit-notes{ min-width:0; }
.billing-signup-submit-fine{ color:var(--muted); margin-top:4px; }
.billing-signup-submit-label{ display:inline-flex; align-items:center; }

/* ===== Shared submit loading spinner ===== */
.btn-spinner{
  width:15px;
  height:15px;
  margin-left:8px;
  border-radius:50%;
  border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;
  display:none;
  animation:billing-spin .7s linear infinite;
}
.btn.is-loading{
  opacity:.85;
  cursor:progress;
}
.btn.is-loading .btn-spinner{ display:inline-block; }
@keyframes billing-spin{
  to{ transform:rotate(360deg); }
}

/* ===== Support: Hulp-knop in topbalk + artikelkaarten ===== */
.app-top-help{
  display:inline-flex; align-items:center; gap:7px;
  padding:6px 12px; font-size:13px; font-weight:600;
  white-space:nowrap;
}
.app-top-help > span[aria-hidden]{
  display:inline-flex; align-items:center; justify-content:center;
  width:17px; height:17px; border-radius:50%;
  border:1.5px solid currentColor; font-size:11px; font-weight:700; line-height:1;
}
@media (max-width:1080px){
  .app-top-help .app-top-help-label{ display:none; }
  .app-top-help{ padding:6px 9px; }
}
a.support-card-link{
  display:flex; flex-direction:column; gap:3px;
  text-decoration:none; color:var(--text);
  transition:box-shadow .15s ease, border-color .15s ease, transform .15s ease;
}
a.support-card-link:hover{
  border-color:var(--accent);
  box-shadow:0 4px 14px rgba(16,32,56,.10);
  transform:translateY(-1px);
}
a.support-card-link strong{ font-size:15px; font-weight:700; letter-spacing:-.01em; }
a.support-card-link .small{ color:var(--muted); }
/* Contextuele "Hulp bij deze pagina" in het tandwiel-menu: alleen tonen wanneer
   de topbalk-knop verborgen is (dus op smalle schermen, <901px). */
@media (min-width:901px){
  .menu-item-help-ctx{ display:none; }
}