/* =============================================================
   MiniTP — Global stylesheet
   Loaded on every page via layouts/app.blade.php
   Holds: shared color tokens, reset, and the 3 theme skins.
   Page-specific CSS lives in /public/css/pages/<slug>.css
   ============================================================= */

/* ---------- 1. Base tokens (NAVY / default) ---------------- */
:root{
  /* structural navy scale */
  --navy-950:#070c18;
  --navy-900:#0a1226;
  --navy-800:#0f1b35;
  --navy-700:#152444;

  /* accent (brand blue) */
  --blue-500:#3b7bff;
  --blue-600:#2a5fe0;
  --blue-400:#6ea0ff;

  /* text ink */
  --ink-0:#f3f6fc;
  --ink-1:#aab4c8;
  --ink-2:#6c7791;

  /* hairlines & surfaces */
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.14);
  --surface:rgba(255,255,255,.035);
  --surface-hi:rgba(255,255,255,.06);

  /* status */
  --green:#2ecf8f;
  --red:#ef5a6f;
  --gold:#e8b84b;
  --purple:#8b6cff;
  --teal:#2ec5c5;

  /* semantic accent — pages that used blue read from here so a
     theme can retint the primary action colour in one place */
  --accent:var(--blue-500);
  --accent-strong:var(--blue-600);
  --accent-soft:var(--blue-400);

  /* page backdrop stops (referenced by page body{} rules that
     opt in; legacy pages keep their own navy gradient) */
  --bg-0:var(--navy-950);
  --bg-1:var(--navy-900);
}

/* ---------- 2. Reset ---------------------------------------- */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink-0);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;}
a{color:inherit;}

/* smooth the skin change */
body,
body *{
  transition:background-color .25s ease, border-color .25s ease, color .2s ease;
}

/* =============================================================
   3. THEME SKINS
   Applied by setting  <html data-theme="navy|heritage|light">
   (see /public/js/theme.js). Each skin only remaps the shared
   tokens above, so all 38 pages recolour at once.
   ============================================================= */

/* ---- NAVY (dark, default) — same as base :root ------------ */
html[data-theme="navy"]{
  color-scheme:dark;
}

/* ---- HERITAGE (gold) -------------------------------------- */
html[data-theme="heritage"]{
  color-scheme:dark;

  --navy-950:#0a0803;
  --navy-900:#140f05;
  --navy-800:#000000;
  --navy-700:#2a1f0c;

  /* gold takes over the accent role */
  --blue-500:#e8b84b;
  --blue-600:#c99a2e;
  --blue-400:#f3d488;

  --ink-0:#f7efdd;
  --ink-1:#d3c39c;
  --ink-2:#9a8a63;

  --line:rgba(232,184,75,.14);
  --line-strong:rgba(232,184,75,.24);
  --surface:rgba(26,26,26);
  --surface-hi:rgba(232,184,75,.09);

  --green:#4bd39a;
  --red:#ef6b73;
  --gold:#e8b84b;

  --accent:#e8b84b;
  --accent-strong:#c99a2e;
  --accent-soft:#f3d488;

  --bg-0:#0a0803;
  --bg-1:#140f05;
}

/* ---- LIGHT (executive white / silver) --------------------- */
html[data-theme="light"]{
  color-scheme:light;

  --navy-950:#eef1f6;
  --navy-900:#f5f7fb;
  --navy-800:#ffffff;
  --navy-700:#e7ebf3;

  --blue-500:#2a5fe0;
  --blue-600:#1f49b8;
  --blue-400:#5b86ee;

  --ink-0:#0f1b35;
  --ink-1:#4a566e;
  --ink-2:#8792a8;

  --line:rgba(15,27,53,.10);
  --line-strong:rgba(15,27,53,.18);
  --surface:rgba(15,27,53,.03);
  --surface-hi:rgba(15,27,53,.06);

  --green:#12a866;
  --red:#e0384f;
  --gold:#b8862b;

  --accent:#2a5fe0;
  --accent-strong:#1f49b8;
  --accent-soft:#5b86ee;

  --bg-0:#eef1f6;
  --bg-1:#f5f7fb;
}

