
/* ============================================================

   salute.nw — Theme System

   Light / Dark × Branch themes

   All variables consume into salute-core.css primitives

   ============================================================ */



/* ── DARK MODE (default) ────────────────────────────────────── */

:root,

[data-theme="dark"] {

    --sal-bg:       #09090d;

    --sal-surface:  #111318;

    --sal-surface2: #191c24;

    --sal-surface3: #21242e;

    --sal-border:   #2a2d38;

    --sal-border2:  #383b48;



    --sal-t1: #f0eeea;

    --sal-t2: #9a98a0;

    --sal-t3: #5a5862;

    --sal-t4: #38363e;



    --sal-accent:       var(--sal-gold);

    --sal-accent-hover: var(--sal-gold-bright);



    --sal-link:        var(--sal-gold);

    --sal-link-hover:  var(--sal-gold-bright);



    --sal-btn-bg:      var(--sal-surface2);

    --sal-btn-hover:   var(--sal-surface3);

    --sal-btn-border:  var(--sal-border);



    --sal-input-bg:    var(--sal-surface2);

    --sal-input-border:var(--sal-border);

    --sal-input-focus: var(--sal-gold);



    --sal-topbar-bg:   rgba(9, 9, 13, 0.92);

    --sal-topbar-border: var(--sal-border);

    --sal-sidebar-bg:  #0d0e14;

    --sal-sidebar-border: var(--sal-border);



    --sal-card-bg:     var(--sal-surface);

    --sal-card-hover:  var(--sal-surface2);

    --sal-card-border: var(--sal-border);



    --sal-panel-bg:    var(--sal-surface);

    --sal-panel-border:var(--sal-border);



    --sal-moh-bg:      #0f0e08;

    --sal-moh-border:  var(--sal-gold-border);



    color-scheme: dark;

}



/* ── LIGHT MODE ─────────────────────────────────────────────── */

[data-theme="light"] {

    --sal-bg:       #f4f3f0;

    --sal-surface:  #ffffff;

    --sal-surface2: #f0eeea;

    --sal-surface3: #e8e5e0;

    --sal-border:   #dbd8d2;

    --sal-border2:  #ccc8c2;



    --sal-t1: #14120e;

    --sal-t2: #5a5650;

    --sal-t3: #9a968e;

    --sal-t4: #ccc8c2;



    --sal-accent:       #b8922a;

    --sal-accent-hover: #9a7820;



    --sal-link:        #8b6914;

    --sal-link-hover:  #6b5010;



    --sal-btn-bg:      var(--sal-surface2);

    --sal-btn-hover:   var(--sal-surface3);

    --sal-btn-border:  var(--sal-border);



    --sal-input-bg:    var(--sal-surface);

    --sal-input-border:var(--sal-border);

    --sal-input-focus: #b8922a;



    --sal-topbar-bg:   rgba(255,255,255,0.94);

    --sal-topbar-border: var(--sal-border);

    --sal-sidebar-bg:  #f8f7f4;

    --sal-sidebar-border: var(--sal-border);



    --sal-card-bg:     var(--sal-surface);

    --sal-card-hover:  var(--sal-surface2);

    --sal-card-border: var(--sal-border);



    --sal-panel-bg:    var(--sal-surface);

    --sal-panel-border:var(--sal-border);



    --sal-moh-bg:      #fffdf5;

    --sal-moh-border:  rgba(184,146,42,0.35);



    color-scheme: light;

}



/* ── BRANCH: DEFAULT ────────────────────────────────────────── */

