/* ===================================
   FILE: themes/theme.css
   Theme Mùa Hè - Beach & Sunny
   =================================== */
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;600;700&family=Baloo+2:wght@500;700;800&display=swap');

:root {
    /* --- 1. NỀN & MÀU CHỮ --- */
    --bg-main: url('https://images.unsplash.com/photo-1507525428034-b723cf961d3e?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80') center/cover no-repeat fixed;
    --text-main: #2b4c7e;
    --text-sub: #4f6e9b;

    /* --- 2. CÁC HỘP (BOX) --- */
    --box-bg: rgba(255, 255, 255, 0.75);
    --box-border: rgba(0, 150, 255, 0.3);
    --box-hover-bg: rgba(255, 255, 255, 0.95);
    --box-shadow: rgba(0, 50, 100, 0.15);

    /* --- 3. MENU (NAVBAR) --- */
    --header-bg: rgba(255, 255, 255, 0.85);
    --nav-item-bg: rgba(255, 255, 255, 0.9);
    --nav-active: #ff9800;
    --nav-active-text: #fff;

    /* --- 4. MÀU ĐIỂM NHẤN --- */
    --highlight: #00b4d8;
    --highlight-color: #00b4d8;
    --highlight-hover: #0096c7;
    --accent: #ff9800;
    --accent-color: #ff9800;
    --accent2: #ff5722;

    /* --- 5. FONT CHỮ --- */
    --font-main: 'Quicksand', sans-serif;
    --main-font: 'Quicksand', sans-serif;
    --font-title: 'Baloo 2', cursive;

    /* --- 6. HIỆU ỨNG --- */
    --glow-accent: 0 4px 15px rgba(255, 152, 0, 0.4);
    --glow-highlight: 0 4px 15px rgba(0, 180, 216, 0.4);
    --transition-speed: 0.35s;

    /* --- 7. TƯƠNG THÍCH CŨ --- */
    --text-color: #2b4c7e;
}