/*
Theme Name: Aura Magazine
Theme URI: https://github.com/mun-ca/aura-magazine
Author: Mun ca & Đệ đệ
Author URI: https://github.com/mun-ca
Description: Một tạp chí văn học cao cấp với phong cách Luxury, tối giản và tinh tế.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aura-magazine
*/

/* Design Tokens as CSS Custom Properties */
:root {
    /* Colors */
    --primary: #C5A059;
    --primary-dark: #A68549;
    --bg: #F9F8F6;
    --bg-card: #FFFFFF;
    --text: #1A1A1A;
    --text-muted: #666666;
    --border: #E5E2DD;
    --accent: #2D3436;

    /* Spacing */
    --space-4: 4px;
    --space-8: 8px;
    --space-12: 12px;
    --space-16: 16px;
    --space-24: 24px;
    --space-32: 32px;
    --space-48: 48px;
    --space-64: 64px;
    --space-80: 80px;
    --space-120: 120px;

    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
    --shadow-md: 0 10px 25px rgba(0,0,0,0.08);
    --shadow-lg: 0 20px 50px rgba(0,0,0,0.12);

    /* Transition */
    --transition: all 0.3s ease;
}

/* Dark Mode Overrides */
[data-theme="dark"] {
    --bg: #121212;
    --bg-card: #1E1E1E;
    --text: #E5E5E5;
    --text-muted: #A0A0A0;
    --border: #333333;
}

/* Base Styles */
body {
    background-color: var(--bg);
    color: var(--text);
    font-family: 'Inter', sans-serif;
    transition: var(--transition);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Playfair Display', serif;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--bg);
}
::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: var(--primary-dark);
}

/* Fluid Typography */
h1 { font-size: clamp(2.5rem, 5vw, 4rem); line-height: 1.1; }
h2 { font-size: clamp(2rem, 4vw, 3rem); line-height: 1.2; }
body { font-size: clamp(1.125rem, 1.2vw, 1.25rem); line-height: 1.8; }

/* Drop Cap */
.drop-cap::first-letter {
    float: left;
    font-family: 'Playfair Display', serif;
    font-size: 4.5rem;
    line-height: 1;
    padding: 4px 8px 0 0;
    color: var(--primary);
}