/* =====================================================================
   Pelagic State — Light theme "premium" finish (proof, 29 Oct 2026)
   Requested by Rosco: the light theme read flat. Light counterpart of the
   dark navy-glass / metal-rim / electric-cyan look: pearl surfaces, a fine
   metallic rim with an electric glint, pearl
   buttons, sapphire for the selected state, letter-spaced field labels.
   Loaded after theme-light.css; remove the <link> to return to the plain
   light theme. Light theme only; dark theme untouched.
   ===================================================================== */
body.theme-light {
  --ps-pearl: linear-gradient(180deg, #ffffff 0%, #f6f9fc 55%, #edf3f8 100%);
  --ps-rim: linear-gradient(155deg, #c9eeff 0%, #dfe7ee 22%, #b9c7d3 55%, #e7eef4 78%, #6fd0ff 100%);
  --ps-lift: inset 0 1px 0 rgba(255,255,255,.95), 0 22px 48px -18px rgba(9,38,66,.42), 0 6px 14px rgba(9,38,66,.10), 0 0 0 .5px rgba(53,191,255,.10);
  --ps-btn: linear-gradient(180deg, #ffffff 0%, #eef4f9 100%);
  --ps-btn-line: #c3d3df;
  --ps-btn-shadow: inset 0 1px 0 #ffffff, 0 1px 2px rgba(15,42,64,.14), 0 2px 6px -2px rgba(15,42,64,.12);
  --ps-sapphire: linear-gradient(180deg, #3fb2f2 0%, #1488d6 52%, #0b67ad 100%);
  --ps-sapphire-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -1px 0 rgba(4,40,72,.35), 0 0 0 1px #0b6aa8, 0 3px 10px -2px rgba(13,120,198,.55);
  --ps-ink: #0b2236;
  --ps-label: #3f6580;
}

/* ---- Card surfaces: catch card / mark details, mark popup, bottom card ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-mark-details-dialog, .leaflet-popup-content-wrapper, .ps-lite-bg-panel) {
  background: var(--ps-pearl) padding-box, var(--ps-rim) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-lift) !important;
  color: var(--ps-ink) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog { border-radius: 20px !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .leaflet-popup-content-wrapper { border-radius: 18px !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .leaflet-popup-tip {
  background: #eef4f9 !important;
  box-shadow: 0 6px 12px rgba(9,38,66,.12) !important;
}

/* ---- Type ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog h2 {
  color: var(--ps-ink) !important; font-weight: 800 !important; letter-spacing: -.01em;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog > form > p:not([role="status"]):not(.ps-catch-time-note) {
  color: #4e6679 !important; font-size: 13px;
}
/* Field labels: small letter-spaced caps, the inputs keep normal text. */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog form > label,
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog .ps-fish-picker-title {
  color: var(--ps-label) !important; font-size: 11.5px !important; font-weight: 700 !important;
  letter-spacing: .09em !important; text-transform: uppercase !important; margin-top: 14px;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-details-dialog :is(input, select, textarea) {
  text-transform: none !important; letter-spacing: normal !important; font-weight: 500 !important;
}

/* ---- Fields ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-mark-details-dialog, .mark-popup) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%) !important;
  border: 1px solid #c6d5e0 !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 2px rgba(15,42,64,.07), 0 1px 0 rgba(255,255,255,.9) !important;
  color: var(--ps-ink) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-mark-details-dialog, .mark-popup) :is(input, select, textarea):focus {
  border-color: #35bfff !important;
  box-shadow: 0 0 0 3px rgba(53,191,255,.22), inset 0 1px 2px rgba(15,42,64,.05) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup input[type="text"] { font-weight: 700 !important; }

/* ---- Saved conditions panel: recessed ice panel with an electric edge ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-snapshot {
  background: linear-gradient(180deg, #f0f6fa 0%, #e8f1f7 100%) !important;
  border: 1px solid #d3e1ea !important;
  border-left: 3px solid #35bfff !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 3px rgba(15,42,64,.06) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-mark-snapshot strong { color: var(--ps-ink) !important; }

/* ---- Buttons: pearl, sapphire when selected/primary ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.mark-popup-actions button, .ps-mark-details-actions button, .ps-sst-view-btn) {
  background: var(--ps-btn) !important;
  border: 1px solid var(--ps-btn-line) !important;
  border-radius: 11px !important;
  box-shadow: var(--ps-btn-shadow) !important;
  color: #0a5f97 !important;
  font-weight: 600 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.mark-popup-actions button, .ps-mark-details-actions button, .ps-sst-view-btn):hover {
  background: linear-gradient(180deg, #ffffff 0%, #e3f2fc 100%) !important; border-color: #8fcdf0 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-sst-view-btn[aria-pressed="true"], .ps-mark-details-actions button:last-child, .mark-popup-actions button.done) {
  background: var(--ps-sapphire) !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-sapphire-shadow) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(4,40,72,.35) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup-actions button.delete {
  background: linear-gradient(180deg, #fff8f7 0%, #fde9e7 100%) !important;
  border-color: #f0b9b3 !important; color: #b42318 !important;
}

/* ---- Mark popup: pearl type buttons, sapphire for the chosen type ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup .mark-type-btn {
  background: linear-gradient(180deg, #ffffff 0%, #e9f0f6 100%) !important;
  border: 1px solid var(--ps-btn-line) !important;
  box-shadow: var(--ps-btn-shadow) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup .mark-type-btn svg :is(path, circle, rect, polygon, ellipse) { fill: #1d4664 !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup .mark-type-btn.active {
  background: var(--ps-sapphire) !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-sapphire-shadow), 0 0 0 3px rgba(53,191,255,.28) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup .mark-type-btn.active svg :is(path, circle, rect, polygon, ellipse) { fill: #ffffff !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-popup .mark-popup-coords { color: #4e6679 !important; font-variant-numeric: tabular-nums; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .leaflet-popup:has(.mark-popup) .leaflet-popup-close-button { color: #4e6679 !important; }

/* ---- Bottom card ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-bg-panel { border-radius: 20px !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-bg-name { color: var(--ps-ink) !important; font-weight: 800 !important; letter-spacing: -.01em; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-bg-age {
  color: #0a5f97 !important; background: #e6f4fc; border: 1px solid #bfe3f7;
  border-radius: 999px; padding: 1px 8px; font-size: 11.5px !important; font-weight: 600; vertical-align: 2px;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-key-end { color: var(--ps-ink) !important; font-weight: 700 !important; font-variant-numeric: tabular-nums; }

/* =====================================================================
   Roll-out to every light-theme window (Rosco approved the proof, 29 Oct)
   ===================================================================== */
/* ---- Window and panel surfaces ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-modal, .wptmgr-modal, .credits-modal, .ps-custom-dialog, .ps-delete-dialog, .ps-feedback-dialog, .ps-signout-confirm, .ps-upgrade-card, .ps-welcome-card, .ps-custom-editor, .ps-custom-dock, .ps-pro-dock, .ps-lite-sheet-panel, .active-trip-quickswitch, .new-trip-panel, .coord-search-panel, .mobile-measure-bar, .draw-toolbox, .offline-info, .offline-finder-panel) {
  background: var(--ps-pearl) padding-box, var(--ps-rim) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-lift) !important;
  color: var(--ps-ink) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .layer-panel:not(.fully-collapsed) {
  background: var(--ps-pearl) padding-box, var(--ps-rim) border-box !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-lift) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-modal, .wptmgr-modal, .credits-modal, .ps-delete-dialog, .ps-upgrade-card, .ps-welcome-card) { border-radius: 20px !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-sheet-panel { border-bottom: 0 !important; }


/* ---- Headings and section labels ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-modal-header, .wptmgr-header, .ps-custom-dialog h2, .ps-custom-editor h2, .ps-delete-title, .ps-feedback-form h2, .ps-signout-confirm h2, .ps-upgrade-title, .ps-welcome-card h1, .desktop-measure-header, .layer-panel-title, .layer-panel-header-title-text, .ps-lite-sheet-title h2) {
  color: var(--ps-ink) !important; font-weight: 800 !important; letter-spacing: -.01em;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-modal-header, .wptmgr-header) {
  border-bottom: 1px solid rgba(15,42,64,.08) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.9), rgba(255,255,255,0)) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-offline-reminder .ps-upgrade-title,
html body.theme-light.theme-light.theme-light.theme-light.theme-light .offline-info :is(h2, h3, strong:first-child) { color: #8a5300 !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-group-label, .settings-group-title, .ps-sheet-strip-head span:first-child, .ps-sheet-group-head span:first-child, .ps-custom-sechead) {
  color: var(--ps-label) !important; font-weight: 700 !important; letter-spacing: .09em !important;
}

/* ---- Settings hub rows: pearl tiles with an electric chevron ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .settings-hub-row {
  background: var(--ps-btn) !important;
  border: 1px solid #d3e0ea !important;
  border-radius: 14px !important;
  box-shadow: var(--ps-btn-shadow) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .settings-hub-row:hover {
  background: linear-gradient(180deg, #ffffff 0%, #e6f4fc 100%) !important; border-color: #9fd6f3 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .settings-hub-row strong { color: var(--ps-ink) !important; font-weight: 700 !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .settings-hub-chevron { color: #1b9fe6 !important; font-weight: 700; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .settings-hub-intro { color: var(--ps-label) !important; letter-spacing: .09em; text-transform: uppercase; font-weight: 700 !important; font-size: 11.5px !important; }

/* ---- Buttons everywhere: pearl secondary, sapphire primary, rose danger ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.settings-system-action, .temp-scale-reset, .trip-set-active-btn, .coord-search-paste, .waypoint-new-trip-btn:not(.primary), .active-trip-create-btn, .active-trip-cancel-btn, .ps-account-btn:not(.primary):not(.ps-danger), .ps-custom-dialog button:not(.ps-custom-primary):not(.ps-custom-danger), .ps-custom-editfoot button:not(.ps-custom-primary):not(.ps-custom-danger), .ps-feedback-actions button:not(.primary), .ps-signout-confirm button, .offline-progress-cancel, .offline-finder-buttons button:not(.offline-finder-go), .mobile-measure-bar button:not(.mobile-measure-done), .ps-mark-visibility-toolbar button, .wpt-popup-actions button:not(.delete), .query-copy-btn, .query-share-btn, .query-gpx-btn, .query-waypoint-btn, .query-mark-btn, .ps-delete-cancel, .wptmgr-footer button, .ps-catch-toolbar .ps-catch-export) {
  background: var(--ps-btn) !important;
  border: 1px solid var(--ps-btn-line) !important;
  box-shadow: var(--ps-btn-shadow) !important;
  color: #0a5f97 !important;
  font-weight: 600 !important;
  text-shadow: none !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-custom-primary, .ps-feedback-actions .primary, .mobile-measure-done, .coord-search-go, .ps-account-btn.primary, .offline-finder-buttons .offline-finder-go, .wptmgr-modal .waypoint-new-trip-btn.primary, .query-done-btn, .wptmgr-footer .wptmgr-export-all-btn:last-child:not(:disabled)) {
  background: var(--ps-sapphire) !important;
  border: 1px solid transparent !important;
  box-shadow: var(--ps-sapphire-shadow) !important;
  color: #ffffff !important;
  text-shadow: 0 1px 0 rgba(4,40,72,.35) !important;
  font-weight: 700 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-custom-danger, .ps-account-btn.ps-danger, .wpt-popup-actions button.delete, .ps-delete-confirm) {
  background: linear-gradient(180deg, #fff8f7 0%, #fde5e2 100%) !important;
  border: 1px solid #efb2ab !important;
  box-shadow: inset 0 1px 0 #ffffff, 0 1px 2px rgba(120,20,10,.12) !important;
  color: #b42318 !important;
  font-weight: 700 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(button, .ps-account-btn):disabled:is(.wptmgr-export-all-btn, .ps-catch-export) {
  background: #eef3f7 !important; color: #8796a3 !important; box-shadow: none !important; border-color: #d6e0e8 !important;
}

/* ---- Fields everywhere ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light :is(.ps-custom-dialog, .ps-custom-editor, .ps-delete-dialog, .ps-feedback-dialog, .ps-signout-confirm, .wptmgr-modal, .settings-modal, .coord-search-panel, .new-trip-panel, .active-trip-quickswitch, .ps-mark-visibility-toolbar) :is(input:not([type="range"]):not([type="radio"]):not([type="checkbox"]), select, textarea) {
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfd 100%) !important;
  border: 1px solid #c6d5e0 !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 2px rgba(15,42,64,.07), 0 1px 0 rgba(255,255,255,.9) !important;
  color: var(--ps-ink) !important;
}

/* ---- Delete confirm: warning badge ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-delete-warning {
  background: radial-gradient(circle at 50% 35%, #fff 0%, #fdebe8 70%) !important;
  border: 1px solid #efb2ab !important; color: #c0352a !important;
  box-shadow: 0 0 0 4px rgba(239,84,68,.10), 0 4px 10px -2px rgba(150,30,20,.25) !important;
}

/* ---- Chart background tiles (Lite sheet) and Layers rows ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-tile {
  background: var(--ps-btn) !important;
  border: 1px solid #d3e0ea !important;
  border-radius: 14px !important;
  box-shadow: var(--ps-btn-shadow) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-tile[aria-pressed="true"] {
  background: linear-gradient(180deg, #ffffff 0%, #e3f3fd 100%) !important;
  border: 1px solid #35bfff !important;
  box-shadow: 0 0 0 3px rgba(53,191,255,.22), 0 6px 14px -6px rgba(13,120,198,.45) !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-lite-sheet-grip { background: linear-gradient(90deg, #b8c7d3, #35bfff, #b8c7d3) !important; }

/* ---- Marks / Trips manager rows ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-row .ps-mark-name {
  background: linear-gradient(180deg, #ffffff 0%, #f6f9fc 100%) !important;
  border: 1px solid #d3e0ea !important; border-radius: 10px !important; font-weight: 600 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .mark-type-header { color: var(--ps-ink) !important; font-weight: 800 !important; }
html body.theme-light.theme-light.theme-light.theme-light.theme-light .wptmgr-footer { background: linear-gradient(180deg, rgba(237,243,248,0), #e9f1f7) !important; border-top: 1px solid rgba(15,42,64,.08) !important; }

/* ---- Query popup (tap on chart) ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-query-leaflet-popup .leaflet-popup-content-wrapper { border-radius: 18px !important; }

/* ---- SST row Front Guide toggle: pearl when off, electric rim when on ---- */
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-front-guide-btn {
  background: var(--ps-btn) !important;
  border: 1px solid var(--ps-btn-line) !important;
  border-radius: 11px !important;
  box-shadow: var(--ps-btn-shadow) !important;
  color: #0a5f97 !important;
  font-weight: 600 !important;
}
html body.theme-light.theme-light.theme-light.theme-light.theme-light .ps-front-guide-btn:is([data-mode="pinned"], [data-mode="layer"]) {
  background: linear-gradient(180deg, #ffffff 0%, #e3f3fd 100%) !important;
  border: 1px solid #35bfff !important;
  box-shadow: 0 0 0 3px rgba(53,191,255,.22), inset 0 1px 0 #fff !important;
  color: #075f94 !important;
}