/* Saved overrides are opt-in. Without them, signature.css remains the palette. */
:root[data-custom-background] { --paper: var(--custom-background); }
:root[data-custom-surface] {
  --surface: var(--custom-surface); --white: var(--custom-surface); --input: var(--custom-surface);
  --surface-raised: color-mix(in srgb, var(--custom-surface) 93%, var(--ink));
  --surface-hover: color-mix(in srgb, var(--custom-surface) 85%, var(--ink));
  --line: color-mix(in srgb, var(--custom-surface) 78%, var(--ink));
}
:root[data-custom-text] { --ink: var(--custom-text); }
:root[data-custom-accent] {
  --purple: var(--custom-accent); --purple-dark: var(--custom-accent);
  --tint: color-mix(in srgb, var(--custom-accent) 15%, var(--surface));
  --nav-active: var(--custom-accent); --nav-active-text: var(--custom-accent-ink);
}
:root[data-custom-accent] .dark-bg { background: var(--custom-accent); border-color: var(--custom-accent); color: var(--custom-accent-ink); }
:root[data-custom-accent] .dark-bg:hover { background: color-mix(in srgb, var(--custom-accent) 86%, var(--custom-accent-ink)); }
:root[data-custom-accent] .header nav a.active:after { background: var(--custom-accent); }
:root[data-custom-ttc] .vehicle-price .price-main { color: var(--custom-ttc); }
:root[data-custom-ht] .vehicle-price .price-ht { color: var(--custom-ht); }

