/*! Snugport — css/temas.css
 *
 * The palette structure and the semantic colors of the Nightwatch and Daybreak
 * themes derive from Catppuccin (Mocha and Latte). The values were replaced
 * with our own, but the design debt is acknowledged and the license notice
 * travels with the stylesheet we serve:
 *
 *   Catppuccin — MIT License
 *   Copyright (c) 2021 Catppuccin
 *
 *   Permission is hereby granted, free of charge, to any person obtaining a copy
 *   of this software and associated documentation files (the "Software"), to deal
 *   in the Software without restriction, including without limitation the rights
 *   to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 *   copies of the Software, and to permit persons to whom the Software is
 *   furnished to do so, subject to the following conditions:
 *
 *   The above copyright notice and this permission notice shall be included in all
 *   copies or substantial portions of the Software.
 *
 *   THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 *   IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 *   FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 *   AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 *   LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 *   OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 *   SOFTWARE.
 *
 * The Outfit typeface is distributed under the SIL Open Font License 1.1; the
 * full text travels in fonts/OFL-outfit.txt.
 *
 * THE BANG ON THE FIRST LINE IS NOT DECORATION: it is the marker (the
 * convention every minifier respects) that makes scripts/quitar-comentarios.py
 * keep this block. The served code carries no comments; without the bang, the
 * sweep that removed them would have taken a mandatory license notice with it.
 * Do not remove it.
 */

