:root{
  --ccest-bg:#0b1020;
  --ccest-card:#0f1730;
  --ccest-card2:#0c1328;
  --ccest-text:#e9eefc;
  /* Slightly brighter for better readability on mobile outdoors */
  --ccest-muted:#c8d0ee;
  --ccest-accent:#5be7c4;
  --ccest-accent2:#ff6b3d;
  --ccest-border:rgba(255,255,255,.14);
  --ccest-shadow:0 18px 40px rgba(0,0,0,.35);
  --ccest-radius:10px;
}

/*
  Some themes/plugins ship global selectors like [class*="modal"] or override the
  built-in [hidden] attribute. These rules harden CoreEstimate so the UI remains
  clickable and the modal only appears when opened.
*/
.ccest-shell [hidden]{display:none !important;}
.ccest-shell .ccest-modal[hidden]{display:none !important;}

.ccest-shell, .ccest-shell *{box-sizing:border-box;}
.ccest-shell{
  font-family:ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
  color:var(--ccest-text);
  background:
    radial-gradient(1100px 500px at 20% 0%, rgba(91,231,196,.12), transparent 60%),
    radial-gradient(1100px 500px at 80% 0%, rgba(255,107,61,.10), transparent 60%),
    var(--ccest-bg);
  border:1px solid var(--ccest-border);
  border-radius:var(--ccest-radius);
  overflow:hidden;
  box-shadow:var(--ccest-shadow);
  max-width:980px;
  /* Desktop should sit flush to the top of the viewport/page (no empty band above the header) */
  margin:0 auto 18px;
  /* Ensures native UI controls (select dropdowns, etc.) match the theme */
  color-scheme: dark;
}

/*
  Theme hardening for typography: some themes (Salient/WPBakery) apply large
  typography + low-contrast colors to headings/labels. Force CoreEstimate's
  intended sizes + colors.
*/
.ccest-shell h1,
.ccest-shell h2,
.ccest-shell h3,
.ccest-shell h4,
.ccest-shell h5,
.ccest-shell h6{
  color:var(--ccest-text) !important;
  font-family:inherit !important;
  line-height:1.15 !important;
}

.ccest-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 14px;
  border-bottom:1px solid var(--ccest-border);
  background:linear-gradient(180deg, rgba(255,255,255,.04), transparent);
  /* Desktop uses an internal scroll region (.ccest-main), so the topbar already stays fixed.
     Sticky positioning can introduce odd offsets in some WP themes; keep it simple. */
  position:relative;
  z-index:220;
}

.ccest-top-title{
  flex: 1;
  min-width: 0;
  font-weight: 900;
  font-size: 18px;
  letter-spacing: .2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  opacity: .98;
}

.ccest-brand{display:flex; align-items:center; gap:10px; min-width:0;}
.ccest-topbar .ccest-logo{
  height:32px !important;
  width:auto !important;
  max-width:190px !important;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 10px 22px rgba(0,0,0,.32));
}
@media (max-width: 420px){
  .ccest-topbar .ccest-logo{max-width:150px !important; height:30px !important;}
}

/* Accessible-only text (used for the brand name when the logo is shown) */
.ccest-sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

.ccest-top-actions{display:flex; gap:8px; align-items:center;}


.ccest-profile{position:relative; display:flex; align-items:center;}
.ccest-profile-btn{display:flex; align-items:center; gap:8px;}
.ccest-profile-chev{font-size:12px; opacity:.85; margin-left:-2px;}

.ccest-profile-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:210px;
  max-width:calc(100vw - 24px);
  background:var(--ccest-card);
  border:1px solid var(--ccest-border);
  border-radius:14px;
  padding:8px;
  box-shadow:0 14px 30px rgba(0,0,0,.35);
  z-index:550;
}

.ccest-profile-item{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border:1px solid transparent;
  border-radius:12px;
  background:transparent;
  color:var(--ccest-text) !important;
  font:inherit;
  cursor:pointer;
  text-align:left;
}

.ccest-profile-item:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.10);
}

.ccest-profile-item.is-active{
  background:rgba(91,231,196,.12);
  border-color:rgba(91,231,196,.22);
}

.ccest-profile-ico{
  width:20px;
  display:inline-flex;
  justify-content:center;
}



.ccest-main{padding:14px; min-height:480px;}
.ccest-footer{border-top:1px solid var(--ccest-border); padding:10px 14px; background:rgba(255,255,255,.02);}
.ccest-footer-inner{display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap;}
.ccest-muted{color:var(--ccest-muted) !important; font-size:12px;}

.ccest-card{background:linear-gradient(180deg, rgba(255,255,255,.04), transparent), var(--ccest-card); border:1px solid var(--ccest-border); border-radius:var(--ccest-radius); padding:14px; box-shadow:0 10px 24px rgba(0,0,0,.25);}
.ccest-card + .ccest-card{margin-top:12px;}

/* KPI / totals cards (Invoices + other summary panels) */
.ccest-kpi-grid{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:12px; align-items:stretch;}
.ccest-kpi-grid--4{grid-template-columns:repeat(4, minmax(0, 1fr));}

/* Expenses summary tuning */
.ccest-kpi-grid--expenses{margin:0;}
.ccest-expense-kpi-footnote{margin-top:8px; margin-bottom:2px;}
.ccest-metric{background:linear-gradient(180deg, rgba(255,255,255,.05), transparent), var(--ccest-card2); border:1px solid var(--ccest-border); border-radius:14px; padding:12px 14px; box-shadow:0 10px 22px rgba(0,0,0,.18); display:flex; flex-direction:column; justify-content:center; min-height:72px;}
.ccest-metric-label{font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--ccest-muted) !important;}
.ccest-metric-value{font-size:22px; font-weight:800; margin-top:6px; line-height:1.05;}
.ccest-metric-sub{margin-top:6px; font-size:12px; color:var(--ccest-muted) !important;}