[data-branch="default"] {

    --sal-branch-primary:  #1a1d24;

    --sal-branch-accent:   var(--sal-gold);

    --sal-branch-text:     var(--sal-t1);

    --sal-branch-glow:     rgba(201,168,76,0.10);

    --sal-branch-gradient: linear-gradient(135deg, #1a1d24 0%, #0d0e14 100%);

}

[data-theme="light"][data-branch="default"] {

    --sal-branch-primary:  #f0eeea;

    --sal-branch-gradient: linear-gradient(135deg, #f4f3f0 0%, #e8e5e0 100%);

}



/* ── BRANCH: ARMY ───────────────────────────────────────────── */

[data-branch="army"] {

    --sal-branch-primary:  #2d3a18;

    --sal-branch-secondary:#1e2710;

    --sal-branch-accent:   #c9a84c;

    --sal-branch-text:     #eae8d8;

    --sal-branch-glow:     rgba(77,105,32,0.18);

    --sal-branch-gradient: linear-gradient(135deg, #2d3a18 0%, #1a2210 100%);

    --sal-sidebar-bg:      #0e1208;

    --sal-topbar-bg:       rgba(14,18,8,0.94);

}

[data-theme="light"][data-branch="army"] {

    --sal-branch-primary:  #e8f0d8;

    --sal-branch-secondary:#d4e8b0;

    --sal-branch-glow:     rgba(77,105,32,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #e8f0d8 0%, #d8e8c4 100%);

    --sal-sidebar-bg:      #f4f8ec;

    --sal-topbar-bg:       rgba(244,248,236,0.94);

}



/* ── BRANCH: NAVY ───────────────────────────────────────────── */

[data-branch="navy"] {

    --sal-branch-primary:  #0a1e45;

    --sal-branch-secondary:#061230;

    --sal-branch-accent:   #c9a84c;

    --sal-branch-text:     #dce8f8;

    --sal-branch-glow:     rgba(13,37,80,0.25);

    --sal-branch-gradient: linear-gradient(135deg, #0a1e45 0%, #040d24 100%);

    --sal-sidebar-bg:      #050e1e;

    --sal-topbar-bg:       rgba(5,14,30,0.94);

}

[data-theme="light"][data-branch="navy"] {

    --sal-branch-primary:  #dce8f8;

    --sal-branch-secondary:#c8d8f0;

    --sal-branch-glow:     rgba(13,37,80,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #dce8f8 0%, #c8d8f0 100%);

    --sal-sidebar-bg:      #eef4fc;

    --sal-topbar-bg:       rgba(238,244,252,0.94);

}



/* ── BRANCH: MARINES ────────────────────────────────────────── */

[data-branch="marines"] {

    --sal-branch-primary:  #6b0000;

    --sal-branch-secondary:#4a0000;

    --sal-branch-accent:   #c9a84c;

    --sal-branch-text:     #f8e8e8;

    --sal-branch-glow:     rgba(107,0,0,0.25);

    --sal-branch-gradient: linear-gradient(135deg, #6b0000 0%, #2d0000 100%);

    --sal-sidebar-bg:      #1a0000;

    --sal-topbar-bg:       rgba(26,0,0,0.94);

}

[data-theme="light"][data-branch="marines"] {

    --sal-branch-primary:  #f8e0e0;

    --sal-branch-secondary:#f0c8c8;

    --sal-branch-glow:     rgba(107,0,0,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #f8e0e0 0%, #f0c8c8 100%);

    --sal-sidebar-bg:      #fcf0f0;

    --sal-topbar-bg:       rgba(252,240,240,0.94);

}



/* ── BRANCH: AIR FORCE ──────────────────────────────────────── */

[data-branch="airforce"] {

    --sal-branch-primary:  #001a6b;

    --sal-branch-secondary:#000e45;

    --sal-branch-accent:   #7eb8ff;

    --sal-branch-text:     #dce8ff;

    --sal-branch-glow:     rgba(0,48,135,0.25);

    --sal-branch-gradient: linear-gradient(135deg, #001a6b 0%, #000820 100%);

    --sal-sidebar-bg:      #00051a;

    --sal-topbar-bg:       rgba(0,5,26,0.94);

}

[data-theme="light"][data-branch="airforce"] {

    --sal-branch-primary:  #dce8ff;

    --sal-branch-secondary:#c8d8ff;

    --sal-branch-accent:   #2952cc;

    --sal-branch-glow:     rgba(0,48,135,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #dce8ff 0%, #c8d8ff 100%);

    --sal-sidebar-bg:      #eef4ff;

    --sal-topbar-bg:       rgba(238,244,255,0.94);

}



/* ── BRANCH: COAST GUARD ────────────────────────────────────── */

[data-branch="coastguard"] {

    --sal-branch-primary:  #002248;

    --sal-branch-secondary:#00142e;

    --sal-branch-accent:   #e8a000;

    --sal-branch-text:     #dceeff;

    --sal-branch-glow:     rgba(0,34,72,0.25);

    --sal-branch-gradient: linear-gradient(135deg, #002248 0%, #000c1e 100%);

    --sal-sidebar-bg:      #000814;

    --sal-topbar-bg:       rgba(0,8,20,0.94);

}

[data-theme="light"][data-branch="coastguard"] {

    --sal-branch-primary:  #dce8fc;

    --sal-branch-secondary:#c8d8f4;

    --sal-branch-accent:   #c07000;

    --sal-branch-glow:     rgba(0,34,72,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #dce8fc 0%, #c8d8f4 100%);

    --sal-sidebar-bg:      #eef4ff;

    --sal-topbar-bg:       rgba(238,244,255,0.94);

}



/* ── BRANCH: SPACE FORCE ────────────────────────────────────── */

[data-branch="spaceforce"] {

    --sal-branch-primary:  #080820;

    --sal-branch-secondary:#040410;

    --sal-branch-accent:   #7eb8ff;

    --sal-branch-text:     #d8e8ff;

    --sal-branch-glow:     rgba(126,184,255,0.12);

    --sal-branch-gradient: linear-gradient(135deg, #0d0d30 0%, #040410 100%);

    --sal-sidebar-bg:      #030310;

    --sal-topbar-bg:       rgba(3,3,16,0.96);

}

[data-theme="light"][data-branch="spaceforce"] {

    --sal-branch-primary:  #e8eeff;

    --sal-branch-secondary:#d0dcff;

    --sal-branch-accent:   #2040cc;

    --sal-branch-glow:     rgba(126,184,255,0.08);

    --sal-branch-gradient: linear-gradient(135deg, #e8eeff 0%, #d0dcff 100%);

    --sal-sidebar-bg:      #f0f4ff;

    --sal-topbar-bg:       rgba(240,244,255,0.94);

}



/* ── MOH — Universal Gold Treatment (overrides all themes) ─── */

.sal-context--moh {

    --sal-accent: var(--sal-gold-bright);

}

.sal-moh-panel {

    background: var(--sal-moh-bg);

    border-left: 3px solid var(--sal-gold);

    border-radius: var(--sal-radius);

}

.sal-moh-citation {

    font-family: var(--sal-font-display);

    font-style: italic;

    font-size: 1.05rem;

    line-height: 1.8;

    color: var(--sal-t1);

    border-left: 3px solid var(--sal-gold-border);

    padding-left: var(--sal-s5);

    margin: var(--sal-s5) 0;

}



/* ── Full Circle designation ────────────────────────────────── */

.sal-full-circle-panel {

    border: 1px solid var(--sal-gold-border);

    border-left: 4px solid var(--sal-gold);

    background: var(--sal-gold-glass);

    border-radius: var(--sal-radius);

    padding: var(--sal-s5) var(--sal-s6);

}

.sal-full-circle-label {

    font-size: 0.7rem;

    letter-spacing: 0.15em;

    text-transform: uppercase;

    color: var(--sal-gold);

    font-weight: 700;

    margin-bottom: var(--sal-s2);

}

.sal-full-circle-title {

    font-family: var(--sal-font-display);

    font-size: 1.5rem;

    font-weight: 700;

    color: var(--sal-gold-bright);

    margin-bottom: var(--sal-s3);

}

.sal-full-circle-body {

    color: var(--sal-t2);

    font-size: 0.9375rem;

    line-height: 1.65;

    margin-bottom: var(--sal-s4);

}