/* In light skin, decorative dark gradients on a few pages can wash
   out text; keep body text on the dark ink token above. */
html[data-theme="light"] body{ color:var(--ink-0); }

/* =============================================================
   4. Theme switcher control (floating, collapsible)
   A round toggle sits on the right edge; tapping it slides/fades
   the 3 colour swatches out. Tapping again tucks them back in.
   ============================================================= */
.theme-switch{
  position:fixed;
  right:16px;
  bottom:88px;              /* clear of bottom nav bars */
  z-index:9999;
  display:flex;
  align-items:center;
  gap:8px;
}

/* the panel that holds the 3 swatches */
.theme-switch .ts-panel{
  display:flex;
  gap:6px;
  padding:6px;
  border-radius:999px;
  background:var(--surface-hi);
  border:1px solid var(--line-strong);
  backdrop-filter:blur(10px);
  box-shadow:0 10px 30px -12px rgba(0,0,0,.6);

  /* collapsed by default: faded + slid to the right + non-interactive */
  opacity:0;
  transform:translateX(16px) scale(.92);
  transform-origin:right center;
  pointer-events:none;
  transition:opacity .28s ease, transform .28s cubic-bezier(.34,1.56,.64,1);
}
/* open state */
.theme-switch.open .ts-panel{
  opacity:1;
  transform:translateX(0) scale(1);
  pointer-events:auto;
}

/* stagger each swatch as the panel opens */
.theme-switch .ts-panel button{
  opacity:0;
  transform:scale(.6);
  transition:opacity .2s ease, transform .2s ease, border-color .15s ease;
}
.theme-switch.open .ts-panel button{
  opacity:1;
  transform:scale(1);
}
.theme-switch.open .ts-panel button:nth-child(1){ transition-delay:.06s; }
.theme-switch.open .ts-panel button:nth-child(2){ transition-delay:.12s; }
.theme-switch.open .ts-panel button:nth-child(3){ transition-delay:.18s; }

/* colour swatches */
.theme-switch .ts-panel button{
  width:20px;height:20px;
  border-radius:50%;
  /*border:2px solid transparent;*/
  border:none;
  cursor:pointer;
  padding:0;
  outline:none;
}
.theme-switch .ts-panel button:hover{ transform:scale(1.12); }
.theme-switch .ts-panel button[aria-pressed="true"]{ border-color:var(--ink-0); border: 2px solid; }
.theme-switch .sw-navy{     background:linear-gradient(135deg,#3b7bff,#0a1226); }
.theme-switch .sw-heritage{ background:linear-gradient(135deg,#f3d488,#c99a2e); }
.theme-switch .sw-light{    background:linear-gradient(135deg,#ffffff,#c7d0e0); }


/* the round toggle button */
.theme-switch .ts-toggle{
  width:35px;height:35px;
  flex:0 0 auto;
  border-radius:50%;
  border:1px solid var(--line-strong);
  background:var(--surface-hi);
  backdrop-filter:blur(10px);
  box-shadow:0 10px 30px -12px rgba(0,0,0,.6);
  color:var(--ink-0);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  transition:transform .28s ease, background-color .25s ease, border-color .25s ease;
}
.theme-switch .ts-toggle:hover{ transform:scale(1.06); }
.theme-switch .ts-toggle svg{
  width:20px;height:20px;
  transition:transform .35s cubic-bezier(.34,1.56,.64,1);
}
/* spin the icon a touch when open */
.theme-switch.open .ts-toggle svg{ transform:rotate(90deg); }


/*manual add and move css*/
a {
    text-decoration: none;
}


.blur-background {
    filter: blur(5px);
    transition: filter 0.3s ease;
}


.page-name{
    font-size:13px;
    font-weight: 700;
}