@media (max-width: 920px){
  .ccest-kpi-grid--4{grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width: 720px){
  .ccest-kpi-grid{grid-template-columns:repeat(2, minmax(0, 1fr));}
}
@media (max-width: 520px){
  .ccest-kpi-grid, .ccest-kpi-grid--4{grid-template-columns:1fr;}
  .ccest-metric{min-height:auto;}
  .ccest-metric-value{font-size:20px;}
}

/* -------------------------------------------------------------------------
   Reports (Phase 1)
   ------------------------------------------------------------------------- */

.ccest-reports-range{min-width:320px;}
.ccest-reports-range-row{display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end;}
.ccest-reports-range-row .ccest-select{min-width:170px;}
.ccest-reports-range-row .ccest-input{min-width:140px;}

@media (max-width: 720px){
  .ccest-reports-range{width:100%; min-width:0;}
  .ccest-reports-range-row{justify-content:flex-start;}
}

.ccest-trend{width:100%;}
.ccest-trend-legend{display:flex; align-items:center; gap:10px; flex-wrap:wrap; font-size:12px; color:var(--ccest-muted) !important; margin-bottom:10px;}
.ccest-trend-dot{width:10px; height:10px; border-radius:999px; display:inline-block; background:var(--ccest-accent); box-shadow:0 0 0 2px rgba(0,0,0,.25);}
.ccest-trend-dot--exp{background:var(--ccest-accent2);}

.ccest-trend-chart{border:1px solid var(--ccest-border); border-radius:14px; padding:10px 12px; background:rgba(255,255,255,.02);}
.ccest-trend-cols{display:flex; align-items:flex-end; gap:8px; height:160px;}
.ccest-trend-col{flex:1; min-width:0; position:relative; height:100%;}
.ccest-trend-bar{position:absolute; left:0; bottom:0; border-radius:10px 10px 6px 6px; width:100%;}
.ccest-trend-bar--exp{background:rgba(255,107,61,.28); border:1px solid rgba(255,107,61,.35);}
.ccest-trend-bar--cash{background:rgba(91,231,196,.65); border:1px solid rgba(91,231,196,.55); width:62%; left:19%;}

.ccest-trend-labels{display:flex; gap:8px; margin-top:8px;}
.ccest-trend-label{flex:1; min-width:0; text-align:center; font-size:11px; color:var(--ccest-muted) !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

@media (max-width: 520px){
  .ccest-trend-cols{gap:6px; height:140px;}
  .ccest-trend-label{font-size:10px;}
}


/* Reports (Phase 2) - Tabs + Revenue chart + clickables */
.ccest-reports-tabs{display:flex; gap:8px; margin-top:10px; flex-wrap:wrap;}
.ccest-reports-tab{appearance:none; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.12); color:var(--ccest-text); padding:6px 10px; border-radius:999px; font-size:12px; cursor:pointer;}
.ccest-reports-tab:hover{background:rgba(0,0,0,.18);}
.ccest-reports-tab.is-active{background:rgba(91,231,196,.18); border-color:rgba(91,231,196,.35);}

/* Reports header tools (range + presets + export) */
.ccest-reports-head-controls{display:flex; flex-direction:column; gap:8px; align-items:flex-end;}
.ccest-reports-presets{display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end;}
.ccest-reports-presets select{min-width:200px;}

.ccest-row-click{cursor:pointer;}
.ccest-row-click:hover{background:rgba(255,255,255,.04);}

.ccest-clickable{cursor:pointer;}
.ccest-clickable.is-active{outline:2px solid rgba(91,231,196,.4); outline-offset:2px;}

.ccest-bar-chart{display:flex; align-items:flex-end; gap:8px; height:200px; margin-top:8px;}
.ccest-bar-col{flex:1; min-width:0; display:flex; flex-direction:column; align-items:stretch; gap:6px;}
.ccest-bar-bar{flex:none; border-radius:10px 10px 6px 6px; background:rgba(91,231,196,.65); border:1px solid rgba(91,231,196,.55); width:100%; min-height:2px;}
.ccest-bar-label{text-align:center; font-size:11px; color:var(--ccest-muted) !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

@media (max-width: 520px){
  .ccest-bar-chart{gap:6px; height:160px;}
  .ccest-bar-label{font-size:10px;}
}

/* Invoice filter row */
.ccest-filters{display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:10px; align-items:end;}
.ccest-filter{min-width:0;}
.ccest-filter--action{display:flex; align-items:end; justify-content:flex-end;}
.ccest-btn--block{width:100%;}
@media (max-width: 900px){
  .ccest-filters{grid-template-columns:repeat(2, minmax(0, 1fr));}
  .ccest-filter--action{grid-column:1 / -1;}
}

/* Table wrapper + responsive tables */
.ccest-table-wrap{overflow:auto; border:1px solid var(--ccest-border); border-radius:14px; background:rgba(255,255,255,.02);}
table.ccest-table.ccest-table--responsive{min-width:880px;}

/*
  Table hardening (Invoices + Expenses)
  ------------------------------------------------------------
  Some WordPress themes apply global table/th/td background + color
  rules (sometimes with high specificity or !important). That can
  force our dark-mode dashboard tables to render as bright white.

  We force the cells back to transparent so the .ccest-table-wrap
  background shows through, and we force text + borders to use our
  theme variables.
*/
.ccest-shell table.ccest-table{
  /* Prevent WP themes from forcing a white TBODY/TR background in dark mode */
  background:transparent !important;
  background-color:transparent !important;
  border:none !important;
}

/* Some WordPress themes set backgrounds on TBODY/THEAD/TFOOT/TR, not just TD/TH. */
.ccest-shell table.ccest-table thead,
.ccest-shell table.ccest-table tbody,
.ccest-shell table.ccest-table tfoot,
.ccest-shell table.ccest-table tr{
  background:transparent !important;
  background-color:transparent !important;
}

/* Keep light mode crisp */
.ccest-shell.ccest-theme-light table.ccest-table,
.ccest-shell.ccest-theme-light table.ccest-table thead,
.ccest-shell.ccest-theme-light table.ccest-table tbody,
.ccest-shell.ccest-theme-light table.ccest-table tfoot{
  background:#fff !important;
  background-color:#fff !important;
}

/* Dark mode surface (subtle, matches cards) */
.ccest-shell.ccest-theme-dark table.ccest-table{
  background:rgba(255,255,255,.02) !important;
  background-color:rgba(255,255,255,.02) !important;
}
.ccest-shell table.ccest-table th,
.ccest-shell table.ccest-table td{
  background:transparent !important;
  color:var(--ccest-text) !important;
  border-bottom-color:var(--ccest-border) !important;
}
.ccest-shell table.ccest-table thead th{
  background:rgba(255,255,255,.04) !important;
  color:var(--ccest-muted) !important;
}
.ccest-shell table.ccest-table tbody tr:hover td{
  background:rgba(255,255,255,.04) !important;
}
.ccest-shell.ccest-theme-light table.ccest-table thead th{
  background:rgba(2,6,23,.06) !important;
}
.ccest-shell.ccest-theme-light table.ccest-table tbody tr:hover td{
  background:rgba(2,6,23,.04) !important;
}

@media (max-width: 640px){
  /* Convert responsive tables into stacked rows for small screens */
  table.ccest-table.ccest-table--responsive{min-width:0; border-radius:14px;}
  table.ccest-table.ccest-table--responsive thead{display:none;}
  table.ccest-table.ccest-table--responsive tbody,
  table.ccest-table.ccest-table--responsive tr,
  table.ccest-table.ccest-table--responsive td{display:block; width:100%;}
  table.ccest-table.ccest-table--responsive tr{border-bottom:1px solid var(--ccest-border);}
  table.ccest-table.ccest-table--responsive tr:last-child{border-bottom:none;}
  table.ccest-table.ccest-table--responsive td{border-right:none !important; border-bottom:1px dashed rgba(255,255,255,.12); padding:10px 12px; display:flex; justify-content:space-between; gap:12px; align-items:flex-start;}
  table.ccest-table.ccest-table--responsive td:last-child{border-bottom:none;}
  table.ccest-table.ccest-table--responsive td::before{content:attr(data-label); font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--ccest-muted); flex:0 0 auto;}
  table.ccest-table.ccest-table--responsive td.is-right{justify-content:space-between;}
  /* Action buttons stack nicely */
  table.ccest-table.ccest-table--responsive td[data-label="Actions"]{flex-direction:column; align-items:stretch;}
  table.ccest-table.ccest-table--responsive td[data-label="Actions"] .ccest-btn{width:100%;}
}

/*
  Project tiles are rendered as <button> elements and many WP themes apply
  button/text styling that can inadvertently darken the project title.
  Harden these classes so titles remain readable on desktop.
*/
.ccest-card-btn{
  cursor:pointer;
  width:100%;
  text-align:left;
  color:var(--ccest-text) !important;
  font:inherit;
  -webkit-appearance:none;
  appearance:none;
}
.ccest-card-btn:focus{
  outline:2px solid rgba(91,231,196,.45);
  outline-offset:2px;
}
.ccest-card-btn:hover{transform:translateY(-1px);}

.ccest-h3{
  font-size:18px !important;
  font-weight:800 !important;
  color:var(--ccest-text) !important;
  letter-spacing:.15px;
  line-height:1.15 !important;
}

.ccest-hero h1{font-size:28px !important; margin:0 0 8px !important; letter-spacing:.2px; font-weight:800 !important; color:var(--ccest-text) !important;}
.ccest-hero p{margin:0;}
.ccest-actions{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.ccest-actions-inline{display:flex; gap:10px; align-items:center; margin-top:10px;}
.ccest-stack{display:flex; flex-direction:column; gap:12px;}
.ccest-stickybar{position:sticky; top:0; z-index:25; padding:4px 0 10px; background:linear-gradient(180deg, rgba(8,14,24,.92), rgba(8,14,24,.55), rgba(8,14,24,0)); backdrop-filter:blur(10px);}
.ccest-actions-sticky{margin:0; flex-wrap:wrap;}


/* Sticky toolbars: improve contrast in light mode (desktop) */
.ccest-shell.ccest-theme-light .ccest-stickybar{
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.68), rgba(255,255,255,0));
  border-bottom:1px solid rgba(15,23,42,.10);
}
.ccest-shell.ccest-theme-light .ccest-actions-sticky{
  background:rgba(15,23,42,.03);
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  padding:8px;
}

/* -------------------------------------------------------------------------
   Phase 3 — Project view (Option A): Rooms-first layout + side panel
   ------------------------------------------------------------------------- */
.ccest-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin:0;
  background:rgba(255,255,255,.03);
  border:1px solid var(--ccest-border);
  border-radius:14px;
  padding:8px;
}
.ccest-shell.ccest-theme-light .ccest-toolbar{
  background:rgba(15,23,42,.03);
  border:1px solid rgba(15,23,42,.08);
}
.ccest-toolbar-group{display:flex; gap:10px; align-items:center; flex-wrap:wrap;}
.ccest-toolbar-right{gap:8px; justify-content:flex-end;}

.ccest-project-summary{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--ccest-border);
  border-radius:14px;
  background:rgba(255,255,255,.03);
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.ccest-shell.ccest-theme-light .ccest-project-summary{
  background:rgba(255,255,255,.75);
  box-shadow:0 10px 24px rgba(15,23,42,.10);
}
.ccest-project-summary-main{min-width:0; display:flex; flex-direction:column; gap:6px;}
.ccest-project-summary-top{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.ccest-project-summary-meta{display:flex; gap:10px; flex-wrap:wrap;}
.ccest-project-summary-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center; flex:0 0 auto;}
.ccest-project-help{max-width:820px;}

.ccest-project-layout{display:grid; grid-template-columns:1fr; gap:12px; align-items:start;}
.ccest-project-main{min-width:0;}
.ccest-project-side{min-width:0;}

.ccest-side-tabs{display:none; gap:6px; flex-wrap:wrap; margin-bottom:10px;}
.ccest-side-tab{
  appearance:none;
  border:1px solid var(--ccest-border);
  background:rgba(255,255,255,.04);
  color:var(--ccest-muted);
  border-radius:999px;
  padding:8px 10px;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}
.ccest-side-tab:hover{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.18);}
.ccest-side-tab-active{color:var(--ccest-text); border-color:rgba(91,231,196,.55); background:rgba(91,231,196,.14);}

.ccest-side-acc{border:1px solid var(--ccest-border); border-radius:14px; overflow:hidden; background:rgba(255,255,255,.03); margin-bottom:10px;}
.ccest-side-acc summary{cursor:pointer; padding:10px 12px; font-weight:900; color:var(--ccest-text); list-style:none;}
.ccest-side-acc summary::-webkit-details-marker{display:none;}
.ccest-side-acc[open] summary{border-bottom:1px solid var(--ccest-border);}
.ccest-side-panel-body{padding:10px;}

.ccest-more-wrap{position:relative;}
.ccest-popover{
  position:absolute;
  right:0;
  top:calc(100% + 8px);
  z-index:40;
  min-width:220px;
  background:var(--ccest-card);
  border:1px solid var(--ccest-border);
  border-radius:14px;
  box-shadow:0 14px 28px rgba(0,0,0,.28);
  padding:6px;
}
.ccest-shell.ccest-theme-light .ccest-popover{box-shadow:0 14px 28px rgba(15,23,42,.14);}
.ccest-popover-item{
  width:100%;
  text-align:left;
  background:transparent;
  border:none;
  color:var(--ccest-text);
  padding:10px 10px;
  border-radius:12px;
  cursor:pointer;
  display:flex;
  gap:8px;
  align-items:center;
  font-weight:750;
}
.ccest-popover-item:hover{background:rgba(255,255,255,.06);}
.ccest-shell.ccest-theme-light .ccest-popover-item:hover{background:rgba(15,23,42,.04);}
.ccest-popover-danger{color:rgba(255,107,61,.95);}

@media (min-width: 961px){
  .ccest-project-layout{grid-template-columns:minmax(0, 1fr) minmax(280px, 360px);}
  .ccest-project-side{position:sticky; top:74px; align-self:start;}
  .ccest-side-tabs{display:flex;}
  .ccest-side-acc summary{display:none;}
  .ccest-side-acc{border:none; background:transparent; margin:0;}
  .ccest-side-acc:not([open]){display:none;}
  .ccest-side-panel-body{padding:0;}
}

