/* ==========================================================================
   CV BUILDER - TEMPLATE SIMPLE (TỐI GIẢN)
   Áp dụng kiến trúc CSS phân tầng độc lập & hỗ trợ đa bảng màu theo [data-theme]
   ========================================================================== */

/* 1. Theme Variables cho các gam màu của template Simple */

/* 1.1. Theme Amber (Cam ấm - Chuẩn gốc VLNM - Mặc định) */
.cv-template-simple,
.cv-template-simple[data-theme="amber"],
[data-theme="amber"] .cv-template-simple,
[data-theme="amber"]#cvSimplePreview,
#cvSimplePreview[data-theme="amber"],
[data-theme="amber"] {
    --cv-primary: #f59e0b;
    --cv-primary-subtle: #fef3c7;
    --cv-primary-dark: #b45309;
    --cv-primary-rgb: 245, 158, 11;
    --cv-sidebar-bg: #fef3c7;
    --cv-accent: #b45309;
    --cv-border: #fde68a;
    --cv-text-dark: #78350f;
    --cv-mock-border: #fde68a;

    --cv-theme-primary: #f59e0b;
    --cv-theme-sidebar-bg: #fef3c7;
    --cv-theme-accent: #b45309;
    --cv-theme-border: #fde68a;
    --cv-theme-text-dark: #78350f;
}

/* 1.2. Theme Steel Blue (Xanh công nghiệp) */
.cv-template-simple[data-theme="steel_blue"],
[data-theme="steel_blue"] .cv-template-simple,
[data-theme="steel_blue"]#cvSimplePreview,
#cvSimplePreview[data-theme="steel_blue"],
[data-theme="steel_blue"] {
    --cv-primary: #0284c7;
    --cv-primary-subtle: #f0f9ff;
    --cv-primary-dark: #0369a1;
    --cv-primary-rgb: 2, 132, 199;
    --cv-sidebar-bg: #f0f9ff;
    --cv-accent: #0369a1;
    --cv-border: #bae6fd;
    --cv-text-dark: #0c4a6e;
    --cv-mock-border: #bae6fd;

    --cv-theme-primary: #0284c7;
    --cv-theme-sidebar-bg: #f0f9ff;
    --cv-theme-accent: #0369a1;
    --cv-theme-border: #bae6fd;
    --cv-theme-text-dark: #0c4a6e;
}

/* 1.3. Theme Emerald (Xanh lục bảo) */
.cv-template-simple[data-theme="emerald"],
[data-theme="emerald"] .cv-template-simple,
[data-theme="emerald"]#cvSimplePreview,
#cvSimplePreview[data-theme="emerald"],
[data-theme="emerald"] {
    --cv-primary: #059669;
    --cv-primary-subtle: #ecfdf5;
    --cv-primary-dark: #047857;
    --cv-primary-rgb: 5, 150, 105;
    --cv-sidebar-bg: #ecfdf5;
    --cv-accent: #047857;
    --cv-border: #a7f3d0;
    --cv-text-dark: #064e3b;
    --cv-mock-border: #a7f3d0;

    --cv-theme-primary: #059669;
    --cv-theme-sidebar-bg: #ecfdf5;
    --cv-theme-accent: #047857;
    --cv-theme-border: #a7f3d0;
    --cv-theme-text-dark: #064e3b;
}

/* 2. Color Swatches cho Palette Buttons */
.cv-swatch-amber {
    background-color: #f59e0b;
}

.cv-swatch-steel_blue {
    background-color: #0284c7;
}

.cv-swatch-emerald {
    background-color: #059669;
}

/* 3. Class định hình cấu trúc Template Simple chuẩn gốc */
.cv-template-simple {
    background-color: #ffffff;
    width: 100%;
    min-height: 100%;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    color: #334155;
    font-size: 0.85rem;
    line-height: 1.5;
}

/* 3.1. Cột bên (Sidebar) */
.cv-simple-sidebar {
    background-color: var(--cv-theme-sidebar-bg);
    border-right: 1px solid var(--cv-theme-border);
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.cv-simple-avatar {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #ffffff;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.cv-simple-avatar-placeholder {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    background-color: #ffffff;
    border: 3px solid var(--cv-theme-border);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--cv-theme-accent);
    font-size: 2.2rem;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

.cv-simple-title {
    color: var(--cv-theme-accent);
    transition: color 0.15s ease-in-out;
}

.cv-simple-sidebar-heading {
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--cv-theme-accent);
    border-bottom: 1.5px solid var(--cv-theme-border);
    padding-bottom: 6px;
    margin-bottom: 12px;
    transition: color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.cv-simple-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 0.8rem;
    color: #475569;
    word-break: break-word;
}

