/* Centralized font management for Lackadaisical Security */

/* Font declarations with proper optimization */
@font-face {
    font-family: 'Lazer84';
    src: url('../fonts/Lazer84.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap; /* Show fallback font until custom font loads */
}

@font-face {
    font-family: 'VCR OSD Mono';
    src: url('../fonts/VCROSDMono.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Ancient Script Fonts */
@font-face {
    font-family: 'Noto Sans Linear A';
    src: url('../fonts/NotoSansLinearA-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Sans Linear B';
    src: url('../fonts/NotoSansLinearB-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Noto Sans Meroitic';
    src: url('../fonts/NotoSansMeroitic-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/* Font family variables */
:root {
    --font-retro: 'VCR OSD Mono', 'Courier New', monospace;
    --font-neon: 'Lazer84', Impact, fantasy;
    --font-base: 'VCR OSD Mono', 'Courier New', monospace;
    --font-display: 'Lazer84', Impact, fantasy;
    --font-mono: 'VCR OSD Mono', 'Courier New', monospace;
    --font-linear-a: 'Noto Sans Linear A', serif;
    --font-linear-b: 'Noto Sans Linear B', serif;
    --font-meroitic: 'Noto Sans Meroitic', serif;
}

/* Base font assignments with color properties to ensure visibility against dark backgrounds */
body {
    font-family: var(--font-base);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #e2fcff; /* Light blue/cyan for default text */
}

h1, h2, h3, h4, .cyber-text, .lackadaisical-text, .blog-title, .glitch-text, .section-heading {
    font-family: var(--font-display);
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #ffffff; /* Bright white for headings */
}

.sec-text, code, pre, .cyber-input, .address-bar, .terminal-text,
.cyber-button, .nav-links a, .badge-text, .btn-primary, .form-control,
input, textarea, select, button, .feature-list li {
    font-family: var(--font-mono);
}

/* Ensure form inputs have visible text */
input, textarea, select, .cyber-input, .form-control {
    color: #e2fcff; /* Light color for input text */
    background-color: rgba(12, 3, 32, 0.7); /* Dark semi-transparent background */
}

/* Fix placeholder text color to be visible but slightly dimmed */
::placeholder {
    color: rgba(226, 252, 255, 0.5); /* Semi-transparent light cyan */
    opacity: 1; /* Firefox fix */
}

:-ms-input-placeholder {
    color: rgba(226, 252, 255, 0.5);
}

::-ms-input-placeholder {
    color: rgba(226, 252, 255, 0.5);
}

/* Font loading states */
.fonts-loading * {
    transition: none !important; /* Prevent transitions until fonts load */
}

/* Font sizing consistency */
h1, .h1 { font-size: 2.5rem; }
h2, .h2 { font-size: 2rem; }
h3, .h3 { font-size: 1.75rem; }
h4, .h4 { font-size: 1.5rem; }
h5, .h5 { font-size: 1.25rem; }
h6, .h6 { font-size: 1rem; }

p, li, td, th, input, textarea, select, button {
    font-size: 1rem;
}

/* Mobile font size adjustments */
@media (max-width: 768px) {
    h1, .h1 { font-size: 2rem; }
    h2, .h2 { font-size: 1.75rem; }
    h3, .h3 { font-size: 1.5rem; }
}

/* Font weight classes */
.font-normal { font-weight: normal; }
.font-bold { font-weight: bold; }

/* Neon text effects with proper font usage */
.neon-text {
    font-family: var(--font-display);
    color: var(--neon-cyan, #00ffff);
    text-shadow: 0 0 5px var(--neon-cyan, #00ffff), 0 0 10px var(--neon-cyan, #00ffff);
}

.neon-magenta {
    font-family: var(--font-display);
    color: var(--neon-magenta, #ff00aa);
    text-shadow: 0 0 5px var(--neon-magenta, #ff00aa), 0 0 10px var(--neon-magenta, #ff00aa);
}

.neon-green {
    font-family: var(--font-display);
    color: var(--neon-green, #39ff14);
    text-shadow: 0 0 5px var(--neon-green, #39ff14), 0 0 10px var(--neon-green, #39ff14);
}

.neon-cyan {
    font-family: var(--font-display);
    color: var(--neon-cyan, #00ffff);
    text-shadow: 0 0 5px var(--neon-cyan, #00ffff), 0 0 10px var(--neon-cyan, #00ffff);
}

/* Font preloading helper classes */
.font-lazer84 {
    font-family: 'Lazer84', Impact, fantasy;
    position: absolute;
    visibility: hidden;
}

.font-vcr {
    font-family: 'VCR OSD Mono', 'Courier New', monospace;
    position: absolute;
    visibility: hidden;
}

/* Fix for any dark text on dark backgrounds */
.text-dark {
    color: #e2fcff !important; /* Override any dark text classes */
}

/* Ensure links are visible */
a {
    color: var(--neon-cyan, #00ffff);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover {
    color: var(--neon-magenta, #ff00aa);
    text-shadow: 0 0 5px var(--neon-magenta, #ff00aa);
}

/* Linear script CSS classes with cyber theme */
.linear-a {
    font-family: var(--font-linear-a);
    font-size: 1.2em;
    line-height: 1.4;
    color: #00ffff; /* Cyber cyan */
    text-shadow: 0 0 3px #00ffff;
}

.linear-b {
    font-family: var(--font-linear-b);
    font-size: 1.2em;
    line-height: 1.4;
    color: #ffaa00; /* Cyber gold */
    text-shadow: 0 0 3px #ffaa00;
}

.linear-a-large {
    font-family: var(--font-linear-a);
    font-size: 2em;
    line-height: 1.3;
    display: block;
    margin: 1em 0;
    color: #39ff14; /* Cyber green */
    text-shadow: 0 0 5px #39ff14;
}

.linear-b-large {
    font-family: var(--font-linear-b);
    font-size: 2em;
    line-height: 1.3;
    display: block;
    margin: 1em 0;
    color: #ff00aa; /* Cyber magenta */
    text-shadow: 0 0 5px #ff00aa;
}

/* Meroitic script classes with Ancient Africa purple/gold theme */
.meroitic-text {
    font-family: var(--font-meroitic);
    font-size: 1.2em;
    line-height: 1.4;
    color: #8a2be2; /* Purple for Meroitic */
    text-shadow: 0 0 3px #8a2be2;
    direction: rtl; /* Right-to-left for Meroitic script */
    unicode-bidi: bidi-override;
}

.meroitic-text-large {
    font-family: var(--font-meroitic);
    font-size: 2em;
    line-height: 1.3;
    display: block;
    margin: 1em 0;
    color: #ffd700; /* Gold for large Meroitic */
    text-shadow: 0 0 5px #ffd700;
    direction: rtl;
    unicode-bidi: bidi-override;
}

.meroitic-inline {
    font-family: var(--font-meroitic);
    font-size: 1.1em;
    color: #8a2be2;
    padding: 0 0.3em;
    direction: rtl;
    unicode-bidi: bidi-override;
}

/* Darker backgrounds for better container readability */
.container-dark {
    background: rgba(8, 4, 18, 0.9) !important;
    border: 1px solid rgba(255, 170, 0, 0.3);
}

.stat-box {
    background: rgba(8, 4, 18, 0.85) !important;
}

.script-demonstration {
    background: rgba(12, 8, 24, 0.9) !important;
}