/* Compact customer summary strip (project view) */
.ccest-info-strip{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--ccest-border);
  border-radius:14px;
  background:rgba(255,255,255,.03);
  box-shadow:0 10px 24px rgba(0,0,0,.22);
}
.ccest-info-strip:hover{border-color:rgba(255,255,255,.24); background:rgba(255,255,255,.05);}
.ccest-shell.ccest-theme-light .ccest-info-strip{background:rgba(255,255,255,.75); box-shadow:0 10px 24px rgba(15,23,42,.10);} 
.ccest-info-left{min-width:0; display:flex; flex-direction:column; gap:4px;}
.ccest-info-title{font-weight:900; font-size:14px; color:var(--ccest-text); line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.ccest-info-meta{display:flex; gap:10px; flex-wrap:wrap; font-size:12px; color:var(--ccest-muted);}
.ccest-info-chip{display:inline-flex; align-items:center; gap:6px; padding:4px 8px; border-radius:999px; border:1px solid var(--ccest-border); background:rgba(255,255,255,.03);}
.ccest-shell.ccest-theme-light .ccest-info-chip{background:rgba(15,23,42,.03);}
.ccest-icon-btn-sm{width:34px; height:34px; border-radius:10px;}


.ccest-link{background:none; border:none; color:var(--ccest-text); cursor:pointer; padding:0; font-weight:700;}
.ccest-breadcrumb{display:flex; align-items:center; gap:10px;}

.ccest-pill{display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:6px 10px; border-radius:999px; font-size:12px; border:1px solid var(--ccest-border); background:rgba(255,255,255,.04); color:var(--ccest-muted) !important; white-space:nowrap;}
.ccest-pill-ok{border-color:rgba(91,231,196,.55); background:rgba(91,231,196,.14); color:var(--ccest-text) !important;}
.ccest-pill-warn{border-color:rgba(255,107,61,.55); background:rgba(255,107,61,.10); color:var(--ccest-text) !important;}
.ccest-pill-link{cursor:pointer;}
.ccest-pill-link:hover{border-color:rgba(255,255,255,.25); background:rgba(255,255,255,.06);}

/* Trade chips (onboarding + pricebook filtering UI) */
.ccest-trade-chip{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:10px; /* requested */
  border:1px solid var(--ccest-border);
  background:rgba(255,255,255,.04);
  color:var(--ccest-text) !important;
  cursor:pointer;
  user-select:none;
  transition:transform .06s ease, background .15s ease, border-color .15s ease;
}
.ccest-trade-chip:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.22);
}
.ccest-shell.ccest-theme-light .ccest-trade-chip:hover{
  background:rgba(10,20,40,.04);
  border-color:rgba(10,20,40,.18);
}
.ccest-trade-chip:active{transform:translateY(1px);}
.ccest-trade-checkbox{width:16px; height:16px; margin:0; flex:0 0 auto;}

.ccest-alert{border:1px solid var(--ccest-border); border-radius:var(--ccest-radius); padding:10px 12px; background:rgba(255,255,255,.04); margin:10px 0;}
.ccest-alert-error{border-color:rgba(255,107,61,.55); background:rgba(255,107,61,.10);}
.ccest-alert-warn{border-color:rgba(255,107,61,.35); background:rgba(255,107,61,.06);}

.ccest-field{display:flex; flex-direction:column; gap:6px; margin:12px 0;}
.ccest-field label{font-size:12px; color:var(--ccest-muted) !important;}
.ccest-field input,
.ccest-field textarea,
.ccest-field select{width:100%; border:1px solid var(--ccest-border); background:rgba(255,255,255,.05); color:var(--ccest-text); border-radius:12px; padding:10px 12px; outline:none;}
.ccest-field input:focus,
.ccest-field textarea:focus,
.ccest-field select:focus{border-color:rgba(91,231,196,.55); box-shadow:0 0 0 2px rgba(91,231,196,.18);}

/* Registration (centered shell): make fields very obvious and resistant to theme underline styles */
.ccest-shell.ccest-shell-centered .ccest-field label{
  font-size:13px !important;
  font-weight:750 !important;
  color:rgba(255,255,255,.78) !important;
}
.ccest-shell.ccest-shell-centered .ccest-field input,
.ccest-shell.ccest-shell-centered .ccest-field textarea,
.ccest-shell.ccest-shell-centered .ccest-field select{
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.07) !important;
  border-radius:14px !important;
  padding:12px 12px !important;
}
.ccest-shell.ccest-shell-centered .ccest-field input::placeholder,
.ccest-shell.ccest-shell-centered .ccest-field textarea::placeholder{
  color:rgba(255,255,255,.45) !important;
}
.ccest-shell.ccest-shell-centered .ccest-field input:focus,
.ccest-shell.ccest-shell-centered .ccest-field textarea:focus,
.ccest-shell.ccest-shell-centered .ccest-field select:focus{
  border-color:rgba(91,231,196,.65) !important;
  box-shadow:0 0 0 3px rgba(91,231,196,.18) !important;
}
.ccest-shell.ccest-shell-centered .ccest-req{color:rgba(255,107,61,.95) !important; margin-left:3px;}
.ccest-shell.ccest-shell-centered .ccest-invalid{
  border-color:rgba(255,107,61,.85) !important;
  box-shadow:0 0 0 3px rgba(255,107,61,.20) !important;
}

.ccest-required{color:rgba(255,107,61,.95); margin-left:4px; font-weight:700;}
.ccest-required-note{font-size:12px; color:rgba(120,120,120,.95); margin-top:6px;}
.ccest-shell.ccest-shell-centered .ccest-field.ccest-field-invalid label{color:rgba(255,107,61,.95) !important;}
.ccest-shell.ccest-shell-centered .ccest-field-error{margin-top:6px; font-size:12px; color:rgba(255,107,61,.95) !important;}

.ccest-mini{display:flex; gap:14px; flex-wrap:wrap; margin-top:10px; font-size:13px;}
.ccest-scope{margin-top:10px; font-size:13px; color:var(--ccest-muted) !important; white-space:pre-wrap;}

.ccest-room-est-row{margin-top:12px; display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap;}
.ccest-room-est-row .ccest-btn{white-space:nowrap;}

.ccest-banner{display:flex; gap:10px; align-items:flex-start; justify-content:space-between; padding:10px 12px; border-bottom:1px solid var(--ccest-border); background:rgba(255,107,61,.08);}
.ccest-banner code{background:rgba(0,0,0,.25); padding:2px 6px; border-radius:8px; border:1px solid var(--ccest-border);}

.ccest-row{display:flex; gap:12px; align-items:stretch;}
.ccest-row-between{justify-content:space-between; align-items:center;}
.ccest-col{flex:1; min-width:0;}
.ccest-col-2{flex:2; min-width:0;}

.ccest-h1{font-size:20px !important; margin:0 0 10px !important; color:var(--ccest-text) !important; font-weight:800 !important;}
.ccest-h2{font-size:16px !important; margin:0 0 8px !important; color:var(--ccest-text) !important; font-weight:700 !important;}
.ccest-p{margin:0 0 10px; color:var(--ccest-muted) !important;}

.ccest-btn{appearance:none; border:1px solid var(--ccest-border); background:rgba(255,255,255,.06); color:var(--ccest-text); border-radius:12px; padding:10px 12px; font-weight:600; cursor:pointer; display:inline-flex; align-items:center; gap:8px; line-height:1;}


/* Button icon/label helpers (used for mobile icon-only quick actions) */
.ccest-btn-ico{display:inline-flex; align-items:center; justify-content:center; font-size:14px; line-height:1;}
.ccest-btn-label{display:inline;}
.ccest-btn:active{transform:translateY(1px);}
.ccest-btn:hover{background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.18);}
.ccest-btn-primary{border-color:rgba(91,231,196,.55); background:rgba(91,231,196,.14);}
.ccest-btn-primary:hover{border-color:rgba(255,107,61,.55); background:linear-gradient(180deg, rgba(255,107,61,.14), rgba(91,231,196,.10));}
.ccest-btn-primary:focus-visible{outline:2px solid rgba(255,107,61,.55); outline-offset:2px;}
.ccest-btn-danger{border-color:rgba(255,107,61,.55); background:rgba(255,107,61,.10);}
.ccest-btn-accent{border-color:rgba(255,107,61,.55); background:rgba(255,107,61,.12);}
.ccest-btn-accent:hover{border-color:rgba(255,107,61,.75); background:rgba(255,107,61,.16);}
.ccest-btn-accent:focus-visible{outline:2px solid rgba(255,107,61,.55); outline-offset:2px;}
.ccest-btn-ghost{background:transparent;}
.ccest-btn-ghost:hover{background:rgba(255,107,61,.06); border-color:rgba(255,107,61,.28);}
.ccest-btn[disabled]{opacity:.55; cursor:not-allowed;}
.ccest-btn-label{font-size:13px;}

.ccest-icon-btn{appearance:none; border:1px solid var(--ccest-border); background:rgba(255,255,255,.04); color:var(--ccest-text); width:38px; height:38px; border-radius:12px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;}

/*
  Form controls
  NOTE: Many WP themes/plugins apply global input/select styles (often underline-only)
  with high specificity. We intentionally re-assert our control styling inside
  .ccest-shell to keep the UI consistent.
*/
.ccest-input, .ccest-select, .ccest-textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.06) !important;
  color:var(--ccest-text) !important;
  border-radius:12px !important;
  padding:10px 12px;
  outline:none;
  font-size:16px; /* prevents iOS zoom + improves readability */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}