.cv-simple-contact-item i {
    color: var(--cv-theme-accent);
    margin-top: 3px;
    flex-shrink: 0;
    font-size: 0.85rem;
}

.cv-simple-badge {
    background-color: var(--cv-theme-sidebar-bg);
    color: var(--cv-theme-accent);
    border: 1px solid var(--cv-theme-border);
    font-size: 0.75rem;
    font-weight: 500;
    padding: 3px 8px;
    border-radius: 9999px;
    display: inline-block;
}

.cv-simple-tag-pill {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 9999px;
    border: 1px solid var(--cv-theme-border);
    background-color: #ffffff;
    color: var(--cv-theme-accent);
    font-size: 0.75rem;
    font-weight: 500;
}

/* 3.2. Cột chính (Main Panel) */
.cv-simple-main {
    background-color: #ffffff;
}

.cv-simple-section-heading {
    font-size: 0.95rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--cv-theme-accent);
    border-bottom: 2px solid var(--cv-theme-border);
    padding-bottom: 6px;
    margin-bottom: 14px;
    transition: color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.cv-simple-bullet {
    color: var(--cv-theme-primary);
}

.cv-simple-border-primary {
    border-color: var(--cv-theme-primary) !important;
}

.cv-simple-education-header {
    background-color: var(--cv-theme-primary);
    color: #ffffff;
    font-weight: 600;
    padding: 6px 12px;
    border-radius: 4px 4px 0 0;
    font-size: 0.85rem;
    transition: background-color 0.15s ease-in-out;
}

.cv-simple-education-body {
    border: 1px solid var(--cv-theme-border);
    border-top: none;
    border-radius: 0 0 4px 4px;
    padding: 10px 12px;
    background-color: #ffffff;
}

.cv-simple-timeline-card {
    border-left: 3px solid var(--cv-theme-primary);
    padding-left: 12px;
    margin-bottom: 16px;
    transition: border-color 0.15s ease-in-out;
}

.cv-simple-star {
    color: var(--cv-theme-primary);
    font-size: 0.75rem;
    transition: color 0.15s ease-in-out;
}

.cv-simple-star-empty {
    color: #cbd5e1;
    font-size: 0.75rem;
}

/* 4. @MEDIA PRINT A4 CHUẨN: KHÔNG CẮT KHỐI, CHỐNG TRÀN LỀ, GIỮ MÀU SẮC */
@media print {
    @page {
        size: A4 portrait;
        margin: 0;
    }

    /* Ẩn toolbar, topbar, buttons khi in */
    .cv-show-topbar,
    .cv-public-topbar,
    .btn,
    .cv-preview-control,
    .cv-preview-actions,
    .no-print,
    header,
    footer,
    nav {
        display: none !important;
    }

    .cv-paper-stage {
        padding: 0 !important;
        background: transparent !important;
    }

    .cv-a4-sheet {
        border: none !important;
        box-shadow: none !important;
        margin: 0 !important;
        width: 100% !important;
    }

    .cv-template-simple {
        width: 100% !important;
        background-color: #ffffff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .cv-template-simple .cv-simple-sidebar {
        background-color: var(--cv-theme-sidebar-bg) !important;
        border-right: 1px solid var(--cv-theme-border) !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .cv-template-simple .cv-simple-main {
        background-color: #ffffff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    .cv-simple-education-header,
    .cv-template-simple .cv-simple-education-header {
        background-color: var(--cv-theme-primary) !important;
        color: #ffffff !important;
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
    }

    /* Ngăn ngắt trang xấu giữa chừng các khối thông tin */
    .cv-template-simple .break-inside-avoid,
    .cv-simple-contact-item,
    .cv-live-exp-item,
    .cv-live-edu-item,
    .cv-live-skill-item,
    .cv-live-award-item,
    .cv-live-ref-item,
    .cv-simple-timeline-card,
    .cv-simple-education-header,
    .cv-simple-education-body {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
    }
}