/*
Theme Name: ByByPanara
Theme URI: https://panara.id
Author: Panara Team
Author URI: https://panara.id
Description: Lightweight modern Indonesian news portal theme with amber accent, hero slider, trending section, and newsletter footer. Inspired by tokohternama.my.id design style.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: bybypanara
Tags: news, blog, responsive, dark-mode, custom-colors, one-column
*/

/* =============================================
   DESIGN TOKENS — ubah di sini untuk rebranding
   ============================================= */
:root {
    /* Primary amber palette — customizable */
    --color-primary:      #b45309;
    --color-primary-dark: #92400e;
    --color-primary-light:#d97706;
    --color-primary-bg:   rgba(180,83,9,.08);

    /* Neutrals */
    --color-dark:         #1c1917;
    --color-text:         #1c1917;
    --color-text-muted:   #78716c;
    --color-bg:           #f3f4f6;
    --color-surface:      #ffffff;
    --color-border:       #e5e7eb;
    --color-border-light: #f0f0f0;

    /* Typography */
    --font-heading: 'Playfair Display', 'Georgia', serif;
    --font-body:    'Inter', 'Segoe UI', sans-serif;

    /* Spacing */
    --space-xs:  4px;
    --space-sm:  8px;
    --space-md:  16px;
    --space-lg:  24px;
    --space-xl:  40px;
    --space-2xl: 64px;

    /* Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;

    /* Shadow */
    --shadow-sm: 0 1px 3px rgba(0,0,0,.07);
    --shadow-md: 0 4px 16px rgba(0,0,0,.10);
    --shadow-lg: 0 8px 32px rgba(0,0,0,.14);

    /* Transitions */
    --transition: 0.2s ease;

    /* Layout */
    --container-width: 1200px;
}

/* =============================================
   DARK MODE TOKENS
   ============================================= */
[data-theme="dark"] {
    --color-bg:         #0c0a09;
    --color-surface:    #1c1917;
    --color-text:       #e7e5e4;
    --color-text-muted: #a8a29e;
    --color-border:     #2c2a28;
    --color-border-light:#292524;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.3);
    --shadow-md: 0 4px 16px rgba(0,0,0,.4);
}