/* ============================================================
   Rood IT Services — Navy + Orange Brand Theme
   Single dark navy theme. Token colors come from the Tailwind
   config in each page; this file handles base surfaces and the
   literal emerald/slate/white utility classes in nav + footer.
   ============================================================ */

:root,
.dark {
    color-scheme: dark;
}

html {
    background-color: #011124;
}

body {
    min-height: 100vh;
    background-color: #011124 !important;
    background-image: none !important;
    color: #f4f5f7;
    transition: background-color 220ms ease, color 220ms ease;
}

/* The light/dark toggle is meaningless on a single navy theme — hide it */
[data-theme-toggle] {
    display: none !important;
}

/* ============================================================
   Brand wordmark (nav)
   ============================================================ */

.brand-wordmark {
    font-family: 'Manrope', sans-serif;
    font-weight: 800;
    letter-spacing: -0.02em;
    font-size: 1.4rem;
    line-height: 1;
}
.brand-wordmark .b-rood { color: #f4f5f7; }
.brand-wordmark .b-it { color: #e66b0a; }

/* ============================================================
   Navigation
   ============================================================ */

nav.fixed,
.glass-nav {
    background-color: rgba(1, 7, 14, 0.85) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #23415e !important;
    box-shadow: none !important;
}

/* ============================================================
   Emerald utility classes -> white / orange
   ============================================================ */

.text-emerald-900,
.text-emerald-800,
.text-emerald-700,
.text-emerald-600,
.text-emerald-300,
.text-emerald-200,
.text-emerald-100,
.text-emerald-50 {
    color: #f4f5f7 !important;
}

/* Active nav link + its underline -> brand orange */
nav a.text-emerald-700,
nav a.dark\:text-emerald-300 {
    color: #e66b0a !important;
}
.border-emerald-700,
.border-emerald-300,
.border-b-2.border-emerald-700 {
    border-color: #e66b0a !important;
}

.hover\:text-emerald-800:hover,
.hover\:text-emerald-600:hover,
.hover\:text-emerald-300:hover,
.hover\:text-emerald-100:hover {
    color: #f18a18 !important;
}
.hover\:bg-emerald-50\/50:hover,
.hover\:bg-emerald-900\/50:hover {
    background-color: rgba(35, 65, 94, 0.4) !important;
}

/* ============================================================
   Slate utility classes (nav inactive links, footer text)
   ============================================================ */

.text-slate-600,
.text-slate-500,
.text-slate-400 {
    color: #9fb1c4 !important;
}

.bg-slate-50,
.bg-slate-100,
.bg-slate-900,
.bg-slate-950 {
    background-color: #01070e !important;
}
.bg-slate-800\/50 {
    background-color: rgba(6, 37, 75, 0.5) !important;
}

.border-slate-100,
.border-slate-200,
.border-slate-200\/50,
.border-slate-800,
.border-slate-800\/50 {
    border-color: #23415e !important;
}

/* ============================================================
   White / translucent-white surfaces -> midnight blue
   (about overlay card, contact map chips, etc.)
   ============================================================ */

.bg-white,
.bg-white\/90,
.bg-white\/70,
.bg-white\/50 {
    background-color: #06254b !important;
    color: #f4f5f7;
}
.bg-white\/5 {
    background-color: rgba(244, 245, 247, 0.06) !important;
}
.border-white\/50,
.border-white\/10,
.border-white\/5 {
    border-color: rgba(35, 65, 94, 0.5) !important;
}
.bg-black\/5 {
    background-color: rgba(1, 7, 14, 0.4) !important;
}

/* ============================================================
   Misc
   ============================================================ */

/* Stock images used mix-blend-multiply for the green theme; neutralize */
.mix-blend-multiply {
    mix-blend-mode: normal !important;
}

/* Shadows read as soft black on navy */
.editorial-shadow,
.shadow-sm,
.shadow-lg,
.shadow-xl,
.shadow-2xl {
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45) !important;
}

footer {
    transition: background-color 220ms ease, color 220ms ease;
}

::selection {
    background-color: #e66b0a;
    color: #01070e;
}