/*
===============================================================================
ZOey TRANSPORTATION — OFFICIAL 2026 BRAND COLOR SYSTEM — LOCKED
===============================================================================
THIS FILE IS THE FINAL CSS COLOR AUTHORITY FOR THE ENTIRE WEBSITE.

DO NOT change these colors unless the Owner explicitly requests a brand change.
DO NOT introduce generic blue, purple, cyan, teal, Bootstrap colors, white-page
layouts, or feature-specific palettes.

Every public page, booking page, auth page, Owner portal, Partner portal,
Customer portal, DEV page, rental lifecycle page, contract/document UI,
inspection UI, telemetry UI, and communications UI must use these tokens.

OFFICIAL COLORS
#0B0D10  primary background
#0D1014  secondary background
#101318  soft dark background
#15191E  primary panel
#1B2026  secondary panel
#222831  elevated panel
#F0CF70  primary gold
#D9B455  darker gold
#F6F3EA  primary/off-white text
#9FA6AF  muted text
#9DA4AD  secondary muted text
#89DCA9  success
#FF8F8F  danger/error
===============================================================================
*/
:root{
  --zoey-bg:#0B0D10;
  --zoey-bg-secondary:#0D1014;
  --zoey-bg-soft:#101318;
  --zoey-panel:#15191E;
  --zoey-panel-secondary:#1B2026;
  --zoey-panel-elevated:#222831;
  --zoey-gold:#F0CF70;
  --zoey-gold-dark:#D9B455;
  --zoey-text:#F6F3EA;
  --zoey-text-muted:#9FA6AF;
  --zoey-text-muted-secondary:#9DA4AD;
  --zoey-success:#89DCA9;
  --zoey-danger:#FF8F8F;
  --zoey-border:rgba(255,255,255,.09);
  --zoey-border-soft:rgba(255,255,255,.08);
  --zoey-border-gold:rgba(240,207,112,.28);
  --zoey-gold-soft:rgba(240,207,112,.07);
  --zoey-input:#0E1115;
  --zoey-button-text:#15120A;
  --zoey-shadow:0 18px 45px rgba(0,0,0,.20);
}

html{color-scheme:dark;background:var(--zoey-bg)!important}
body{
  background:radial-gradient(circle at 84% 8%,var(--zoey-gold-soft),transparent 28rem),linear-gradient(180deg,var(--zoey-bg),var(--zoey-bg-secondary))!important;
  color:var(--zoey-text)!important;
}

/* Typography */
h1,h2,h3,h4,h5,h6,strong,b,.heading,.title{color:var(--zoey-text)!important}
p,small,.muted,.fine-print,.helper-text,.subtext{color:var(--zoey-text-muted)!important}
a{color:var(--zoey-gold)}
a:hover{color:var(--zoey-text)}

