/* ───────────────────────── SendMe dark mode ─────────────────────────
   Switched on by <html class="dark"> (Light / Dark / Auto toggle in the account menu).
   1) colour tokens   2) shared components   3) fields   4) maps   5) generated page overrides */

html.dark {
    color-scheme: dark;
    --sm-bg: #0E0D14;
    --d-surface: #17151F; --d-surface-rgb: 23 21 31;
    --d-raised: #1E1B29;
    --c-ink: 237 235 246;  --c-muted: 158 153 182;  --c-inkbg: 46 42 70;
    --c-lav: 37 34 50;     --c-lav100: 41 38 55;    --c-lav200: 58 54 79;
    --c-peach: 56 35 22;   --c-royal-t: 190 172 255; --c-royal-b: 140 116 242;
    --c-danger: 240 98 98; --c-success: 52 199 123;
}
html.dark body { background-color: var(--sm-bg) !important; color: rgb(var(--c-ink)); }
html.dark * { --tw-ring-offset-color: var(--d-surface); }
html.dark ::selection { background: rgba(var(--sm-accent-rgb), .35); }

/* Components from the UI kit (they don't carry utility classes) */
html.dark .card, html.dark .card-pad, html.dark .btn-secondary, html.dark .btn-danger, html.dark .chip, html.dark .input { background-color: var(--d-surface); }
html.dark .chip.chip-on { background-color: var(--sm-primary); border-color: var(--sm-primary); color: #fff; }
html.dark .btn-danger { border-color: #4A2328; }
html.dark .table-basic th { background-color: #1A1726; }
html.dark .table-row-link:hover { background-color: #1D1A29; }
html.dark .shadow-card { box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }

/* Fields without their own background class (Tailwind forms plugin paints them white) */
html.dark :is([type='text'], [type='email'], [type='url'], [type='password'], [type='number'], [type='date'], [type='datetime-local'], [type='month'], [type='search'], [type='tel'], [type='time'], [type='week'], textarea, select):not([class*="bg-"]) {
    background-color: var(--d-surface); color: rgb(var(--c-ink));
}
html.dark :is([type='checkbox'], [type='radio']):not(:checked) { background-color: var(--d-raised); border-color: rgb(var(--c-lav200)); }
html.dark input::placeholder, html.dark textarea::placeholder { color: rgb(var(--c-muted) / .6); }
html.dark input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px var(--d-raised) inset; -webkit-text-fill-color: rgb(var(--c-ink)); }
html.dark dialog { background-color: var(--d-surface); color: rgb(var(--c-ink)); }

/* Maps: invert the light tiles into a calm night map (markers & pins keep their colours) */
html.dark .leaflet-container { background: #15151B; }
html.dark .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(.95) contrast(.86) saturate(.55); }
html.dark .gm-style > div:first-child > div:first-child > div:first-child { filter: invert(1) hue-rotate(180deg) brightness(.95) contrast(.86) saturate(.55); }
html.dark .leaflet-control-attribution { background: rgba(23, 21, 31, .8) !important; color: #8E89A6; }
html.dark .leaflet-control-attribution a { color: #B5B0CB; }
html.dark .leaflet-bar a, html.dark .leaflet-bar a:hover { background: var(--d-surface); color: rgb(var(--c-ink)); border-color: #2A2738; }
html.dark .leaflet-popup-content-wrapper, html.dark .leaflet-popup-tip { background: var(--d-surface); color: rgb(var(--c-ink)); }

/* Splash / preloader */
html.dark #sm-preloader .sm-ring-track { stroke: #2A2738; }
html.dark #sm-preloader .sm-word { color: #EDEBF6; }
html.dark #sm-preloader .sm-tag { color: #9E99B6; }
html.dark #sm-preloader .sm-line { background: #2A2738; }

/* Smooth switch */
html.sm-theme-anim, html.sm-theme-anim * { transition: background-color .3s ease, border-color .3s ease, color .2s ease !important; }

/* Illustrations: light track lines & paper fills */
html.dark [stroke="#F0EDF7"], html.dark [stroke="#ECE8F6"], html.dark [stroke="#F3F0FA"], html.dark [stroke="#E8E2F7"] { stroke: #2A2738; }
html.dark [stroke="#D6CCF0"], html.dark [stroke="#C9D6F2"], html.dark [stroke="#B9AEE0"] { stroke: #3A3650; }
html.dark rect[fill="#fff"], html.dark rect[fill="#FFFFFF"] { fill: var(--d-surface); }
html.dark [fill="#DCD5F0"] { fill: #2E2A42; }
html.dark [fill="#FFF3DF"] { fill: #3A2E1A; }
html.dark .rounded-\[18px\] > svg path[stroke="#fff"] { stroke: rgba(255, 255, 255, .14); }

html.dark .text-royal-500, html.dark .text-royal-700 { color: #A894FF; }
html.dark .hover\:text-royal-500:hover { color: #C4B5FF; }

/* SendMe dark mode — generated from the classes used in resources/views (html.dark). Do not edit by hand. */
:where(html.dark) body .bg-\[\#E5E1F0\]{background-color:#272430}
:where(html.dark) body .bg-\[\#E8F1FE\]{background-color:#162132}
:where(html.dark) body .bg-\[\#E9F7EE\]{background-color:#1E2D23}
:where(html.dark) body .bg-\[\#EAF2FF\]{background-color:#142032}
:where(html.dark) body .bg-\[\#EEEBF6\]{background-color:#231F2B}
:where(html.dark) body .bg-\[\#EEF0F4\]{background-color:#222428}
:where(html.dark) body .bg-\[\#EEF0FA\]{background-color:#1B1E2B}
:where(html.dark) body .bg-\[\#F0EBFF\]{background-color:#1C1431}
:where(html.dark) body .bg-\[\#F3F0FB\]{background-color:#1F1A2B}
:where(html.dark) body .bg-\[\#F4F2F8\]{background-color:#211E27}
:where(html.dark) body .bg-\[\#FAF9FD\]{background-color:#1C1926}
:where(html.dark) body .bg-\[\#FAF9FE\]{background-color:#1A1629}
:where(html.dark) body .bg-\[\#FBFAFD\]{background-color:#1D1A25}
:where(html.dark) body .bg-\[\#FFECF1\]{background-color:#31141C}
:where(html.dark) body .bg-\[\#FFF1E2\]{background-color:#352616}
:where(html.dark) body .bg-\[\#FFF6DD\]{background-color:#372E16}
:where(html.dark) body .bg-\[\#FFF8F1\]{background-color:#2F2113}
:where(html.dark) body .bg-\[\#FFF8F2\]{background-color:#2F2013}
:where(html.dark) body .bg-\[\#FFF9F9\]{background-color:#2C1212}
:where(html.dark) body .bg-\[\#FFFDF7\]{background-color:#2D2612}
:where(html.dark) body .bg-amber-50{background-color:#2F2614}
:where(html.dark) body .bg-gray-100{background-color:#24212F}
:where(html.dark) body .bg-green-50\/40{background-color:rgb(15 42 28 / 0.4)}
:where(html.dark) body .bg-green-50\/50{background-color:rgb(15 42 28 / 0.5)}
:where(html.dark) body .bg-green-50{background-color:#0F2A1C}
:where(html.dark) body .bg-orange-50{background-color:#33221A}
:where(html.dark) body .bg-red-50\/60{background-color:rgb(46 21 24 / 0.6)}
:where(html.dark) body .bg-red-50{background-color:#2E1518}
:where(html.dark) body .bg-slate-100{background-color:#24212F}
:where(html.dark) body .bg-white\/90{background-color:rgb(var(--d-surface-rgb) / 0.9)}
:where(html.dark) body .bg-white\/95{background-color:rgb(var(--d-surface-rgb) / 0.95)}
:where(html.dark) body .bg-white{background-color:var(--d-surface)}
:where(html.dark) body .border-green-100{border-color:#1D4630}
:where(html.dark) body .border-red-100{border-color:#4A2328}
:where(html.dark) body .border-red-200{border-color:#5A2A30}
:where(html.dark) body .focus\:bg-white:focus{background-color:var(--d-surface)}
:where(html.dark) body .from-\[\#D9DCE3\]{--tw-gradient-from:#2C2E32 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#D9DCE3\]{--tw-gradient-to:rgb(44 46 50 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#DCE6FF\]{--tw-gradient-from:#172037 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#DCE6FF\]{--tw-gradient-to:rgb(23 32 55 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#E9E2FB\]{--tw-gradient-from:#211A33 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#E9E2FB\]{--tw-gradient-to:rgb(33 26 51 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#F7F5FC\]{--tw-gradient-from:#1E1928 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#F7F5FC\]{--tw-gradient-to:rgb(30 25 40 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#FFE7D1\]{--tw-gradient-from:#3C2918 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#FFE7D1\]{--tw-gradient-to:rgb(60 41 24 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#FFE7D6\]{--tw-gradient-from:#3A2618 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#FFE7D6\]{--tw-gradient-to:rgb(58 38 24 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .from-\[\#FFF4EC\]{--tw-gradient-from:#312014 var(--tw-gradient-from-position)}
:where(html.dark) body .from-\[\#FFF4EC\]{--tw-gradient-to:rgb(49 32 20 / 0.0) var(--tw-gradient-to-position)}
:where(html.dark) body .hover\:bg-\[\#F4F2F8\]:hover{background-color:#211E27}
:where(html.dark) body .hover\:bg-\[\#F7F5FC\]:hover{background-color:#1E1928}
:where(html.dark) body .hover\:bg-\[\#FAF9FD\]:hover{background-color:#1C1926}
:where(html.dark) body .hover\:bg-\[\#FAF9FE\]:hover{background-color:#1A1629}
:where(html.dark) body .hover\:bg-\[\#FCFBFE\]:hover{background-color:#1C1726}
:where(html.dark) body .hover\:bg-red-100:hover{background-color:#3A1A1E}
:where(html.dark) body .hover\:bg-red-100\/70:hover{background-color:rgb(58 26 30 / 0.7)}
:where(html.dark) body .hover\:bg-red-50:hover{background-color:#2E1518}
:where(html.dark) body .hover\:bg-white:hover{background-color:var(--d-surface)}
:where(html.dark) body .ring-\[\#F7F5FC\]{--tw-ring-color:#383249}
:where(html.dark) body .ring-white{--tw-ring-color:var(--d-surface)}
:where(html.dark) body .text-\[\#0F7B3F\]{color:#8BEEB7}
:where(html.dark) body .text-\[\#1A73E8\]{color:#A8C8F3}
:where(html.dark) body .text-\[\#1B1830\]{color:#ACA7D3}
:where(html.dark) body .text-\[\#5FD39A\]{color:#D7F4E6}
:where(html.dark) body .text-\[\#6B6785\]{color:#BDBBCA}
:where(html.dark) body .text-\[\#B7791F\]{color:#ECC58E}
:where(html.dark) body .text-amber-700{color:#EAB867}
:where(html.dark) body .text-gray-500{color:#A09BB8}
:where(html.dark) body .text-gray-600{color:#B5B0CB}
:where(html.dark) body .text-orange-800{color:#F6B48A}
:where(html.dark) body .text-slate-600{color:#B5B0CB}
:where(html.dark) body .to-\[\#F2F5FF\]{--tw-gradient-to:#13192F var(--tw-gradient-to-position)}
:where(html.dark) body .to-\[\#F7F4FE\]{--tw-gradient-to:#1C152C var(--tw-gradient-to-position)}
:where(html.dark) body .to-\[\#FFF4EC\]{--tw-gradient-to:#312014 var(--tw-gradient-to-position)}
:where(html.dark) body .to-\[\#FFF6EE\]{--tw-gradient-to:#302114 var(--tw-gradient-to-position)}
:where(html.dark) body .to-\[\#FFF8F2\]{--tw-gradient-to:#2F2013 var(--tw-gradient-to-position)}
:where(html.dark) body .to-white{--tw-gradient-to:var(--d-surface) var(--tw-gradient-to-position)}
@media (min-width:640px) {
:where(html.dark) body .sm\:bg-white{background-color:var(--d-surface)}
}