/* dist/css/style.css */
@import url('https://cdnjs.cloudflare.com/ajax/libs/inter-ui/3.19.3/inter.css');

:root {
    --bg-deep: #050505;
    --gold-primary: #FFAB00;
    --gold-hover: #FFC107;
    --purple-primary: #A855F7;
    --purple-hover: #BC7AFA;
    --zinc-dark: #0A0A0A;
}

body { font-family: 'Inter', sans-serif; background-color: var(--bg-deep); color: #71717a; margin: 0; }
.font-mono { font-family: 'ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', monospace; }

/* High-Contrast Selection */
::selection { background-color: var(--gold-primary); color: var(--bg-deep); }

/* Typography */
.text-gradient-gold { 
    background: linear-gradient(to bottom right, #FFE066, var(--gold-primary)); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
}

/* Hardened Button System */
.btn-gold {
    background-color: var(--gold-primary) !important;
    color: var(--bg-deep) !important;
    font-weight: 800;
    transition: all 0.2s ease;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-gold:hover { background-color: var(--gold-hover) !important; transform: translateY(-1px); }

.btn-purple {
    background-color: var(--purple-primary) !important;
    color: #FFFFFF !important;
    font-weight: 800;
    transition: all 0.2s ease;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-purple:hover { background-color: var(--purple-hover) !important; transform: translateY(-1px); }

.btn-outline-gold {
    background-color: transparent !important;
    border: 1px solid rgba(255, 171, 0, 0.4) !important;
    color: var(--gold-primary) !important;
    font-weight: 800;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-outline-gold:hover { border-color: var(--gold-primary) !important; background-color: rgba(255, 171, 0, 0.05) !important; }

.btn-ghost {
    background-color: rgba(255, 255, 255, 0.05) !important;
    color: #FFFFFF !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    font-weight: 800;
    display: inline-flex; align-items: center; justify-content: center;
}
.btn-ghost:hover { background-color: rgba(255, 255, 255, 0.1) !important; }

/* Layout Utilities */
.gold-glow { box-shadow: 0 0 30px rgba(255, 171, 0, 0.1); }
.purple-glow { box-shadow: 0 0 30px rgba(168, 85, 247, 0.1); }
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #27272a; border-radius: 10px; }

/* Form Styling */
.input-field {
    @apply w-full bg-white/5 border border-white/10 rounded-xl px-4 py-4 text-white outline-none focus:border-gold-500 transition-all;
}

/* Documentation Layout */
.docs-container {
    display: grid;
    grid-template-columns: 280px 1fr;
    min-height: 100vh;
}

.docs-sidebar {
    @apply border-r border-white/5 bg-zinc-900/20 p-8 sticky top-20 h-[calc(100vh-80px)];
}

.docs-content {
    @apply p-16 max-w-4xl mx-auto;
}

.docs-content h1 { @apply text-4xl font-black text-white mb-8 uppercase tracking-tight; }
.docs-content h2 { @apply text-2xl font-bold text-white mt-12 mb-4 border-b border-white/5 pb-2; }
.docs-content p { @apply text-zinc-400 leading-relaxed mb-6; }
.docs-content code { @apply font-mono text-gold-500 bg-gold-500/10 px-1.5 py-0.5 rounded; }

/* --- DOCUMENTATION LIGHT THEME --- */

.docs-page {
    background-color: #FFFFFF !important;
    color: #374151 !important; /* High-contrast gray-700 */
}

.docs-page nav {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #e5e7eb !important;
}

.docs-page .text-white { color: #111827 !important; } /* Black-900 */
.docs-page .text-zinc-500 { color: #6b7280 !important; } /* Gray-500 */
.docs-page .text-zinc-400 { color: #4b5563 !important; }

/* Sidebar Styling */
.docs-page .sidebar {
    background-color: #F9FAFB !important; /* Subtle gray-50 */
    border-right: 1px solid #e5e7eb !important;
}

.docs-page .sidebar a { color: #4b5563; }
.docs-page .sidebar a:hover { color: var(--gold-primary); }

/* Content Headings */
.docs-page main h1 { color: #000000 !important; }
.docs-page main h2 { 
    color: #111827 !important; 
    border-bottom: 1px solid #f3f4f6 !important;
}
.docs-page main h3 { color: #1f2937 !important; }

/* Keep Code Blocks Dark (VSCode Style) for contrast */
.docs-page pre {
    background-color: #0d0d0d !important;
    border: 1px solid #1f2937 !important;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
}

.docs-page code {
    background-color: rgba(255, 171, 0, 0.1) !important;
    color: #b45309 !important; /* Darker Gold/Amber for legibility on white */
}

.docs-page pre code {
    background-color: transparent !important;
    color: #FFAB00 !important; /* Original Gold for inside dark blocks */
}

/* Section Numbering */
.docs-page .bg-gold-500\/10 {
    background-color: #fffbeb !important; /* Light amber-50 */
    border-color: #fde68a !important; /* Amber-200 */
}