.appearance-layout { display: grid; grid-template-columns: minmax(220px,.7fr) minmax(0,1.5fr); gap: 35px; align-items: start; }
.appearance-intro h2 { font-size: 1.65rem; }
.appearance-intro .private-label { display: inline-block; color: var(--muted); font-size: 11px; }
.appearance-theme-tabs { display: flex; gap: 7px; margin-bottom: 25px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.appearance-theme-tabs button { flex: 1; padding: 11px; min-height: 44px; background: var(--surface-raised); color: var(--muted); border: 1px solid var(--line); border-radius: 7px; font-size: 13px; }
.appearance-theme-tabs button.selected { color: var(--nav-active-text); background: var(--nav-active); border-color: transparent; }
.appearance-color-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.appearance-color-field label { gap: 5px; margin-bottom: 9px; color: var(--ink); font-size: 14px; }
.appearance-color-field label small { color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; }
.appearance-color-controls { display: flex; gap: 9px; }
.appearance-color-controls input[type=color] { padding: 5px; width: 51px; min-width: 51px; height: 46px; cursor: pointer; }
.appearance-color-controls input[type=text] { min-width: 0; font-family: Consolas,monospace; letter-spacing: .04em; text-transform: uppercase; }
.appearance-preview { margin-top: 28px; padding: 24px; background: var(--preview-background); border: 1px solid var(--line); border-radius: 11px; }
.appearance-preview-card { max-width: 340px; margin: auto; padding: 24px; border-radius: 10px; background: var(--preview-surface); color: var(--preview-text); box-shadow: 0 10px 25px #00000015; }
.appearance-preview-kicker { display: block; font-size: 10px; letter-spacing: .12em; margin-bottom: 18px; color: var(--preview-accent); }
.appearance-preview-card h3 { font-size: 24px; color: var(--preview-text); }
.appearance-preview-card p { font-size: 13px; color: var(--preview-text); opacity: .8; }
#appearance-preview .price-main { color: var(--preview-ttc); }
#appearance-preview .price-ht { color: var(--preview-ht); }
.appearance-preview-button { display: inline-block; margin-top: 23px; padding: 10px 13px; background: var(--preview-accent); color: var(--preview-accent-ink); border-radius: 6px; font-size: 12px; font-weight: 650; }
.appearance-contrast { margin-top: 13px; color: var(--gold); font-size: 13px; }
.appearance-contrast:empty, #appearance-draft-status:empty { display: none; }
.appearance-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 23px; }
@media(max-width:850px) { .appearance-layout { grid-template-columns: 1fr; gap: 20px; } .appearance-intro .private-label { display: none; } }
@media(max-width:520px) { .appearance-color-grid { grid-template-columns: 1fr; gap: 19px; } .appearance-preview { padding: 15px; } .appearance-actions .button { width: 100%; } }

.appearance-color-controls input[type=color]::-webkit-color-swatch-wrapper { padding: 0; }
.appearance-color-controls input[type=color]::-webkit-color-swatch { border: 0; border-radius: 4px; }
.appearance-color-controls input[type=color]::-moz-color-swatch { border: 0; border-radius: 4px; }
.promotions-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 19px; }
.promotions-heading h2 { font-size: 1.7rem; margin-bottom: 10px; }
.promotions-heading p { margin-bottom: 0; max-width: 680px; }
.promotions-heading .button { white-space: nowrap; flex-shrink: 0; }
.promotion-rules { margin-bottom: 23px; padding: 15px 18px; border: 1px solid var(--line); border-left: 3px solid var(--purple); border-radius: 7px; background: var(--surface-raised); }
.promotion-rules p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.promotions-list { display: flex; flex-direction: column; gap: 15px; }
.promotion-row { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding: 22px 25px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.promotion-row-main { min-width: 0; flex: 1; }
.promotion-row-title { display: flex; align-items: center; gap: 11px; margin-bottom: 10px; flex-wrap: wrap; }
.promotion-row-title h3 { font-size: 19px; font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.promotion-status { display: inline-flex; border-radius: 5px; padding: 4px 8px; font-size: 11px; font-weight: 600; color: var(--muted); background: var(--surface-raised); border: 1px solid var(--line); }
.promotion-status.active { color: #8FE0B4; background: #2C805D24; border-color: #368D6747; }
.promotion-status.scheduled { color: var(--purple-dark); background: var(--tint); }
.promotion-status.invalid, .promotion-status.unavailable { color: var(--gold); background: var(--gold-panel); }
[data-theme=light] .promotion-status.active { color: #246845; background: #E6F5EB; border-color: #C6E6D3; }
.promotion-vehicle-name { color: var(--ink); font-size: 14px; margin: 0 0 8px; }
.promotion-description { max-width: 760px; color: var(--muted); font-size: 13px; line-height: 1.6; margin-bottom: 13px; }
.promotion-row-meta { display: flex; align-items: center; gap: 10px 19px; flex-wrap: wrap; font-size: 12px; color: var(--muted); }
.promotion-discount-label { color: var(--purple-dark); font-weight: 650; }
.promotion-row-actions { display: flex; flex-direction: column; gap: 9px; min-width: 112px; }
.promotion-row-actions .button { font-size: 12px; min-height: 40px; padding: 9px 13px; }
.promotion-list-price { margin-top: 16px; padding-top: 13px; border-top: 1px solid var(--line); }
.promotion-list-price .price-main { font-size: 17px; }
.promotion-editor .editor-section { margin-top: 23px; }
.promotion-editor select { max-width: 100%; }
.promotion-price-preview { padding: 19px; margin: 10px 0 18px; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 8px; }
.promotion-preview-prices { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 15px; }
.promotion-preview-arrow { color: var(--purple); font-size: 24px; }
.promotion-preview-saving { color: var(--purple-dark); font-size: 12px; padding-top: 13px; margin: 15px 0 0; border-top: 1px solid var(--line); }
.promotion-price-preview>p:only-child { margin: 0; }

/* Flash offers retain the catalogue palette and support the custom price colors. */
.price-original { display: flex; flex-wrap: wrap; align-items: baseline; gap: 5px 10px; color: var(--muted); font-size: 12px; font-weight: 400; line-height: 1.5; letter-spacing: 0; }
.price-original s, s.price-original, del.price-original { text-decoration-thickness: 1px; text-decoration-color: currentColor; }
.price-original small { font-size: 11px; color: var(--muted); }
.price-discount, .vehicle-price .price-discount { display: inline-flex; align-items: center; align-self: flex-start; gap: 5px; padding: 3px 7px; margin: 2px 0; background: var(--tint); color: var(--purple-dark); border: 1px solid color-mix(in srgb,var(--purple) 24%,transparent); border-radius: 4px; font-size: 11px; font-weight: 650; letter-spacing: .02em; }
.flash-carousel { max-width: 1456px; margin: 27px 4.5% 0; border: 1px solid var(--line); border-radius: 13px; overflow: hidden; background: var(--surface); box-shadow: inset 0 1px #B8CBE31A; }
.flash-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 17px 25px; border-bottom: 1px solid var(--line); }
.flash-heading h2, .flash-heading h3 { font-size: 19px; font-weight: 650; margin: 0; }
.flash-heading p { color: var(--muted); font-size: 12px; margin: 0; }
.flash-slide { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); min-height: 270px; overflow: hidden; }
.flash-slide[hidden] { display: none!important; }
.flash-copy { position: relative; z-index: 1; padding: 27px 31px; background: linear-gradient(125deg,var(--surface),var(--surface-raised)); }
.flash-copy h2, .flash-copy h3 { font-size: clamp(1.65rem,2.4vw,2.4rem); font-weight: 600; line-height: 1.15; margin: 12px 0; letter-spacing: -.035em; overflow-wrap: anywhere; }
.flash-copy p { color: var(--muted); font-size: 13px; line-height: 1.6; margin-bottom: 13px; }
.flash-copy .flash-vehicle { color: var(--ink); font-size: 16px; font-weight: 600; }
.flash-status { display: inline-flex; align-items: center; gap: 8px; color: var(--purple-dark); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; font-weight: 600; }
.flash-status::before { content: ''; width: 5px; height: 5px; border-radius: 50%; background: var(--purple); box-shadow: 0 0 10px color-mix(in srgb,var(--purple) 45%,transparent); }
.flash-discount { display: inline-flex; border: 1px solid color-mix(in srgb,var(--purple) 35%,transparent); background: var(--tint); color: var(--purple-dark); font-size: 13px; font-weight: 700; border-radius: 5px; padding: 5px 8px; }
.flash-price { margin: 15px 0; }
.flash-price .price-discount { display: none; }
.flash-price .price-main { font-size: 27px; }
.flash-price .price-ht { font-size: 13px; }
.flash-price .price-original { font-size: 12px; }
.flash-countdown, .flash-copy .flash-countdown { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums; margin: 4px 0 12px; }
.flash-image { position: relative; display: block; padding: 0; border: 0; background: var(--surface-raised); min-width: 0; min-height: 260px; overflow: hidden; }
.flash-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.flash-image:hover img { transform: scale(1.035); }
.flash-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 15px; min-height: 43px; border: 1px solid var(--line); border-radius: 7px; background: var(--nav-active); color: var(--nav-active-text); font-size: 13px; font-weight: 600; }
.flash-button:hover { filter: brightness(1.08); }
.flash-controls { display: flex; align-items: center; justify-content: center; gap: 11px; padding: 11px 22px; background: var(--surface); border-top: 1px solid var(--line); }
.flash-controls>button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; min-width: 40px; padding: 8px 12px; border-radius: 6px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font-size: 12px; }
.flash-controls>button:hover { background: var(--surface-hover); }
.flash-controls svg { width: 16px; height: 16px; }
.flash-dots { display: flex; align-items: center; justify-content: center; gap: 0; flex-wrap: wrap; }
.flash-dot { display: grid; place-items: center; width: 28px; height: 36px; padding: 0; border: 0; background: transparent; color: var(--muted); }
.flash-dot::after { content: ''; width: 6px; height: 6px; border: 1px solid var(--muted); border-radius: 50%; }
.flash-dot.selected::after, .flash-dot.is-active::after, .flash-dot[aria-current=true]::after, .flash-dot[aria-pressed=true]::after { background: var(--purple); border-color: var(--purple); width: 8px; height: 8px; }
@keyframes flash-appear { from { opacity: .65; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
@media(prefers-reduced-motion:no-preference) { .flash-slide:not([hidden]) { animation: flash-appear .35s ease-out; } }
@media(min-width:1600px) { .flash-carousel { margin: 27px auto 0; } }
@media(max-width:900px) { .promotions-heading { flex-direction: column; gap: 15px; } .flash-copy { padding: 25px; } .flash-copy h2, .flash-copy h3 { font-size: 1.8rem; } }
@media(max-width:720px) {
  .promotion-row { padding: 19px; flex-direction: column; align-items: stretch; gap: 18px; }
  .promotion-row-actions { flex-direction: row; } .promotion-row-actions .button { flex: 1; }
  .promotions-heading .button { width: 100%; }
  .promotion-row-title h3 { font-size: 18px; }
  .promotion-preview-prices { grid-template-columns: 1fr; gap: 13px; }
  .promotion-preview-arrow { display: none; }
  .flash-carousel { margin: 23px 5% 0; }
  .flash-heading { padding: 15px 19px; } .flash-heading h2, .flash-heading h3 { font-size: 17px; }
  .flash-slide { grid-template-columns: 1fr; }
  .flash-copy { padding: 22px; }
  .flash-image { min-height: 195px; max-height: 240px; }
  .flash-image img { min-height: 195px; max-height: 240px; }
  .flash-price .price-main { font-size: 25px; }
  .flash-controls { padding: 10px 14px; gap: 7px; flex-wrap: wrap; }
  .flash-controls>button { padding: 8px 10px; }
}
@media(prefers-reduced-motion:reduce) { .flash-image:hover img { transform: none; } .flash-slide, .flash-image img { animation: none!important; transition: none!important; } }