/* ========================================
   NITXY - NT red & black theme for blog and admin pages
   (the same tokens as brand.css, without the page components). Loaded after style.css.
   ======================================== */

/* ---- NT red & black theme (matches the NT logo: red #CC0000 + black) ---- */
:root {
    --primary-600: #CC0000;
    --primary-500: #E0141F;
    --primary-400: #F0565E;
    --primary-100: #FDE2E3;

    --accent-500: #E8323C;
    --accent-400: #FF6B72;
    --accent-100: #FFE1E3;

    --gray-900: #0B0B0C;
    --gray-800: #18181B;
    --gray-700: #3F3F46;
    --gray-600: #52525B;
    --gray-500: #71717A;
    --gray-400: #A1A1AA;
    --gray-300: #D4D4D8;
    --gray-200: #E4E4E7;
    --gray-100: #F4F4F5;
    --gray-50: #FAFAFA;

    --gradient-primary: linear-gradient(135deg, #E3141F 0%, #A80A12 100%);
    --gradient-hero: linear-gradient(135deg, #0B0B0C 0%, #1C1C1F 50%, #0B0B0C 100%);
    --gradient-glow: radial-gradient(ellipse at center, rgba(204, 0, 0, 0.15) 0%, transparent 70%);
    --shadow-glow: 0 0 60px rgba(204, 0, 0, 0.3);
    --shadow-glow-accent: 0 0 60px rgba(232, 50, 60, 0.3);
}

/* ---- Per-product themes (override design tokens only). Default / PDF / English = brand red & black. ---- */
body.theme-scanner {   /* NIT Scanner icon is black + cyan */
    --primary-600: #0891B2;
    --primary-500: #06B6D4;
    --primary-400: #33C3E8;
    --primary-100: #CFF5FC;
    --accent-500: #33C3E8;
    --accent-400: #67D8F2;
    --accent-100: #D6F5FC;
    --gradient-primary: linear-gradient(135deg, #0891B2 0%, #33C3E8 100%);
    --shadow-glow: 0 0 60px rgba(51, 195, 232, 0.3);
}

/* ---- Logo: the NT mark sits on a white tile (its black T would vanish on the dark header / footer) ---- */
.logo-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    flex-shrink: 0;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}
.logo-mark img { width: 32px; height: auto; display: block; }
.footer-logo .logo-mark { width: 44px; height: 44px; }

/* ---- Hard-coded indigo spots in style.css, re-coloured to the red & black theme ---- */
.btn-primary { box-shadow: var(--shadow-lg), 0 0 30px rgba(204, 0, 0, 0.3); }
.btn-primary:hover { box-shadow: var(--shadow-xl), 0 0 40px rgba(204, 0, 0, 0.4); }
.hero::before {
    background:
        radial-gradient(ellipse 80% 50% at 20% 40%, rgba(204, 0, 0, 0.22) 0%, transparent 50%),
        radial-gradient(ellipse 60% 40% at 80% 60%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
}
.phone-mockup {
    background: linear-gradient(180deg, #1C1C1F 0%, #101012 100%);
    box-shadow: 0 50px 100px -20px rgba(0, 0, 0, 0.5), 0 0 60px rgba(204, 0, 0, 0.22), inset 0 0 0 1px rgba(255, 255, 255, 0.1);
}
.section-dark .section-badge { background: rgba(204, 0, 0, 0.22); color: var(--primary-400); }
.feature-icon.purple { background: linear-gradient(135deg, var(--primary-100) 0%, var(--accent-100) 100%); color: var(--primary-600); }
.cta-section::before { background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(204, 0, 0, 0.25) 0%, transparent 70%); }
.page-hero::before { background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(204, 0, 0, 0.2) 0%, transparent 50%); }
body.theme-scanner .btn-primary { box-shadow: var(--shadow-lg), 0 0 30px rgba(51, 195, 232, 0.3); }
body.theme-scanner .hero::before {
    background:
        radial-gradient(ellipse 80% 50% at 20% 40%, rgba(51, 195, 232, 0.2) 0%, transparent 50%),
        radial-gradient(ellipse 60% 40% at 80% 60%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
}
body.theme-scanner .cta-section::before { background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(51, 195, 232, 0.22) 0%, transparent 70%); }
body.theme-scanner .page-hero::before { background: radial-gradient(ellipse 80% 50% at 50% 0%, rgba(51, 195, 232, 0.18) 0%, transparent 50%); }

.footer-links .footer-sub { padding-left: var(--space-md); font-size: 0.9rem; opacity: 0.85; }

/* admin sidebar logo is smaller */
.admin-logo .logo-mark { width: 38px; height: 38px; border-radius: 10px; }
.admin-logo .logo-mark img { width: 26px; }