/* EventPartner – Global Styles */

/*
 * CONVENTION EXCEPTION (intentional, audit-acknowledged):
 * The bare element/Bootstrap selectors below (body, .card, .badge, .alert, .table th)
 * are deliberate platform-wide theme overrides, not component styles — they redefine
 * Bootstrap's defaults (e.g. badge weight 700->500, alert/card radius) as the base look.
 * They are intentionally NOT scoped: scoping to a wrapper class would either change the
 * current appearance or miss elements rendered outside the wrapper (a visible regression).
 * Leave global. New *component* styles should still be scoped (see .ob-*, .lead-*, .doc-*).
 */

:root {
    --ep-primary: #4f46e5;
    --ep-radius: 0.75rem;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: #1e1e2e;
}

.card { transition: box-shadow .15s ease; }

.rounded-4 { border-radius: var(--ep-radius) !important; }

/* Form check cards (selectable goal/type tiles) */
.form-check-card {
    cursor: pointer;
    transition: border-color .15s, background .15s;
}
.form-check-card:has(.form-check-input:checked) {
    border-color: var(--ep-primary) !important;
    background: #eef2ff;
}

/* Sidebar active link */
.sidebar .nav-link.active {
    color: #fff !important;
    background: rgba(255,255,255,.15) !important;
}

/* Tables */
.table th {
    font-weight: 600;
    font-size: .8rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6b7280;
}

.badge { font-weight: 500; letter-spacing: .02em; }

.alert { border-radius: var(--ep-radius) !important; }

.form-control:focus,
.form-select:focus {
    border-color: var(--ep-primary);
    box-shadow: 0 0 0 0.2rem rgba(79,70,229,.15);
}

.navbar-brand .text-primary { color: var(--ep-primary) !important; }