/* Ensure selects that use .ccest-input (e.g., New Project modal) look like our app selects */
.ccest-shell select.ccest-input{
  /*
    IMPORTANT:
    We do NOT paint a custom chevron as a background-image here.
    Some WP themes apply high-specificity background shorthands to <select>
    that can re-enable background-repeat ("repeat"), causing the chevron to tile.
    To make this bulletproof, we keep native OS chevrons and only style the field.
  */
  appearance:auto !important;
  -webkit-appearance:auto !important;
  -moz-appearance:auto !important;
  background-image:none !important;
  background-repeat:no-repeat !important;
  padding-right:14px !important;
}
/* Hover affordance for these selects too */
.ccest-shell select.ccest-input:hover{
  cursor:pointer;
  border-color:rgba(91,231,196,.45) !important;
  /* Use background-color (not shorthand background) so we don't reset background-repeat and accidentally tile the chevron */
  background-color:rgba(255,255,255,.08) !important;
  box-shadow:0 0 0 3px rgba(91,231,196,.10), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
/* Make native select dropdown panels readable in dark/light modes (browser support varies) */
.ccest-shell select.ccest-input option{
  background-color:var(--ccest-card) !important;
  color:var(--ccest-text) !important;
}

.ccest-shell .ccest-input:focus,
.ccest-shell .ccest-select:focus,
.ccest-shell .ccest-textarea:focus{
  border-color:rgba(91,231,196,.65) !important;
  box-shadow:0 0 0 3px rgba(91,231,196,.18), inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* Hover affordance for dropdowns */
.ccest-shell .ccest-select:hover,
.ccest-shell .ccest-project-select:hover{
  cursor:pointer;
  border-color:rgba(91,231,196,.45) !important;
  /* Avoid shorthand background here too; it resets background-repeat which can tile our chevron SVG on selects */
  background-color:rgba(255,255,255,.08) !important;
  box-shadow:0 0 0 3px rgba(91,231,196,.10), inset 0 1px 0 rgba(255,255,255,.10) !important;
}


/* Make native select dropdowns readable across themes */
.ccest-select option{background-color:var(--ccest-card) !important; color:var(--ccest-text) !important;}
.ccest-select option.ccest-optgroup{font-weight:700 !important; opacity:.7 !important;}
.ccest-select option.ccest-optgroup:disabled{opacity:.7 !important;}


.ccest-input::placeholder, .ccest-textarea::placeholder{
  color:rgba(233,238,252,.55) !important;
}
.ccest-textarea{min-height:120px; resize:vertical;}
.ccest-label{display:block; font-size:12px; color:var(--ccest-muted) !important; margin:8px 0 6px; font-weight:800 !important; letter-spacing:.2px;}
.ccest-help{font-size:12px; color:var(--ccest-muted) !important; margin-top:6px;}

.ccest-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px;}
.ccest-grid-3{grid-template-columns:repeat(3,minmax(0,1fr));}

/* Projects dashboard grid (2–4 cols on desktop) */
.ccest-project-grid{display:grid; grid-template-columns:1fr; gap:14px;}
@media (min-width: 961px){
  .ccest-project-grid{grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px;}
}
@media (min-width: 1200px){
  .ccest-project-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media (min-width: 1600px){
  .ccest-project-grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}

.ccest-project-card{
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  text-align:left;
  cursor:pointer;
  border-radius:10px !important;
  padding:22px !important;
  border:1px solid var(--ccest-border) !important;
  background:var(--ccest-card) !important;
  box-shadow:var(--ccest-shadow);
  color:var(--ccest-text) !important;
  appearance:none;
}
.ccest-project-card:hover{transform:translateY(-1px); box-shadow:0 22px 55px rgba(0,0,0,.18);}
.ccest-shell.ccest-theme-light .ccest-project-card:hover{box-shadow:0 22px 55px rgba(10,20,40,.12);}

/* Extra specificity: some themes force very large button radii */
.ccest-shell button.ccest-project-card{border-radius:10px !important;}
.ccest-project-card *{color:inherit;}
.ccest-project-card:hover{transform:translateY(-1px); border-color:rgba(255,255,255,.18);}
.ccest-project-card:focus{outline:none;}
.ccest-project-card:focus-visible{outline:2px solid rgba(255,255,255,.35); outline-offset:3px;}

.ccest-project-card-top{display:flex; align-items:flex-start; gap:10px; justify-content:space-between;}
.ccest-project-title{
  font-size:20px;
  font-weight:800;
  letter-spacing:-0.01em;
  line-height:1.15;
  color:var(--ccest-text) !important;
}
.ccest-project-owner{
  font-size:13px;
  opacity:.85;
  margin-top:4px;
}
.ccest-project-meta{display:flex; justify-content:space-between; gap:10px;}
.ccest-project-updated{font-weight:700; opacity:.95;}
.ccest-project-card-foot{margin-top:auto; padding-top:2px;}
.ccest-link{font-weight:700; opacity:.9;}

.ccest-pill-muted{background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12);}

.ccest-divider{height:1px; background:var(--ccest-border); margin:12px 0;}

.ccest-list{display:flex; flex-direction:column; gap:10px;}
.ccest-item-row{display:flex; gap:10px; align-items:stretch;}
.ccest-item-row .ccest-item{flex:1;}
.ccest-item{background:var(--ccest-card2); border:1px solid var(--ccest-border); border-radius:10px !important; padding:16px; display:flex; justify-content:space-between; gap:12px; align-items:flex-start;}
.ccest-shell button.ccest-item{border-radius:10px !important;}

/* Extra-hardening: some WP themes apply very high border-radius to *all* buttons */
.ccest-shell .ccest-item-row button.ccest-item.ccest-item-btn{border-radius:10px !important;}

/* Harden against theme button styles that force pill shapes */
.ccest-shell button.ccest-item,
.ccest-shell button.ccest-item-btn{border-radius:10px !important;}
.ccest-item-btn{width:100%; text-align:left; cursor:pointer; appearance:none;}
.ccest-item-btn:hover{border-color:rgba(255,255,255,.22); transform:translateY(-1px);}
.ccest-item-btn:active{transform:translateY(0);}
.ccest-item-title{font-weight:700; margin:0 0 4px;}
.ccest-item-meta{font-size:12px; color:var(--ccest-muted) !important;}

.ccest-pill-link{cursor:pointer;}
.ccest-pill-link:hover{border-color:rgba(255,255,255,.22); background:rgba(255,255,255,.06);}

.ccest-room-est-row{margin-top:12px; display:flex; gap:12px; align-items:center; justify-content:space-between;}
@media (max-width: 720px){
  .ccest-room-est-row{flex-direction:column; align-items:flex-start;}
}

.ccest-badge{display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:999px; font-size:12px; border:1px solid var(--ccest-border); background:rgba(255,255,255,.04); color:var(--ccest-muted) !important;}
.ccest-badge-accent{border-color:rgba(91,231,196,.35); color:var(--ccest-text); background:rgba(91,231,196,.10);}
.ccest-badge-draft{border-color:rgba(120,140,170,.35); color:var(--ccest-text); background:rgba(120,140,170,.10);}
.ccest-badge-good{border-color:rgba(47,204,131,.35); color:var(--ccest-text); background:rgba(47,204,131,.10);}

.ccest-contact-card{border:1px solid var(--ccest-border); background:var(--ccest-card); border-radius:14px; overflow:hidden; cursor:pointer; box-shadow: var(--ccest-shadow);}
.ccest-contact-card .ccest-item{background:transparent;}
.ccest-contact-card:hover{filter:brightness(1.02);}
.ccest-contact-projects{border-top:1px solid var(--ccest-border);}
.ccest-contact-project{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 14px; background:rgba(255,255,255,0.02);}
.ccest-contact-project:hover{background:rgba(255,255,255,0.06);}
.ccest-contact-project-title{font-weight:700;}
.ccest-contact-project-meta{font-size:12px; color:var(--ccest-muted); margin-top:2px;}

.ccest-table-native-wrap{overflow:auto; border:1px solid var(--ccest-border); border-radius:14px;}
.ccest-table-native{width:100%; border-collapse:separate; border-spacing:0; min-width:780px; table-layout:fixed;}
.ccest-table-native th:nth-child(1), .ccest-table-native td:nth-child(1){width:170px;}
.ccest-table-native th:nth-child(3), .ccest-table-native td:nth-child(3){width:90px;}
.ccest-table-native th:nth-child(4), .ccest-table-native td:nth-child(4){width:90px;}
.ccest-table-native th:nth-child(5), .ccest-table-native td:nth-child(5){width:90px;}
.ccest-table-native th:nth-child(6), .ccest-table-native td:nth-child(6){width:150px;}
.ccest-table-native th:nth-child(7), .ccest-table-native td:nth-child(7){width:110px;}
.ccest-table-native th, .ccest-table-native td{padding:10px 10px; border-bottom:1px solid var(--ccest-border); vertical-align:top;}
.ccest-table-native th{text-align:left; font-size:12px; color:var(--ccest-muted) !important; background:rgba(255,255,255,.03); position:sticky; top:0;}
.ccest-table-native td{font-size:13px;}
.ccest-table-native tr:last-child td{border-bottom:none;}

.ccest-loading{padding:22px; text-align:center; color:var(--ccest-muted);}

/* Toast */
.ccest-toast{position:fixed; left:50%; bottom:18px; transform:translateX(-50%); background:rgba(15,23,48,.95); border:1px solid var(--ccest-border); padding:10px 12px; border-radius:14px; box-shadow:var(--ccest-shadow); max-width:min(520px, calc(100% - 22px)); z-index:9999;}
.ccest-toast .ccest-toast-action{color:#fff; text-decoration:underline; font-weight:700; margin-left:10px;}
.ccest-toast .ccest-toast-action:hover{opacity:.95;}

/* Busy overlay (used for long-running actions like Generate Estimate) */
.ccest-busy{position:fixed; inset:0; z-index:99999; display:flex; align-items:center; justify-content:center; padding:16px;}
.ccest-busy-backdrop{position:absolute; inset:0; background:rgba(0,0,0,.55);}
.ccest-busy-card{position:relative; z-index:1; display:flex; align-items:center; gap:12px; background:var(--ccest-card); border:1px solid var(--ccest-border); border-radius:18px; padding:14px 16px; box-shadow:var(--ccest-shadow); width:min(560px, calc(100% - 22px));}
.ccest-busy-title{font-weight:900; font-size:16px; margin:0 0 2px; color:var(--ccest-text);}
.ccest-busy-sub{font-size:12px;}
.ccest-spinner{width:22px; height:22px; border-radius:50%; border:3px solid rgba(233,238,252,.18); border-top-color:var(--ccest-accent); animation:ccestspin 1s linear infinite; flex:0 0 auto;}
@keyframes ccestspin{to{transform:rotate(360deg);}}

/* Modal */
.ccest-modal{position:fixed !important; inset:0 !important; z-index:99998 !important; display:flex !important; align-items:center !important; justify-content:center !important; padding:14px;}
.ccest-submodal{z-index:99999 !important;}
.ccest-submodal .ccest-modal-card{width:min(760px, 100%) !important;}
.ccest-modal-backdrop{position:absolute; inset:0; background:rgba(0,0,0,.55); z-index:0;}
.ccest-modal-card{position:relative; z-index:1; width:min(720px, 100%); max-height:80vh; overflow:hidden; background:var(--ccest-card); border:1px solid var(--ccest-border); border-radius:18px; box-shadow:var(--ccest-shadow); display:flex; flex-direction:column;}
.ccest-modal-head{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:12px 12px; border-bottom:1px solid var(--ccest-border);}
.ccest-modal-title{margin:0; font-size:22px !important; font-weight:900 !important; letter-spacing:.2px; color:var(--ccest-text) !important;}
.ccest-modal-body{padding:12px; overflow:auto;}
.ccest-modal-foot{padding:12px; border-top:1px solid var(--ccest-border); display:flex; justify-content:flex-end; gap:10px;}

/* Lightbox AI toggle */
.ccest-ai-toggle{display:flex; align-items:center; gap:8px; font-weight:700; color:var(--ccest-text); padding:6px 10px; border:1px solid var(--ccest-border); border-radius:999px; background:rgba(255,255,255,.04);}
.ccest-ai-toggle input{width:18px; height:18px;}

/* Desktop fullscreen dashboard */
@media (min-width:961px){
  .ccest-shell{
    max-width:none;
    width:100%;
    margin:0;
    border-radius:0;
    border-left:none;
    border-right:none;
    min-height:100vh; height:100dvh;
    display:flex;
    flex-direction:column;
  }
  body.admin-bar .ccest-shell{min-height:calc(100vh - 32px);}
  .ccest-main{flex:1; min-height:auto;}
}

/* Mobile */
@media (max-width:720px){
  .ccest-shell{border-radius:0; border-left:none; border-right:none; margin:0; max-width:none;}
  .ccest-main{padding:12px; min-height:65vh;}
  .ccest-row{flex-direction:column;}
  .ccest-grid{grid-template-columns:1fr;}
  .ccest-grid-3{grid-template-columns:1fr;}
  .ccest-btn-label{display:none;}
}

/* Div-table for estimate rows (editor UI) */
div.ccest-table{display:flex; flex-direction:column; border:1px solid var(--ccest-border); border-radius:14px; overflow:hidden; margin-top:10px;}

/* Native table styling (used in previews / billing / team lists) */
table.ccest-table{width:100%; border-collapse:separate; border-spacing:0; table-layout:fixed; border:1px solid var(--ccest-border); border-radius:14px;}
table.ccest-table th, table.ccest-table td{padding:10px 10px; border-bottom:1px solid var(--ccest-border); vertical-align:top;}
table.ccest-table thead th{font-size:12px; color:var(--ccest-muted) !important; background:rgba(255,255,255,.03); text-align:left;}
table.ccest-table tbody td{font-size:13px;}
table.ccest-table tr:last-child td{border-bottom:none;}
table.ccest-table th:not(:last-child), table.ccest-table td:not(:last-child){border-right:1px solid var(--ccest-border);}

.ccest-tr{display:grid; grid-template-columns: 1.8fr .6fr .6fr .7fr .7fr; gap:10px; padding:10px; border-top:1px solid var(--ccest-border); align-items:start;}
.ccest-th{background:rgba(255,255,255,.02); border-top:none; position:sticky; top:0; z-index:1; font-size:12px; color:var(--ccest-muted);}
.ccest-tr-subtotal{background:rgba(255,255,255,.02); font-weight:800; color:var(--ccest-text);}
.ccest-right{text-align:right;}
.ccest-tiny{font-size:11px;}
.ccest-input-sm{padding:8px 10px; border-radius:10px;}

.ccest-totals{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px;}
.ccest-total{font-size:18px; font-weight:800; margin-top:6px;}
.ccest-total-strong{border-color:rgba(91,231,196,.35);}




/* Estimate row UI helpers */
.ccest-item-top{display:flex; align-items:flex-start; justify-content:space-between; gap:10px;}
.ccest-item-actions{display:flex; gap:8px; align-items:flex-start;}
/* Description: read view + pencil -> larger editor (desktop + mobile) */
.ccest-desc-input{display:none;}
.ccest-desc-viewwrap{display:flex; flex:1; min-width:0; gap:10px; align-items:flex-start; justify-content:space-between;}
.ccest-desc-view{flex:1; min-width:0; white-space:pre-wrap; word-break:break-word; line-height:1.35; font-size:14px; color:var(--ccest-text);}
.ccest-desc-editor{margin-top:10px;}
.ccest-desc-editor-actions{display:flex; gap:10px; justify-content:flex-end; margin-top:8px;}

.ccest-icon-btn-success{border-color:rgba(91,231,196,.55); background:rgba(91,231,196,.14);}
.ccest-icon-btn-success:hover{border-color:rgba(91,231,196,.75);}
.ccest-icon-btn-danger{border-color:rgba(255,107,61,.55); background:rgba(255,107,61,.10);}
.ccest-icon-btn-danger:hover{border-color:rgba(255,107,61,.75);}

.ccest-savebar{
  position:sticky;
  bottom:0;
  z-index:3;
  margin-top:12px;
  border:1px solid var(--ccest-border);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  padding:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.ccest-savebar[hidden]{display:none !important;}
.ccest-savebar-left{display:flex; align-items:center; gap:10px; min-width:0;}
.ccest-savebar-right{display:flex; gap:10px; align-items:center;}
.ccest-savebar-note{font-size:12px; color:var(--ccest-muted) !important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* Animated "unsaved changes" notice bar (appears when edits are made; helps because Save is at the bottom) */
.ccest-unsaved{
  position:sticky;
  top:0;
  z-index:6;
  overflow:hidden;
  max-height:0;
  opacity:0;
  transform:translateY(-10px);
  transition:max-height .25s ease, opacity .20s ease, transform .25s ease;
  pointer-events:none;
}
.ccest-unsaved.is-visible{max-height:96px; opacity:1; transform:translateY(0); pointer-events:auto;}
.ccest-unsaved-inner{
  margin-top:8px;
  margin-bottom:6px;
  border:1px solid rgba(255,107,61,.55);
  background:rgba(255,107,61,.10);
  border-radius:14px;
  padding:10px 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  box-shadow:0 10px 22px rgba(0,0,0,.18);
}
.ccest-unsaved-text{font-size:13px; line-height:1.25; color:var(--ccest-text);}

.ccest-btn-sm{padding:8px 10px; border-radius:12px; font-size:12px;}

/* Billing interval toggle (Monthly/Annual) */
.ccest-billing-toggle{display:flex; gap:8px; justify-content:center; align-items:center; margin:10px 0 16px; flex-wrap:wrap;}


@keyframes ccest-banner-pop{from{transform:translateY(-6px);}to{transform:translateY(0);}}
.ccest-unsaved.is-pop .ccest-unsaved-inner{animation:ccest-banner-pop .22s ease;}

/* Consolidated mobile layout for estimate rows (card-style) */
@media (max-width:720px){
  .ccest-totals{grid-template-columns:1fr 1fr;}

  .ccest-th{display:none !important;}
  .ccest-tr{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding:14px 12px !important;
  }
  .ccest-tr > div{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:12px !important;
    min-width:0;
  }
  .ccest-tr > div:first-child{display:block !important;}
  .ccest-tr > div:nth-child(2)::before{content:"Qty"; font-size:12px; color:var(--ccest-muted);}
  .ccest-tr > div:nth-child(3)::before{content:"Unit"; font-size:12px; color:var(--ccest-muted);}
  .ccest-tr > div:nth-child(4)::before{content:"Unit cost"; font-size:12px; color:var(--ccest-muted);}
  .ccest-tr > div:nth-child(5)::before{content:"Total"; font-size:12px; color:var(--ccest-muted);}
  .ccest-tr > div:nth-child(5){font-weight:800;}
  .ccest-input-sm{width:140px; max-width:60vw;}

  /* On mobile, keep the same read view + pencil UX */
  .ccest-desc-input{display:none !important;}
  .ccest-desc-viewwrap{display:flex !important;}
}

/* Harden button colors against aggressive theme overrides (registration pages especially) */
.ccest-shell .ccest-btn{
  background:rgba(255,255,255,.06) !important;
  border-color:var(--ccest-border) !important;
  color:var(--ccest-text) !important;
}
.ccest-shell .ccest-btn:hover{
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.18) !important;
}
.ccest-shell .ccest-btn-primary{background:rgba(91,231,196,.14) !important; border-color:rgba(91,231,196,.55) !important;}
.ccest-shell .ccest-btn-primary:hover{border-color:rgba(255,107,61,.55) !important; background:linear-gradient(180deg, rgba(255,107,61,.14), rgba(91,231,196,.10)) !important;}
.ccest-shell .ccest-btn-ghost{background:transparent !important;}
.ccest-shell .ccest-btn-ghost:hover{background:rgba(255,107,61,.06) !important; border-color:rgba(255,107,61,.28) !important;}
.ccest-shell .ccest-btn-danger{background:rgba(255,107,61,.10) !important; border-color:rgba(255,107,61,.55) !important;}
.ccest-shell .ccest-icon-btn{background:rgba(255,255,255,.04) !important; border-color:var(--ccest-border) !important; color:var(--ccest-text) !important;}

/* Theme overrides */
.ccest-shell.ccest-theme-light{
  --ccest-bg:#f6f8ff;
  --ccest-card:#ffffff;
  --ccest-card2:#ffffff;
  --ccest-text:#0b1020;
  --ccest-muted:#3a4a66;
  --ccest-border:rgba(10,20,40,.22);
  --ccest-shadow:0 18px 40px rgba(10,20,40,.10);
  /* Ensures native UI controls (select dropdowns, etc.) match the theme */
  color-scheme: light;
}

/* Light theme: improve contrast for form controls + pills */
.ccest-shell.ccest-theme-light .ccest-input,
.ccest-shell.ccest-theme-light .ccest-select,
.ccest-shell.ccest-theme-light .ccest-textarea{
  background:rgba(10,20,40,.03) !important;
  border-color:rgba(10,20,40,.20) !important;
  color:var(--ccest-text) !important;
}
.ccest-shell.ccest-theme-light .ccest-input::placeholder,
.ccest-shell.ccest-theme-light .ccest-textarea::placeholder{
  color:rgba(58,74,102,.60) !important;
}
.ccest-shell.ccest-theme-light .ccest-select option{background-color:#ffffff !important; color:#0b1020 !important;}

.ccest-shell.ccest-theme-light .ccest-tr-subtotal{background:rgba(10,20,40,.03);}

.ccest-shell.ccest-theme-light .ccest-pill{
  background:rgba(10,20,40,.03);
  border-color:rgba(10,20,40,.14);
}
.ccest-shell.ccest-theme-light .ccest-pill-muted{
  background:rgba(10,20,40,.05);
  border-color:rgba(10,20,40,.14);
}
.ccest-shell.ccest-theme-light .ccest-btn{
  background:rgba(10,20,40,.03);
}
.ccest-shell.ccest-theme-light .ccest-icon-btn{
  background:rgba(10,20,40,.03);
}

/* App layout with left nav */
/* Use an internal scroll region so top bar + side nav remain fixed while content scrolls */
.ccest-app{display:flex; height:100vh; height:100dvh; width:100%; overflow:hidden;}
.ccest-sidenav{
  width:220px;
  padding:14px 10px;
  border-right:1px solid var(--ccest-border);
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  position:sticky;
  top:0;
  height:100vh; height:100dvh;
  display:flex;
  flex-direction:column;
  gap:6px;
  overflow:auto;
}
.ccest-shell.ccest-theme-light .ccest-sidenav{
  background:linear-gradient(180deg, rgba(10,20,40,.04), rgba(10,20,40,.02));
}

.ccest-content{flex:1; display:flex; flex-direction:column; min-width:0; height:100vh; height:100dvh; overflow:hidden;}
.ccest-main{flex:1; min-height:0; overflow:auto; -webkit-overflow-scrolling:touch;}

/* Side nav collapse (desktop) */
.ccest-sidenav-spacer{flex:1;}
.ccest-nav-collapse{margin-top:6px;}
.ccest-shell.ccest-nav-collapsed .ccest-sidenav{width:70px;}
.ccest-shell.ccest-nav-collapsed .ccest-nav-label{display:none;}
.ccest-shell.ccest-nav-collapsed .ccest-nav-item{justify-content:center; padding-left:8px; padding-right:8px;}
.ccest-shell.ccest-nav-collapsed .ccest-nav-ico{width:24px;}


/* Nav items */
.ccest-nav-item{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 10px;
  border-radius:10px !important;
  border:1px solid transparent;
  background:transparent;
  color:var(--ccest-text) !important;
  cursor:pointer;
  text-align:left;
  font:inherit;
}
.ccest-nav-item:hover{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.10);}
.ccest-shell.ccest-theme-light .ccest-nav-item:hover{background:rgba(10,20,40,.04); border-color:rgba(10,20,40,.10);}
.ccest-nav-item.is-active{
  background:linear-gradient(90deg, rgba(255,107,61,.14), rgba(91,231,196,.10));
  border-color:rgba(91,231,196,.28);
  box-shadow:inset 3px 0 0 rgba(255,107,61,.75);
  border-radius:10px !important;
}
.ccest-nav-ico{width:20px; display:inline-flex; justify-content:center;}
.ccest-nav-label{font-weight:700;}

/* Mobile navigation: bottom fixed menu (replaces hamburger drawer) */
.ccest-nav-toggle{display:none;}
@media (max-width: 960px){
  /* Match the top quick-actions toolbar height for visual consistency */
  :root{ --ccest-bottomnav-h: 72px; }

  /* No hamburger on mobile: bottom nav is always available */
  .ccest-nav-toggle{display:none !important;}

  /* Turn the existing side nav into a bottom nav bar */
  .ccest-sidenav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    top:auto;
    width:auto;
    height:auto;
    min-height: calc(var(--ccest-bottomnav-h, 72px) + env(safe-area-inset-bottom, 0px));
    transform:none;
    transition:none;
    z-index:85;
    padding: 8px 10px calc(8px + env(safe-area-inset-bottom, 0px));
    border-right:none;
    border-top:1px solid rgba(255,255,255,.10);
    box-shadow: 0 -10px 30px rgba(0,0,0,.35);
    background: rgba(8,14,24,.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    overflow:visible;
    flex-direction:row;
    align-items:stretch;
    gap:8px;
  }
  .ccest-shell.ccest-theme-light .ccest-sidenav{
    background: rgba(255,255,255,.92);
    border-top: 1px solid rgba(10,20,40,.12);
    box-shadow: 0 -10px 30px rgba(10,20,40,.12);
  }

  /* Kill the drawer overlay behavior if the JS toggles ccest-nav-open */
  .ccest-shell.ccest-nav-open::before{display:none !important; content:none !important;}

  /* Bottom nav items: icons only (labels are redundant with aria-label) */
  .ccest-nav-item{
    flex:1;
    justify-content:center;
    text-align:center;
    padding: 10px 6px;
    gap: 0;
    flex-direction:column;
    border-radius: 10px !important;
  }
  .ccest-nav-ico{width:auto; font-size:20px; line-height:1;}
  .ccest-nav-label{display:none;}

  /* Hide spacer + collapse toggle in bottom nav */
  .ccest-sidenav-spacer{display:none;}
  .ccest-nav-collapse{display:none;}

  /* Ensure content isn't hidden behind bottom nav */
  .ccest-main{padding-bottom: calc(var(--ccest-bottomnav-h, 72px) + env(safe-area-inset-bottom, 0px) + 10px);}
  .ccest-footer{padding-bottom: calc(var(--ccest-bottomnav-h, 72px) + env(safe-area-inset-bottom, 0px));}
}

/* Harden colors for estimate list (themes sometimes override button text colors) */
.ccest-shell .ccest-item-title,
.ccest-shell .ccest-right{color:var(--ccest-text) !important;}
.ccest-shell .ccest-item-meta{color:var(--ccest-muted) !important;}

/* Ensure project cards are true 10px rounded rectangles everywhere */
.ccest-shell .ccest-project-card{
  border-radius:10px !important;
  padding:24px !important;
}


/* Registration Wizard */

.ccest-shell.ccest-shell-centered{
  /*
    Full-bleed registration background.
    Many WP themes place shortcodes inside constrained containers.
    The 50vw breakout makes this section span the entire viewport.
  */
  width: 100vw;
  max-width: none;
  margin: 0;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: calc(100vh - 36px);
  /*
    IMPORTANT: Some WP themes lock <body> scrolling on desktop (but not mobile),
    which can make the longer "Create account" step impossible to scroll.
    Make the registration shell its own scroll container.
  */
  max-height: calc(100vh - 36px);
  overflow-y: auto;
  overflow-x: hidden;

  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding: 34px 18px;

  /* Remove the app-shell chrome so it reads as a page background */
  border: none;
  border-radius: 0;
  box-shadow: none;
  /* keep internal scroll enabled */

  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Membership paywall: center the notice both horizontally and vertically */
.ccest-shell.ccest-shell-centered.ccest-shell-paywall{
  align-items: center;
  padding: 18px 18px;
}
.ccest-paywall-card{
  position: relative;
  /* Reserve space for the top-right Logout button so it never overlaps the headline */
  padding-top: 54px;
}
.ccest-paywall-logout{
  position: absolute;
  top: 14px;
  right: 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--ccest-muted) !important;
  text-decoration: none !important;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.10);
}
.ccest-paywall-logout:hover{opacity: .9;}
body.admin-bar .ccest-shell.ccest-shell-centered{
  min-height: calc(100vh - 36px - 32px);
  max-height: calc(100vh - 36px - 32px);
}

#ccest-register-root{width: 100%;}

/* Registration trade grid: compact + modern */
.ccest-trade-grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
  margin-top: 10px;
}
@media (max-width: 760px){
  .ccest-trade-grid{grid-template-columns: repeat(2, minmax(0, 1fr));}
}
@media (max-width: 420px){
  .ccest-trade-grid{grid-template-columns: 1fr;}
}

/* Harden trade-chip internals against theme CSS (positioning, color, etc.) */
.ccest-shell .ccest-trade-chip{justify-content:flex-start; min-height: 42px;}
.ccest-shell.ccest-shell-centered .ccest-trade-chip{
  border-radius: 12px;
  padding: 8px 10px;
}
.ccest-shell .ccest-trade-chip span{
  position: static !important;
  inset: auto !important;
  display:block;
  color: var(--ccest-text) !important;
  font-weight: 750;
  font-size: 13px;
  line-height: 1.15;
}
.ccest-shell .ccest-trade-chip.is-checked{
  border-color: rgba(91,231,196,.65);
  background: rgba(91,231,196,.10);
  box-shadow: 0 10px 26px rgba(91,231,196,.10);
}
.ccest-shell .ccest-trade-checkbox{
  width: 18px;
  height: 18px;
  accent-color: rgba(91,231,196,.95);
}

.ccest-wizard{
  width:100%;
  max-width: 920px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}

.ccest-wizard-head{
  text-align:center;
  padding: 10px 6px 0;
}

/* Registration brand logo */
.ccest-brand-logo-wrap{
  display:flex;
  justify-content:center;
  margin: 2px 0 12px;
}
.ccest-brand-logo{
  /* Keep the registration logo from dominating the viewport */
  max-width: 175px;
  max-height: 175px;
  width: auto;
  height: auto;
  display:block;
  object-fit: contain;
  filter: drop-shadow(0 10px 26px rgba(0,0,0,.35));
}
@media (max-width: 520px){
  .ccest-brand-logo{width: 150px;}
}
.ccest-wizard-head h1{
  font-size: 30px;
  margin: 0;
  letter-spacing: .2px;
}
.ccest-wizard-head p{
  margin: 8px 0 0;
  color: var(--ccest-muted);
  font-size: 14px;
}

.ccest-stepper{
  display:flex;
  justify-content:center;
  gap: 8px;
  flex-wrap:wrap;
  margin-top: 12px;
}
.ccest-step{
  display:flex;
  align-items:center;
  gap: 8px;
  padding: 8px 10px;
  border: 1px solid var(--ccest-border);
  border-radius: 999px;
  background: rgba(255,255,255,.03);
  color: var(--ccest-muted);
  font-size: 12px;
}
.ccest-step-num{
  width: 22px;
  height: 22px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  border: 1px solid rgba(91,231,196,.35);
  background: rgba(91,231,196,.10);
  color: var(--ccest-text);
  font-weight: 700;
}
.ccest-step.ccest-step-active{
  border-color: rgba(91,231,196,.55);
  background: rgba(91,231,196,.10);
  color: var(--ccest-text);
}
.ccest-step.ccest-step-done{
  border-color: rgba(91,231,196,.55);
  background: rgba(91,231,196,.10);
  color: var(--ccest-text);
}

.ccest-wizard-card{
  max-width: 920px;
  margin: 0 auto;
  width:100%;
  background: linear-gradient(180deg, rgba(255,255,255,.05), transparent), var(--ccest-card);
  border: 1px solid var(--ccest-border);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 18px 42px rgba(0,0,0,.35);
}

.ccest-plan-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
@media (max-width: 760px){
  .ccest-plan-grid{grid-template-columns: 1fr;}
}

.ccest-plan{
  border:1px solid var(--ccest-border);
  border-radius: 16px;
  padding: 14px;
  background: rgba(255,255,255,.02);
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, box-shadow .12s ease;
  display:flex;
  flex-direction:column;
  gap: 10px;
  min-height: 260px;
}
.ccest-plan:hover{transform: translateY(-1px); box-shadow: 0 16px 40px rgba(0,0,0,.25);}
.ccest-plan.ccest-plan-selected{
  border-color: rgba(91,231,196,.65);
  box-shadow: 0 18px 50px rgba(91,231,196,.10);
}
.ccest-plan-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap: 10px;
}
.ccest-plan-name{
  font-weight: 800;
  font-size: 18px;
  margin:0;
}
.ccest-plan-price{
  font-weight: 800;
  font-size: 18px;
  color: var(--ccest-text);
}
.ccest-plan-price span{font-weight:600; font-size: 12px; color: var(--ccest-muted);}
.ccest-plan-tag{
  display:inline-flex;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,107,61,.45);
  background: rgba(255,107,61,.10);
  color: var(--ccest-text);
  font-size: 12px;
  width: fit-content;
}
.ccest-plan-bullets{
  margin: 0;
  padding-left: 18px;
  color: var(--ccest-muted);
  font-size: 13px;
  line-height: 1.35;
}
.ccest-plan-bullets li{margin: 6px 0;}

