/*
Theme Name: Lịch Ngày Đẹp
Theme URI: https://lichngaydep.com
Author: LichNgayDep Team
Author URI: https://lichngaydep.com
Description: Theme WordPress chuyên biệt cho Lịch Âm Dương, Ngày Tốt Xấu, Giờ Hoàng Đạo, Can Chi, Tiết Khí, Sổ Mơ, Tử Vi, Phong Thủy và Tin Tức. Thiết kế mang phong cách văn hóa truyền thống Việt Nam kết hợp hiện đại, sang trọng và tối ưu SEO.
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: lichngaydep
Tags: calendar, lunar-calendar, phong-thuy, tu-vi, custom-colors, responsive-layout, seo-optimized
*/

/* CSS Variables */
:root {
    --color-primary: #8D2424;
    --color-primary-dark: #6D1B1B;
    --color-primary-light: #B43A3A;
    --color-secondary: #B88A3B;
    --color-secondary-light: #D4AF37;
    --color-secondary-dark: #8F6824;
    --color-bg: #F5EFE4;
    --color-card: #FFFDF8;
    --color-card-alt: #FBF7EE;
    --color-text: #292522;
    --color-text-muted: #6B635B;
    --color-border: #E5DAC6;
    --color-border-light: #EFE8DA;
    --color-green: #2E7D32;
    --color-green-bg: #E8F5E9;
    --color-red: #C62828;
    --color-red-bg: #FFEBEE;
    --font-heading: 'Cinzel Decorative', 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 14px;
    --shadow-sm: 0 1px 3px rgba(41, 37, 34, 0.05);
    --shadow-md: 0 4px 12px rgba(41, 37, 34, 0.07);
    --shadow-lg: 0 8px 24px rgba(141, 36, 36, 0.08);
}

/* Reset & Base */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--color-primary-dark);
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    color: var(--color-primary-dark);
    font-weight: 700;
    line-height: 1.3;
}

.section-title {
    font-size: 22px;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--color-secondary);
}

.section-title::before {
    content: "❖";
    color: var(--color-secondary);
    font-size: 18px;
}