/* Site chrome */
.site-header,.portal-topbar,header.site-header{
  background:rgba(11,13,16,.90)!important;
  border-color:var(--zoey-border)!important;
}
.site-footer,footer.site-footer{background:#0A0C0F!important;border-color:var(--zoey-border)!important}
.main-nav a,.nav-link,.portal-nav a,.portal-nav button{color:#D7DCE2!important}
.main-nav a:hover,.nav-link:hover,.portal-nav a:hover,.portal-nav button:hover{color:var(--zoey-text)!important}
.main-nav a.active,.nav-link.active,.portal-nav a.active,.portal-nav button.active{
  background:linear-gradient(135deg,var(--zoey-gold),var(--zoey-gold-dark))!important;
  color:var(--zoey-button-text)!important;
}

/* Panels / cards — eliminates old white-card palette */
.card,.panel,.portal-card,.stat-card,.booking-card,.booking-preview,.booking-price,
.feature-card,.info-card,.pricing-card,.trailer-card,.transport-card,.auth-card,
.login-card,.form-card,.contact-card,.faq-item,.content-card,.dashboard-hero,
.compact-hero,.record-card,.document-card,.inspection-card,.notification-card,
[class*="card"]:not(.brand-logo-card):not(.image-card){
  background:linear-gradient(180deg,var(--zoey-panel-secondary),var(--zoey-panel))!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
  box-shadow:var(--zoey-shadow);
}

/* Form controls */
input,select,textarea,.booking-card input,.booking-card select{
  background:var(--zoey-input)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}
input::placeholder,textarea::placeholder{color:#737B85!important}
input:focus,select:focus,textarea:focus,.booking-card input:focus,.booking-card select:focus{
  outline:none!important;
  border-color:rgba(240,207,112,.58)!important;
  box-shadow:0 0 0 3px rgba(240,207,112,.08)!important;
}
label,legend{color:var(--zoey-text)!important}
select option{background:var(--zoey-panel)!important;color:var(--zoey-text)!important}

/* Buttons */
.primary-button,.btn-primary,.button.primary,.booking-submit,.booking-primary-action,
.portal-button:not(.secondary),button[type="submit"],input[type="submit"]{
  background:linear-gradient(135deg,var(--zoey-gold),var(--zoey-gold-dark))!important;
  color:var(--zoey-button-text)!important;
  border-color:transparent!important;
}
.secondary-button,.btn-secondary,.button.secondary,.portal-button.secondary{
  background:var(--zoey-panel-secondary)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}

/* Booking — old page-level CSS used white/navy; force official palette */
.booking-progress span{
  background:var(--zoey-panel-secondary)!important;
  color:var(--zoey-text-muted)!important;
  border-color:var(--zoey-border)!important;
}
.booking-progress .active{
  background:linear-gradient(135deg,var(--zoey-gold),var(--zoey-gold-dark))!important;
  color:var(--zoey-button-text)!important;
  border-color:transparent!important;
}
.booking-trailer-photo{background:var(--zoey-bg-soft)!important;border-color:var(--zoey-border)!important}
.booking-meta div,.booking-price,.booking-action-flow{
  background:var(--zoey-panel)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}
.sms-consent-block{
  background:var(--zoey-panel-elevated)!important;
  border-color:var(--zoey-border-gold)!important;
}
.sms-consent-label span{color:var(--zoey-text)!important}
.sms-consent-note{color:var(--zoey-text-muted)!important}
.sms-consent-links a{color:var(--zoey-gold)!important}

/* Tables, records, dropdowns */
table{background:var(--zoey-panel)!important;border-color:var(--zoey-border)!important;color:var(--zoey-text)!important}
th{background:var(--zoey-panel-secondary)!important;color:var(--zoey-text)!important}
td,th{border-color:var(--zoey-border)!important}
.dropdown,.menu,.popover,.modal,.dialog{background:var(--zoey-panel)!important;color:var(--zoey-text)!important;border-color:var(--zoey-border)!important}

/* Semantic states */
.status-success,.status-approved,.status-completed,.badge.success,.success{color:var(--zoey-success)!important}
.status-error,.status-failed,.status-rejected,.status-overdue,.badge.error,.error{color:var(--zoey-danger)!important}
.status-warning,.status-pending,.badge.warning{color:var(--zoey-gold)!important}

/* Protect media from generic card/background rules */
img,video,canvas{background-color:transparent}

/* Desktop/mobile both supported */
@media(min-width:641px){
  .container{width:min(1440px,calc(100% - 64px));margin-inline:auto}
}
@media(max-width:640px){
  .container{width:min(100% - 22px,1440px);margin-inline:auto}
}

/* ============================================================================
   ZOEY 2026 FULL-SITE COLOR REPAIR — FINAL OVERRIDE LAYER
   This block intentionally defeats older feature CSS that still contains
   white/navy/legacy-gold palettes. Keep this at the END of zoey-theme.css.
   ============================================================================ */
:root{
  --zt-gold:var(--zoey-gold)!important;
  --gold:var(--zoey-gold)!important;
  --zt-ink:var(--zoey-text)!important;
  --ink:var(--zoey-text)!important;
  --zt-muted:var(--zoey-text-muted)!important;
  --muted:var(--zoey-text-muted)!important;
  --zt-line:var(--zoey-border)!important;
  --line:var(--zoey-border)!important;
  --zt-soft:var(--zoey-bg-soft)!important;
  --zt-surface:var(--zoey-panel)!important;
  --surface:#15191E;
  --good:var(--zoey-success)!important;
  --danger:var(--zoey-danger)!important;
}

/* Full page surfaces */
body:not(.print-mode),
.portal-body,.inspection-flow-body,.success-page,.success-body,
.auth-page,.login-page,.admin-page,.customer-page,.partner-page{
  background:radial-gradient(circle at 84% 8%,var(--zoey-gold-soft),transparent 28rem),linear-gradient(180deg,var(--zoey-bg),var(--zoey-bg-secondary))!important;
  color:var(--zoey-text)!important;
}

/* Feature CSS previously shipped white cards. */
.success-card,.success-hero,.summary-item,.success-action,
.inspection-booking-card,.inspection-booking-head,.owner-phase-card,
.inspection-empty-phase,.inspection-flow-card,.inspection-summary div,
.inspection-photo-card,.inspection-complete-panel,
.notification-history-item,.notification-history-item.status-failed,
.contract-shell,.contract-card,.contract-section,.contract-panel,
.document-panel,.document-upload-card,.document-review-card,
.rental-card,.customer-summary-card,.next-action-card,.rental-next,
.document-chip,.lifecycle-step,.communication-card,.settings-card,
.admin-section,.admin-card,.owner-card,.owner-panel,.portal-section,
.receipt-card,.receipt-panel,.payment-card,.payment-panel{
  background:linear-gradient(180deg,var(--zoey-panel-secondary),var(--zoey-panel))!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}

/* Specific legacy light panels / text */
.inspection-booking-head p,.owner-phase-meta,.inspection-empty-phase,
.inspection-summary span,.inspection-photo-card span,
.notification-history-body p,.notification-history-body small,
.summary-item span,.customer-summary-card span,.timeline-step,
.contract-copy,.contract-copy p,.contract-copy li,.contract-copy small,
.ack-row,.contract-grid label,.receipt-meta,.receipt-label{
  color:var(--zoey-text-muted)!important;
}

.success-hero h1,.success-card h1,.success-card h2,.success-card h3,
.inspection-flow-card h1,.inspection-flow-card h2,.inspection-flow-card h3,
.inspection-booking-head h3,.owner-phase-head h4,
.notification-history-heading,.customer-summary-card strong,
.next-action-card h2,.rental-card h2,.rental-card h3,
.contract-shell h1,.contract-shell h2,.contract-shell h3,
.contract-grid label,.ack-row{
  color:var(--zoey-text)!important;
}

/* Inputs in old inspection/contract/admin modules */
.inspection-owner-toolbar input,.inspection-owner-toolbar select,.inspection-note,
.inspection-flow-card input,.inspection-flow-card select,.inspection-flow-card textarea,
.contract-grid input,.contract-grid select,.contract-grid textarea,
.contract-shell input,.contract-shell select,.contract-shell textarea,
.notification-filter-row input,.notification-filter-row select{
  background:var(--zoey-input)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}

/* Signature pads are intentionally white drawing surfaces. */
.signature-wrap,#signature-pad,#admin-signature-pad,.signed-image{
  background:#15191E!important;
}

/* Semantic chips / progress */
.review-chip.pending,.document-chip.warn{
  background:rgba(240,207,112,.10)!important;
  color:var(--zoey-gold)!important;
  border-color:rgba(240,207,112,.35)!important;
}
.review-chip.reviewed,.document-chip.good,.lifecycle-step.complete{
  background:rgba(137,220,169,.10)!important;
  color:var(--zoey-success)!important;
  border-color:rgba(137,220,169,.35)!important;
}
.review-chip.concern,.notification-history-item.status-failed{
  background:rgba(255,143,143,.08)!important;
  color:var(--zoey-danger)!important;
  border-color:rgba(255,143,143,.32)!important;
}
.lifecycle-step.current,.next-action-card,.rental-next{
  background:rgba(240,207,112,.08)!important;
  border-color:var(--zoey-border-gold)!important;
}
.lifecycle-step.current span,.readiness-ring{
  background-color:var(--zoey-gold)!important;
}
.rental-kicker,.inspection-kicker,.summary-item.total strong,
.lifecycle-filter-button:hover,.lifecycle-filter-button.active{
  color:var(--zoey-gold)!important;
}

/* Owner inspection/photo UI */
.owner-photo-tile,.trailer-photo-placeholder,.photo-placeholder{
  background:var(--zoey-panel-elevated)!important;
  border-color:var(--zoey-border)!important;
}
.owner-photo-label{
  background:rgba(11,13,16,.88)!important;
  color:var(--zoey-text)!important;
}

/* Mobile nav and menu */
.mobile-bottom-nav,.mobile-menu-sheet{
  background:rgba(11,13,16,.97)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}
.mobile-bottom-nav a,.mobile-menu-sheet a,.mobile-menu-sheet button{
  color:var(--zoey-text)!important;
  background:rgba(34,40,49,.72)!important;
}
.mobile-bottom-nav .active,.mobile-menu-sheet .active{
  color:var(--zoey-gold)!important;
  background:rgba(240,207,112,.10)!important;
}

/* Admin/DEV mirror chrome */
.dev-banner,.admin-toolbar,.owner-toolbar,.portal-toolbar{
  background:var(--zoey-bg-soft)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}
.dev-banner a,.dev-banner button{
  background:var(--zoey-panel-elevated)!important;
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border)!important;
}

/* Ensure old hardcoded links/buttons do not reintroduce blue. */
.portal-body a:not(.primary-button):not(.portal-button),
.admin-page a:not(.primary-button),.customer-page a:not(.primary-button),
.partner-page a:not(.primary-button){color:var(--zoey-gold)}

/* Checkbox/radio accent belongs to brand gold. */
input[type="checkbox"],input[type="radio"]{accent-color:var(--zoey-gold)}

/* Scrollbars: subtle, brand-consistent where supported. */
*{scrollbar-color:var(--zoey-panel-elevated) var(--zoey-bg)}


/* ==========================================================================
   ZOEY TRANSPORTATION — OWNER APPROVED 2026 UI SYSTEM
   ==========================================================================
   OWNER APPROVED ZOEY BRAND COLORS — DO NOT CHANGE WITHOUT EXPLICIT OWNER
   APPROVAL.

   This section modernizes COMPONENTS ONLY. It must not introduce a new color
   palette or alter the approved --zoey-* brand variables above.

   Scope:
   - selects / dropdowns
   - forms
   - buttons
   - cards
   - accordions/details
   - navigation
   - tables
   - portal controls
   - responsive/mobile behavior
   ========================================================================== */

:root{
  --zoey-control-height:46px;
  --zoey-control-height-lg:50px;
  --zoey-control-radius:12px;
  --zoey-card-radius:18px;
  --zoey-section-gap:clamp(18px,2vw,28px);
  --zoey-ease:cubic-bezier(.2,.75,.25,1);
  --zoey-focus:0 0 0 3px rgba(240,207,112,.12);
}

/* Better overall rhythm without changing page structure */
body{
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

main,
.portal-main,
.dashboard-main{
  isolation:isolate;
}

section + section{
  scroll-margin-top:88px;
}

.portal-section,
.inner-section,
.page-section{
  scroll-margin-top:92px;
}

/* --------------------------------------------------------------------------
   BUTTONS
   -------------------------------------------------------------------------- */
button,
.button,
.btn,
.portal-button,
input[type="submit"],
input[type="button"]{
  min-height:var(--zoey-control-height);
  border-radius:var(--zoey-control-radius);
  font-weight:800;
  letter-spacing:.005em;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  cursor:pointer;
  transition:
    transform .16s var(--zoey-ease),
    border-color .16s var(--zoey-ease),
    background-color .16s var(--zoey-ease),
    box-shadow .16s var(--zoey-ease),
    filter .16s var(--zoey-ease);
}

button:hover:not(:disabled),
.button:hover,
.btn:hover,
.portal-button:hover:not(:disabled){
  transform:translateY(-1px);
}

button:active:not(:disabled),
.button:active,
.btn:active,
.portal-button:active:not(:disabled){
  transform:translateY(0) scale(.985);
}

button:focus-visible,
.button:focus-visible,
.btn:focus-visible,
.portal-button:focus-visible,
a:focus-visible{
  outline:none;
  box-shadow:var(--zoey-focus);
}

button:disabled,
.button[aria-disabled="true"],
.btn[aria-disabled="true"]{
  cursor:not-allowed;
  opacity:.48;
  transform:none!important;
  filter:none!important;
}

/* --------------------------------------------------------------------------
   FORM CONTROLS / INPUTS
   -------------------------------------------------------------------------- */
input,
select,
textarea{
  width:100%;
  min-height:var(--zoey-control-height);
  border-radius:var(--zoey-control-radius);
  padding:10px 13px;
  font:inherit;
  transition:
    border-color .16s var(--zoey-ease),
    box-shadow .16s var(--zoey-ease),
    background-color .16s var(--zoey-ease);
}

textarea{
  min-height:112px;
  resize:vertical;
  line-height:1.5;
}

input:hover:not(:disabled),
select:hover:not(:disabled),
textarea:hover:not(:disabled){
  border-color:var(--zoey-border-gold)!important;
}

input:focus,
select:focus,
textarea:focus{
  outline:none!important;
  box-shadow:var(--zoey-focus)!important;
}

input[type="checkbox"],
input[type="radio"]{
  width:18px;
  height:18px;
  min-height:18px;
  padding:0;
  accent-color:var(--zoey-gold);
  flex:none;
}

label{
  display:grid;
  gap:7px;
  font-size:.88rem;
  line-height:1.35;
}

.form-grid,
.portal-form,
.booking-form,
.market-form{
  gap:14px;
}

.field-row,
.form-row{
  gap:12px;
}

/* --------------------------------------------------------------------------
   NATIVE SELECT / DROPDOWN CONTROLS
   -------------------------------------------------------------------------- */
select{
  appearance:none;
  -webkit-appearance:none;
  cursor:pointer;
  padding-right:44px!important;
  background-image:
    linear-gradient(45deg,transparent 50%,var(--zoey-gold) 50%),
    linear-gradient(135deg,var(--zoey-gold) 50%,transparent 50%);
  background-position:
    calc(100% - 18px) 19px,
    calc(100% - 12px) 19px;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
}

select:disabled{
  cursor:not-allowed;
  opacity:.55;
}

select option{
  background:var(--zoey-panel)!important;
  color:var(--zoey-text)!important;
  padding:10px;
}

/* compact toolbar selects */
.toolbar select,
.notification-filter-row select,
.system-filter-row select{
  min-width:150px;
}

/* --------------------------------------------------------------------------
   DETAILS / SUMMARY — FAQ & collapsible menus
   -------------------------------------------------------------------------- */
details{
  overflow:hidden;
  border:1px solid var(--zoey-border);
  border-radius:var(--zoey-card-radius);
  background:linear-gradient(180deg,var(--zoey-panel-secondary),var(--zoey-panel));
  transition:border-color .18s var(--zoey-ease),box-shadow .18s var(--zoey-ease);
}

details:hover{
  border-color:var(--zoey-border-gold);
}

details[open]{
  border-color:var(--zoey-border-gold);
  box-shadow:0 14px 34px rgba(0,0,0,.16);
}

summary{
  position:relative;
  list-style:none;
  cursor:pointer;
  padding:16px 52px 16px 18px;
  color:var(--zoey-text);
  font-weight:800;
  line-height:1.35;
  user-select:none;
}

summary::-webkit-details-marker{
  display:none;
}

summary::after{
  content:"+";
  position:absolute;
  right:16px;
  top:50%;
  width:28px;
  height:28px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  border-radius:9px;
  border:1px solid var(--zoey-border-gold);
  background:var(--zoey-gold-soft);
  color:var(--zoey-gold);
  font-size:1.15rem;
  line-height:1;
  transition:transform .18s var(--zoey-ease);
}

details[open] summary::after{
  transform:translateY(-50%) rotate(45deg);
}

details > :not(summary){
  margin-left:18px;
  margin-right:18px;
}

details > :last-child{
  margin-bottom:18px;
}

/* --------------------------------------------------------------------------
   CARDS / SURFACES
   -------------------------------------------------------------------------- */
.card,
.panel,
.portal-card,
.stat-card,
.booking-card,
.feature-card,
.trailer-card,
.auth-card,
.action-card,
.record-card{
  border-radius:var(--zoey-card-radius);
  transition:
    border-color .18s var(--zoey-ease),
    transform .18s var(--zoey-ease),
    box-shadow .18s var(--zoey-ease);
}

.card:hover,
.feature-card:hover,
.trailer-card:hover,
.action-card:hover{
  border-color:var(--zoey-border-gold);
}

.portal-card,
.booking-card,
.auth-card{
  overflow:clip;
}

/* cleaner card headings */
.card h2:first-child,
.card h3:first-child,
.portal-card h2:first-child,
.portal-card h3:first-child{
  margin-top:0;
}

/* --------------------------------------------------------------------------
   NAVIGATION / MENUS
   -------------------------------------------------------------------------- */
.site-header,
.portal-topbar{
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.main-nav,
.portal-nav,
.admin-nav-2026{
  align-items:center;
}

.main-nav a,
.portal-nav a,
.portal-nav button,
.admin-nav-2026 button{
  position:relative;
  border-radius:11px;
  transition:
    background-color .16s var(--zoey-ease),
    color .16s var(--zoey-ease),
    border-color .16s var(--zoey-ease),
    transform .16s var(--zoey-ease);
}

/* subtle selected state without adding colors */
.main-nav a[aria-current="page"],
.main-nav a.active{
  background:var(--zoey-gold-soft);
  color:var(--zoey-gold)!important;
}

/* --------------------------------------------------------------------------
   TABLES / DATA
   -------------------------------------------------------------------------- */
.table-wrap,
.table-responsive,
.data-table-wrap{
  width:100%;
  overflow:auto;
  border-radius:14px;
  scrollbar-width:thin;
  scrollbar-color:var(--zoey-panel-elevated) transparent;
}

table{
  border-spacing:0;
  overflow:hidden;
}

th{
  position:sticky;
  top:0;
  z-index:2;
  font-size:.76rem;
  text-transform:uppercase;
  letter-spacing:.055em;
  white-space:nowrap;
}

td{
  vertical-align:middle;
}

tbody tr{
  transition:background-color .14s var(--zoey-ease);
}

tbody tr:hover td{
  background:rgba(240,207,112,.025);
}

/* --------------------------------------------------------------------------
   STATUS PILLS / PROGRESS
   -------------------------------------------------------------------------- */
.badge,
.status,
.pill,
.chip,
[class*="status-badge"],
[class*="requirement-badge"]{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:5px 9px;
  border-radius:999px;
  font-size:.74rem;
  line-height:1;
  font-weight:800;
  white-space:nowrap;
}

.progress-step,
.lifecycle-step,
.requirement-step{
  transition:
    border-color .16s var(--zoey-ease),
    background-color .16s var(--zoey-ease),
    opacity .16s var(--zoey-ease);
}

/* --------------------------------------------------------------------------
   EMPTY / MESSAGE / ERROR STATES
   -------------------------------------------------------------------------- */
.empty-state,
.portal-message,
.notice,
.alert{
  border-radius:13px;
}

.empty-state{
  padding:22px;
  text-align:center;
  border:1px dashed var(--zoey-border);
  background:rgba(34,40,49,.72);
}

.portal-message:not(:empty),
.message:not(:empty){
  padding:10px 12px;
}

/* --------------------------------------------------------------------------
   OWNER / ADMIN TOOLBARS
   -------------------------------------------------------------------------- */
.toolbar,
.notification-filter-row,
.system-filter-row{
  display:flex;
  align-items:end;
  flex-wrap:wrap;
  gap:10px;
  padding:10px;
  border-radius:14px;
}

.toolbar > *,
.notification-filter-row > *,
.system-filter-row > *{
  flex:1 1 160px;
}

.toolbar button,
.notification-filter-row button,
.system-filter-row button{
  flex:0 0 auto;
}

/* --------------------------------------------------------------------------
   DROPDOWN / POPOVER-LIKE LEGACY MENUS
   Generic support for common classes already used by various pages.
   -------------------------------------------------------------------------- */
.dropdown-menu,
.menu-popover,
.action-menu,
.context-menu,
.portal-menu,
.admin-menu{
  min-width:220px;
  padding:7px;
  border:1px solid var(--zoey-border-gold)!important;
  border-radius:14px!important;
  background:var(--zoey-panel-elevated)!important;
  color:var(--zoey-text)!important;
  box-shadow:0 22px 55px rgba(0,0,0,.34)!important;
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.dropdown-menu a,
.dropdown-menu button,
.menu-popover a,
.menu-popover button,
.action-menu a,
.action-menu button,
.context-menu a,
.context-menu button{
  width:100%;
  min-height:40px;
  justify-content:flex-start;
  padding:9px 11px;
  border:0!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--zoey-text)!important;
  text-align:left;
}

.dropdown-menu a:hover,
.dropdown-menu button:hover,
.menu-popover a:hover,
.menu-popover button:hover,
.action-menu a:hover,
.action-menu button:hover,
.context-menu a:hover,
.context-menu button:hover{
  background:var(--zoey-gold-soft)!important;
  color:var(--zoey-gold)!important;
  transform:none!important;
}

/* --------------------------------------------------------------------------
   MOBILE / TABLET
   -------------------------------------------------------------------------- */
@media(max-width:800px){
  :root{
    --zoey-control-height:48px;
  }

  .toolbar,
  .notification-filter-row,
  .system-filter-row{
    display:grid;
    grid-template-columns:1fr;
  }

  .toolbar > *,
  .notification-filter-row > *,
  .system-filter-row > *{
    width:100%;
  }

  .main-nav a,
  .portal-nav a,
  .portal-nav button,
  .admin-nav-2026 button{
    min-height:44px;
  }

  summary{
    padding:15px 48px 15px 15px;
  }

  details > :not(summary){
    margin-left:15px;
    margin-right:15px;
  }

  table{
    min-width:680px;
  }
}

@media(max-width:520px){
  .card,
  .panel,
  .portal-card,
  .booking-card,
  .auth-card{
    border-radius:15px;
  }

  .record-actions,
  .hero-actions,
  .action-row{
    gap:8px;
  }

  .record-actions > button,
  .record-actions > .button{
    flex:1 1 100%;
  }

  .badge,
  .status,
  .pill,
  .chip,
  [class*="status-badge"],
  [class*="requirement-badge"]{
    white-space:normal;
    line-height:1.2;
  }
}

/* Respect user accessibility preferences */
@media(prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}

/* ==========================================================================
   ZOEY V3.10.3 — NO CREAM / NO WHITE SURFACES
   OWNER DIRECTIVE: cream/white surface styling is prohibited.
   Near-white #F6F3EA is reserved for readable text only.
   ========================================================================== */
html,body,
main,section,
.inner-section,.page-section,.booking-section,.partners-section,
.booking-page,.booking-shell,.booking-layout,.booking-form,.booking-sidebar,
.portal-main,.portal-section,.dashboard-main,.admin-main,.customer-main,
.transport-page,.transport-form,.transport-card,
.about-section,.fleet-section,.reservation-section{
  background-color:#0B0D10!important;
}

.card,.panel,.portal-card,.booking-card,.trailer-card,.feature-card,
.auth-card,.record-card,.action-card,.stat-card,.market-card,
.reservation-card,.consent-card,.sms-consent,.form-card,
[class*="card"],[class*="panel"]{
  background:#15191E!important;
  color:#F6F3EA!important;
  border-color:var(--zoey-border)!important;
}

input,select,textarea{
  background:#101318!important;
  color:#F6F3EA!important;
  border-color:var(--zoey-border)!important;
}

option{
  background:#15191E!important;
  color:#F6F3EA!important;
}

table,tbody,td{
  background-color:#15191E!important;
  color:#F6F3EA!important;
}
th{
  background:#1B2026!important;
  color:#F0CF70!important;
}

details,summary,
.dropdown-menu,.menu-popover,.action-menu,.context-menu,
.portal-menu,.admin-menu{
  background:#1B2026!important;
  color:#F6F3EA!important;
}

.site-header,header,.portal-topbar,.admin-topbar,.site-footer,footer{
  background:#0B0D10!important;
}


body [style*="#f4f1e9" i],
body [style*="#f5f2e9" i],
body [style*="#f8f4e9" i],
body [style*="#f4f0e6" i],
body [style*="#fafafa" i],
body [style*="#f5f5f5" i],
body [style*="#f8fafc" i]{
  background:#15191E!important;
}



/* ==========================================================================
   ZOEY 3.9.7.6 — LIVE TEST BOOKING FIX
   ========================================================================== */
.button,.button-black,.button-ghost,.secondary-action,.portal-button.secondary,
a.button-black,a.button-ghost{
  background:#222831!important;color:#F6F3EA!important;border:1px solid #2A3038!important;
}
.button-gold,.primary-action,.portal-button:not(.secondary):not(.danger):not(.danger-lite),
input[type="submit"],button[type="submit"],#calculate-estimate,.nav-button{
  background:linear-gradient(135deg,#F0CF70,#D9B455)!important;
  color:#0B0D10!important;border-color:transparent!important;
}
.contract-card,.contract-card *,.contract-header,.contract-section{color:#F6F3EA;}
.contract-header>div:last-child,.contract-meta div,.contract-notice,.signing-feedback,
.document-upload-panel,.document-upload-card,.document-completion-badge{
  background:#1B2026!important;color:#F6F3EA!important;border-color:#2A3038!important;
}
.contract-badge,.success-kicker,.live-status,.timeline-step.active .timeline-dot,
.calendar-day.in-range,.review-chip.pending{
  background:rgba(240,207,112,.12)!important;color:#F0CF70!important;
  border-color:rgba(240,207,112,.35)!important;
}
.contract-error,.signing-feedback.contract-error,.success-error,.review-chip.concern,
.calendar-day.booked{
  background:rgba(255,143,143,.12)!important;color:#FF8F8F!important;
  border-color:rgba(255,143,143,.35)!important;
}
.contract-success,.signing-feedback.contract-success,.document-upload-card.uploaded,
.timeline-step.done .timeline-dot,.review-chip.reviewed,.inspection-photo-card.uploaded,
.inspection-complete-panel{
  background:rgba(137,220,169,.12)!important;color:#89DCA9!important;
  border-color:rgba(137,220,169,.35)!important;
}
.success-body,.success-shell,.success-card,.success-hero,.success-help,.timeline-dot,
.availability-picker,.inspection-flow-body,.inspection-flow-card,.inspection-summary div,
.inspection-photo-card,.premium-fleet-card,.premium-fleet-body,.transport-form,.quote-result,
.contact-form,.booking-form,.booking-sidebar{
  background:#15191E!important;color:#F6F3EA!important;border-color:#2A3038!important;
}
input,select,textarea,.contract-grid input,.inspection-note{
  background:#101318!important;color:#F6F3EA!important;border-color:#2A3038!important;
}
.premium-fleet-body p,.premium-fleet-body li,.document-upload-heading p,
.document-upload-card span,.inspection-booking-head p{color:#9FA6AF!important;}


/* ==========================================================================
   ZOEY 3.9.7.9 — STABILIZATION UX
   ========================================================================== */
.portal-message.error,
.notification-error,
.v34-communication-result.error,
#test-email-result.error,
#notification-config-note.error,
#inspection-upload-diagnostic {
  padding:12px 14px!important;
  border:1px solid rgba(255,143,143,.48)!important;
  border-radius:12px!important;
  background:rgba(255,143,143,.10)!important;
  color:#FFB4B4!important;
  font-size:.86rem!important;
  line-height:1.45!important;
  font-weight:700!important;
  overflow-wrap:anywhere;
}

.portal-message.success,
.v34-communication-result.success,
#test-email-result.success,
#notification-config-note.success {
  padding:10px 13px!important;
  border:1px solid rgba(137,220,169,.34)!important;
  border-radius:12px!important;
  background:rgba(137,220,169,.08)!important;
  color:#89DCA9!important;
}

.communication-actions {
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.communication-actions .portal-button {
  min-width:0;
}

.notification-history-item .notification-error {
  margin-top:8px!important;
}

@media(max-width:700px) {
  .communication-actions .portal-button {
    flex:1 1 calc(50% - 8px);
  }
}


/* ==========================================================================
   ZOEY 3.9.8.1 — MARKETPLACE / MOBILE-READY PORTALS
   ========================================================================== */
.connect-payout-panel{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;
  padding:18px;border:1px solid var(--zoey-border,#2A3038);border-radius:16px;
  background:linear-gradient(145deg,#15191E,#101318);
}
.connect-payout-panel h3{margin:.2rem 0 .4rem}
.connect-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex-wrap:wrap}
.portal-shell .stat-card,.portal-shell .data-card,.portal-shell .portal-card{
  box-shadow:0 10px 28px rgba(0,0,0,.14);
}
.portal-sidebar button,.quick-link-grid button,.portal-button{
  min-height:44px;
}
.portal-section{scroll-margin-top:84px}
@media(max-width:760px){
  .connect-payout-panel{grid-template-columns:1fr}
  .connect-actions{justify-content:flex-start}
  .portal-shell .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .portal-shell .section-heading{align-items:flex-start;gap:10px}
}
@media(max-width:460px){
  .portal-shell .stats-grid{grid-template-columns:1fr}
  .connect-actions .portal-button{width:100%}
}


/* ==========================================================================\n   ZOEY 3.9.8.2 — PARTNER RULES + POST-RENTAL CHARGES\n   ========================================================================== */
#partner-fee-policy-form .form-grid,#partner-post-rental-charge-form .form-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
#partner-post-charge-list .record-details,#partner-payout-list .record-details{grid-template-columns:repeat(3,minmax(0,1fr));}
.portal-section[data-section="charges"] .portal-card,.portal-section[data-section="rules"] .portal-card{border-color:rgba(240,207,112,.24);}
@media(max-width:700px){#partner-fee-policy-form .form-grid,#partner-post-rental-charge-form .form-grid,#partner-post-charge-list .record-details{grid-template-columns:1fr;}}


/* ==========================================================================
   ZOEY 3.9.8.4 — ADDRESS AUTOCOMPLETE VISIBILITY
   The transport address suggestions are custom Zoey buttons populated from
   the Maps autocomplete API. Older CSS made dark text invisible on dark rows.
   ========================================================================== */
.address-suggestions{
  background:var(--zoey-panel-elevated)!important;
  border:1px solid var(--zoey-border-gold)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.38)!important;
}
.address-suggestions button{
  background:transparent!important;
  color:var(--zoey-text)!important;
  border:1px solid transparent!important;
  font-weight:650!important;
}
.address-suggestions button + button{
  border-top-color:var(--zoey-border-soft)!important;
}
.address-suggestions button:hover,
.address-suggestions button:focus,
.address-suggestions button[aria-selected="true"]{
  background:var(--zoey-gold-soft)!important;
  color:var(--zoey-gold)!important;
  border-color:var(--zoey-border-gold)!important;
  outline:none!important;
}
.address-suggestions button:active{
  background:rgba(240,207,112,.14)!important;
  color:var(--zoey-text)!important;
}

/* Also protect Google-rendered Places widgets if one is used on a future page. */
.pac-container{
  background:var(--zoey-panel-elevated)!important;
  border-color:var(--zoey-border-gold)!important;
  color:var(--zoey-text)!important;
  box-shadow:0 18px 44px rgba(0,0,0,.38)!important;
}
.pac-item,
.pac-item-query{
  color:var(--zoey-text)!important;
  border-color:var(--zoey-border-soft)!important;
}
.pac-item:hover,
.pac-item-selected{
  background:var(--zoey-gold-soft)!important;
}
.pac-matched{
  color:var(--zoey-gold)!important;
}

/* v3.15.8 — Lockii overlay iframe transparency fix.
   Keep the site dark theme, but prevent inherited color-scheme from making
   Lockii's transparent overlay iframe paint as an opaque white surface. */
iframe.lockii-overlay,
.lockii-overlay,
iframe.lockii-iframe {
  color-scheme: normal;
  background: transparent !important;
}