/* The light theme is the approved design. Dark mode changes colour only. */
html[data-theme="dark"] {
  color-scheme: dark;
  --blue: #315cf5;
  --blue-hover: #3b63f5;
  --blue-light: #303030;
  --ink: #f1f1ef;
  --muted: #b4b4b1;
  --line: #383838;
  --canvas: #292929;
  --white: #fff;
  --sender: #454545;
  --sender-ink: #d4d4d1;
  --sender-soft: #252525;
  --courier: #315cf5;
  --courier-ink: #b5c7ff;
  --courier-soft: #303030;
  --theme-bg: #141414;
  --theme-surface: #1e1e1e;
  --theme-raised: #292929;
  --theme-input: #191919;
  --theme-border: #777777;
  --theme-link: #a9bdff;
  --theme-error: #ffb0ab;
  --theme-error-bg: #392227;
  --theme-success: #a5e0bf;
  --theme-success-bg: #1c382d;
  color: var(--ink);
  background: var(--theme-bg);
}
html[data-theme="dark"] body {
  color: var(--ink);
  background: var(--theme-bg);
}
html[data-theme="dark"] ::selection { color: #fff; background: #444444; }
html[data-theme="dark"] :is(.header,.footer) { border-color: var(--line); }
html[data-theme="dark"] .header { background: var(--theme-bg); }
html[data-theme="dark"] :is(.header-nav,.login-button,.listing-view,.type-tabs) {
  background: var(--theme-surface);
  border-color: var(--line);
  color: var(--ink);
}
html[data-theme="dark"] :is(.header-nav .active,.button-quiet,.icon-button,.acp-close) {
  color: var(--ink);
  background: var(--theme-raised);
  border-color: var(--theme-border);
}
html[data-theme="dark"] :is(.nav-link,.header-publish,.footer .footer-brand,.account-name) { color: var(--ink); }
html[data-theme="dark"] :is(.nav-link:hover,.text-link,.composer-add,.composer-small,.sender-request-text,.acp-text-button) { color: var(--theme-link); }
html[data-theme="dark"] :is(.button-outline,.filter-button,.sender-request-action,.listing-kind-choice,.acp-edit-button) {
  color: var(--ink);
  background: var(--theme-surface);
  border-color: var(--theme-border);
}
html[data-theme="dark"] :is(.button-outline,.button-quiet,.icon-button,.filter-button,.sender-request-action,.listing-kind-choice,.acp-edit-button):hover {
  color: var(--ink);
  background: var(--theme-raised);
  border-color: #858585;
}
html[data-theme="dark"] :is(.button-primary,.acp-create-button) { background: var(--blue); color: #fff; }
html[data-theme="dark"] :is(.button-primary,.acp-create-button):hover { background: var(--blue-hover); color: #fff; }
html[data-theme="dark"] button:disabled { opacity: .6; box-shadow: none; }
html[data-theme="dark"] :is(button,a,input,select,textarea,summary,[tabindex]):focus-visible { outline-color: var(--theme-link); }
html[data-theme="dark"] :is(.login-button.auth-loading,.empty-icon) { background: var(--theme-raised); color: var(--muted); }

/* Keep the photograph and its crop; protect the text with a quiet overlay. */
html[data-theme="dark"] body[data-intent] .hero-area { background: #202020; border-color: #414141; }
html[data-theme="dark"] body[data-intent] .hero-area::after {
  background: linear-gradient(90deg,#171717ed 0%,#171717d9 46%,#1717178c 78%,#17171752 100%);
}
html[data-theme="dark"] :is(.hero-title,.hero-title span) { color: #f5f5f2; }
html[data-theme="dark"] body[data-intent] .hero-area .hero-description { color: #d7d7d4; }
html[data-theme="dark"] .hero-area .intent-switch { background: #232323ed; border-color: #666666; box-shadow: none; }
html[data-theme="dark"] .intent-switch [data-intent] { background: transparent; color: #d7d7d4; }
html[data-theme="dark"] .intent-switch [data-intent="sender"][aria-pressed="true"] { background: var(--sender); color: #fff; }
html[data-theme="dark"] .intent-switch [data-intent="courier"][aria-pressed="true"] { background: var(--blue); color: #fff; }
html[data-theme="dark"] .hero-area .search {
  color: var(--ink);
  background: #202020ed;
  border-color: var(--theme-border);
  box-shadow: inset 0 1px 0 #ffffff0d,0 8px 24px #00000026;
}
html[data-theme="dark"] .search-field { background: transparent; color: var(--ink); border-color: #555555; }
html[data-theme="dark"] .search-field:hover { background: #ffffff0b; }
html[data-theme="dark"] :is(.field-value,.date-trigger .field-value) { color: var(--ink); }
html[data-theme="dark"] :is(.field-value.is-placeholder,.field-label,.field-symbol,.quick-label,.search-hint) { color: #c0c0bc; }
html[data-theme="dark"] .date-trigger::before { background: #555555; }
html[data-theme="dark"] .swap { background: var(--theme-raised); color: #dadad6; border-color: #696969; }
html[data-theme="dark"] .swap:hover { color: #fff; background: #363636; }
html[data-theme="dark"] .hero-area :is(.route-chip,.search-hint,.hero-eyebrow,.sender-request-action),
html[data-theme="dark"] .intent-actions .text-link {
  background: #222222ed;
  border-color: #696969;
  color: #e1e1dd;
}
html[data-theme="dark"] .hero-area :is(.route-chip,.sender-request-action):hover { background: #303030; color: #fff; border-color: #888888; }
html[data-theme="dark"] .intent-actions p { background: #222222ed; color: #d7d7d4; }
html[data-theme="dark"] .sender-request-action span { color: #d2d2ce; background: #333333; }
html[data-theme="dark"] body[data-intent="courier"] #courier-my-listings { background: #303030de; color: #eeeeeb; border-color: #888888; }

/* Neutral catalogue surfaces. Flags and photos keep their original colours. */
html[data-theme="dark"] :is(.courier-offer,.sender-offer,.empty-state,.listing-card,.acp-card) {
  background: var(--theme-surface);
  border-color: var(--line);
  color: var(--ink);
  box-shadow: none;
}
html[data-theme="dark"] :is(.courier-identity,.courier-name,.sender-offer-person strong,.courier-key-fact,.sender-offer-shipment,.courier-extra-cities,.sender-detail-facts) { color: var(--ink); }
html[data-theme="dark"] :is(.courier-avatar,.sender-offer-avatar,.account-avatar,.acp-avatar,.auth-profile-avatar) { background: #303030; color: #c3d2ff; }
html[data-theme="dark"] :is(.courier-offer .transport-badge,.courier-detail .transport-badge,.courier-own-label) { background: #303030; color: #b9ccff; }
html[data-theme="dark"] :is(.sender-offer-kind,.courier-offer .offer-categories li,.offer-categories li,.acp-status) { background: var(--theme-raised); color: #d1d1ce; }
html[data-theme="dark"] .courier-more-categories { color: #e2e2de!important; }
html[data-theme="dark"] :is(.courier-review-state,.sender-offer-person>span,.courier-extra-label,.courier-return-route,.courier-return-date,.courier-contact-hint,.engagement-note,.sender-offer-description,.sender-offer-facts,.sender-detail-hint,.sender-detail .gated-contact-body p,.listing-author,.listing-kind,.courier-detail-facts,.offer-timeline-copy>span,.courier-meeting-place) { color: var(--muted); }
html[data-theme="dark"] .courier-detail .offer-timeline-copy .city-with-flag { color: var(--ink); }
html[data-theme="dark"] .offer-timeline-dot { background: var(--theme-surface); border-color: #a9bdff; }
html[data-theme="dark"] .offer-timeline-stop:not(:last-child)::after { background: #666666; }
html[data-theme="dark"] :is(.courier-key-fact,.sender-offer-facts,.sender-offer-shipment,.sender-detail-facts,.courier-extra-row) .listing-icon { color: #bdbdb9; }
html[data-theme="dark"] :is(.offer-route-arrow,.courier-offer-route .offer-route-arrow,.sender-offer-route .offer-route-arrow) { color: #aaaaa6; }
html[data-theme="dark"] :is(.courier-offer-footer,.sender-offer-footer,.courier-extra-locations,.courier-key-fact+.courier-key-fact,.courier-offer-facts .offer-categories,.courier-contact-section,.engagement-section,.sender-detail-section,.offer-detail-section,.courier-return-cities,.courier-offer-route>.city-with-flag:last-child) { border-color: var(--line); }
html[data-theme="dark"] .listing-flag { box-shadow: 0 0 0 1px #b7c9e52e; }
html[data-theme="dark"] :is(.listing-view button,.type-tab) { color: var(--muted); }
html[data-theme="dark"] :is(.listing-view button,.type-tab):hover { background: var(--theme-raised); color: var(--ink); }
html[data-theme="dark"] :is(.listing-view button,.type-tab)[aria-pressed="true"] { background: #363636; color: #c6d4ff; }
html[data-theme="dark"] .save-listing-button { background: var(--theme-raised); color: #c4c4c0; }
html[data-theme="dark"] .save-listing-button:hover { background: #363636; color: #eeeee9; }
html[data-theme="dark"] .save-listing-button[aria-pressed="true"] { background: #363636; color: #b7caff; }
html[data-theme="dark"] .save-listing-button[aria-pressed="true"] svg { fill: #a9bdff26; }
html[data-theme="dark"] .engagement-actions .button[aria-pressed="true"] { background: #363636; color: #c6d4ff; border-color: #888888; }
html[data-theme="dark"] .sender-offer-footer .sender-view { background: transparent; color: #c9c9c5; }
html[data-theme="dark"] .clear-route-search { color: var(--muted); }
html[data-theme="dark"] .clear-route-search:hover { background: var(--theme-raised); color: var(--ink); }

/* These components are also loaded lazily, so use their component selectors. */
html[data-theme="dark"] :is(dialog,.route-builder,.sender-request-dialog,.acp-dialog,.editor-status-dialog,.sender-detail,.courier-detail) {
  color: var(--ink);
  background: var(--theme-surface);
  border-color: var(--theme-border);
  box-shadow: 0 24px 80px #0006;
}
html[data-theme="dark"] dialog::backdrop { background: #000000a6; }
html[data-theme="dark"] :is(.date-footer,.dialog-header,.auth-dialog .auth-top,.composer-header,.composer-footer,.sender-request-header,.sender-request-footer,.acp-header,.acp-toolbar,.acp-tabs,.acp-footer,.listing-action-dialog .editor-status-actions,.courier-detail .offer-detail-top,.sender-detail .sender-detail-top) {
  background: var(--theme-surface);
  color: var(--ink);
  border-color: var(--line);
  box-shadow: none;
}
html[data-theme="dark"] :is(.composer-stop,.courier-own-actions,.sender-detail-facts,.composer-telegram-account,.sender-request-identity) { background: var(--theme-input); color: var(--ink); border-color: var(--theme-border); }
html[data-theme="dark"] :is(.composer-contacts,.composer-advanced,.composer-return,.sender-request-contacts,.acp-confirm,.listing-action-dialog>h2,.composer-policy) { border-color: var(--line); }
html[data-theme="dark"] :is(.dialog-subtitle,.auth-privacy,.composer-label,.composer-kicker,.composer-input-hint,.composer-contact-warning,.composer-policy,.composer-save,.composer-advanced>summary,.composer-stop-details>summary,.sender-request-label,.sender-request-kicker,.sender-request-hint,.sender-request-policy,.sender-request-save,.sender-request-consent,.acp-profile-name,.acp-meta,.acp-description,.acp-review-note,.acp-response-time,.acp-listing-kind,.acp-announcement,.acp-empty p,.acp-loading,.listing-kind-choice span) { color: var(--muted); }
html[data-theme="dark"] .composer-description>.composer-label { color: var(--ink); }
html[data-theme="dark"] .auth-extra .account-setting { background: var(--theme-input); color: var(--ink); border-color: var(--theme-border); }
html[data-theme="dark"] :is(.cargo-choice,.composer-chip):has(input:checked),
html[data-theme="dark"] .choice-chip input:checked+span { background: #303030; color: #c6d4ff; border-color: #888888; }
html[data-theme="dark"] .auth-extra .auth-logout { background: var(--theme-surface); color: #c4c4c0; border-color: var(--theme-border); }
html[data-theme="dark"] .auth-extra .auth-logout:hover { background: var(--theme-error-bg); color: var(--theme-error); border-color: #a66b70; }
html[data-theme="dark"] .acp-tab { color: var(--muted); }
html[data-theme="dark"] .acp-tab[aria-selected="true"] { color: #bccdff; }
html[data-theme="dark"] .acp-tab[aria-selected="true"]::after { background: #89a7ff; }
html[data-theme="dark"] .acp-card-actions>.acp-text-button { color: #c4c4c0; }
html[data-theme="dark"] .acp-status[data-state="pending"] { background: #303030; color: #c6d4ff; }
html[data-theme="dark"] .acp-status[data-state="published"] { background: var(--theme-success-bg); color: var(--theme-success); }
html[data-theme="dark"] .acp-status[data-state="rejected"] { background: var(--theme-error-bg); color: var(--theme-error); }
html[data-theme="dark"] .acp-confirm-button { background: #a8373d; border-color: #bc5960; color: #fff; }
html[data-theme="dark"] .acp-confirm-button:hover { background: #bd424a; }

/* Native controls follow color-scheme, including number/date pickers. */
html[data-theme="dark"] :is(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea,.composer-picker,.composer-weight,.composer-chip,.sender-request-picker,.choice-chip span,.city-query-box) {
  color: var(--ink);
  background: var(--theme-input);
  border-color: var(--theme-border);
}
html[data-theme="dark"] :is(input,textarea)::placeholder { color: #aaaaa6; opacity: 1; }
html[data-theme="dark"] :is(input,select,textarea):disabled { color: #a0a09c; background: #252525; border-color: var(--line); }
html[data-theme="dark"] :is(input[type="checkbox"],input[type="radio"],input[type="range"]) { accent-color: #89a7ff; }
html[data-theme="dark"] option { background: var(--theme-input); color: var(--ink); }
html[data-theme="dark"] .city-query-box:focus-within { border-color: #8da9ff; box-shadow: 0 0 0 3px #8da9ff20; }
html[data-theme="dark"] :is(.composer-picker,.sender-request-picker):hover { background: #303030; border-color: #999999; }
html[data-theme="dark"] .composer-value.is-empty { color: #aaaaa6; }
html[data-theme="dark"] :is(.composer-advanced>summary,.composer-stop-details>summary,.sender-request-contacts>summary) { color: #ccccca; }

/* Country/city selection and calendar selected, range and disabled states. */
html[data-theme="dark"] :is(.country-choice,.country-regions button,.city-country-code,.date-quick button) { background: var(--theme-input); color: var(--ink); border-color: var(--theme-border); }
html[data-theme="dark"] :is(.country-choice:hover,.city-option:hover,.city-option:focus-visible,.country-regions button[aria-pressed="true"],.date-quick button:hover,.date-quick button[aria-pressed="true"]) { background: #303030; color: #dbe5ff; border-color: #888888; }
html[data-theme="dark"] :is(.country-count,.city-option-country,.city-list-heading,.country-section h3,.calendar-prompt,.weekdays,.weekdays span,.date-footer p) { color: var(--muted); }
html[data-theme="dark"] :is(.city-option .icon,.city-query-box .icon,.category-options .listing-icon) { color: #c4c4c0; }
html[data-theme="dark"] .date-selection-tabs { background: var(--theme-input); }
html[data-theme="dark"] .date-mode { color: var(--muted); }
html[data-theme="dark"] .date-mode[aria-pressed="true"] { background: #303030; color: #cbd9ff; box-shadow: none; }
html[data-theme="dark"] :is(.calendar-day,.calendar-navigation .icon-button) { color: var(--ink); background: transparent; }
html[data-theme="dark"] :is(.calendar-day:hover:not(:disabled),.calendar-navigation .icon-button:hover:not(:disabled)) { background: #363636; color: #e5edff; }
html[data-theme="dark"] :is(.calendar-cell.is-between,.calendar-cell.range-start,.calendar-cell.range-end) { background: #303030; }
html[data-theme="dark"] .calendar-day.is-selected { background: var(--blue); color: #fff; }
html[data-theme="dark"] .calendar-day.is-selected:hover:not(:disabled) { background: var(--blue-hover); color: #fff; }
html[data-theme="dark"] :is(.calendar-day,.calendar-navigation .icon-button):disabled { color: #8a8a86; background: transparent; }
html[data-theme="dark"] .calendar-day.is-today::after { background: #b0c4ff; }
html[data-theme="dark"] .calendar-day.is-today.is-selected::after { background: #fff; }
html[data-theme="dark"] .date-footer .button:disabled { background: #333333; color: #c0c0bc; }

/* Validation keeps meaning through text and outline, not colour alone. */
html[data-theme="dark"] :is(.search-error,.composer-error,.acp-action-error,.acp-error p) { color: var(--theme-error); }
html[data-theme="dark"] .response-status { color: #d2d2ce; }
html[data-theme="dark"] :is(.composer-errors,.sender-request-errors) { color: var(--theme-error); background: var(--theme-error-bg); border-color: #8d515a; }
html[data-theme="dark"] :is(input,select,textarea,.composer-picker,.sender-request-picker)[aria-invalid="true"] { border-color: #ed928f; }
html[data-theme="dark"] :is(.composer-edit-draft,.sender-request-recovery) { color: #d1dfff; background: #292929; border-color: #777777; }
html[data-theme="dark"] .auth-notice { color: #f4d59d; background: #382d1d; border-color: #7a6138; }

@media(max-width:600px) {
  html[data-theme="dark"] body[data-intent] .hero-area::after { background: linear-gradient(125deg,#171717f0 0%,#171717d9 48%,#1717178c 100%); }
}
@media(prefers-reduced-transparency:reduce) {
  html[data-theme="dark"] .hero-area .search,
  html[data-theme="dark"] .hero-area :is(.route-chip,.search-hint,.hero-eyebrow,.sender-request-action,.intent-switch) { background: var(--theme-surface); backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@media(forced-colors:active) {
  html[data-theme="dark"] { color-scheme: light dark; }
}