@font-face {
  font-family: "Outfit";
  src: url("../fonts/outfit-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg-dark:    #050b14;
  --bg-card:    rgba(0, 240, 255, 0.03);
  --text-light: #d4e8f9;
  --neon-cyan:  #00f0ff;
  --neon-glow:  rgba(0, 240, 255, 0.6);
  --border-dim: rgba(0, 240, 255, 0.1);
  --text-white: #ffffff;
  --text-muted: #a6b8c8;
  --text-faint: #8293a1;
  --border-section: #1a1a1a;
  --input-border: #606060;
  --font-mono: "Courier New", Courier, monospace;
  --radius: 0px;
  --accent-width: 3px;

  --radius-card: 0px;
  --radius-chip: 0px;
  --surface: rgba(0, 240, 255, 0.03);
  --surface-quiet: rgba(0, 240, 255, 0.06);
  --font-display: var(--font-mono);

  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #ff3b5c;
  --warn: #ffcc00;
  --ok: #34d399;
  --btn-text: #000;
  --btn-hover-bg: #fff;
  --hover-tint: rgba(0, 240, 255, 0.08);
  --shadow-card: none;
  --shadow-pop: 0 4px 20px rgba(0, 0, 0, 0.4);
  --shadow-modal: 0 0 30px var(--neon-glow);
}

.saltmarsh {
  --bg-dark:    #f6f2e6;
  --bg-card:    rgba(51, 115, 68, 0.05);
  --text-light: #3a4a3a;
  --neon-cyan:  #337344;
  --neon-glow:  rgba(51, 115, 68, 0);
  --border-dim: rgba(51, 115, 68, 0.16);
  --text-white: #1f2e1f;
  --text-muted: #4d5b4c;
  --text-faint: #5a6758;
  --border-section: #ddd5bd;
  --input-border: #958c6c;
  --font-mono: Georgia, "Palatino Linotype", "Book Antiqua", serif;
  --radius: 10px;
  --accent-width: 0px;
  --radius-card: 14px;
  --radius-chip: 999px;
  --surface: #fffdf7;
  --surface-quiet: #ece6d5;
  --font-display: var(--font-mono);
  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #b13c2e;
  --warn: #875f00;
  --ok: #2c7439;
  --btn-text: #fff;
  --btn-hover-bg: #276c3b;
  --hover-tint: rgba(51, 115, 68, 0.08);
  --shadow-card: 0 1px 3px rgba(58, 74, 58, 0.09), 0 4px 14px rgba(58, 74, 58, 0.07);
  --shadow-pop: 0 8px 28px rgba(58, 74, 58, 0.2);
  --shadow-modal: 0 12px 40px rgba(58, 74, 58, 0.25);
}

.nightwatch {
  --bg-dark:    #0c1f30;
  --bg-card:    rgba(218, 168, 236, 0.05);
  --text-light: #d1dae6;
  --neon-cyan:  #daa8ec;
  --neon-glow:  rgba(218, 168, 236, 0);
  --border-dim: rgba(218, 168, 236, 0.16);
  --text-white: #f5e0dc;
  --text-muted: #a2adbb;
  --text-faint: #8994a3;
  --border-section: #16354c;
  --input-border: #5d7389;
  --font-mono: "Outfit", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius: 8px;
  --accent-width: 0px;
  --radius-card: 14px;
  --radius-chip: 999px;
  --surface: #12293c;
  --surface-quiet: #0a1a29;
  --font-display: var(--font-mono);
  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #f38ba8;
  --warn: #f9e2af;
  --ok: #a6e3a1;
  --btn-text: #0c1f30;
  --btn-hover-bg: #e8c4f4;
  --hover-tint: rgba(218, 168, 236, 0.08);
  --shadow-card: 0 1px 3px rgba(6, 20, 32, 0.3), 0 4px 14px rgba(6, 20, 32, 0.22);
  --shadow-pop: 0 8px 28px rgba(6, 20, 32, 0.5);
  --shadow-modal: 0 12px 40px rgba(6, 20, 32, 0.55);
}

.daybreak {
  --bg-dark:    #eff1f5;
  --bg-card:    rgba(148, 48, 179, 0.04);
  --text-light: #4c4f69;
  --neon-cyan:  #9430b3;
  --neon-glow:  rgba(148, 48, 179, 0);
  --border-dim: rgba(148, 48, 179, 0.14);
  --text-white: #0c1f30;
  --text-muted: #53566f;
  --text-faint: #5f627a;
  --border-section: #dce0e8;
  --input-border: #878b97;
  --font-mono: "Outfit", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius: 8px;
  --accent-width: 0px;
  --radius-card: 14px;
  --radius-chip: 999px;
  --surface: #ffffff;
  --surface-quiet: #e5e8ef;
  --font-display: var(--font-mono);
  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #cb0e37;
  --warn: #875f00;
  --ok: #2d7320;
  --btn-text: #fff;
  --btn-hover-bg: #7c1499;
  --hover-tint: rgba(148, 48, 179, 0.08);
  --shadow-card: 0 1px 3px rgba(76, 79, 105, 0.09), 0 4px 14px rgba(76, 79, 105, 0.07);
  --shadow-pop: 0 8px 28px rgba(76, 79, 105, 0.2);
  --shadow-modal: 0 12px 40px rgba(76, 79, 105, 0.25);
}

.papel {
  --bg-dark:    #f7f3ec;
  --bg-card:    rgba(148, 48, 179, 0.04);
  --text-light: #4a4239;
  --neon-cyan:  #9430b3;
  --neon-glow:  rgba(148, 48, 179, 0);
  --border-dim: rgba(148, 48, 179, 0.14);
  --text-white: #322c25;
  --text-muted: #5f574f;
  --text-faint: #6b635d;
  --border-section: #e4dbcb;
  --input-border: #958b7a;
  --font-mono: "Outfit", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius: 10px;
  --accent-width: 0px;
  --radius-card: 14px;
  --radius-chip: 999px;
  --surface: #fffdf9;
  --surface-quiet: #f0e9dd;
  --font-display: var(--font-mono);
  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #a83e28;
  --warn: #8c5e0e;
  --ok: #46703c;
  --btn-text: #fff;
  --btn-hover-bg: #7c1499;
  --hover-tint: rgba(148, 48, 179, 0.08);
  --shadow-card: 0 1px 3px rgba(50, 44, 37, 0.09), 0 4px 14px rgba(50, 44, 37, 0.07);
  --shadow-pop: 0 8px 28px rgba(50, 44, 37, 0.2);
  --shadow-modal: 0 12px 40px rgba(50, 44, 37, 0.25);
}

.cuaderno {
  --bg-dark:    #f3ece0;
  --bg-card:    rgba(148, 48, 179, 0.04);
  --text-light: #4d453b;
  --neon-cyan:  #9430b3;
  --neon-glow:  rgba(148, 48, 179, 0);
  --border-dim: rgba(148, 48, 179, 0.14);
  --text-white: #2b2620;
  --text-muted: #5b5348;
  --text-faint: #675f55;
  --border-section: #e3d9c7;
  --input-border: #938771;
  --font-mono: "Outfit", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius: 11px;
  --accent-width: 0px;
  --radius-card: 18px;
  --radius-chip: 999px;
  --surface: #fdfaf4;
  --surface-quiet: #ece4d6;
  --font-display: Georgia, "Palatino Linotype", "Book Antiqua", serif;
  --accent-2: #99641a;
  --page-texture: radial-gradient(#e4d9c4 1px, transparent 1px);
  --chrome-bg: var(--bg-dark);
  --chrome-blur: none;
  --page-glow: none;
  --danger: #a8402a;
  --warn: #855a0e;
  --ok: #456b3b;
  --btn-text: #fff;
  --btn-hover-bg: #7c1499;
  --hover-tint: rgba(148, 48, 179, 0.08);
  --shadow-card: 0 1px 3px rgba(43, 38, 32, 0.09), 0 4px 14px rgba(43, 38, 32, 0.07);
  --shadow-pop: 0 8px 28px rgba(43, 38, 32, 0.2);
  --shadow-modal: 0 12px 40px rgba(43, 38, 32, 0.25);
}

.cristal {
  --bg-dark:    #0b0f1c;
  --bg-card:    rgba(218, 168, 236, 0.05);
  --text-light: #d3d9e8;
  --neon-cyan:  #daa8ec;
  --neon-glow:  rgba(218, 168, 236, 0);
  --border-dim: rgba(235, 240, 255, 0.16);
  --text-white: #eef2fb;
  --text-muted: #a0abc2;
  --text-faint: #8791aa;
  --border-section: #1d2540;
  --input-border: #5e6e8c;
  --font-mono: "Outfit", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --radius: 12px;
  --accent-width: 0px;
  --radius-card: 22px;
  --radius-chip: 999px;
  --surface: #161d33;
  --surface-quiet: #0a0e19;
  --font-display: var(--font-mono);
  --accent-2: var(--neon-cyan);
  --page-texture: none;
  --chrome-bg: rgba(210, 220, 255, 0.10);
  --chrome-blur: blur(26px) saturate(1.6);
  --page-glow:
    radial-gradient(52rem 40rem at 16% 8%, rgba(148, 48, 179, 0.22), transparent 68%),
    radial-gradient(46rem 38rem at 86% 92%, rgba(0, 240, 255, 0.07), transparent 70%);
  --danger: #f38ba8;
  --warn: #f9e2af;
  --ok: #a6e3a1;
  --btn-text: #0b0f1c;
  --btn-hover-bg: #e8c4f4;
  --hover-tint: rgba(218, 168, 236, 0.08);
  --shadow-card: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 1px 3px rgba(2, 4, 12, 0.4), 0 6px 18px rgba(2, 4, 12, 0.3);
  --shadow-pop: 0 12px 36px rgba(2, 4, 12, 0.6);
  --shadow-modal: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 24px 70px rgba(2, 4, 12, 0.65);
}