::placeholder { color: #a1a1aa !important; opacity: 1; font-weight: 400; }

/* Stat cards on the dashboard */
.stat-card { border: 0; border-radius: var(--ep-radius); }
.stat-card .stat-value { font-size: 1.75rem; font-weight: 700; line-height: 1; }
.stat-card .stat-label { font-size: .8rem; color: #6b7280; text-transform: uppercase; letter-spacing: .04em; }
.stat-icon {
    width: 48px; height: 48px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0;
}
.stat-icon-purple { background: #f3f0ff; color: #7c3aed; }
.stat-icon-blue   { background: #eff6ff; color: #2563eb; }
.stat-icon-green  { background: #f0fdf4; color: #16a34a; }
.stat-icon-red    { background: #fef2f2; color: #dc2626; }
.stat-icon-yellow { background: #fefce8; color: #ca8a04; }
.stat-icon-indigo { background: #eef2ff; color: #4f46e5; }

/* Meta grid on detail pages */
.presentation-meta {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
@media (min-width: 768px) {
    .presentation-meta { grid-template-columns: 1fr 1fr 1fr; }
}
.meta-item { display: flex; align-items: flex-start; gap: 0.75rem; }
.meta-icon {
    width: 36px; height: 36px; border-radius: 8px;
    display: flex; align-items: center; justify-content: center; font-size: 0.9rem; flex-shrink: 0;
}
.meta-icon-purple { background: #f3f0ff; color: #7c3aed; }
.meta-icon-indigo { background: #eef2ff; color: #4f46e5; }
.meta-icon-blue   { background: #eff6ff; color: #2563eb; }
.meta-icon-pink   { background: #fdf2f8; color: #db2777; }
.meta-icon-green  { background: #f0fdf4; color: #16a34a; }
.meta-icon-yellow { background: #fefce8; color: #ca8a04; }
.meta-label {
    font-size: 11px; font-weight: 600; color: #9ca3af;
    text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 2px;
}
.meta-value { font-size: 14px; font-weight: 500; color: #1e1e2e; line-height: 1.4; }

.section-icon {
    width: 48px; height: 48px; border-radius: 12px;
    display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0;
}
.section-icon-purple { background: #f3f0ff; color: #7c3aed; }
.section-icon-blue   { background: #eff6ff; color: #2563eb; }
.section-icon-green  { background: #f0fdf4; color: #16a34a; }

/* Public sponsor form */
.sponsor-hero {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    color: #fff;
}

/* Subtle grey field fill so inputs separate from the white page. Scoped to the
   sponsor form only (public + iframe/JS embed both carry .sponsor-form) — no
   global .form-control/.form-select override, so admin/other forms are untouched. */
.sponsor-form .form-control,
.sponsor-form .form-select {
    background-color: #f5f6f8;
    border: 1px solid #d8dce2;
}
.sponsor-form .form-control:focus,
.sponsor-form .form-select:focus {
    background-color: #fff;
    border-color: var(--ep-primary);
    box-shadow: 0 0 0 0.2rem rgba(79,70,229,.15);
}
.sponsor-form .form-control::placeholder { color: #8a909c; opacity: 1; }

/* Validation-error summary — one readable red-boxed list (shared by every form via _form_errors
   partial; the embed inlines an identical copy so it works without this stylesheet). Scoped to
   .form-errors so it never touches other .alert/.list styling. */
.form-errors {
    background: #fef2f2;
    border: 1px solid #fca5a5;
    color: #991b1b;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 1rem;
}
.form-errors p { margin: 0 0 6px; font-weight: 600; }
.form-errors ul { margin: 0; padding-left: 1.25rem; }
.form-errors li { margin: 2px 0; }

/* iOS zoom prevention */
@media screen and (max-width: 767px) {
    input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
    input[type="password"], input[type="number"], input[type="date"], select, textarea {
        font-size: 16px !important;
    }
    .card-body { padding: 1rem; }
    td, th { word-break: break-word; }
}

/* ──────────────────────────────────────────────────────────────────────────
   Lead detail — "Company info" + "Sponsorship interest" cards (visual only).
   Scoped, lead-*-prefixed names; no global body/h2/a/.card/.badge overrides.
   ────────────────────────────────────────────────────────────────────────── */
/* --ld-* palette for the lead-detail components. Defined on BOTH the legacy .lead-detail grid and
   the redesigned page wrapper .lead-page, so cards/rows/timeline get the vars (dividers, muted
   colours, badge tints) in either layout. .lead-page carries vars only — no layout of its own. */
.lead-detail,
.lead-page{
  --ld-muted:#667085;--ld-line:#e5e7eb;--ld-blue:#2563eb;--ld-blue-soft:#eff6ff;--ld-green:#168456;--ld-green-soft:#dff7ea;
  --ld-purple:#6d28d9;--ld-purple-soft:#f0e7ff;--ld-amber:#b45309;--ld-amber-soft:#fff5e6;--ld-gray:#475569;--ld-gray-soft:#f1f5f9;
  --ld-coral:#c2410c;--ld-coral-soft:#fff1ea;--ld-teal:#0f766e;--ld-teal-soft:#e6f7f4;}
.lead-detail{display:grid;grid-template-columns:minmax(340px,.9fr) minmax(480px,1.3fr);gap:24px;align-items:start;}
.lead-card{background:#fff;border:1px solid var(--ld-line);border-radius:18px;box-shadow:0 10px 30px rgba(15,23,42,.06);padding:28px;}
.lead-company-head{display:flex;align-items:center;gap:20px;}
.lead-logo{width:84px;height:84px;flex:0 0 84px;border:1px solid var(--ld-line);border-radius:16px;display:grid;place-items:center;
  overflow:hidden;background:var(--ld-blue-soft);color:var(--ld-blue);font-size:26px;font-weight:600;}
.lead-logo img{width:100%;height:100%;object-fit:contain;}
.lead-company-head h2{font-size:24px;line-height:1.15;margin:0;}
.lead-event{margin-top:6px;color:var(--ld-muted);font-size:15px;display:inline-flex;align-items:center;gap:6px;}
.lead-divider{height:1px;background:var(--ld-line);margin:22px 0;}
.lead-section+.lead-section{margin-top:22px;}
.lead-section-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:var(--ld-muted);margin:0 0 14px;}
.lead-section-title i{color:var(--ld-blue);font-size:16px;}
.lead-row{display:grid;grid-template-columns:200px 1fr;gap:16px;align-items:center;padding:11px 0;border-bottom:1px dashed var(--ld-line);}
.lead-row:last-child{border-bottom:0;}
.lead-row dt{display:flex;align-items:center;gap:10px;color:var(--ld-muted);font-size:14px;margin:0;}
.lead-row dt i{color:var(--ld-muted);font-size:16px;width:18px;text-align:center;}
.lead-row dd{margin:0;font-weight:500;font-size:15px;}
.lead-row dd a{color:var(--ld-blue);text-decoration:none;}
.lead-empty{color:#9aa4b2;}
.lead-card-title{display:flex;align-items:center;gap:12px;margin-bottom:26px;}
.lead-card-title i{color:var(--ld-blue);font-size:24px;} .lead-card-title h2{font-size:22px;margin:0;}
.lead-interest{display:grid;grid-template-columns:1fr 1fr;gap:36px;}
.lead-interest-col{display:grid;gap:28px;align-content:start;}
.lead-interest-col+.lead-interest-col{border-left:1px solid var(--ld-line);padding-left:36px;}
.lead-block{display:flex;gap:14px;} .lead-block.start{align-items:flex-start;} .lead-block:not(.start){align-items:center;}
.lead-block>i{color:var(--ld-blue);font-size:22px;width:24px;text-align:center;line-height:1.2;}
.lead-label{margin:0 0 8px;color:#0f172a;font-size:14px;font-weight:600;display:flex;align-items:center;gap:8px;}
.lead-label i{color:#2563eb;font-size:16px;}
.lead-value{margin:0;font-size:16px;font-weight:500;}
.lead-badges{display:flex;flex-wrap:wrap;gap:8px;}
.lead-badge{display:inline-flex;align-items:center;gap:6px;width:fit-content;border-radius:10px;padding:6px 12px;font-size:13px;font-weight:600;line-height:1;white-space:nowrap;}
.lead-badge--blue{color:var(--ld-blue);background:var(--ld-blue-soft);}
.lead-badge--green{color:var(--ld-green);background:var(--ld-green-soft);}
.lead-badge--purple{color:var(--ld-purple);background:var(--ld-purple-soft);}
.lead-badge--amber{color:var(--ld-amber);background:var(--ld-amber-soft);}
.lead-badge--gray{color:var(--ld-gray);background:var(--ld-gray-soft);}
.lead-badge--coral{color:var(--ld-coral);background:var(--ld-coral-soft);}
.lead-badge--teal{color:var(--ld-teal);background:var(--ld-teal-soft);}
.lead-message{margin-top:4px;color:#1f2937;font-size:15px;line-height:1.6;}
@media (max-width:1100px){.lead-detail{grid-template-columns:1fr;}.lead-interest{grid-template-columns:1fr;gap:24px;}
  .lead-interest-col+.lead-interest-col{border-left:0;padding-left:0;border-top:1px solid var(--ld-line);padding-top:24px;}}
@media (max-width:640px){.lead-card{padding:20px;}.lead-company-head{flex-direction:column;align-items:flex-start;}
  .lead-row{grid-template-columns:1fr;gap:4px;}.lead-card-title h2{font-size:20px;}}

/* Lead detail — full redesign additions (top bar, meta, consents, timeline). Scoped .lead-*. */
.lead-topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 24px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--ld-line);border-radius:18px;box-shadow:0 10px 30px rgba(15,23,42,.06);padding:22px 26px;margin-bottom:24px;}
.lead-topbar h1{font-size:26px;font-weight:700;margin:0;line-height:1.15;letter-spacing:-.02em;}
.lead-topbar .lead-sub{color:var(--ld-muted);font-size:15px;margin:6px 0 0;display:flex;align-items:center;flex-wrap:wrap;gap:6px 14px;}
.lead-topbar .lead-sub a{color:var(--ld-blue);text-decoration:none;}
.lead-topbar-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.lead-card--pad{padding:26px;}
.lead-card+.lead-card{margin-top:24px;}
/* Row dividers for the Sponsorship-interest rows (.lead-block) so they match the delicate dashed
   line .lead-row already draws in Contact/Company/Custom fields/Submission details. No trailing line. */
.lead-card .lead-irow{border-bottom:1px dashed var(--ld-line);padding-bottom:16px;margin-bottom:16px;}
.lead-card .lead-irow:last-child{border-bottom:0;padding-bottom:0;margin-bottom:0;}
.lead-consents{display:flex;flex-direction:column;gap:10px;}
.lead-consent{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:500;}
.lead-consent i{font-size:18px;} .lead-consent.ok i{color:var(--ld-green);} .lead-consent.no i{color:var(--ld-coral);}
.lead-timeline{list-style:none;margin:0;padding:0;}
.lead-timeline li{position:relative;padding:0 0 18px 22px;}
.lead-timeline li::before{content:"";position:absolute;left:4px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--ld-blue);}
.lead-timeline li:not(:last-child)::after{content:"";position:absolute;left:8px;top:14px;bottom:0;width:1px;background:var(--ld-line);}
.lead-timeline .lead-tl-meta{color:var(--ld-muted);font-size:13px;margin-top:3px;}
.lead-note{border-left:3px solid var(--ld-blue-soft);padding:2px 0 2px 14px;margin-bottom:14px;}
.lead-note .lead-note-meta{color:var(--ld-muted);font-size:13px;margin-bottom:2px;}

/* ──────────────────────────────────────────────────────────────────────────
   Offer builder (/admin/offers/{id}/edit). Scoped, .ob-* prefixed.
   ────────────────────────────────────────────────────────────────────────── */
.ob{--ob-line:#e5e7eb;--ob-primary:#4f46e5;display:flex;flex-direction:column;height:calc(100vh - 120px);min-height:560px;}
.ob-topbar{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--ob-line);border-radius:12px;padding:8px 12px;margin-bottom:10px;flex-wrap:wrap;}
.ob-title{max-width:280px;font-weight:600;}
.ob-days{display:flex;align-items:center;gap:3px;} .ob-day{width:32px;padding:2px 0;}
.ob-totals{display:flex;align-items:center;gap:6px;font-size:14px;}
.ob-disc{width:90px;} .ob-disc-type{width:64px;}
.ob-total-val{font-weight:700;color:var(--ob-primary);}
.ob-save{white-space:nowrap;}
/* Custom public-slug editor inside the ⋯ menu */
.dropdown-menu:has(.ob-slug-edit){min-width:360px;}
.ob-slug-edit .input-group-text{font-size:11px;color:#6b7280;padding-inline:6px;}
.ob-slug-hint:empty{display:none;}
/* Zoom controls (topbar): [−] [100% ▾] [+] Fit */
.ob-zoomgrp{display:inline-flex;align-items:center;gap:2px;}
.ob-zbtn{border:1px solid var(--ob-line);background:#fff;border-radius:6px;font-size:12px;line-height:1;padding:4px 7px;cursor:pointer;color:#374151;}
.ob-zbtn:hover{border-color:var(--ob-primary);color:var(--ob-primary);}
.ob-zlabel{min-width:54px;text-align:center;white-space:nowrap;}
.ob-zlabel::after{margin-left:3px;}
.ob-zfit{font-weight:600;}
.ob-cols{display:grid;grid-template-columns:150px 188px 1fr 320px;gap:12px;flex:1;min-height:0;}
.ob-cols > *{min-height:0;overflow:auto;}
/* Block palette column */
.ob-palette-col{display:flex;flex-direction:column;background:#fff;border:1px solid var(--ob-line);border-radius:12px;overflow:hidden;}
.ob-palette-head{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;font-weight:700;font-size:12px;border-bottom:1px solid var(--ob-line);}
.ob-palette-close{display:none;border:0;background:none;font-size:18px;line-height:1;color:#6b7280;cursor:pointer;}
.ob-palette-list{flex:1;overflow-y:auto;padding:8px;}
.ob-pal-group{font-size:9px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#9ca3af;margin:8px 2px 4px;}
.ob-pal-group:first-child{margin-top:0;}
.ob-pal-tile{display:grid;grid-template-columns:auto 1fr;column-gap:7px;align-items:center;padding:6px 8px;border:1px solid var(--ob-line);border-radius:7px;background:#fff;font-size:11.5px;color:#374151;cursor:grab;margin-bottom:5px;user-select:none;}
.ob-pal-tile:hover{border-color:var(--ob-primary);background:#eef2ff;color:var(--ob-primary);}
.ob-pal-tile > i{font-size:14px;color:var(--ob-primary);grid-row:1 / -1;}
.ob-pal-tile span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ob-pal-cap{grid-column:2;font-size:9.5px;font-weight:400;color:#9ca3af;line-height:1.2;margin-top:1px;} /* media size/aspect hint */
.ob-pal-tile.sortable-chosen{opacity:.5;}
.ob-pal-tile.sortable-drag{box-shadow:0 6px 18px rgba(0,0,0,.2);}
/* Insertion-line indicator: the palette tile's ghost inside the canvas becomes a pink bar */
#ob-blocks > .ob-pal-tile.sortable-ghost{height:4px;min-height:4px;padding:0;margin:8px 0;border:0;background:var(--ob-primary);border-radius:2px;box-shadow:0 0 0 3px rgba(79,70,229,.2);}
#ob-blocks > .ob-pal-tile.sortable-ghost *{display:none;}
/* While dragging a palette tile, flag the canvas + thumbnails as drop targets */
.ob-dragging-palette #ob-canvas .ob-page{outline:2px dashed var(--ob-primary);outline-offset:3px;}
.ob-dragging-palette .ob-thumb{outline:2px dashed var(--ob-primary);outline-offset:2px;}
.ob-palette-toggle{display:none;}

/* rail */
.ob-rail-wrap{display:flex;flex-direction:column;}
.ob-rail{display:flex;flex-direction:column;gap:0;} /* spacing comes from the .ob-gap insert affordances between thumbs */
/* Between-thumbnail "insert a page here" affordance: a hover hairline + "+" badge, one per gap. */
.ob-gap{display:block;width:100%;height:10px;border:0;background:none;padding:0;margin:0;position:relative;cursor:pointer;}
.ob-gap::before{content:"";position:absolute;left:6px;right:6px;top:50%;transform:translateY(-50%);height:2px;border-radius:2px;background:transparent;transition:background .12s ease;}
.ob-gap::after{content:"+";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.5);width:18px;height:18px;line-height:17px;text-align:center;font-size:14px;font-weight:700;color:#fff;background:var(--ob-primary);border-radius:50%;opacity:0;transition:opacity .12s ease,transform .12s ease;pointer-events:none;z-index:2;}
.ob-gap:hover::before{background:var(--ob-primary);}
.ob-gap:hover::after{opacity:1;transform:translate(-50%,-50%) scale(1);}
.ob-insertmenu{position:fixed;z-index:1080;min-width:180px;background:#fff;border:1px solid #e5e7eb;border-radius:10px;box-shadow:0 8px 28px rgba(0,0,0,.16);padding:6px;}
.ob-insertmenu-h{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#9ca3af;padding:4px 8px 6px;}
.ob-insertmenu-item{display:block;width:100%;text-align:left;border:0;background:none;padding:7px 10px;border-radius:6px;font-size:13px;color:#111827;cursor:pointer;}
.ob-insertmenu-item:hover{background:var(--ob-primary);color:#fff;}
.ob-thumb{border:2px solid transparent;border-radius:8px;cursor:pointer;background:#fff;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.ob-thumb.active{border-color:var(--ob-primary);}
.ob-thumb-page{position:relative;aspect-ratio:210/297;overflow:hidden;background:#fff;} /* click to select; reorder via the grip */
/* Rail reorder grip (the drag handle) + drop indicator. */
.ob-thumb-grip{cursor:grab;color:#c1c5cd;display:inline-flex;align-items:center;font-size:13px;line-height:1;touch-action:none;}
.ob-thumb-grip:hover{color:var(--ob-primary);}
.ob-thumb-grip:active{cursor:grabbing;}
/* Collapse the dragged thumb's placeholder into a drop-indicator line between thumbnails. */
#ob-rail > .ob-thumb.sortable-ghost{height:4px;min-height:4px;padding:0;border:0;border-radius:2px;background:var(--ob-primary);box-shadow:0 0 0 3px rgba(79,70,229,.2);overflow:hidden;}
#ob-rail > .ob-thumb.sortable-ghost *{display:none;}
/* Scaled live preview: renderPage() output at THUMB_W(460px), scaled to the thumb box. */
.ob-thumb-scale{position:absolute;top:0;left:0;width:460px;transform-origin:top left;transform:scale(var(--thumb-scale,0.35));pointer-events:none;}
.ob-thumb-scale .ob-page{width:460px;border-radius:0;box-shadow:none;}
.ob-thumb-scale .ob-page-inner{overflow:hidden;}
.ob-thumb-scale .ob-block{border:0;padding:0;margin-bottom:6px;} /* strip canvas edit chrome from the miniature */
.ob-thumb-meta{display:flex;align-items:center;gap:6px;padding:3px 6px;font-size:11px;color:#6b7280;background:#fff;}
.ob-thumb-num{font-weight:700;color:#111827;} .ob-thumb-tpl{text-transform:capitalize;}
.ob-thumb-dup{margin-left:auto;border:0;background:none;color:#6b7280;font-size:12px;line-height:1;cursor:pointer;display:inline-flex;align-items:center;padding:0;}
.ob-thumb-dup:hover{color:var(--ob-primary);}
.ob-thumb-del{border:0;background:none;color:#c2410c;font-size:15px;line-height:1;cursor:pointer;}

/* canvas */
.ob-canvas-wrap{display:flex;flex-direction:column;align-items:center;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;}
.ob-canvas-wrap.ob-pan-ready{cursor:grab;}
.ob-canvas-wrap.ob-panning{cursor:grabbing;}
.ob-canvas-wrap.ob-panning *{pointer-events:none;} /* don't fall into a block mid-pan */
.ob-canvas{width:100%;display:flex;justify-content:safe center;padding:16px;box-sizing:border-box;}
/* Canvas zoom is a VISUAL scale of the rendered page only — block geometry, saved style JSON,
   rail thumbnails and public/PDF output are untouched. The wrap is JS-sized to the SCALED page
   dimensions so scrollbars stay honest; the stage carries the transform. */
.ob-zoom-wrap{position:relative;flex:0 0 auto;}
/* max-content so the stage shrink-wraps the fixed-width page instead of filling the JS-sized
   wrap — otherwise measuring the stage fed its own width back and the scroll area ran away. */
.ob-zoom-stage{width:max-content;transform:scale(var(--ob-zoom,1));transform-origin:top left;}
.ob-page{position:relative;width:460px;aspect-ratio:210/297;border-radius:6px;box-shadow:0 12px 40px rgba(15,23,42,.18);overflow:hidden;}
.ob-page.ob-dark{color:#fff;}
.ob-overlay{position:absolute;inset:0;background:#000;}
.ob-page-inner{position:relative;z-index:1;padding:28px;height:100%;overflow:auto;display:flex;flex-wrap:wrap;gap:12px;align-content:flex-start;}
/* Page vertical alignment (cross-axis of the row-wrap column) */
.ob-page-inner.ob-va-top{align-content:flex-start;} .ob-page-inner.ob-va-center{align-content:center;} .ob-page-inner.ob-va-bottom{align-content:flex-end;}
/* Flex-spacer pages switch to a single column so flex-grow can absorb vertical space */
.ob-page-inner.ob-flexcol{flex-direction:column;flex-wrap:nowrap;}
.ob-page-inner.ob-flexcol>.ob-block{flex:0 0 auto;width:100%;max-width:100%;}
.ob-page-inner.ob-flexcol>.ob-block.ob-block-grow{flex:1 1 0;min-height:0;}
/* Spacer affordance (edit-chrome only; hidden in thumbnails + public/PDF) */
.ob-spacer{position:relative;min-height:16px;border:1px dashed var(--ob-primary);border-radius:6px;background:repeating-linear-gradient(45deg,rgba(79,70,229,.06) 0 8px,transparent 8px 16px);display:flex;align-items:center;justify-content:center;}
.ob-spacer-flex{height:100%;}
.ob-spacer-lbl{font-size:10px;font-weight:600;color:var(--ob-primary);background:rgba(255,255,255,.85);padding:1px 8px;border-radius:999px;pointer-events:none;}
.ob-thumb-scale .ob-spacer{border:0;background:none;} .ob-thumb-scale .ob-spacer-lbl{display:none;}
.ob-sp-presets .btn{padding:3px 8px;}
/* Block width fractions (snap steps) — same class names in document.php */
.ob-w-full{flex:0 0 100%;max-width:100%;}
.ob-w-half{flex:0 0 calc(50% - 6px);max-width:calc(50% - 6px);}
.ob-w-third{flex:0 0 calc(33.333% - 8px);max-width:calc(33.333% - 8px);}
.ob-w-two-thirds{flex:0 0 calc(66.666% - 4px);max-width:calc(66.666% - 4px);}
/* Fixed-height media block fills its box; images cover-crop, photo_grid keeps its ratio */
.ob-fixed-h{display:flex;flex-direction:column;} /* clip the media child, NOT the wrapper (so the tab/handle aren't hidden) */
.ob-fixed-h > figure,.ob-fixed-h .ob-b-img,.ob-fixed-h .ob-photos,.ob-fixed-h .ob-logos,.ob-fixed-h .ob-hero,.ob-fixed-h .ob-hero-r,.ob-fixed-h .ob-hero-img{flex:1;min-height:0;height:100%;overflow:hidden;}
.ob-fixed-h .ob-b-img img,.ob-fixed-h .ob-photos img,.ob-fixed-h .ob-hero-img{height:100%;object-fit:cover;}
.ob-resize-handle{position:absolute;left:0;right:0;bottom:-5px;height:11px;cursor:ns-resize;display:flex;align-items:center;justify-content:center;z-index:3;}
.ob-resize-handle::after{content:"";width:38px;height:4px;border-radius:2px;background:var(--ob-primary);opacity:.9;}
body.ob-resizing{cursor:ns-resize;user-select:none;}
/* Width buttons (hover toolbar + inspector) */
.ob-wbtns{display:inline-flex;gap:2px;margin-right:3px;}
.ob-wbtn{border:1px solid var(--ob-line);background:#fff;border-radius:4px;font-size:11px;line-height:1;padding:2px 5px;cursor:pointer;color:#374151;}
.ob-wbtn.on{background:var(--ob-primary);color:#fff;border-color:var(--ob-primary);}
.ob-wrow{display:flex;gap:4px;}
/* ── Page theme tokens (shared with document.php — keep the values in sync) ── */
.ob-theme-dark{color:#fff;--eyebrow:#ff7bac;--card-bg:rgba(255,255,255,.06);--card-border:rgba(255,255,255,.15);}
.ob-theme-dark::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(circle at 18% 12%,rgba(255,0,110,.38),transparent 42%),radial-gradient(circle at 85% 82%,rgba(130,60,255,.4),transparent 46%);}
.ob-theme-muted{background:#f7f2fb;color:#24112b;--eyebrow:#ff005c;--card-bg:#fff;--card-border:#ece3f3;}
.ob-theme-white{background:#fff;color:#24112b;--eyebrow:#ff005c;--card-bg:#fff;--card-border:#eef0f3;}
/* Theme swatches in the page inspector */
.ob-swatches{display:flex;gap:6px;}
.ob-swatch{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;border:2px solid var(--ob-line);border-radius:8px;padding:6px 4px;cursor:pointer;font-size:10px;text-transform:capitalize;color:#374151;background:#fff;}
.ob-swatch::after{content:"";display:block;order:-1;width:100%;height:22px;border-radius:4px;}
.ob-sw-dark::after{background:linear-gradient(135deg,#16001d,#30003e);}
.ob-sw-muted::after{background:#f7f2fb;border:1px solid #ece3f3;}
.ob-sw-white::after{background:#fff;border:1px solid #e5e7eb;}
.ob-swatch.on{border-color:var(--ob-primary);background:#eef2ff;}
.ob-block{position:relative;border:1px dashed transparent;border-radius:6px;padding:4px;margin:0;box-sizing:border-box;}
.ob-block:hover{border-color:rgba(79,70,229,.4);}
.ob-block.sel{border-color:var(--ob-primary);border-style:solid;background:rgba(79,70,229,.04);}
/* Small pinned tab above the block's top-right corner — drag handle + kebab. Never covers content. */
.ob-blocktab{position:absolute;top:-16px;right:0;display:none;gap:3px;z-index:5;
  /* Counter-scale against the canvas zoom so the ⋯/drag tab keeps a constant, clickable size at 50%–200%. */
  transform:scale(calc(1/var(--ob-zoom,1)));transform-origin:top right;}
.ob-block:hover > .ob-blocktab,.ob-block.sel > .ob-blocktab{display:flex;}
.ob-block.ob-tab-below > .ob-blocktab{top:auto;bottom:-16px;transform-origin:bottom right;} /* collision flip when the block sits at the page top */
.ob-blocktab .ob-drag,.ob-tab-kebab{background:#fff;border:1px solid var(--ob-line);border-radius:5px;font-size:11px;line-height:1;padding:3px 6px;color:#374151;box-shadow:0 1px 3px rgba(0,0,0,.14);}
.ob-blocktab .ob-drag{cursor:grab;}
.ob-tab-kebab{cursor:pointer;}
.ob-blocktab .ob-drag:hover,.ob-tab-kebab:hover{border-color:var(--ob-primary);color:var(--ob-primary);}
/* kebab dropdown (mirrors the inspector actions) */
/* Block ⋯ menu — body-level fixed top layer (JS sets left/top); no ancestor can clip it.
   Compact (≈3 rows) + translucent so the block underneath stays hinted when it overlaps. */
#ob-blockmenu{position:fixed;z-index:2000;display:flex;flex-direction:column;gap:5px;
  background:rgba(255,255,255,.96);backdrop-filter:blur(3px);border:1px solid var(--ob-line);
  border-radius:8px;box-shadow:0 12px 32px rgba(0,0,0,.22);padding:6px;min-width:190px;max-width:210px;color:#374151;}
#ob-blockmenu[hidden]{display:none;}
#ob-blockmenu .ob-seg{width:100%;} #ob-blockmenu .ob-segbtn{flex:1;text-align:center;}
#ob-blockmenu .ob-move{width:100%;margin:0;}
.ob-tab-mitem{display:flex;align-items:center;width:100%;border:0;background:none;text-align:left;font-size:12px;padding:5px 6px;border-radius:5px;cursor:pointer;color:#374151;}
.ob-tab-mitem:hover{background:#f3f4f6;}
.ob-tab-del{color:#dc2626;}
/* "Move to page…" select in a block's toolbar */
/* Inspector "Block" header (primary controls, outside the canvas) */
.ob-block-hdr{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--ob-line);}
.ob-block-hdr-t{font-weight:700;text-transform:capitalize;font-size:13px;display:flex;align-items:center;min-width:0;}
.ob-block-hdr-t i{color:var(--ob-primary);}
.ob-blockacts{display:flex;gap:4px;flex:0 0 auto;}
.ob-seg{display:inline-flex;border:1px solid var(--ob-line);border-radius:6px;overflow:hidden;}
.ob-segbtn{border:0;border-right:1px solid var(--ob-line);background:#fff;font-size:12px;line-height:1;padding:5px 10px;cursor:pointer;color:#374151;}
.ob-segbtn:last-child{border-right:0;} .ob-segbtn.on{background:var(--ob-primary);color:#fff;}
.ob-vseg{display:flex;width:100%;} .ob-vseg .ob-segbtn{flex:1;text-align:center;} .ob-vseg.ob-disabled{opacity:.5;pointer-events:none;}
.ob-hrow{display:flex;gap:6px;}
/* ── Per-block Typography section (inspector) ── */
.ob-typo{margin-bottom:6px;}
.ob-typo-h{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px;}
.ob-typo-resetall{border:0;background:transparent;color:var(--ob-primary);font-size:10.5px;font-weight:600;cursor:pointer;padding:0;}
.ob-trow{margin-bottom:8px;}
.ob-trow-h{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#374151;margin-bottom:3px;}
.ob-treset{border:0;background:transparent;color:#9ca3af;font-size:11px;cursor:pointer;padding:0 2px;line-height:1;}
.ob-treset:hover{color:var(--ob-primary);}
.ob-tseg{display:flex;align-items:center;gap:4px;flex-wrap:wrap;}
.ob-tsz{border:1px solid var(--ob-line);background:#fff;border-radius:5px;font-size:10.5px;font-weight:600;line-height:1;padding:4px 7px;cursor:pointer;color:#374151;}
.ob-tsz:hover{border-color:var(--ob-primary);} .ob-tsz.on{background:var(--ob-primary);color:#fff;border-color:var(--ob-primary);}
.ob-tpx{width:52px;border:1px solid var(--ob-line);border-radius:5px;font-size:11px;padding:3px 5px;}
.ob-tcolors{display:inline-flex;align-items:center;gap:4px;margin-left:2px;}
.ob-tsw{width:18px;height:18px;border-radius:50%;border:1px solid rgba(0,0,0,.18);cursor:pointer;padding:0;position:relative;box-shadow:inset 0 0 0 2px #fff;}
.ob-tsw.on{box-shadow:inset 0 0 0 2px #fff,0 0 0 2px var(--ob-primary);}
.ob-tsw-hex{display:inline-flex;align-items:center;justify-content:center;background:conic-gradient(from 0deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00);overflow:hidden;}
.ob-tsw-hex input{position:absolute;inset:-4px;opacity:0;cursor:pointer;}
/* While dragging a block, highlight the page thumbnails as drop targets */
.ob-dragging-block .ob-thumb{outline:2px dashed var(--ob-primary);outline-offset:2px;cursor:copy;}
.ob-dragging-block .ob-thumb:hover{outline-color:#e6005c;background:rgba(230,0,92,.06);}
.ob-empty{border:1px dashed #cbd5e1;border-radius:6px;padding:14px;text-align:center;color:#94a3b8;font-size:12px;}

/* block display */
.ob-b-h{font-size:var(--ty-text,24px);font-weight:800;margin:0 0 6px;} .ob-b-sh{font-size:var(--ty-text,16px);font-weight:600;margin:0 0 6px;}
.ob-b-p{font-size:var(--ty-text,12px);line-height:1.6;margin:0;}
.ob-b-img img{width:100%;height:150px;border-radius:6px;} .ob-b-img figcaption{font-size:10px;color:#94a3b8;margin-top:3px;}
.ob-imgrid{display:grid;gap:6px;} .ob-imgrid img{width:100%;height:60px;object-fit:cover;border-radius:4px;}
.ob-stats{display:flex;gap:14px;flex-wrap:wrap;} .ob-stat-v{font-size:var(--ty-value,22px);font-weight:800;color:var(--tc-value,var(--eyebrow,#ff005c));} .ob-stat-l{font-size:var(--ty-label,10px);color:var(--tc-label,inherit);opacity:.7;}
/* ── Rich content blocks (theme-aware via --eyebrow/--card-bg/--card-border) ── */
.ob-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:var(--ty-eyebrow,11px);color:var(--tc-eyebrow,var(--eyebrow,#ff005c));margin-bottom:4px;}
.ob-hero{display:flex;gap:16px;align-items:center;} .ob-hero-l{flex:1;min-width:0;}
.ob-hero-title{font-size:var(--ty-title,clamp(18px,3vw,30px));color:var(--tc-title,inherit);font-weight:800;line-height:1.05;margin:4px 0 6px;} .ob-hero-lead{font-size:var(--ty-lead,12px);color:var(--tc-lead,inherit);opacity:.8;line-height:1.5;}
.ob-hero-mark{width:84px;height:84px;border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:800;color:#fff;background:linear-gradient(135deg,#ff005c,#7c3aed);}
.ob-hero-img{width:100px;height:100px;object-fit:cover;border-radius:12px;}
.ob-pills{display:flex;flex-wrap:wrap;gap:8px;} .ob-pill{border:1px solid var(--card-border,#e5e7eb);background:var(--card-bg,#fff);border-radius:999px;padding:6px 12px;font-size:11px;} .ob-pill b{color:var(--eyebrow,#ff005c);}
.ob-quote{background:#241033;color:#fff;border-radius:12px;padding:14px 16px;} .ob-quote-t{font-size:var(--ty-quote,14px);color:var(--tc-quote,inherit);font-weight:600;line-height:1.4;} .ob-quote-a{opacity:.7;font-size:var(--ty-attribution,11px);color:var(--tc-attribution,inherit);margin-top:8px;}
.ob-timeline{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;}
.ob-tl{background:var(--card-bg,#fff);border:1px solid var(--card-border,#e5e7eb);border-top:3px solid var(--eyebrow,#ff005c);border-radius:8px;padding:9px;}
.ob-tl-day{color:var(--tc-day,var(--eyebrow,#ff005c));font-weight:800;font-size:var(--ty-day,10px);text-transform:uppercase;} .ob-tl-title{font-weight:700;font-size:var(--ty-title,12px);color:var(--tc-title,inherit);margin:2px 0;} .ob-tl-text{font-size:var(--ty-text,11px);color:var(--tc-text,inherit);opacity:.8;}
.ob-check-h{font-weight:700;font-size:var(--ty-title,13px);color:var(--tc-title,inherit);margin-bottom:5px;} .ob-checklist{list-style:none;padding:0;margin:0;} .ob-checklist li{position:relative;padding-left:20px;margin-bottom:5px;font-size:var(--ty-items,12px);color:var(--tc-items,inherit);} .ob-checklist li::before{content:"✓";position:absolute;left:0;color:var(--eyebrow,#ff005c);font-weight:800;}
.ob-cta{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(135deg,#ff005c,#7c3aed);color:#fff;border-radius:999px;padding:9px 16px;} .ob-cta-t{font-weight:700;font-size:var(--ty-text,12px);color:var(--tc-text,inherit);} .ob-cta-b{background:#fff;color:#16001d;border-radius:999px;padding:6px 12px;font-weight:700;font-size:11px;}
/* ── Valid-until block (theme-aware; typo via --ty-text/--tc-text) ── */
.ob-validity{font-size:var(--ty-text,12px);color:var(--tc-text,inherit);opacity:.9;} .ob-validity b{font-weight:700;}
.ob-validity-badge{display:inline-block;border:1px solid var(--card-border,#e5e7eb);background:var(--card-bg,#fff);border-radius:999px;padding:5px 12px;opacity:1;} .ob-validity-badge b{color:var(--eyebrow,#ff005c);}
.ob-validity-ph{opacity:.5;font-style:italic;}
.ob-vu-warn{margin-top:6px;padding:6px 8px;border-radius:6px;background:#fff8e6;border:1px solid #f6d68a;color:#8a6d3b;}
.ob-tl-edit{border-bottom:1px dashed var(--ob-line);padding-bottom:6px;margin-bottom:6px;}
/* ── Part 2: cards / tables / packages / photos ── */
.ob-card-edit{border-bottom:1px dashed var(--ob-line);padding-bottom:6px;margin-bottom:6px;} .ob-chk{font-size:11px;display:flex;align-items:center;gap:4px;white-space:nowrap;} .ob-f-l{font-size:11px;color:#6b7280;display:block;margin:4px 0 2px;}
.ob-icards{display:grid;gap:8px;} .ob-icard{background:var(--card-bg,#fff);border:1px solid var(--card-border,#e5e7eb);border-radius:10px;padding:10px;} .ob-icard-ic{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:12px;color:#fff;background:linear-gradient(135deg,#ff005c,#7c3aed);margin-bottom:6px;} .ob-icard-t{font-weight:700;font-size:var(--ty-title,12px);color:var(--tc-title,inherit);} .ob-icard-b{font-size:var(--ty-body,11px);color:var(--tc-body,inherit);opacity:.8;}
.ob-cmp,.ob-dtable{width:100%;border-collapse:collapse;font-size:10px;} .ob-cmp th,.ob-cmp td,.ob-dtable th,.ob-dtable td{border:1px solid var(--card-border,rgba(148,163,184,.4));padding:3px 5px;text-align:center;} .ob-cmp td:first-child,.ob-dtable td:first-child,.ob-cmp th:first-child,.ob-dtable th:first-child{text-align:left;} .ob-cmp .ob-yes{color:#16a34a;font-weight:800;} .ob-cmp-price td{font-weight:800;}
.ob-pcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:8px;} .ob-pcard{position:relative;background:var(--card-bg,#fff);border:1px solid var(--card-border,#e5e7eb);border-radius:10px;padding:10px;} .ob-pcard.featured{border:2px solid #ff005c;box-shadow:0 8px 20px rgba(255,0,92,.2);} .ob-pcard-badge{position:absolute;top:-8px;left:8px;background:#ff005c;color:#fff;font-size:8px;font-weight:700;padding:2px 6px;border-radius:999px;} .ob-pcard-n{font-weight:800;font-size:12px;} .ob-pcard-p{color:var(--eyebrow,#ff005c);font-weight:800;font-size:11px;margin:2px 0 5px;} .ob-pcard-f{list-style:none;padding:0;margin:0;} .ob-pcard-f li{font-size:10px;padding-left:12px;position:relative;margin-bottom:3px;} .ob-pcard-f li::before{content:"✓";position:absolute;left:0;color:var(--eyebrow,#ff005c);font-weight:800;}
.ob-addons{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;} .ob-addon{background:var(--card-bg,#fff);border:1px solid var(--card-border,#e5e7eb);border-radius:10px;padding:9px;} .ob-addon-t{font-weight:700;font-size:var(--ty-title,11px);color:var(--tc-title,inherit);} .ob-addon-b{font-size:var(--ty-body,10px);color:var(--tc-body,inherit);opacity:.8;margin:2px 0 4px;} .ob-addon-p{color:var(--eyebrow,#ff005c);font-weight:800;font-size:11px;}
.ob-photos{display:grid;grid-template-columns:2fr 1fr;grid-auto-rows:1fr;gap:6px;} .ob-photo{position:relative;border-radius:8px;overflow:hidden;min-height:60px;} .ob-photo.lead{grid-row:span 2;} .ob-photo img{width:100%;height:100%;object-fit:cover;} .ob-photo-ph{width:100%;height:100%;min-height:60px;background:linear-gradient(135deg,#16001d,#7c3aed);display:flex;align-items:center;justify-content:center;} .ob-photo-l{position:absolute;left:6px;bottom:6px;background:rgba(0,0,0,.55);color:#fff;font-size:9px;padding:2px 7px;border-radius:999px;}
.ob-logos{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;} .ob-logo{background:var(--card-bg,#fff);border:1px solid var(--card-border,#e5e7eb);border-radius:8px;height:42px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:10px;overflow:hidden;} .ob-logo img{max-width:80%;max-height:28px;object-fit:contain;}
.ob-b-table,.ob-price,.ob-matrix{width:100%;border-collapse:collapse;font-size:11px;}
.ob-b-table th,.ob-b-table td,.ob-price th,.ob-price td,.ob-matrix th,.ob-matrix td{border:1px solid rgba(148,163,184,.4);padding:3px 6px;text-align:left;}
.ob-price td:last-child,.ob-price th:last-child{text-align:right;}
.ob-tier{font-size:9px;text-transform:uppercase;color:#7c3aed;}
.ob-mprice{font-size:10px;color:var(--ob-primary);} .ob-matrix th{text-align:center;}
.ob-contact{display:flex;gap:10px;align-items:center;} .ob-contact img,.ob-contact-ph{width:54px;height:54px;border-radius:50%;object-fit:cover;background:#eef2ff;display:flex;align-items:center;justify-content:center;color:var(--ob-primary);}
.ob-b-btn{display:inline-block;padding:7px 16px;border-radius:8px;font-size:12px;font-weight:600;}
.ob-btn-primary{background:var(--ob-primary);color:#fff;} .ob-btn-dark{background:#111827;color:#fff;} .ob-btn-light{background:#fff;color:#111827;} .ob-btn-outline{border:1px solid currentColor;}
.ob-b-hr{border-top:1px solid rgba(148,163,184,.5);} 

/* inspector */
.ob-inspector{background:#fff;border:1px solid var(--ob-line);border-radius:12px;padding:12px;}
.ob-insp-head{display:flex;align-items:center;justify-content:space-between;font-weight:700;text-transform:capitalize;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--ob-line);}
.ob-f{margin-bottom:9px;} .ob-f > label{display:block;font-size:11px;font-weight:600;color:#6b7280;margin-bottom:3px;}
.ob-row2{display:flex;gap:5px;margin-bottom:5px;align-items:center;}
.ob-x{border:0;background:none;color:#dc2626;font-size:15px;cursor:pointer;line-height:1;}
.ob-w90{width:90px;flex:0 0 90px;} .ob-w50{width:54px;flex:0 0 54px;}
.ob-upload{border:2px dashed #cbd5e1;border-radius:8px;padding:12px;text-align:center;color:#94a3b8;font-size:12px;cursor:pointer;}
.ob-upload img{max-height:60px;border-radius:4px;}
/* Recommended-size guidance (advisory only — uploads are never blocked). Single source: MEDIA_SPEC. */
.ob-mhint{display:flex;align-items:center;gap:6px;margin:4px 0 2px;font-size:10.5px;color:#6b7280;line-height:1.3;}
.ob-ratio{flex:0 0 auto;font-weight:700;font-size:9.5px;background:#eef2ff;color:var(--ob-primary);border:1px solid #dfe3ff;border-radius:4px;padding:1px 5px;}
.ob-mnwrap:empty{display:none;}
.ob-mnotice{display:flex;align-items:flex-start;gap:6px;margin:4px 0 2px;padding:6px 8px;font-size:10.5px;line-height:1.35;color:#92400e;background:#fffbeb;border:1px solid #fde68a;border-radius:6px;}
.ob-mnotice > i{margin-top:1px;flex:0 0 auto;}
.ob-mnotice-x{margin-left:auto;border:0;background:transparent;color:#92400e;font-size:14px;line-height:1;cursor:pointer;padding:0 2px;flex:0 0 auto;}
/* Canvas empty placeholders: faint aspect frame + ratio label so the target shape is visible. */
.ob-mph{width:100%;}
.ob-mph-frame{width:100%;max-height:220px;display:flex;align-items:center;justify-content:center;border:1.5px dashed #cbd5e1;border-radius:8px;background:linear-gradient(135deg,rgba(124,58,237,.08),rgba(255,0,92,.08));}
.ob-ph-lbl{font-size:10px;font-weight:600;color:#94a3b8;background:rgba(255,255,255,.72);padding:2px 8px;border-radius:999px;}
.ob-empty-media{display:flex;align-items:center;justify-content:center;gap:6px;}
.ob-thumbs{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px;} .ob-mini{position:relative;} .ob-mini img{width:46px;height:46px;object-fit:cover;border-radius:5px;} .ob-mini button{position:absolute;top:-6px;right:-6px;border:0;background:#dc2626;color:#fff;border-radius:50%;width:16px;height:16px;font-size:11px;line-height:1;cursor:pointer;}
.ob-palette{display:flex;flex-direction:column;gap:5px;max-height:170px;overflow:auto;}
.ob-pkg{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--ob-line);border-radius:7px;padding:6px 9px;background:#fff;cursor:pointer;font-size:12px;}
.ob-pkg.on{border-color:var(--ob-primary);background:#eef2ff;}
.ob-lineitem{display:flex;align-items:center;gap:5px;margin-bottom:5px;font-size:12px;} .ob-lineitem > span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ob-w70{width:70px;flex:0 0 70px;}
/* Per-event pricing inspector */
.ob-pkgrow{border:1px solid var(--ob-line);border-radius:8px;padding:7px 9px;margin-bottom:7px;}
.ob-pkgname{font-size:12px;font-weight:600;margin-bottom:5px;}
.ob-evtogs{display:flex;flex-wrap:wrap;gap:5px;}
.ob-evtog{display:inline-flex;align-items:center;gap:4px;font-size:11px;border:1px solid var(--ob-line);border-radius:6px;padding:3px 7px;cursor:pointer;background:#fff;}
.ob-evtog.on{border-color:var(--ob-primary);background:#eef2ff;}
.ob-evtog.off{opacity:.5;} .ob-evtog small{color:#6b7280;}
.ob-gdisc{display:flex;align-items:center;gap:5px;margin-top:6px;}
.ob-lgh{font-size:11px;font-weight:700;color:#374151;margin:6px 0 3px;}
/* Grouped price preview on the canvas */
.ob-price .ob-r{text-align:right;}
.ob-price .ob-pgh td{background:#f8fafc;font-weight:700;border-top:2px solid var(--ob-primary);}
.ob-price .ob-pdisc td{color:#16a34a;}
.ob-price .ob-psub td{font-weight:700;}
.ob-price .ob-ptot td{font-weight:800;background:var(--ob-primary);color:#fff;border-color:var(--ob-primary);}
.ob-trow{display:flex;gap:4px;margin-bottom:4px;}

@media (max-width:1200px){
  /* palette leaves the grid (becomes a drawer) → 3 columns: rail · canvas · inspector */
  .ob-cols{grid-template-columns:150px 1fr 280px;}
  .ob-page{width:380px;}
  .ob-palette-col{position:fixed;top:0;left:0;bottom:0;width:230px;z-index:1050;border-radius:0;transform:translateX(-100%);transition:transform .2s ease;box-shadow:0 0 40px rgba(0,0,0,.2);}
  body.ob-palette-open .ob-palette-col{transform:none;}
  .ob-palette-close{display:inline-flex;}
  .ob-palette-toggle{display:inline-flex;align-items:center;position:fixed;left:14px;bottom:14px;z-index:1049;border-radius:999px;box-shadow:0 6px 18px rgba(0,0,0,.25);}
}

/* ──────────────────────────────────────────────────────────────────────────
   Error log viewer (/admin/error-logs). Scoped, .errlog-* prefixed.
   ────────────────────────────────────────────────────────────────────────── */
.errlog-row td { transition: background .1s ease; }
.errlog-unread { background: #fff7f7; }                 /* subtle tint, like an unread email */
.errlog-unread td:first-child { box-shadow: inset 3px 0 0 #dc2626; }  /* accent left border */
.errlog-unread .errlog-link { font-weight: 700; color: #111827; }
.errlog-unread .errlog-msg { font-weight: 600; }
.errlog-read .errlog-link { font-weight: 400; color: #6b7280; }
.errlog-read .errlog-msg { color: #6b7280; }
.errlog-link { text-decoration: none; }
.errlog-link:hover { text-decoration: underline; }
.errlog-dot { color: #dc2626; font-size: 11px; line-height: 1; margin-right: 4px; vertical-align: middle; }
.errlog-trace {
    background: #0f172a; color: #e2e8f0; border-radius: 10px; padding: 14px 16px; margin: 0;
    font-size: 12px; line-height: 1.55; max-height: 460px; overflow: auto; white-space: pre;
}

/* ──────────────────────────────────────────────────────────────────────────
   Email log viewer (/admin/email-logs). Scoped, .maillog-* prefixed.
   ────────────────────────────────────────────────────────────────────────── */
.maillog-row td { transition: background .1s ease; }
.maillog-unread { background: #f5f8ff; }                    /* unread tint, like an unopened email */
.maillog-unread td:first-child { box-shadow: inset 3px 0 0 #4f46e5; }
.maillog-unread .maillog-link { font-weight: 700; color: #111827; }
.maillog-unread .maillog-subj { font-weight: 600; color: #1f2937; }
.maillog-read .maillog-link { font-weight: 400; color: #6b7280; }
.maillog-read .maillog-subj { color: #6b7280; }
.maillog-link { text-decoration: none; }
.maillog-link:hover { text-decoration: underline; }
.maillog-dot { color: #4f46e5; font-size: 11px; line-height: 1; margin-right: 4px; vertical-align: middle; }
.maillog-frame { width: 100%; height: 560px; border: 1px solid #e5e7eb; border-radius: 10px; background: #fff; }
.maillog-raw {
    background: #0f172a; color: #e2e8f0; border-radius: 10px; padding: 14px 16px; margin: 0;
    font-size: 12px; line-height: 1.55; max-height: 560px; overflow: auto; white-space: pre-wrap; word-break: break-word;
}

/* ── Settings page (scoped, .set-*) ────────────────────────────────────────── */
/* Card header: soft tinted icon square + title + one-line description. */
.set-head { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: 1.25rem; }
.set-ico {
    flex: 0 0 auto; width: 2.5rem; height: 2.5rem; border-radius: .7rem;
    display: grid; place-items: center; font-size: 1.15rem;
    background: #eef2ff; color: var(--ep-primary);
}
.set-head-text { min-width: 0; }
.set-title { font-weight: 700; font-size: 1rem; line-height: 1.2; margin: 0; }
.set-desc { font-size: .8rem; color: #6b7280; margin: .15rem 0 0; }

/* Fields: consistent label weight + muted helper text. */
.set-field { margin-bottom: 1rem; }
.set-field:last-child { margin-bottom: 0; }
.set-label { display: block; font-weight: 600; font-size: .875rem; color: #374151; margin-bottom: .35rem; }
.set-req { color: #dc3545; }
.set-help { display: block; font-size: .78rem; color: #6b7280; margin-top: .3rem; }
.set-help code, .set-label code { font-size: .76em; }

/* Two-up field grid: side by side on desktop, stacked on mobile. */
.set-row2 { display: grid; grid-template-columns: 1fr; gap: 1rem; margin-bottom: 1rem; }
.set-row2:last-child { margin-bottom: 0; }
.set-row2 .set-field { margin-bottom: 0; }
@media (min-width: 992px) { .set-row2 { grid-template-columns: 1fr 1fr; } }

/* Toggle rows: icon + label on one line, helper beneath. */
.set-toggle { margin-bottom: 1rem; }
.set-toggle:last-child { margin-bottom: 0; }
.set-toggle .form-check { margin-bottom: 0; min-height: auto; }
.set-toggle-label { font-weight: 600; font-size: .875rem; color: #374151; }

/* Colour field: swatch aligned next to its (read-only) hex value. */
.set-color { display: flex; align-items: center; gap: .6rem; }
.set-color .form-control-color { flex: 0 0 auto; width: 3rem; padding: .25rem; }
.set-hex { max-width: 9rem; text-transform: uppercase; font-family: var(--bs-font-monospace, monospace); }

.set-divider { border: 0; border-top: 1px solid #eef0f3; margin: 1.25rem 0; }

/* ──────────────────────────────────────────────────────────────────────────
   Mobile pass #1 (public + admin shell). Builder is out of scope.
   ────────────────────────────────────────────────────────────────────────── */

/* S1 — Admin sidebar: Bootstrap responsive offcanvas. Drawer < lg (bundled JS, hamburger in the
   top bar); static 250px column ≥ lg. At ≥ lg the offcanvas-body defaults to display:flex — force
   block so the vertical nav fills the 250px column exactly as before. < lg the nav is position:fixed
   (off-canvas), so <main class="col"> becomes the only in-flow child and goes full-width. */
@media (min-width: 992px) {
  /* Bootstrap forces .offcanvas-lg { background: transparent !important } at ≥lg, which would hide
     the dark sidebar (white text on the light body) — restore it with matching !important. */
  #adminSidebar.offcanvas-lg { background-color: #1a1a2e !important; visibility: visible; }
  #adminSidebar .offcanvas-body { display: block; padding: 0; background-color: transparent; }
}

/* S5 — Legal pages: the stored WYSIWYG HTML is echoed raw inside .legal-content. Guard long words
   and wide tables so a URL or table can never force whole-page horizontal scroll on phones. */
.legal-content { overflow-wrap: break-word; }
.legal-content table { display: block; width: 100%; overflow-x: auto; }

/* Mobile pass #2 — /admin/leads card list (< lg only; desktop keeps the full table). */
.lead-mcard-lbl { color: #9ca3af; text-transform: uppercase; letter-spacing: .03em; font-size: .7rem; font-weight: 600; }
.lead-mcard-meta { column-gap: 1rem; row-gap: .25rem; }
.lead-mcard .btn { min-height: 44px; display: flex; align-items: center; justify-content: center; } /* ≥44px tap target */

/* Inline upload row (logo / favicon). */
.set-upload { display: flex; gap: .5rem; align-items: center; }