/* Restricted CRM workspace: warm glass surfaces, readable controls, scoped data density. */
.crm-dashboard-filters{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:22px 0;padding:18px}.crm-dashboard-filters>div{flex:1 1 180px}.crm-dashboard-filters>label{margin:0}.crm-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:23px 0}.crm-metric{position:relative;overflow:hidden;display:flex;flex-direction:column;min-height:155px;padding:20px;border:1px solid rgba(255,255,255,.84);border-radius:22px;color:var(--ink);box-shadow:var(--soft-shadow)}.crm-metric:after{content:"";position:absolute;width:110px;height:110px;right:-55px;top:-60px;border-radius:50%;background:rgba(255,255,255,.5)}.crm-metric:hover{color:var(--ink);transform:translateY(-4px);box-shadow:0 18px 40px rgba(86,55,59,.12)}.crm-metric.coral{background:linear-gradient(145deg,#fffaf7,#f5d2c6)}.crm-metric.amber{background:linear-gradient(145deg,#fffdf6,#f2dfb7)}.crm-metric.mint{background:linear-gradient(145deg,#fbfffd,#cfe7dd)}.crm-metric.plum{background:linear-gradient(145deg,#fffafd,#dfccdf)}.crm-metric span{font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.crm-metric strong{margin:auto 0 2px;font:800 2rem "Manrope",sans-serif}.crm-metric small{color:var(--muted);font-size:.75rem}.crm-dashboard-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.pipeline-bars,.crm-work-list{display:grid;gap:11px}.pipeline-bars a{display:grid;grid-template-columns:120px minmax(0,1fr) 36px;align-items:center;gap:12px;min-height:44px;color:var(--ink);font-size:.8125rem;font-weight:800}.pipeline-bars i{height:8px;border-radius:99px;background:rgba(121,83,110,.09);overflow:hidden}.pipeline-bars b{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--coral),var(--amber))}.crm-work-list a{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;min-height:55px;padding:9px;border-bottom:1px solid var(--line);color:var(--ink)}.crm-work-list small,.crm-work-list time{display:block;color:var(--muted);font-size:.6875rem}.status-dot{width:9px;height:9px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(234,114,93,.11)}
.crm-create-panel{margin:20px 0}.crm-lead-table{overflow:auto;padding:0}.crm-table-head,.crm-table-row{display:grid;grid-template-columns:1.15fr 1fr 1fr 1.1fr .8fr auto;align-items:center;gap:14px;min-width:1050px;padding:14px 18px}.crm-table-head{background:rgba(121,83,110,.06);color:var(--muted);font-size:.6875rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.crm-table-row{border-top:1px solid var(--line)}.crm-table-row:hover{background:rgba(255,255,255,.42)}.crm-table-row.is-overdue{box-shadow:inset 4px 0 var(--coral)}.crm-table-row strong,.crm-table-row small{display:block}.crm-table-row strong{font-size:.8125rem}.crm-table-row small{margin-top:4px;color:var(--muted);font-size:.6875rem}.crm-lead-layout{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.75fr);align-items:start;gap:22px}.crm-lead-side{position:sticky;top:106px}.crm-profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0;overflow:hidden;border:1px solid var(--line);border-radius:17px}.crm-profile-grid>div{padding:14px;background:rgba(255,255,255,.43)}.crm-profile-grid dt{color:var(--muted);font-size:.6875rem;text-transform:uppercase;letter-spacing:.07em}.crm-profile-grid dd{margin:5px 0 0;font-size:.8125rem;font-weight:750;overflow-wrap:anywhere}.stack-form{display:grid;gap:9px}.stack-form .btn{margin-top:5px}.crm-timeline{display:grid}.crm-timeline article{display:grid;grid-template-columns:18px minmax(0,1fr);gap:14px;padding:0 0 20px}.crm-timeline article>i{position:relative;width:10px;height:10px;margin-top:5px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(234,114,93,.12)}.crm-timeline article>i:after{content:"";position:absolute;left:4px;top:15px;width:2px;height:calc(100% + 12px);background:rgba(121,83,110,.12)}.crm-timeline article:last-child>i:after{display:none}.crm-timeline h3{margin:4px 0;font-size:.9375rem}.crm-timeline p{margin:0 0 6px;color:var(--muted);white-space:pre-wrap}.crm-timeline span,.crm-timeline small{color:var(--muted);font-size:.6875rem}.crm-visit-list,.crm-task-list{display:grid;gap:9px;margin-top:13px}.crm-visit-list article,.crm-task-list article{display:flex;justify-content:space-between;gap:11px;padding:11px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.45)}.crm-visit-list strong,.crm-visit-list small,.crm-task-list strong,.crm-task-list small{display:block}.crm-visit-list small,.crm-task-list small{color:var(--muted);font-size:.6875rem}.crm-task-list article.is-overdue{border-color:rgba(234,114,93,.34)}.crm-visit-list details{max-width:360px}.crm-visit-list details form{display:grid;gap:7px;margin-top:8px}
.inventory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.inventory-card{overflow:hidden;padding:20px;border:1px solid rgba(255,255,255,.83);border-top:5px solid var(--mint);border-radius:23px;background:rgba(255,255,255,.67);box-shadow:var(--soft-shadow)}.inventory-card.status-temporarilyheld{border-top-color:var(--amber)}.inventory-card.status-blocked,.inventory-card.status-booked{border-top-color:var(--coral)}.inventory-card.status-unavailable,.inventory-card.status-cancelled{opacity:.72;border-top-color:var(--plum)}.inventory-card h2{margin:12px 0 5px;font-size:1.35rem}.inventory-card>p{min-height:42px;color:var(--muted);font-size:.8125rem}.inventory-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.inventory-facts span{padding:10px;border-radius:13px;background:rgba(121,83,110,.055)}.inventory-facts small,.inventory-facts strong{display:block}.inventory-facts small{color:var(--muted);font-size:.6875rem}.inventory-facts strong{margin-top:3px;font-size:.8125rem}.inventory-card>details{border-top:1px solid var(--line)}.inventory-card>details>summary,.milestone-actions summary,.collection-card>details>summary{display:flex;align-items:center;min-height:44px;color:var(--coral-dark);font-size:.8125rem;font-weight:800;cursor:pointer}.crm-history-list p{margin:0;padding:8px 0;border-top:1px solid var(--line)}.crm-history-list strong,.crm-history-list span{display:block;font-size:.6875rem}.crm-history-list span{color:var(--muted)}
.collection-list{display:grid;gap:20px}.collection-card{overflow:hidden}.collection-card .panel-heading p{margin:5px 0;color:var(--muted)}.approval-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:15px;margin-bottom:15px;border-radius:17px;background:rgba(230,168,79,.1)}.approval-strip form,.inline-action{display:flex;align-items:center;gap:8px}.milestone-list{display:grid;gap:12px;margin-top:16px}.milestone-row{padding:16px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.45)}.milestone-summary{display:flex;align-items:center;gap:12px}.milestone-summary h3{margin:0 0 3px;font-size:.9375rem}.milestone-summary p{margin:0;color:var(--muted);font-size:.75rem}.milestone-actions{display:flex;gap:18px;margin-top:9px}.milestone-actions details{flex:1}.payment-list,.adjustment-list{display:grid;margin-top:9px}.payment-list>div,.adjustment-list>div{display:flex;justify-content:space-between;align-items:center;gap:9px;padding:9px 0;border-top:1px solid var(--line)}.payment-list strong,.payment-list small,.adjustment-list strong,.adjustment-list small{display:block;font-size:.6875rem}.payment-list small,.adjustment-list small{color:var(--muted)}.decision-form{display:flex;align-items:center;gap:8px;max-width:500px}.decision-form .form-control{max-width:230px}
@media(max-width:1100px){.crm-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.crm-dashboard-grid,.crm-lead-layout{grid-template-columns:1fr}.crm-lead-side{position:static}.inventory-grid{grid-template-columns:1fr}.approval-strip{grid-template-columns:1fr}}@media(max-width:600px){.crm-metric-grid,.crm-profile-grid{grid-template-columns:1fr}.crm-dashboard-filters{align-items:stretch}.crm-dashboard-filters>*{width:100%}.approval-strip form,.inline-action,.decision-form{align-items:stretch;flex-direction:column}.decision-form .form-control{max-width:none}.milestone-actions{display:grid}.payment-list>div,.adjustment-list>div{align-items:flex-start;flex-direction:column}}