.ccest-wizard-actions{
  margin-top: 14px;
  display:flex;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.ccest-wizard-actions .ccest-btn{min-width: 160px; justify-content:center;}

.ccest-seat-row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--ccest-border);
  border-radius: 14px;
  background: rgba(255,255,255,.02);
}
.ccest-seat-ctl{
  display:flex;
  gap: 8px;
  align-items:center;
}
.ccest-seat-ctl button{
  width: 34px;
  height: 34px;
  border-radius: 10px;
}
.ccest-seat-val{
  min-width: 36px;
  text-align:center;
  font-weight: 800;
}

.ccest-review{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
}
.ccest-review-row{
  display:flex;
  justify-content: space-between;
  align-items:center;
  gap: 10px;
  padding: 10px 12px;
  border:1px solid var(--ccest-border);
  border-radius: 14px;
  background: rgba(255,255,255,.02);
}
.ccest-review-row strong{font-weight: 800;}
.ccest-spinner{
  width: 18px; height: 18px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.25);
  border-top-color: rgba(91,231,196,.9);
  animation: ccestspin .8s linear infinite;
  display:inline-block;
}
@keyframes ccestspin{to{transform: rotate(360deg);}}


/* Photo lightbox */

.ccest-lightbox {
  display: grid;
  gap: 12px;
}
.ccest-lightbox-stage {
  position: relative;
  width: 100%;
  border: 1px solid var(--ccest-border);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255,255,255,.04);
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ccest-lightbox-img {
  width: 100%;
  height: auto;
  max-height: 68vh;
  object-fit: contain;
  display: block;
}
.ccest-lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border: 1px solid var(--ccest-border);
  background: rgba(0,0,0,.45);
  color: #fff;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}