/* Meta Lead Ads administration */
.meta-safety-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0}.meta-safety-strip>div{padding:12px;border-radius:15px;background:rgba(121,83,110,.05)}.meta-safety-strip strong,.meta-safety-strip small{display:block}.meta-safety-strip small{margin-top:4px;color:var(--muted)}.meta-connect-panel{display:flex;align-items:center;justify-content:space-between;gap:25px;background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(223,204,223,.52))}.meta-connect-panel h2{margin:4px 0}.meta-connect-panel p{margin:0;color:var(--muted)}.meta-connect-button{display:inline-flex;align-items:center;gap:10px;min-height:58px;padding-inline:23px}.meta-connect-button span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#1877f2;color:#fff;font:800 1.25rem Arial}.meta-connection-grid,.meta-mapping-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:20px}.meta-connection-card h2,.meta-mapping-card h2{margin:12px 0 4px}.meta-connection-card>p,.meta-mapping-card>p{color:var(--muted)}.meta-connection-card dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.meta-connection-card dl div,.meta-health-facts div{padding:10px;border-radius:13px;background:rgba(121,83,110,.05)}.meta-connection-card dt,.meta-health-facts dt{color:var(--muted);font-size:.6875rem}.meta-connection-card dd,.meta-health-facts dd{margin:3px 0 0;font-weight:750}.meta-mapping-panel{background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(248,214,200,.38))}.meta-health-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:14px 0}.meta-mapping-card>details>summary{display:flex;align-items:center;min-height:44px;color:var(--coral-dark);font-weight:800;cursor:pointer}
@media(max-width:1000px){.meta-safety-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.meta-connection-grid,.meta-mapping-grid{grid-template-columns:1fr}}
@media(max-width:650px){.meta-safety-strip,.meta-connection-card dl,.meta-health-facts{grid-template-columns:1fr}.meta-connect-panel{align-items:flex-start;flex-direction:column}.meta-connect-button{width:100%}}