.ccest-lightbox-prev { left: 10px; }
.ccest-lightbox-next { right: 10px; }
.ccest-lightbox-nav:disabled {
  opacity: .35;
  cursor: default;
}
.ccest-lightbox-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.ccest-lightbox-count {
  font-weight: 600;
}
@media (max-width: 720px) {
  .ccest-lightbox-nav {
    width: 40px;
    height: 40px;
    font-size: 26px;
  }
  .ccest-lightbox-img {
    max-height: 60vh;
  }
}



/* Mobile UI: stabilize scrolling + compact quick actions */
@media (max-width: 960px){
  /* Avoid nested scroll containers on mobile (sticky + overflow is janky on iOS Safari) */
  .ccest-app{height:auto; min-height:100dvh; overflow:visible;}
  .ccest-content{height:auto; overflow:visible;}
  .ccest-main{overflow:visible; -webkit-overflow-scrolling:auto;}

  /* Keep the header fixed at the very top on mobile */
  .ccest-topbar{
    position: fixed;
    left: 0;
    right: 0;
    top: calc(var(--ccest-adminbar-h, 0px) + env(safe-area-inset-top, 0px));
    z-index: 90;
    background: rgba(8,14,24,.90);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .ccest-shell.ccest-theme-light .ccest-topbar{
    background: rgba(255,255,255,.92);
    border-bottom: 1px solid rgba(10,20,40,.12);
  }

  /* Push content below the fixed header */
  .ccest-main{padding-top: calc(var(--ccest-topbar-h, 0px) + 12px);}
}

@media (max-width: 720px){
  :root{ --ccest-mobile-toolbar-h: 72px; }

  /* Mobile quick-actions: fixed toolbar (always accessible) */
  .ccest-stickybar{
    position: fixed;
    left: 0;
    right: 0;
    top: calc(var(--ccest-topbar-h, 0px) + var(--ccest-adminbar-h, 0px) + env(safe-area-inset-top, 0px));
    z-index: 80;
    padding: 8px 10px;
    background: rgba(8,14,24,.80);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255,255,255,.08);
  }

  /* Push the page content below the fixed header + toolbar */
  .ccest-main{padding-top: calc(var(--ccest-topbar-h, 0px) + var(--ccest-mobile-toolbar-h, 0px) + 16px);}

  /* Keep quick actions on one row with horizontal scroll (inside the fixed toolbar) */
  .ccest-actions-sticky{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    gap:8px;
    padding:6px;
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
  }
  .ccest-actions-sticky::-webkit-scrollbar{display:none;}

  /* Icon-only buttons */
  .ccest-actions-sticky .ccest-btn{padding:10px; min-width:44px; justify-content:center;}
  .ccest-actions-sticky .ccest-btn-label{display:none;}
}


/* Folder UI */
.ccest-folderbar{align-items:flex-end; flex-wrap:wrap; gap:10px;}
.ccest-folderbar-field{min-width:220px; margin:0;}
.ccest-project-folders{margin-top:6px; display:flex; gap:6px; flex-wrap:wrap;}
.ccest-chip{display:inline-flex; align-items:center; gap:6px; padding:3px 8px; border-radius:999px; border:1px solid var(--ccest-border); font-size:12px; background:rgba(255,255,255,.03);} 
.ccest-shell.ccest-theme-light .ccest-chip{background:rgba(15,23,42,.03);} 
.ccest-chip-muted{opacity:.85;}

@media (max-width: 640px){
  .ccest-folderbar-field{min-width:160px;}
}

/* Projects list: compact toolbar (Projects + filters + folders) */
.ccest-project-toolbar{
  width:100%;
  align-items:center;
}
.ccest-project-toolbar .ccest-btn{
  border-radius:999px;
  padding:12px 14px;
}
.ccest-project-toolbar .ccest-btn-primary{
  box-shadow:0 14px 34px rgba(0,0,0,.18);
}
.ccest-project-select{
  width:auto;
  min-width:220px;
  max-width:360px;
  border-radius:12px !important;
  border:1px solid rgba(255,255,255,.22) !important;
  background:rgba(255,255,255,.06) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  padding:12px 14px;
  padding-right:44px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%23ffffff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat !important;
  background-size:18px 18px !important;
  background-position:right 12px center !important;
}
.ccest-project-select option{background-color:var(--ccest-card) !important; color:var(--ccest-text) !important;}
.ccest-shell.ccest-theme-light .ccest-project-select{
  border:1px solid rgba(15,23,42,.18) !important;
  /* Use background-color (not shorthand background) so we don't reset background-repeat */
  background-color:#ffffff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%230f172a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat !important;
  background-size:18px 18px !important;
  background-position:right 12px center !important;
}

.ccest-project-select:focus{
  border-color:rgba(91,231,196,.65) !important;
  box-shadow:0 0 0 3px rgba(91,231,196,.18) !important;
}

@media (max-width: 720px){
  .ccest-project-toolbar{gap:8px;}
  .ccest-project-select{
    min-width:120px;
    max-width:34vw;
    padding:10px 12px;
    border-radius:10px;
    padding-right:34px;
    background-position:right 10px center;
  }
}


/* Pricebook update controls on Estimate screen */
.ccest-unsaved-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.ccest-savebar-meta {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.ccest-pbupdate-ui {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.ccest-pbupdate-label {
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
  font-size: 12px;
}

.ccest-pbupdate-label input[type="checkbox"] {
  transform: translateY(1px);
}

.ccest-unitcost-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ccest-pbmini {
  padding: 4px 8px;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.2px;
}

.ccest-pbmini.is-on {
  border-color: rgba(91, 231, 196, 0.65);
  background: rgba(91, 231, 196, 0.16);
}

.ccest-pbmodal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 12px 0;
  flex-wrap: wrap;
}

.ccest-pbmodal-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
}

.ccest-pbmodal-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.ccest-pbmodal-left {
  min-width: 0;
}

.ccest-pbmodal-meta {
  font-size: 12px;
  opacity: 0.85;
  margin-top: 4px;
}

/* =============================
   Estimate editor: sticky banners + fixed save bar
   ============================= */

/* Keep the unsaved banner visible just under the toolbar (sticky actions row). */
.ccest-shell[data-route="estimate"] .ccest-unsaved{
  top: calc(var(--ccest-mobile-toolbar-h, 0px) + 8px);
  z-index: 70;
}

/* On mobile the toolbar is fixed below the topbar, so pin the banner below both. */
@media (max-width: 720px){
  .ccest-shell[data-route="estimate"] .ccest-unsaved{
    top: calc(
      var(--ccest-topbar-h, 0px)
      + var(--ccest-adminbar-h, 0px)
      + env(safe-area-inset-top, 0px)
      + var(--ccest-mobile-toolbar-h, 0px)
      + 8px
    );
    z-index: 85;
  }
}