/* Role-adaptive Sales Hub command centre */
.crm-command-centre{max-width:100%;overflow:hidden}.crm-dashboard-switcher{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin:22px 0;padding:8px}.crm-dashboard-switcher a{display:grid;grid-template-columns:auto 1fr;column-gap:11px;align-items:center;min-height:72px;padding:12px 15px;border:1px solid transparent;border-radius:18px;color:var(--ink)}.crm-dashboard-switcher a>span{grid-row:1/3;display:grid;place-items:center;width:38px;height:38px;border-radius:13px;background:rgba(121,83,110,.07);color:var(--coral-dark);font-weight:850}.crm-dashboard-switcher strong,.crm-dashboard-switcher small{display:block}.crm-dashboard-switcher small{color:var(--muted);font-size:.7rem}.crm-dashboard-switcher a:hover,.crm-dashboard-switcher a.active{border-color:rgba(234,114,93,.22);background:linear-gradient(135deg,rgba(255,255,255,.8),rgba(248,214,200,.34));box-shadow:0 12px 28px rgba(84,53,58,.08);transform:translateY(-2px)}.crm-dashboard-switcher a.active>span{background:linear-gradient(145deg,var(--coral),#f0ad75);color:#fff;box-shadow:0 8px 20px rgba(234,114,93,.26)}
.crm-filter-dock{position:relative;z-index:2;display:grid;grid-template-columns:repeat(6,minmax(120px,1fr)) auto;align-items:end}.crm-filter-dock>div{min-width:0}.dashboard-title-row{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:34px 0 17px}.dashboard-title-row h2{margin:5px 0 0;font-size:clamp(1.35rem,2.5vw,2rem)}.dashboard-pulse{display:flex;align-items:center;gap:10px;color:var(--ink);font-weight:750}.dashboard-pulse i{width:11px;height:11px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 7px rgba(117,184,161,.14);animation:crmPulse 2s ease-in-out infinite}.dashboard-pulse small{color:var(--muted);font-weight:600}@keyframes crmPulse{50%{box-shadow:0 0 0 12px rgba(117,184,161,0)}}
.crm-metric-grid-six{grid-template-columns:repeat(6,minmax(0,1fr))}.crm-metric-grid-six .crm-metric{min-height:142px;padding:17px}.crm-metric-grid-six .crm-metric strong{font-size:clamp(1.35rem,2vw,1.8rem);overflow-wrap:anywhere}.crm-kpi-ribbon{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));margin:17px 0 22px;padding:7px;overflow:hidden}.crm-kpi-ribbon>a,.crm-kpi-ribbon>span{display:flex;flex-direction:column;justify-content:center;min-height:74px;padding:11px;border-right:1px solid var(--line);color:var(--ink);text-align:center}.crm-kpi-ribbon>:last-child{border-right:0}.crm-kpi-ribbon>a:hover{border-radius:13px;background:rgba(255,255,255,.6);transform:translateY(-2px)}.crm-kpi-ribbon span,.crm-kpi-ribbon b{color:var(--muted);font-size:.67rem;font-weight:750}.crm-kpi-ribbon strong{margin-top:5px;color:var(--ink);font-size:1.05rem}
.crm-insight-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.crm-chart-card{min-width:0;min-height:330px}.crm-chart-card.wide{grid-column:1/-1;min-height:260px}.crm-chart-card h3{margin:4px 0;font-size:1.08rem}.crm-donut-layout{display:grid;grid-template-columns:190px minmax(0,1fr);align-items:center;gap:25px;min-height:225px}.crm-donut{position:relative;display:grid;place-items:center;width:178px;aspect-ratio:1;margin:auto;border-radius:50%;background:conic-gradient(var(--donut));box-shadow:inset 0 0 0 1px rgba(255,255,255,.6),0 16px 35px rgba(84,53,58,.1);transition:transform .35s ease}.crm-donut:hover{transform:rotate(3deg) scale(1.025)}.crm-donut:after{content:"";position:absolute;inset:29px;border-radius:50%;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(250,246,242,.94));box-shadow:inset 0 1px 5px rgba(84,53,58,.08)}.crm-donut>span{position:relative;z-index:1;text-align:center}.crm-donut strong,.crm-donut small{display:block}.crm-donut strong{font-size:1.55rem}.crm-donut small{color:var(--muted);font-size:.7rem}.crm-chart-legend{display:grid;gap:8px}.crm-chart-legend>div{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:7px;border-radius:11px}.crm-chart-legend>div:hover{background:rgba(121,83,110,.045)}.crm-chart-legend i{width:9px;height:9px;border-radius:50%;background:var(--coral)}.crm-chart-legend>div:nth-child(2) i{background:var(--amber)}.crm-chart-legend>div:nth-child(3) i{background:var(--mint)}.crm-chart-legend>div:nth-child(4) i{background:var(--plum)}.crm-chart-legend>div:nth-child(5) i{background:#dd8e9e}.crm-chart-legend>div:nth-child(6) i{background:#6e9cb5}.crm-chart-legend span,.crm-chart-legend strong{font-size:.75rem}.crm-chart-legend p,.crm-horizontal-chart p{color:var(--muted);font-size:.8rem}
.crm-horizontal-chart{display:grid;gap:11px;margin-top:12px}.crm-horizontal-chart>div{display:grid;grid-template-columns:minmax(105px,1fr) minmax(120px,2fr) auto;align-items:center;gap:10px;min-height:27px}.crm-horizontal-chart span{overflow:hidden;color:var(--ink);font-size:.72rem;font-weight:720;text-overflow:ellipsis;white-space:nowrap}.crm-horizontal-chart strong{min-width:35px;color:var(--muted);font-size:.7rem;text-align:right}.crm-horizontal-chart i{height:9px;overflow:hidden;border-radius:99px;background:rgba(121,83,110,.07)}.crm-horizontal-chart b{display:block;height:100%;min-width:3px;border-radius:99px;background:linear-gradient(90deg,var(--plum),var(--coral));transition:width .7s cubic-bezier(.2,.8,.2,1)}.crm-horizontal-chart.mint-bars b{background:linear-gradient(90deg,#5f9f8c,var(--mint))}.crm-horizontal-chart.amber-bars b{background:linear-gradient(90deg,#d8a647,var(--amber))}.crm-horizontal-chart.coral-bars b{background:linear-gradient(90deg,#d45f59,var(--coral))}.crm-column-chart{display:flex;align-items:end;justify-content:space-around;gap:14px;min-height:230px;padding-top:25px}.crm-column-chart>div{display:grid;grid-template-rows:auto 155px auto;align-items:end;justify-items:center;gap:7px;min-width:60px}.crm-column-chart strong{font-size:.68rem}.crm-column-chart i{position:relative;width:34px;height:155px;border-radius:12px;background:rgba(121,83,110,.06)}.crm-column-chart b{position:absolute;right:0;bottom:0;left:0;min-height:3px;border-radius:12px;background:linear-gradient(180deg,var(--amber),var(--coral));transition:height .7s ease}.crm-column-chart span{color:var(--muted);font-size:.66rem;text-align:center}.crm-comparison-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.crm-comparison-charts h4{margin:0;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.07em}.crm-operational-tray>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;cursor:pointer}.crm-operational-tray>summary b,.crm-operational-tray>summary small{display:block}.crm-operational-tray>summary small{margin-top:3px;color:var(--muted);font-size:.72rem}
@media(max-width:1280px){.crm-metric-grid-six{grid-template-columns:repeat(3,minmax(0,1fr))}.crm-filter-dock{grid-template-columns:repeat(4,minmax(140px,1fr))}.crm-kpi-ribbon{grid-template-columns:repeat(4,minmax(0,1fr))}.crm-kpi-ribbon>:nth-child(4n){border-right:0}}
@media(max-width:900px){.crm-dashboard-switcher{grid-template-columns:1fr}.crm-filter-dock{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-insight-grid{grid-template-columns:1fr}.crm-chart-card.wide{grid-column:auto}.crm-metric-grid-six{grid-template-columns:repeat(2,minmax(0,1fr))}.crm-comparison-charts{grid-template-columns:1fr}}
@media(max-width:600px){.crm-filter-dock,.crm-metric-grid-six,.crm-kpi-ribbon{grid-template-columns:1fr}.crm-kpi-ribbon>*{border-right:0;border-bottom:1px solid var(--line)}.crm-kpi-ribbon>:last-child{border-bottom:0}.dashboard-title-row{align-items:flex-start;flex-direction:column}.crm-donut-layout{grid-template-columns:1fr}.crm-donut{width:156px}.crm-chart-card{min-height:0}.crm-horizontal-chart>div{grid-template-columns:minmax(90px,1fr) minmax(80px,1.2fr) auto}.crm-column-chart{overflow-x:auto;justify-content:flex-start}.crm-column-chart>div{min-width:74px}}
/* ---- Site plan review editor -------------------------------------------------
   The colours carry the review state, because "which of these has a human looked
   at" is the question this screen exists to answer. Proposed, edited, unlinked
   and ignored have to be tellable apart at a glance, and an unlinked plot has to
   look unfinished rather than merely grey - grey is also a real inventory status,
   and the two must never be confusable. */
.site-plan-editor { display: grid; grid-template-columns: minmax(0, 1fr) 22rem; gap: 1.5rem; align-items: start; }
.site-plan-editor-canvas { position: relative; min-width: 0; }
.site-plan-editor-canvas img { width: 100%; height: auto; display: block; border-radius: 0.5rem; }
.site-plan-editor-canvas svg { position: absolute; inset: 0; width: 100%; height: 100%; }

.site-plan-shape { fill-opacity: 0.35; stroke-width: 2; cursor: pointer; transition: fill-opacity 120ms ease; }
.site-plan-shape:hover, .site-plan-shape:focus-visible { fill-opacity: 0.55; outline: none; }
.site-plan-shape.is-proposed { fill: #3b82f6; stroke: #1d4ed8; }
.site-plan-shape.is-edited { fill: #10b981; stroke: #047857; }
/* Hatched rather than merely coloured: an unlinked plot is incomplete work, and
   should not be mistakable for a plot whose inventory status happens to be grey. */
.site-plan-shape.is-unlinked { fill: #f59e0b; stroke: #b45309; stroke-dasharray: 6 4; }
.site-plan-shape.is-ignored { fill: #9ca3af; stroke: #6b7280; fill-opacity: 0.15; stroke-dasharray: 2 6; }
.site-plan-shape.is-uncertain { stroke-dasharray: 10 5; stroke-width: 3; }
.site-plan-shape.is-selected { fill-opacity: 0.6; stroke-width: 4; stroke: #111827; }

.site-plan-handle { fill: #ffffff; stroke: #111827; stroke-width: 2; cursor: grab; }
.site-plan-handle:active { cursor: grabbing; }
.site-plan-handle:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

.site-plan-editor-side { display: flex; flex-direction: column; gap: 1rem; }
.site-plan-list { list-style: none; margin: 0; padding: 0; max-height: 18rem; overflow-y: auto; display: grid; gap: 0.25rem; }
.site-plan-list button { width: 100%; text-align: left; padding: 0.4rem 0.6rem; border-radius: 0.35rem; border: 1px solid transparent; background: transparent; cursor: pointer; }
.site-plan-list button:hover { background: rgba(148, 163, 184, 0.18); }
.site-plan-list button.is-selected { border-color: #2563eb; background: rgba(37, 99, 235, 0.12); font-weight: 600; }

.site-plan-selected { display: grid; gap: 0.6rem; padding: 0.9rem; border-radius: 0.5rem; background: rgba(148, 163, 184, 0.12); }
.site-plan-selected label { display: grid; gap: 0.25rem; font-size: 0.875rem; }
.site-plan-actions { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.site-plan-approve { font-weight: 600; }
.site-plan-warnings { padding: 0.75rem 1rem; border-radius: 0.5rem; background: rgba(245, 158, 11, 0.12); }
.form-refusal { padding: 0.65rem 0.9rem; border-radius: 0.4rem; background: rgba(239, 68, 68, 0.12); color: #991b1b; }
.form-confirmation { padding: 0.65rem 0.9rem; border-radius: 0.4rem; background: rgba(16, 185, 129, 0.12); color: #065f46; }

@media (max-width: 900px) {
    .site-plan-editor { grid-template-columns: minmax(0, 1fr); }
    .site-plan-editor-side { order: 2; }
}

/* ---- Inventory availability (Sales Hub) ---------------------------------------
   One status-to-colour family, used by the summary, table chips, overlay fills and
   legend alike. Blocked is amber and deliberately distinct from Reserved's yellow:
   they are different decisions and a sales team must be able to tell them apart at
   a glance. Every chip carries its label too - colour alone is not a status. */
/* One column that may shrink to the viewport. An auto track grows to its widest child's
   minimum width - the table's 60rem - and on a phone that widened every section on the page
   past the screen, where the shell clipped it. The table scrolls inside its own frame instead. */
.availability-page { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
.availability-header h1 { margin: 0.2rem 0; }

.availability-summary { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.availability-count { display: grid; gap: 0.1rem; min-width: 7.5rem; padding: 0.7rem 0.9rem; border-radius: 0.6rem; border-left: 5px solid currentColor; background: rgba(255,255,255,.55); }
.availability-count strong { font: 800 1.6rem "Manrope", sans-serif; color: var(--ink); }
.availability-count span { font-size: .75rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); }

.availability-filters { display: flex; flex-wrap: wrap; align-items: end; gap: 0.9rem; padding: 0.9rem 1rem; border-radius: 0.7rem; background: rgba(148,163,184,.12); }
.availability-filters label { display: grid; gap: 0.25rem; font-size: 0.8125rem; font-weight: 700; }

.availability-views { display: inline-flex; padding: 0.25rem; gap: 0.25rem; border-radius: 0.6rem; background: rgba(148,163,184,.18); width: max-content; }
.availability-views a { padding: 0.45rem 1.4rem; border-radius: 0.45rem; font-weight: 700; font-size: 0.875rem; color: var(--ink); text-decoration: none; }
.availability-views a.is-selected { background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.14); }
.availability-views a:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }

.availability-detail { padding: 1rem 1.1rem; border: 1px solid var(--line); border-radius: 0.75rem; background: rgba(255,255,255,.76); box-shadow: 0 8px 24px rgba(15,23,42,.06); scroll-margin-top: 1rem; }
.availability-detail:focus { outline: 2px solid #2563eb; outline-offset: 3px; }
.availability-detail__heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.availability-detail__heading h2 { margin: .15rem 0 0; }
.availability-detail__heading p { margin: .2rem 0 0; color: var(--muted); }
.availability-detail__heading a { white-space: nowrap; }
.availability-detail dl { display: grid; grid-template-columns: repeat(4, minmax(9rem, 1fr)); gap: .8rem 1rem; margin: 1rem 0 0; }
.availability-detail dl div { display: grid; gap: .2rem; }
.availability-detail dt { color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.availability-detail dd { margin: 0; font-weight: 700; }

.availability-table-scroll { overflow-x: auto; border-radius: 0.7rem; border: 1px solid var(--line); }
.availability-table { width: 100%; border-collapse: collapse; min-width: 60rem; background: rgba(255,255,255,.6); }
.availability-table th, .availability-table td { padding: 0.6rem 0.8rem; text-align: left; border-bottom: 1px solid var(--line); font-size: 0.8125rem; white-space: nowrap; }
.availability-table thead th { position: sticky; top: 0; background: rgba(121,83,110,.08); font-size: .6875rem; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.availability-table tbody tr:hover { background: rgba(255,255,255,.85); }
.availability-table tbody tr.is-selected { background: rgba(37,99,235,.10); box-shadow: inset 4px 0 #2563eb; }

.status-chip { display: inline-block; padding: 0.15rem 0.6rem; border-radius: 99px; font-size: .75rem; font-weight: 800; border: 1px solid currentColor; }
.status-available { color: #047857; background: rgba(16,185,129,.16); }
.status-reserved  { color: #92400e; background: rgba(250,204,21,.28); }
.status-sold      { color: #991b1b; background: rgba(239,68,68,.16); }
.status-blocked   { color: #9a3412; background: rgba(249,115,22,.20); }
.status-unavailable { color: #4b5563; background: rgba(156,163,175,.22); }

.availability-plan { margin: 0; display: grid; gap: 0.75rem; }
.availability-legend { display: flex; flex-wrap: wrap; gap: 0.9rem; font-size: .8125rem; font-weight: 700; }
.legend-entry { display: inline-flex; align-items: center; gap: 0.35rem; }
.legend-entry i { width: 0.9rem; height: 0.9rem; border-radius: 0.2rem; border: 1px solid rgba(0,0,0,.35); display: inline-block; }
.legend-entry i.site-plan-unmapped { background: repeating-linear-gradient(135deg, #f8fafc 0 3px, #cbd5e1 3px 6px); border-color: #64748b; }

/* The image and the overlay share one box, so responsive scaling moves both by the
   same factor. Geometry is never edited to compensate for a transform. */
.availability-plan-canvas { overflow: auto; border-radius: 0.6rem; border: 1px solid var(--line); background: #fff; }
.availability-plan-error { padding: 1.4rem; color: #991b1b; background: rgba(254,226,226,.72); font-weight: 700; }
.availability-plan-stage { position: relative; width: 100%; }
.availability-plan-stage img { display: block; width: 100%; height: auto; }
.availability-plan-stage svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.availability-plan-canvas polygon { fill-opacity: .42; stroke-width: 2; transition: fill-opacity 120ms ease; }
.availability-plan-canvas a polygon { cursor: pointer; }
.availability-plan-canvas a polygon:hover, .availability-plan-canvas a:focus-visible polygon { fill-opacity: .68; outline: none; stroke-width: 4; }
.availability-plan-canvas a:focus-visible { outline: none; }
.availability-plan-canvas polygon.is-selected { fill-opacity: .72; stroke: #111827; stroke-width: 6; }
.availability-plan-canvas polygon.site-plan-unmapped { fill: #e5e7eb; fill-opacity: .28; stroke: #64748b; cursor: default; }
.availability-available   { fill: #10b981; stroke: #047857; }
.availability-reserved    { fill: #facc15; stroke: #a16207; }
.availability-sold        { fill: #ef4444; stroke: #991b1b; }
.availability-blocked     { fill: #f97316; stroke: #9a3412; }
.availability-unavailable { fill: #9ca3af; stroke: #4b5563; }

.availability-empty { padding: 1.4rem; border-radius: 0.6rem; background: rgba(148,163,184,.14); color: var(--muted); }
.visually-hidden { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (max-width: 720px) {
    .availability-filters { flex-direction: column; align-items: stretch; }
    .availability-count { min-width: 6rem; flex: 1 1 6rem; }
    .availability-detail__heading { align-items: stretch; flex-direction: column; }
    .availability-detail dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    /* Pan and zoom rather than shrink: a squeezed plan is unreadable, and the
       vertical floor order must survive the narrow layout unchanged. */
    .availability-plan-canvas { max-height: 70vh; }
    .availability-plan-stage { width: 60rem; max-width: none; }
}

/* ---- Apartment stack -----------------------------------------------------------
   Each floor is its own row with visible spacing, a border and a label. Floors never
   overlap: each has its own image and its own SVG in its own box. Towers sit side by
   side on wide screens and one after another on narrow ones, with floor order
   unchanged - the top floor is always first. */
.availability-towers { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: flex-start; }
.availability-tower { flex: 1 1 22rem; min-width: 0; }
.availability-tower__name { margin: 0 0 0.6rem; font-size: 1rem; }
.availability-stack { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.9rem; }
.availability-floor { display: grid; grid-template-columns: minmax(10rem, 17rem) minmax(0, 1fr); gap: 0.6rem 1rem; align-items: start; padding: 0.6rem; border: 1px solid var(--line); border-radius: 0.6rem; background: rgba(255,255,255,.6); }
.availability-floor__summary { display: grid; gap: 0.5rem; }
.availability-floor__label { display: flex; justify-content: space-between; align-items: baseline; gap: 0.5rem; font-size: .8125rem; }
.availability-floor__label span { color: var(--muted); font-size: .75rem; }
.availability-floor__flats { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.3rem; }
.availability-floor__flats a.status-chip { text-decoration: none; }
.availability-floor__flats a.status-chip.is-selected { outline: 3px solid #111827; outline-offset: 1px; }
.site-plan-unmapped-chip { color: #475569; background: repeating-linear-gradient(135deg, #f8fafc 0 3px, #e2e8f0 3px 6px); }
.availability-floor__canvas { min-width: 0; }
/* A portrait plate is drawn at a readable fixed width rather than the full column, so a
   stack of eight of them reads as a building instead of eight screens of drawing. */
.availability-floor--portrait .availability-floor__canvas { max-width: 24rem; }
.availability-floor__plan { position: relative; border-radius: 0.4rem; background: #fff; border: 1px solid var(--line); }
.availability-floor__plan img { display: block; width: 100%; height: auto; }
.availability-floor__plan svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.availability-floor__plan polygon { fill-opacity: .45; stroke-width: 6; transition: fill-opacity 120ms ease; }
.availability-floor__plan a polygon { cursor: pointer; }
.availability-floor__plan a:focus-visible { outline: none; }
.availability-floor__plan a:focus-visible polygon, .availability-floor__plan a polygon:hover { fill-opacity: .72; stroke-width: 12; }
.availability-floor__plan polygon.is-selected { fill-opacity: .78; stroke: #111827; stroke-width: 16; }
.availability-floor__plan polygon.site-plan-unmapped { fill: #e5e7eb; fill-opacity: .35; stroke: #64748b; cursor: default; }
@media (max-width: 720px) {
    .availability-towers { flex-direction: column; }
    .availability-tower { flex-basis: auto; width: 100%; }
    .availability-floor { grid-template-columns: minmax(0, 1fr); }
    .availability-floor--portrait .availability-floor__canvas { max-width: none; }
}