/* Make the bottom save bar always available (fixed), not just when you scroll to the end. */
.ccest-shell[data-route="estimate"] .ccest-savebar{
  position: fixed;
  left: calc(220px + 18px);
  right: 18px;
  bottom: 18px;
  margin: 0;
  z-index: 95;
}

.ccest-shell.ccest-nav-collapsed[data-route="estimate"] .ccest-savebar{
  left: calc(70px + 18px);
}

@media (max-width: 960px){
  .ccest-shell[data-route="estimate"] .ccest-savebar{
    left: 10px;
    right: 10px;
    bottom: 18px;
  }
}

@media (max-width: 720px){
  .ccest-shell[data-route="estimate"] .ccest-savebar{
    bottom: calc(var(--ccest-bottomnav-h, 72px) + env(safe-area-inset-bottom, 0px) + 10px);
  }
}

/* Extra space so the fixed save bar doesn't cover the last rows/cards. */
.ccest-shell[data-route="estimate"] .ccest-stack{
  padding-bottom: 170px;
}

@media (max-width: 720px){
  .ccest-shell[data-route="estimate"] .ccest-stack{
    padding-bottom: calc(170px + var(--ccest-bottomnav-h, 72px));
  }
}

/* =============================
   Pricebook update: per-row indicator
   ============================= */

.ccest-pbupdate-btn.is-on{
  border-color: rgba(91,231,196,.85);
  background: rgba(91,231,196,.15);
  color: var(--ccest-text);
}

.ccest-tr.ccest-pbselected{
  box-shadow: inset 3px 0 0 rgba(91,231,196,.85);
}

/* =============================
   Expenses (Phase 2) — category suggestions
   ============================= */

.ccest-cat-cell{
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.ccest-suggest{
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px dashed var(--ccest-border);
  background: transparent;
  color: var(--ccest-text);
  font-size: 12px;
  line-height: 1.2;
  cursor: pointer;
}

.ccest-suggest:hover{
  background: rgba(255,255,255,0.04);
}

/* =============================
   Expenses — receipt processing UX (Phase 2/3)
   ============================= */

.ccest-processing{
  border: 1px solid rgba(91,231,196,.30);
  background:
    linear-gradient(180deg, rgba(91,231,196,.10), rgba(255,255,255,0.02));
  border-radius: 14px;
  padding: 14px;
  margin: 12px 0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,0.06);
}

.ccest-processing-title{
  font-size: 16px;
  font-weight: 900;
  letter-spacing: .2px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.ccest-processing-sub{
  color: var(--ccest-muted);
  margin-top: 6px;
  font-size: 13px;
}

.ccest-spinner{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,0.25);
  border-top-color: var(--ccest-accent);
  animation: ccestSpin .9s linear infinite;
  flex: 0 0 auto;
  margin-top: 2px;
}

@keyframes ccestSpin{
  from{ transform: rotate(0deg); }
  to{ transform: rotate(360deg); }
}

.ccest-dots{
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.ccest-dots i{
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,0.85);
  opacity: .18;
  animation: ccestDot 1.1s infinite;
}

.ccest-dots i:nth-child(2){ animation-delay: .15s; }
.ccest-dots i:nth-child(3){ animation-delay: .30s; }

@keyframes ccestDot{
  0%, 100%{ opacity: .18; transform: translateY(0); }
  40%{ opacity: .95; transform: translateY(-2px); }
}

.ccest-proc-bar{
  height: 8px;
  border-radius: 999px;
  overflow: hidden;
  margin-top: 10px;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.08);
}

.ccest-proc-bar > div{
  height: 100%;
  width: 38%;
  background: linear-gradient(90deg, rgba(91,231,196,.20), rgba(91,231,196,.85), rgba(255,107,61,.65));
  border-radius: 999px;
  animation: ccestIndeterminate 1.5s ease-in-out infinite;
}

@keyframes ccestIndeterminate{
  0%{ transform: translateX(-120%); }
  50%{ transform: translateX(120%); }
  100%{ transform: translateX(260%); }
}

.ccest-proc-steps{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.ccest-proc-step{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.12);
  font-size: 12px;
  color: var(--ccest-muted);
}

.ccest-proc-dot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  background: rgba(255,255,255,0.20);
}

.ccest-proc-step.is-active{
  border-color: rgba(91,231,196,.45);
  background: rgba(91,231,196,.08);
  color: var(--ccest-text);
}

.ccest-proc-step.is-active .ccest-proc-dot{
  background: rgba(91,231,196,.95);
  box-shadow: 0 0 0 5px rgba(91,231,196,.14);
  animation: ccestPulse 1.2s ease-in-out infinite;
}

.ccest-proc-step.is-done{
  border-color: rgba(91,231,196,.35);
  color: rgba(233,238,252,.92);
}

.ccest-proc-step.is-done .ccest-proc-dot{
  background: rgba(91,231,196,.80);
}

@keyframes ccestPulse{
  0%,100%{ transform: scale(1); opacity: 1; }
  50%{ transform: scale(1.12); opacity: .85; }
}

/* Skeleton rows while processing */
.ccest-skel-row td{ padding-top: 12px; padding-bottom: 12px; }

.ccest-skeleton{
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(255,255,255,0.06), rgba(255,255,255,0.14), rgba(255,255,255,0.06));
  background-size: 220% 100%;
  animation: ccestShimmer 1.25s ease-in-out infinite;
}

@keyframes ccestShimmer{
  0%{ background-position: 0% 0%; }
  100%{ background-position: 120% 0%; }
}
.ccest-shell.ccest-theme-light .ccest-project-select option{background-color:#ffffff !important; color:#0b1020 !important;}

/* -------------------------------------------------------------------------
   Phase 1 (v3.2.4): Reports
   ------------------------------------------------------------------------- */

.ccest-reports-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.ccest-range{
  display:flex;
  gap:10px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.ccest-range .ccest-filter{min-width:160px;}
.ccest-range .ccest-filter.sm{min-width:150px;}

.ccest-range-note{font-size:12px; color:var(--ccest-muted); margin-top:4px;}

.ccest-trend{
  margin-top:10px;
}

.ccest-trend-bars{
  display:flex;
  align-items:flex-end;
  gap:6px;
  height:170px;
  padding:10px 6px 6px;
  border-radius:14px;
  background: rgba(255,255,255,.03);
  border:1px solid var(--ccest-border);
}

.ccest-trend-col{
  flex:1 1 0;
  min-width:10px;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  gap:2px;
}

.ccest-trend-bar{
  width:12px;
  border-radius:10px 10px 4px 4px;
  background: var(--ccest-accent);
  box-shadow: 0 10px 16px rgba(0,0,0,.14);
  opacity:.92;
}

.ccest-trend-bar.exp{
  width:7px;
  background: var(--ccest-accent2);
  opacity:.55;
}

.ccest-trend-legend{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  margin-top:10px;
  font-size:12px;
  color:var(--ccest-muted);
}

.ccest-trend-key{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.ccest-trend-swatch{
  width:12px;
  height:12px;
  border-radius:4px;
  background: var(--ccest-accent);
}

.ccest-trend-swatch.exp{ background: var(--ccest-accent2); opacity:.6; }

/* Project Profitability Snapshot */
.ccest-snapshot{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.ccest-snapshot-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  margin-top:10px;
}

/* -------------------------------------------------------------------------
   Phase 3 (v3.2.6): Reports — P&L
   ------------------------------------------------------------------------- */

.ccest-pl-indent{padding-left:18px;}

tr.ccest-subhead td{
  background: rgba(255,255,255,.03);
  font-size:12px;
  color:var(--ccest-muted) !important;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
}

tr.ccest-total td{
  background: rgba(255,255,255,.02);
  font-weight:700;
}

.ccest-pl-chart{
  display:flex;
  gap:6px;
  align-items:stretch;
  height:200px;
  padding:10px 6px 6px;
  border-radius:14px;
  background: rgba(255,255,255,.03);
  border:1px solid var(--ccest-border);
  overflow-x:auto;
}

.ccest-pl-col{
  flex:1 0 34px;
  min-width:34px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.ccest-pl-stack{
  flex:1;
  display:flex;
  flex-direction:column;
  border-radius:10px;
  overflow:hidden;
}

.ccest-pl-pos,
.ccest-pl-neg{
  width:100%;
}

.ccest-pl-pos{display:flex; align-items:flex-end;}
.ccest-pl-neg{display:flex; align-items:flex-start;}

.ccest-pl-zero{height:1px; background: rgba(255,255,255,.14);}

.ccest-pl-barwrap{
  display:flex;
  gap:4px;
  justify-content:center;
  align-items:flex-end;
  width:100%;
  height:100%;
  padding:0 2px;
}
.ccest-pl-barwrap--neg{align-items:flex-start;}

.ccest-pl-bar{
  width:40%;
  min-width:6px;
  border-radius:10px 10px 4px 4px;
  background: var(--ccest-accent);
  box-shadow: 0 10px 16px rgba(0,0,0,.14);
}

.ccest-pl-bar--gross{opacity:.92;}
.ccest-pl-bar--net{opacity:.48;}

.ccest-pl-xlab{font-size:11px; color:var(--ccest-muted) !important; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.ccest-pl-swatch{
  width:12px;
  height:12px;
  border-radius:4px;
  background: var(--ccest-accent);
  display:inline-block;
}
.ccest-pl-swatch--net{opacity:.55;}



/* --------------------------------------------------------------
   Phase 4 (v3.7.5): Invoice menu choice cards
-------------------------------------------------------------- */
.ccest-choice-list{display:flex; flex-direction:column; gap:10px;}
.ccest-choice-card{
  width:100%;
  text-align:left;
  border:1px solid var(--ccest-border);
  background:rgba(255,255,255,.03);
  border-radius:var(--ccest-radius);
  padding:12px 12px;
  cursor:pointer;
}
.ccest-choice-card:hover{border-color:rgba(255,255,255,.18);}
.ccest-choice-card.is-selected{
  border-color:var(--ccest-accent);
  box-shadow:0 0 0 2px rgba(91,231,196,.12);
}
.ccest-choice-card:disabled{
  opacity:.55;
  cursor:not-allowed;
}
.ccest-choice-title{font-weight:900; margin-bottom:4px;}
.ccest-choice-desc{font-size:13px; color:rgba(233,238,252,.78);}
.ccest-choice-reason{margin-top:6px; font-size:12px; color:rgba(255,107,61,.92);}