/* ==========================================================================
   EXECUTIVE RESUME DESIGN SYSTEM & TYPOGRAPHY
   ========================================================================== */
:root {
    --primary-color: #0f172a;
    --primary-hover: #1e293b;
    --accent-blue: #2563eb;
    --line-color: #cbd5e1;
    --text-dark: #0f172a;
    --text-muted: #475569;
    --bg-gray: #f1f5f9;
    --card-bg: #ffffff;
    --border-color: #e2e8f0;
    --paper-width: 210mm;
    --paper-min-height: 295mm;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scrollbar-gutter: stable;
}

body {
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: var(--text-dark);
    background-color: var(--bg-gray);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    line-height: 1.45;
    overflow-y: scroll;
}

/* ==========================================================================
   NAVIGATION & CONTROLS (Hidden in Print)
   ========================================================================== */
.top-nav {
    background: #0f172a;
    color: #ffffff;
    padding: 0.75rem 1.5rem;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.nav-container {
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
}

.brand {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.brand-icon {
    font-size: 1.4rem;
    color: #38bdf8;
}

.brand-title {
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.template-picker-wrapper {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #1e293b;
    padding: 0.35rem 0.85rem;
    border-radius: 20px;
    border: 1px solid #334155;
    font-size: 0.85rem;
}

.template-picker-wrapper label {
    color: #94a3b8;
    font-weight: 600;
}

.template-dropdown {
    background: transparent;
    color: #38bdf8;
    border: none;
    font-size: 0.88rem;
    font-weight: 700;
    cursor: pointer;
    outline: none;
}
.template-dropdown option {
    background: #0f172a;
    color: white;
}

.actions {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

/* Buttons */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 1px solid transparent;
}

.btn-primary { background-color: var(--accent-blue); color: white; }
.btn-primary:hover { background-color: #1d4ed8; box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3); }

.btn-success { background-color: #10b981; color: white; }
.btn-success:hover { background-color: #059669; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); }

.btn-secondary { background-color: #334155; color: #f8fafc; }
.btn-secondary:hover { background-color: #475569; }

.btn-outline-danger { background: transparent; border-color: #ef4444; color: #fca5a5; }
.btn-outline-danger:hover { background: #7f1d1d; color: white; border-color: #dc2626; }

.btn-small-danger { background: #fee2e2; color: #dc2626; border: 1px solid #fca5a5; padding: 0.28rem 0.6rem; font-size: 0.74rem; font-weight: 600; border-radius: 4px; cursor: pointer; display: inline-flex; align-items: center; gap: 0.3rem; transition: all 0.2s ease; }
.btn-small-danger:hover { background: #ef4444; color: white; }

.btn-danger-sm { background: #ef4444; color: white; padding: 0.2rem 0.45rem; font-size: 0.72rem; border-radius: 4px; border: none; cursor: pointer; }
.btn-danger-sm:hover { background: #dc2626; }

.btn-sm { padding: 0.3rem 0.6rem; font-size: 0.78rem; }

/* Main Layout */
.main-layout {
    display: flex;
    max-width: 1400px;
    margin: 1.25rem auto;
    padding: 0 1rem;
    gap: 1.5rem;
    width: 100%;
    flex: 1;
}

/* Sidebar Editor */
.editor-sidebar {
    width: 420px;
    max-width: 100%;
    box-sizing: border-box;
    flex-shrink: 0;
    background: var(--card-bg);
    border-radius: 12px;
    padding: 1.1rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05);
    height: calc(100vh - 90px);
    overflow-y: auto;
    transition: all 0.3s ease;
}

.editor-sidebar.collapsed { display: none; }

.sidebar-header { margin-bottom: 1rem; padding-bottom: 0.65rem; border-bottom: 1px solid var(--border-color); }
.sidebar-header h2 { font-size: 1.1rem; color: #0f172a; display: flex; align-items: center; gap: 0.5rem; }
.sidebar-header p { font-size: 0.78rem; color: var(--text-muted); margin-top: 0.2rem; }

.form-section { background: #f8fafc; border: 1px solid var(--border-color); border-radius: 8px; padding: 0.85rem; margin-bottom: 1rem; width: 100%; box-sizing: border-box; overflow: hidden; }
.highlight-section { background: #eff6ff; border-color: #bfdbfe; }
.form-section h3 { font-size: 0.9rem; color: #334155; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.45rem; }
.section-title-with-action { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.75rem; }
.section-title-with-action h3 { margin-bottom: 0; }

.form-group { display: flex; flex-direction: column; gap: 0.3rem; margin-bottom: 0.75rem; min-width: 0; width: 100%; box-sizing: border-box; }
.form-group:last-child { margin-bottom: 0; }
.form-group label { font-size: 0.78rem; font-weight: 600; color: #475569; }

.form-group input, .form-group textarea, .form-control-select {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    min-width: 0;
    padding: 0.45rem 0.65rem; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.83rem; font-family: inherit; background: white;
}
.form-group input:focus, .form-group textarea:focus, .form-control-select:focus {
    outline: none; border-color: var(--accent-blue); box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15);
}

.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.65rem; width: 100%; box-sizing: border-box; }
.form-row .form-group { min-width: 0; }
.help-text { font-size: 0.72rem; color: var(--text-muted); }
.edu-item-card { background: white; border: 1px solid #e2e8f0; padding: 0.65rem; border-radius: 6px; margin-bottom: 0.65rem; width: 100%; box-sizing: border-box; }

.preview-area {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    overflow-x: auto;
    padding-bottom: 2rem;
}

/* ==========================================================================
   BASE RESUME PAPER (295mm height for 1-page PDF fit)
   ========================================================================== */
.resume-paper {
    background: #ffffff;
    width: 210mm;
    height: 295mm;
    max-height: 295mm;
    padding: 10mm 14mm 10mm 14mm;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
    border-radius: 2px;
    box-sizing: border-box;
    position: relative;
    line-height: 1.45;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-start !important;
}

/* Standardized Executive Photo Container */
.header-photo, .tmpl2-photo, .tmpl4-avatar, .tmpl5-photo-wrap, .tmpl6-photo, .tmpl8-avatar, .tmpl9-photo, .tmpl10-photo-box, .tmpl12-photo {
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px #ffffff, 0 6px 16px rgba(15, 23, 42, 0.12);
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #cbd5e1;
}
.header-photo img, .tmpl2-photo img, .tmpl4-avatar img, .tmpl5-photo-wrap img, .tmpl6-photo img, .tmpl8-avatar img, .tmpl9-photo img, .tmpl10-photo-box img, .tmpl12-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ==========================================================================
   TEMPLATE 1: CLASSIC REFERENCE
   ========================================================================== */
.template-1 { font-family: 'Inter', sans-serif; color: #0f172a; justify-content: flex-start !important; }
.template-1 .resume-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.65rem; }
.template-1 .user-name { font-size: 1.75rem; font-weight: 800; color: #0f172a; letter-spacing: 0.03em; margin-bottom: 0.15rem; text-transform: uppercase; }
.template-1 .contact-block { font-size: 0.82rem; color: #334155; line-height: 1.4; }
.template-1 .contact-block p { margin-bottom: 0.1rem; }
.template-1 .contact-block .label { font-weight: 700; color: #0f172a; }
.template-1 .tagline-block { margin-top: 0.4rem; padding: 0.35rem 0; border-top: 1.5px solid #1e3a8a; border-bottom: 1.5px solid #1e3a8a; text-align: center; }
.template-1 .tagline-text { font-size: 0.86rem; font-weight: 700; color: #1e3a8a; font-style: italic; }
.template-1 .header-photo { width: 95px; height: 115px; border-radius: 6px; }
.template-1 .resume-section { margin-bottom: 0.85rem; }
.template-1 .section-header-box { margin-bottom: 0.35rem; text-align: left; border-bottom: 2px solid #1e3a8a; padding-bottom: 0.15rem; }
.template-1 .section-heading { font-size: 0.92rem; font-weight: 800; color: #1e3a8a; letter-spacing: 0.08em; text-transform: uppercase; margin: 0; }
.template-1 .objective-text { font-size: 0.83rem; text-align: justify; line-height: 1.45; color: #334155; }

.template-1 .education-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.82rem; margin-top: 0.2rem; }
.template-1 .education-table th { background: #f8fafc; color: #0f172a; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.05em; padding: 0.45rem 0.65rem; border-bottom: 2px solid #cbd5e1; }
.template-1 .education-table td { padding: 0.45rem 0.65rem; border-bottom: 1px solid #e2e8f0; color: #334155; }

/* Table Column Precise Alignment System */
.education-table th:nth-child(1), .tmpl4-table th:nth-child(1), .tmpl7-table th:nth-child(1),
.education-table td:nth-child(1), .tmpl4-table td:nth-child(1), .tmpl7-table td:nth-child(1) {
    width: 28%;
    text-align: left !important;
}

.education-table th:nth-child(2), .tmpl4-table th:nth-child(2), .tmpl7-table th:nth-child(2),
.education-table td:nth-child(2), .tmpl4-table td:nth-child(2), .tmpl7-table td:nth-child(2) {
    width: 44%;
    text-align: left !important;
}

.education-table th:nth-child(3), .tmpl4-table th:nth-child(3), .tmpl7-table th:nth-child(3),
.education-table td:nth-child(3), .tmpl4-table td:nth-child(3), .tmpl7-table td:nth-child(3) {
    width: 13%;
    text-align: center !important;
}

.education-table th:nth-child(4), .tmpl4-table th:nth-child(4), .tmpl7-table th:nth-child(4),
.education-table td:nth-child(4), .tmpl4-table td:nth-child(4), .tmpl7-table td:nth-child(4) {
    width: 15%;
    text-align: center !important;
}
.template-1 .bullet-list { padding-left: 1.2rem; font-size: 0.83rem; color: #334155; }
.template-1 .bullet-list li { margin-bottom: 0.22rem; }
.template-1 .personal-grid { display: flex; flex-direction: column; gap: 0.25rem; font-size: 0.83rem; }
.template-1 .personal-row { display: flex; align-items: center; }
.template-1 .p-label { width: 145px; font-weight: 700; color: #0f172a; }
.template-1 .p-colon { width: 20px; font-weight: 700; color: #1e3a8a; }
.template-1 .p-val { flex: 1; color: #1e293b; }

/* ==========================================================================
   TEMPLATE 2: MODERN EXECUTIVE
   ========================================================================== */
.tmpl2-layout { display: flex; height: auto; max-height: 100%; min-height: 0; }

.tmpl2-sidebar { 
    width: 32%; 
    background: #0f172a; 
    color: #f8fafc; 
    padding: 10mm 7mm; 
    box-sizing: border-box; 
    display: flex; 
    flex-direction: column; 
    gap: 1.15rem; 
    justify-content: flex-start !important; 
}

.tmpl2-photo { 
    width: 105px; 
    height: 125px; 
    border-radius: 12px; 
    border: 2px solid rgba(245, 158, 11, 0.6); 
    margin: 0 auto 0.2rem auto; 
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
}

.tmpl2-side-title { 
    font-size: 0.82rem; 
    font-weight: 800; 
    color: #fbbf24; 
    border-bottom: 1px solid rgba(255, 255, 255, 0.15); 
    padding-bottom: 0.25rem; 
    margin-bottom: 0.5rem; 
    letter-spacing: 0.08em; 
    display: flex;
    align-items: center;
    gap: 0.45rem;
}
.tmpl2-side-title i {
    background: rgba(251, 191, 36, 0.15);
    color: #fbbf24;
    width: 22px;
    height: 22px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
}

.tmpl2-side-item { 
    font-size: 0.77rem; 
    color: #cbd5e1; 
    margin-bottom: 0.35rem; 
    line-height: 1.35; 
    word-break: break-word; 
    display: flex; 
    align-items: flex-start; 
    gap: 0.45rem; 
}
.tmpl2-side-item i { 
    color: #fbbf24; 
    width: 16px; 
    margin-top: 0.15rem;
    text-align: center; 
    flex-shrink: 0;
}

.tmpl2-skill-tags { display: flex; flex-wrap: wrap; gap: 0.38rem; }
.tmpl2-skill-pill {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.14);
    color: #f1f5f9;
    padding: 0.28rem 0.6rem;
    border-radius: 12px;
    font-size: 0.74rem;
    font-weight: 500;
    line-height: 1.35;
}

.tmpl2-personal-list { display: flex; flex-direction: column; gap: 0.35rem; font-size: 0.77rem; }
.tmpl2-p-row { display: flex; justify-content: space-between; border-bottom: 1px dashed rgba(255, 255, 255, 0.12); padding-bottom: 0.22rem; }
.tmpl2-p-label { color: #94a3b8; font-weight: 600; }
.tmpl2-p-val { color: #f8fafc; font-weight: 500; text-align: right; }

.tmpl2-main { 
    flex: 1; 
    padding: 10mm 12mm; 
    background: #ffffff; 
    box-sizing: border-box; 
    display: flex; 
    flex-direction: column; 
    gap: 0.95rem; 
    justify-content: flex-start !important; 
}

.tmpl2-header { margin-bottom: 0.2rem; border-bottom: 2px solid #f1f5f9; padding-bottom: 0.45rem; }
.tmpl2-name { font-size: 1.75rem; font-weight: 800; color: #0f172a; text-transform: uppercase; letter-spacing: 0.03em; }
.tmpl2-tagline { font-size: 0.86rem; font-weight: 600; color: #d97706; margin-top: 0.15rem; }

.tmpl2-sec-title { 
    font-size: 0.88rem; 
    font-weight: 800; 
    color: #0f172a; 
    border-bottom: 2px solid #d97706; 
    padding-bottom: 0.2rem; 
    margin-bottom: 0.45rem; 
    letter-spacing: 0.06em; 
    text-transform: uppercase;
}
.tmpl2-text { font-size: 0.83rem; color: #334155; line-height: 1.45; }

.tmpl2-edu-card {
    background: #fafaf9;
    border: 1px solid #f5f5f4;
    border-left: 3px solid #d97706;
    border-radius: 6px;
    padding: 0.48rem 0.65rem;
    margin-bottom: 0.4rem;
}
.tmpl2-edu-header { display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; }
.tmpl2-qual { color: #0f172a; font-weight: 700; }
.tmpl2-year { font-weight: 700; color: #d97706; background: #fef3c7; padding: 0.08rem 0.45rem; border-radius: 4px; font-size: 0.75rem; }
.tmpl2-inst { font-size: 0.77rem; color: #64748b; margin-top: 0.15rem; }

.tmpl2-list { padding-left: 1.2rem; font-size: 0.83rem; color: #334155; }
.tmpl2-list li { margin-bottom: 0.24rem; }

/* ==========================================================================
   TEMPLATE 3: ELEGANT MINIMALIST
   ========================================================================== */
.template-3 { font-family: 'Merriweather', Georgia, serif; color: #1c1917; padding: 10mm 14mm 10mm 14mm; justify-content: flex-start !important; }
.tmpl3-container { display: flex; flex-direction: column; gap: 0.85rem; justify-content: flex-start; height: 100%; }
.tmpl3-header { text-align: center; margin-bottom: 0.3rem; }
.tmpl3-name { font-size: 1.75rem; font-weight: 700; color: #1c1917; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl3-tagline { font-size: 0.85rem; font-style: italic; color: #44403c; margin-top: 0.15rem; }
.tmpl3-contact { font-size: 0.78rem; color: #78716c; margin-top: 0.25rem; font-family: 'Inter', sans-serif; }
.tmpl3-contact span { margin: 0 0.2rem; }
.tmpl3-divider { height: 1px; background: #e7e5e4; margin-top: 0.45rem; border-top: 1px solid #a8a29e; }
.tmpl3-title { font-size: 0.88rem; font-weight: 700; color: #1c1917; text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1px solid #78716c; padding-bottom: 0.15rem; margin-bottom: 0.4rem; }
.tmpl3-text { font-size: 0.82rem; font-family: 'Inter', sans-serif; color: #292524; line-height: 1.45; }
.tmpl3-edu-card { margin-bottom: 0.4rem; font-family: 'Inter', sans-serif; }
.tmpl3-edu-top { display: flex; justify-content: space-between; font-size: 0.82rem; font-weight: 700; }
.tmpl3-degree { color: #1c1917; }
.tmpl3-yr { color: #78716c; }
.tmpl3-sub { font-size: 0.77rem; color: #57534e; }
.tmpl3-bullets { padding-left: 1.2rem; font-size: 0.82rem; font-family: 'Inter', sans-serif; color: #292524; }
.tmpl3-bullets li { margin-bottom: 0.22rem; }
.tmpl3-personal-inline { display: flex; flex-wrap: wrap; gap: 0.75rem; font-size: 0.79rem; font-family: 'Inter', sans-serif; color: #44403c; background: #fafaf9; border: 1px solid #f5f5f4; border-radius: 6px; padding: 0.45rem 0.7rem; }

/* ==========================================================================
   TEMPLATE 4: TECH & CREATIVE
   ========================================================================== */
.template-4 { padding: 0 !important; font-family: 'Poppins', sans-serif; color: #0f172a; display: block !important; }
.tmpl4-container { display: flex; flex-direction: column; height: 100%; max-height: 295mm; }
.tmpl4-banner { background: linear-gradient(135deg, #0f172a 0%, #1e3a8a 100%); color: white; padding: 8mm 12mm; display: flex; justify-content: space-between; align-items: center; }
.tmpl4-name { font-size: 1.65rem; font-weight: 700; letter-spacing: -0.01em; }
.tmpl4-tagline { font-size: 0.83rem; color: #bfdbfe; font-weight: 400; margin-top: 0.1rem; }
.tmpl4-pills { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.4rem; }
.tmpl4-pill { background: rgba(255, 255, 255, 0.16); backdrop-filter: blur(4px); padding: 0.25rem 0.65rem; border-radius: 16px; font-size: 0.74rem; color: #ffffff; display: inline-flex; align-items: center; gap: 0.35rem; border: 1px solid rgba(255, 255, 255, 0.25); }
.tmpl4-avatar { width: 90px; height: 105px; border-radius: 8px; border: 2px solid rgba(255, 255, 255, 0.4); }
.tmpl4-body { padding: 8mm 12mm 10mm 12mm; flex: 1; display: flex; flex-direction: column; gap: 0.85rem; justify-content: flex-start !important; }
.tmpl4-heading { font-size: 0.86rem; font-weight: 700; color: #1e3a8a; border-left: 4px solid #2563eb; padding-left: 0.4rem; margin-bottom: 0.4rem; display: flex; align-items: center; gap: 0.4rem; }
.tmpl4-text { font-size: 0.81rem; color: #334155; line-height: 1.45; }
.tmpl4-skill-tags { display: flex; flex-wrap: wrap; gap: 0.38rem; }
.tmpl4-skill-badge { background: #eff6ff; color: #1e40af; border: 1px solid #dbeafe; padding: 0.3rem 0.65rem; border-radius: 6px; font-size: 0.76rem; font-weight: 600; display: inline-flex; align-items: center; }
.tmpl4-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.81rem; margin-top: 0.2rem; }
.tmpl4-table th { background: #f8fafc; color: #0f172a; font-weight: 700; text-transform: uppercase; font-size: 0.75rem; letter-spacing: 0.05em; padding: 0.45rem 0.65rem; border-bottom: 2px solid #cbd5e1; }
.tmpl4-table td { padding: 0.45rem 0.65rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl4-marks-badge { background: #e2e8f0; color: #0f172a; padding: 0.1rem 0.35rem; border-radius: 4px; font-weight: 700; }
.tmpl4-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl4-list li { margin-bottom: 0.22rem; }
.tmpl4-personal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem; font-size: 0.79rem; color: #334155; }

/* ==========================================================================
   TEMPLATE 5: CORPORATE ELITE
   ========================================================================== */
.template-5 { padding: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif; color: #1e293b; display: block !important; }
.tmpl5-container { display: flex; flex-direction: column; height: auto; max-height: 100%; }
.tmpl5-header { background: #064e3b; color: white; padding: 8mm 12mm; display: flex; justify-content: space-between; align-items: center; }
.tmpl5-name { font-size: 1.65rem; font-weight: 800; letter-spacing: -0.01em; }
.tmpl5-photo-wrap { width: 85px; height: 100px; border-radius: 8px; border: 2px solid #a7f3d0; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl5-photo-wrap img { width: 100%; height: 100%; object-fit: cover; display: block; }
.tmpl5-contact-stripe { background: #f0fdf4; border-bottom: 1px solid #a7f3d0; color: #065f46; padding: 0.4rem 12mm; margin-bottom: 0.2rem; display: flex; flex-wrap: wrap; align-items: center; gap: 0.35rem 1.4rem; font-size: 0.76rem; font-weight: 600; }
.tmpl5-item { white-space: nowrap !important; display: inline-flex !important; align-items: center !important; gap: 0.35rem !important; flex-shrink: 0 !important; }
.tmpl5-addr { display: inline-flex; align-items: center; gap: 0.35rem; word-break: break-word; }
.tmpl5-body { padding: 6mm 12mm 10mm 12mm; display: flex; flex-direction: column; gap: 0.85rem; justify-content: flex-start !important; }
.tmpl5-sec-title { font-size: 0.86rem; font-weight: 800; color: #064e3b; background: linear-gradient(90deg, #ecfdf5 0%, #ffffff 100%); border-left: 4px solid #059669; padding: 0.25rem 0.65rem; margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl5-text { font-size: 0.81rem; color: #334155; line-height: 1.45; }
.tmpl5-edu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tmpl5-edu-card { background: #f8fafc; border: 1px solid #e2e8f0; border-left: 3px solid #059669; border-radius: 6px; padding: 0.45rem 0.55rem; font-size: 0.79rem; }
.tmpl5-degree { font-weight: 700; color: #0f172a; }
.tmpl5-inst { color: #64748b; margin: 0.08rem 0; }
.tmpl5-meta { display: flex; justify-content: space-between; font-size: 0.73rem; color: #047857; }
.tmpl5-row-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 0.95rem; }
.tmpl5-list { padding-left: 1.15rem; font-size: 0.81rem; color: #334155; }
.tmpl5-list li { margin-bottom: 0.22rem; }
.tmpl5-personal-box { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f0fdf4; border: 1px solid #d1fae5; padding: 0.5rem; border-radius: 6px; }

/* ==========================================================================
   TEMPLATE 6: SPLIT MINIMAL MODERN
   ========================================================================== */
.template-6 { font-family: 'Inter', sans-serif; color: #1e293b; padding: 10mm 14mm 10mm 14mm; justify-content: flex-start !important; }
.tmpl6-container { display: flex; flex-direction: column; gap: 0.85rem; justify-content: flex-start; height: auto; max-height: 100%; }
.tmpl6-header { display: flex; align-items: center; gap: 1.1rem; border-bottom: 2px solid #f3e8ff; padding-bottom: 0.65rem; margin-bottom: 0.35rem; }
.tmpl6-photo { width: 85px; height: 100px; border-radius: 8px; border: 2px solid #7c3aed; box-shadow: 0 0 0 2px #ffffff, 0 6px 16px rgba(107,33,168,0.18); }
.tmpl6-name { font-size: 1.65rem; font-weight: 800; color: #3b0764; text-transform: uppercase; letter-spacing: 0.03em; }
.tmpl6-tagline { font-size: 0.85rem; font-weight: 600; color: #6b21a8; margin-top: 0.12rem; }
.tmpl6-contacts { display: flex; flex-wrap: wrap; gap: 0.9rem; font-size: 0.77rem; color: #475569; margin-top: 0.28rem; }
.tmpl6-contacts span i { color: #6b21a8; margin-right: 0.2rem; }
.tmpl6-heading { font-size: 0.86rem; font-weight: 800; color: #581c87; border-left: 4px solid #6b21a8; padding-left: 0.45rem; margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl6-text { font-size: 0.82rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl6-pills { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tmpl6-pill { background: #faf5ff; color: #581c87; border: 1px solid #e9d5ff; padding: 0.28rem 0.65rem; border-radius: 16px; font-size: 0.76rem; font-weight: 600; }
.tmpl6-edu-timeline { display: flex; flex-direction: column; gap: 0.4rem; }
.tmpl6-edu-item { display: flex; align-items: center; gap: 0.65rem; font-size: 0.8rem; background: #faf5ff; padding: 0.4rem 0.65rem; border-radius: 6px; border: 1px solid #f3e8ff; }
.tmpl6-edu-year { background: linear-gradient(135deg, #7c3aed, #581c87); color: white; padding: 0.22rem 0.58rem; border-radius: 10px; font-weight: 700; font-size: 0.73rem; flex-shrink: 0; }
.tmpl6-edu-content { flex: 1; }
.tmpl6-edu-content p { color: #64748b; font-size: 0.76rem; margin-top: 0.08rem; }
.tmpl6-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl6-list li { margin-bottom: 0.22rem; }
.tmpl6-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; color: #475569; background: #faf5ff; border: 1px solid #f3e8ff; padding: 0.55rem 0.7rem; border-radius: 6px; }

/* ==========================================================================
   TEMPLATE 7: IVY LEAGUE CLASSIC (Harvard / Wharton Academic Format)
   ========================================================================== */
.template-7 { font-family: 'Merriweather', Georgia, serif; color: #0f172a; padding: 12mm 16mm; justify-content: flex-start !important; }
.tmpl7-container { display: flex; flex-direction: column; gap: 0.85rem; }
.tmpl7-header { text-align: center; border-top: 1.5px solid #0f172a; border-bottom: 1.5px solid #0f172a; padding: 0.6rem 0; margin-bottom: 0.4rem; }
.tmpl7-name { font-size: 1.85rem; font-weight: 700; color: #0f172a; text-transform: uppercase; letter-spacing: 0.06em; }
.tmpl7-tagline { font-size: 0.88rem; font-style: italic; color: #334155; margin-top: 0.2rem; }
.tmpl7-contact { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 0.35rem 1rem; font-size: 0.8rem; color: #475569; margin-top: 0.4rem; font-family: 'Inter', sans-serif; }
.tmpl7-contact-item { white-space: nowrap; }
.tmpl7-contact-address { width: 100%; text-align: left; font-size: 0.8rem; color: #475569; margin-top: 0.15rem; overflow-wrap: break-word; }
.tmpl7-heading { font-size: 0.92rem; font-weight: 700; color: #0f172a; text-transform: uppercase; letter-spacing: 0.07em; border-bottom: 1px solid #0f172a; padding-bottom: 0.18rem; margin-bottom: 0.4rem; }
.tmpl7-text { font-size: 0.83rem; font-family: 'Inter', sans-serif; color: #1e293b; line-height: 1.45; text-align: justify; }
.tmpl7-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.82rem; font-family: 'Inter', sans-serif; }
.tmpl7-table th { background: #f8fafc; color: #0f172a; font-weight: 700; text-transform: uppercase; font-size: 0.76rem; letter-spacing: 0.05em; padding: 0.45rem 0.65rem; border-bottom: 1.5px solid #0f172a; }
.tmpl7-table td { padding: 0.45rem 0.65rem; border-bottom: 1px solid #e2e8f0; color: #1e293b; }
.tmpl7-list { padding-left: 1.25rem; font-size: 0.83rem; font-family: 'Inter', sans-serif; color: #1e293b; }
.tmpl7-list li { margin-bottom: 0.22rem; }
.tmpl7-personal-grid { display: flex; flex-wrap: wrap; gap: 0.8rem; font-size: 0.8rem; font-family: 'Inter', sans-serif; color: #334155; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.75rem; border-radius: 4px; }

/* ==========================================================================
   TEMPLATE 8: SLATE & CHARCOAL (Corporate Leader Format)
   ========================================================================== */
.template-8 { padding: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif; color: #0f172a; display: block !important; }
.tmpl8-container { display: flex; flex-direction: column; height: auto; max-height: 100%; }
.tmpl8-banner { background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); color: white; padding: 8mm 12mm; display: flex; justify-content: space-between; align-items: center; }
.tmpl8-name { font-size: 1.75rem; font-weight: 800; letter-spacing: 0.01em; }
.tmpl8-tagline { font-size: 0.85rem; color: #94a3b8; margin-top: 0.15rem; font-weight: 500; }
.tmpl8-pills { display: flex; flex-wrap: wrap; gap: 0.35rem; margin-top: 0.4rem; }
.tmpl8-pill { background: rgba(255, 255, 255, 0.1); padding: 0.25rem 0.65rem; border-radius: 14px; font-size: 0.74rem; color: #e2e8f0; border: 1px solid rgba(255, 255, 255, 0.18); }
.tmpl8-avatar { width: 90px; height: 105px; border-radius: 10px; border: 2px solid rgba(255, 255, 255, 0.3); }
.tmpl8-body { padding: 8mm 12mm 10mm 12mm; display: flex; flex-direction: column; gap: 0.85rem; justify-content: flex-start !important; }
.tmpl8-heading { font-size: 0.88rem; font-weight: 800; color: #1e293b; background: #f8fafc; border-left: 4px solid #1e3a8a; padding: 0.25rem 0.6rem; margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl8-text { font-size: 0.82rem; color: #334155; line-height: 1.45; }
.tmpl8-skills { display: flex; flex-wrap: wrap; gap: 0.38rem; }
.tmpl8-skill-badge { background: #f1f5f9; color: #0f172a; border: 1px solid #cbd5e1; padding: 0.3rem 0.65rem; border-radius: 6px; font-size: 0.76rem; font-weight: 600; }
.tmpl8-edu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tmpl8-edu-card { background: #f8fafc; border: 1px solid #e2e8f0; border-left: 3px solid #1e3a8a; border-radius: 6px; padding: 0.45rem 0.6rem; font-size: 0.79rem; }
.tmpl8-degree { font-weight: 700; color: #0f172a; }
.tmpl8-inst { color: #64748b; margin: 0.08rem 0; }
.tmpl8-meta { display: flex; justify-content: space-between; font-size: 0.73rem; color: #1e3a8a; font-weight: 600; }
.tmpl8-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl8-list li { margin-bottom: 0.22rem; }
.tmpl8-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.65rem; border-radius: 6px; color: #334155; }

/* ==========================================================================
   TEMPLATE 9: MINIMALIST TIMELINE (Contemporary Dot Matrix Format)
   ========================================================================== */
.template-9 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 10mm 14mm 10mm 14mm; justify-content: flex-start !important; }
.tmpl9-container { display: flex; flex-direction: column; gap: 0.85rem; }
.tmpl9-header { display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #2563eb; padding-bottom: 0.6rem; margin-bottom: 0.35rem; }
.tmpl9-photo { width: 85px; height: 100px; border-radius: 8px; border: 2px solid #2563eb; }
.tmpl9-name { font-size: 1.75rem; font-weight: 800; color: #0f172a; text-transform: uppercase; letter-spacing: 0.03em; }
.tmpl9-tagline { font-size: 0.86rem; font-weight: 600; color: #2563eb; margin-top: 0.12rem; }
.tmpl9-contacts { display: flex; flex-wrap: wrap; gap: 0.85rem; font-size: 0.78rem; color: #475569; margin-top: 0.3rem; }
.tmpl9-contacts span i { color: #2563eb; margin-right: 0.2rem; }
.tmpl9-heading { font-size: 0.88rem; font-weight: 800; color: #1e3a8a; border-left: 4px solid #2563eb; padding-left: 0.45rem; margin-bottom: 0.4rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl9-text { font-size: 0.82rem; color: #334155; line-height: 1.45; }
.tmpl9-skills { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tmpl9-skill-badge { background: #eff6ff; color: #1e40af; border: 1px solid #dbeafe; padding: 0.28rem 0.65rem; border-radius: 16px; font-size: 0.76rem; font-weight: 600; }
.tmpl9-timeline { border-left: 2px solid #2563eb; padding-left: 0.75rem; display: flex; flex-direction: column; gap: 0.45rem; margin-left: 0.3rem; }
.tmpl9-timeline-item { position: relative; font-size: 0.8rem; }
.tmpl9-timeline-item::before { content: ''; position: absolute; left: -0.92rem; top: 0.35rem; width: 7px; height: 7px; background: #2563eb; border-radius: 50%; }
.tmpl9-tl-top { display: flex; justify-content: space-between; font-weight: 700; color: #0f172a; }
.tmpl9-tl-year { background: #dbeafe; color: #1e40af; padding: 0.05rem 0.4rem; border-radius: 4px; font-size: 0.74rem; }
.tmpl9-tl-sub { color: #64748b; font-size: 0.76rem; margin-top: 0.08rem; }
.tmpl9-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl9-list li { margin-bottom: 0.22rem; }
.tmpl9-personal-box { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; color: #475569; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.7rem; border-radius: 6px; }

/* ==========================================================================
   TEMPLATE 10: BESPOKE EDUCATOR & SCHOLAR (Oxford Academic Leader)
   ========================================================================== */
.template-10 { font-family: 'Plus Jakarta Sans', 'Inter', sans-serif; color: #1e293b; padding: 9mm 12mm; justify-content: flex-start !important; }
.tmpl10-container { display: flex; flex-direction: column; gap: 0.7rem; }
.tmpl10-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #1e3a8a; padding-bottom: 0.55rem; }
.tmpl10-name { font-size: 1.8rem; font-weight: 800; color: #0f172a; letter-spacing: -0.02em; margin-bottom: 0.15rem; text-transform: uppercase; }
.tmpl10-tagline-badge { display: inline-block; background: #eff6ff; color: #1e3a8a; font-weight: 700; font-size: 0.82rem; padding: 0.18rem 0.6rem; border-radius: 4px; border-left: 3px solid #1e3a8a; margin-bottom: 0.35rem; }
.tmpl10-contacts { display: flex; gap: 0.85rem; font-size: 0.78rem; color: #475569; flex-wrap: wrap; }
.tmpl10-contacts span { display: flex; align-items: center; gap: 0.3rem; }
.tmpl10-contacts i { color: #1e3a8a; font-size: 0.8rem; }
.tmpl10-photo-box { width: 90px; height: 108px; border-radius: 8px; border: 2px solid #1e3a8a; box-shadow: 0 4px 12px rgba(30, 58, 138, 0.15); overflow: hidden; flex-shrink: 0; }
.tmpl10-photo-box img { width: 100%; height: 100%; object-fit: cover; }
.tmpl10-sec { margin-bottom: 0.15rem; }
.tmpl10-sec-head { display: flex; align-items: center; gap: 0.45rem; font-size: 0.86rem; font-weight: 800; color: #0f172a; text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1.5px solid #cbd5e1; padding-bottom: 0.2rem; margin-bottom: 0.35rem; }
.tmpl10-sec-head i { color: #1e3a8a; font-size: 0.9rem; }
.tmpl10-summary-box { background: #f8fafc; border-left: 3.5px solid #1e3a8a; padding: 0.45rem 0.75rem; border-radius: 0 6px 6px 0; font-size: 0.81rem; line-height: 1.45; color: #334155; white-space: pre-line; overflow-wrap: break-word; word-break: break-word; }
.tmpl10-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; }
.tmpl10-table th { background: #1e3a8a; color: #ffffff; font-weight: 700; text-transform: uppercase; font-size: 0.74rem; letter-spacing: 0.05em; padding: 0.4rem 0.6rem; }
.tmpl10-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl10-table tr:nth-child(even) { background-color: #f8fafc; }
.tmpl10-table th:nth-child(1), .tmpl10-table td:nth-child(1) { width: 28%; text-align: left !important; }
.tmpl10-table th:nth-child(2), .tmpl10-table td:nth-child(2) { width: 44%; text-align: left !important; }
.tmpl10-table th:nth-child(3), .tmpl10-table td:nth-child(3) { width: 13%; text-align: center !important; }
.tmpl10-table th:nth-child(4), .tmpl10-table td:nth-child(4) { width: 15%; text-align: center !important; }
.tmpl10-skills-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem 1.2rem; }
.tmpl10-skill-item { font-size: 0.8rem; color: #1e293b; display: flex; align-items: center; gap: 0.45rem; }
.tmpl10-skill-item i { color: #1e3a8a; font-size: 0.8rem; }
.tmpl10-cert-card { background: #f8fafc; border: 1px solid #cbd5e1; border-radius: 6px; padding: 0.38rem 0.65rem; margin-bottom: 0.35rem; display: flex; align-items: center; gap: 0.5rem; font-size: 0.81rem; font-weight: 600; color: #0f172a; }
.tmpl10-cert-card i { color: #1e3a8a; font-size: 0.9rem; }
.tmpl10-personal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.45rem; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.75rem; border-radius: 6px; font-size: 0.79rem; color: #334155; }
.tmpl10-personal-grid div strong { color: #0f172a; }
.tmpl10-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl10-list li { margin-bottom: 0.22rem; }

/* ==========================================================================
   TEMPLATE 11: STANFORD ACADEMIC (Minimalist Monochrome ATS)
   ========================================================================== */
.template-11 { font-family: 'Merriweather', Georgia, serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl11-container { display: flex; flex-direction: column; gap: 0.75rem; }
.tmpl11-header { text-align: center; border-bottom: 2px solid #0f172a; padding-bottom: 0.5rem; }
.tmpl11-name { font-size: 1.9rem; font-weight: 700; color: #0f172a; letter-spacing: 0.04em; text-transform: uppercase; margin-bottom: 0.2rem; }
.tmpl11-tagline { font-size: 0.86rem; font-weight: 400; font-style: italic; color: #334155; margin-bottom: 0.35rem; }
.tmpl11-contacts { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0.3rem 0.9rem; font-size: 0.78rem; color: #334155; font-family: 'Inter', sans-serif; margin-top: 0.3rem; }
.tmpl11-contact-item { white-space: nowrap; }
.tmpl11-contact-address { width: 100%; text-align: center; font-size: 0.78rem; color: #334155; margin-top: 0.1rem; overflow-wrap: break-word; }
.tmpl11-sec-title { font-family: 'Inter', sans-serif; font-size: 0.86rem; font-weight: 800; color: #0f172a; text-transform: uppercase; letter-spacing: 0.08em; border-bottom: 1px solid #0f172a; padding-bottom: 0.15rem; margin-bottom: 0.35rem; }
.tmpl11-text { font-size: 0.82rem; line-height: 1.45; color: #334155; text-align: justify; white-space: pre-line; overflow-wrap: break-word; word-break: break-word; }
.tmpl11-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; font-family: 'Inter', sans-serif; }
.tmpl11-table th { border-bottom: 1.5px solid #0f172a; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; padding: 0.4rem 0.6rem; color: #0f172a; }
.tmpl11-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl11-table th:nth-child(1), .tmpl11-table td:nth-child(1) { width: 28%; text-align: left !important; }
.tmpl11-table th:nth-child(2), .tmpl11-table td:nth-child(2) { width: 44%; text-align: left !important; }
.tmpl11-table th:nth-child(3), .tmpl11-table td:nth-child(3) { width: 13%; text-align: center !important; }
.tmpl11-table th:nth-child(4), .tmpl11-table td:nth-child(4) { width: 15%; text-align: center !important; }
.tmpl11-list { padding-left: 1.2rem; font-size: 0.82rem; color: #334155; font-family: 'Inter', sans-serif; }
.tmpl11-list li { margin-bottom: 0.2rem; }
.tmpl11-personal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; font-size: 0.8rem; font-family: 'Inter', sans-serif; border-top: 1px solid #cbd5e1; padding-top: 0.4rem; }

/* ==========================================================================
   TEMPLATE 12: EMERALD SENIOR FACULTY (Executive Leader)
   ========================================================================== */
.template-12 { font-family: 'Plus Jakarta Sans', sans-serif; color: #064e3b; padding: 9mm 12mm; justify-content: flex-start !important; }
.tmpl12-container { display: flex; flex-direction: column; gap: 0.75rem; }
.tmpl12-header { display: flex; justify-content: space-between; align-items: center; background: #ecfdf5; border-left: 5px solid #047857; padding: 0.75rem 1rem; border-radius: 0 8px 8px 0; }
.tmpl12-name { font-size: 1.8rem; font-weight: 800; color: #064e3b; text-transform: uppercase; letter-spacing: -0.01em; margin-bottom: 0.15rem; }
.tmpl12-tagline { font-size: 0.85rem; font-weight: 700; color: #047857; margin-bottom: 0.3rem; }
.tmpl12-contacts { display: flex; gap: 0.85rem; font-size: 0.78rem; color: #065f46; flex-wrap: wrap; }
.tmpl12-contacts span i { color: #047857; margin-right: 0.25rem; }
.tmpl12-photo { width: 90px; height: 105px; border-radius: 8px; border: 2px solid #047857; overflow: hidden; flex-shrink: 0; }
.tmpl12-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl12-sec-head { font-size: 0.86rem; font-weight: 800; color: #064e3b; text-transform: uppercase; letter-spacing: 0.06em; border-left: 4px solid #047857; padding-left: 0.45rem; margin-bottom: 0.35rem; }
.tmpl12-text { font-size: 0.82rem; color: #166534; line-height: 1.45; white-space: pre-line; overflow-wrap: break-word; word-break: break-word; }
.tmpl12-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; }
.tmpl12-table th { background: #047857; color: white; font-weight: 700; text-transform: uppercase; font-size: 0.74rem; padding: 0.4rem 0.6rem; }
.tmpl12-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #a7f3d0; color: #065f46; }
.tmpl12-table tr:nth-child(even) { background-color: #ecfdf5; }
.tmpl12-table th:nth-child(1), .tmpl12-table td:nth-child(1) { width: 28%; text-align: left !important; }
.tmpl12-table th:nth-child(2), .tmpl12-table td:nth-child(2) { width: 44%; text-align: left !important; }
.tmpl12-table th:nth-child(3), .tmpl12-table td:nth-child(3) { width: 13%; text-align: center !important; }
.tmpl12-table th:nth-child(4), .tmpl12-table td:nth-child(4) { width: 15%; text-align: center !important; }
.tmpl12-skills-grid { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.tmpl12-skill-badge { background: #ecfdf5; color: #047857; border: 1px solid #a7f3d0; padding: 0.28rem 0.65rem; border-radius: 6px; font-size: 0.78rem; font-weight: 600; }
.tmpl12-cert-card { background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 6px; padding: 0.38rem 0.65rem; margin-bottom: 0.35rem; font-size: 0.81rem; font-weight: 600; color: #064e3b; display: flex; align-items: center; gap: 0.45rem; }
.tmpl12-personal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.4rem; font-size: 0.79rem; color: #065f46; background: #ecfdf5; border: 1px solid #a7f3d0; padding: 0.5rem 0.7rem; border-radius: 6px; }
.tmpl12-list { padding-left: 1.2rem; font-size: 0.81rem; color: #065f46; }
.tmpl12-list li { margin-bottom: 0.22rem; }


/* Screen Responsiveness */
@media (max-width: 1024px) {
    .main-layout { flex-direction: column; }
    .editor-sidebar { width: 100%; height: auto; max-height: 500px; }
    .preview-area { width: 100%; }
    .resume-paper { width: 100%; max-width: 210mm; }
}

/* Smart Auto-Fit 1-Page Scaling Utilities */
.resume-paper.compact-tight {
    padding: 6mm 10mm !important;
}
.resume-paper.compact-tight .tmpl10-container,
.resume-paper.compact-tight .tmpl11-container,
.resume-paper.compact-tight .tmpl12-container {
    gap: 0.38rem !important;
}
.resume-paper.compact-tight td, 
.resume-paper.compact-tight th {
    padding: 0.22rem 0.45rem !important;
}
.resume-paper.compact-tight .tmpl10-sec-head,
.resume-paper.compact-tight .tmpl11-sec-title,
.resume-paper.compact-tight .tmpl12-sec-head {
    margin-bottom: 0.2rem !important;
    padding-bottom: 0.1rem !important;
}

.resume-paper.compact-super {
    padding: 4mm 8mm !important;
}
.resume-paper.compact-super .tmpl10-container,
.resume-paper.compact-super .tmpl11-container,
.resume-paper.compact-super .tmpl12-container,
.resume-paper.compact-super .tmpl13-container,
.resume-paper.compact-super .tmpl14-container,
.resume-paper.compact-super .tmpl15-container,
.resume-paper.compact-super .tmpl16-container {
    gap: 0.2rem !important;
}
.resume-paper.compact-super td, 
.resume-paper.compact-super th {
    padding: 0.15rem 0.35rem !important;
    font-size: 0.74rem !important;
}
.resume-paper.compact-super p,
.resume-paper.compact-super div,
.resume-paper.compact-super li,
.resume-paper.compact-super td {
    font-size: 0.75rem !important;
    line-height: 1.32 !important;
}

/* ==========================================================================
   TEMPLATE 13: CAMBRIDGE EXECUTIVE ATS (Navy Minimalist)
   ========================================================================== */
.template-13 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl13-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl13-header { display: flex; justify-content: space-between; align-items: center; }
.tmpl13-hinfo { flex: 1; }
.tmpl13-name { font-size: 1.85rem; font-weight: 800; color: #1e3a8a; letter-spacing: -0.01em; }
.tmpl13-tagline { font-size: 0.86rem; color: #475569; margin-top: 0.15rem; font-weight: 500; }
.tmpl13-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1.1rem; font-size: 0.78rem; color: #334155; margin-top: 0.4rem; }
.tmpl13-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl13-contacts i { color: #1e3a8a; }
.tmpl13-photo { width: 85px; height: 105px; border-radius: 8px; border: 2px solid #1e3a8a; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl13-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl13-stripe { height: 3px; background: linear-gradient(90deg, #1e3a8a 0%, #3b82f6 100%); border-radius: 2px; margin: 0.2rem 0; }
.tmpl13-sec-title { font-size: 0.85rem; font-weight: 800; color: #1e3a8a; border-bottom: 1.5px solid #cbd5e1; padding-bottom: 0.15rem; margin-bottom: 0.35rem; text-transform: uppercase; letter-spacing: 0.05em; display: flex; align-items: center; gap: 0.4rem; }
.tmpl13-text { font-size: 0.82rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl13-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; }
.tmpl13-table th { background: #f8fafc; border-bottom: 2px solid #1e3a8a; color: #0f172a; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; padding: 0.4rem 0.6rem; text-align: left; }
.tmpl13-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl13-table th:nth-child(1), .tmpl13-table td:nth-child(1) { width: 30%; }
.tmpl13-table th:nth-child(2), .tmpl13-table td:nth-child(2) { width: 42%; }
.tmpl13-table th:nth-child(3), .tmpl13-table td:nth-child(3) { width: 13%; text-align: center; }
.tmpl13-table th:nth-child(4), .tmpl13-table td:nth-child(4) { width: 15%; text-align: right; }
.tmpl13-badge { background: #eff6ff; color: #1e3a8a; border: 1px solid #bfdbfe; padding: 0.15rem 0.45rem; border-radius: 4px; font-weight: 700; font-size: 0.75rem; }
.tmpl13-pills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl13-pill { background: #f1f5f9; color: #1e293b; border: 1px solid #cbd5e1; padding: 0.25rem 0.6rem; border-radius: 5px; font-size: 0.76rem; font-weight: 600; }
.tmpl13-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl13-list li { margin-bottom: 0.22rem; }
.tmpl13-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.7rem; border-radius: 6px; color: #334155; }

/* ==========================================================================
   TEMPLATE 14: SILICON VALLEY TECH LEAD (Teal & Mint)
   ========================================================================== */
.template-14 { padding: 0 !important; font-family: 'Plus Jakarta Sans', sans-serif; color: #0f172a; display: block !important; }
.tmpl14-container { display: flex; flex-direction: column; height: auto; max-height: 100%; }
.tmpl14-header { background: #0f766e; color: white; padding: 8mm 12mm; display: flex; align-items: center; gap: 1.2rem; }
.tmpl14-avatar { width: 95px; height: 110px; border-radius: 10px; border: 2.5px solid #ccfbf1; overflow: hidden; flex-shrink: 0; box-shadow: 0 4px 12px rgba(0,0,0,0.25); }
.tmpl14-avatar img { width: 100%; height: 100%; object-fit: cover; }
.tmpl14-hinfo { flex: 1; }
.tmpl14-name { font-size: 1.75rem; font-weight: 800; letter-spacing: -0.01em; }
.tmpl14-role-badge { display: inline-block; background: rgba(255, 255, 255, 0.18); border: 1px solid rgba(255, 255, 255, 0.3); color: #ccfbf1; padding: 0.2rem 0.65rem; border-radius: 14px; font-size: 0.78rem; font-weight: 600; margin-top: 0.25rem; }
.tmpl14-contacts { display: flex; flex-wrap: wrap; gap: 0.4rem 1.1rem; font-size: 0.76rem; color: #e6fffa; margin-top: 0.45rem; }
.tmpl14-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl14-contacts i { color: #5eead4; }
.tmpl14-body { padding: 7mm 12mm 10mm 12mm; display: flex; flex-direction: column; gap: 0.8rem; }
.tmpl14-heading { font-size: 0.86rem; font-weight: 800; color: #0f766e; background: #f0fdf4; border-left: 4px solid #0d9488; padding: 0.25rem 0.65rem; margin-bottom: 0.35rem; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl14-text { font-size: 0.81rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl14-skills-grid { display: flex; flex-wrap: wrap; gap: 0.38rem; }
.tmpl14-skill-tag { background: #f0fdf4; color: #0f766e; border: 1px solid #99f6e4; padding: 0.28rem 0.65rem; border-radius: 6px; font-size: 0.76rem; font-weight: 600; display: inline-flex; align-items: center; gap: 0.3rem; }
.tmpl14-skill-tag i { font-size: 0.7rem; color: #0d9488; }
.tmpl14-edu-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tmpl14-edu-card { background: #f8fafc; border: 1px solid #e2e8f0; border-left: 3px solid #0f766e; padding: 0.45rem 0.6rem; border-radius: 6px; font-size: 0.79rem; }
.tmpl14-edu-head { display: flex; justify-content: space-between; font-weight: 700; color: #0f172a; }
.tmpl14-year { color: #0d9488; font-weight: 700; font-size: 0.74rem; }
.tmpl14-inst { color: #64748b; font-size: 0.75rem; margin-top: 0.15rem; }
.tmpl14-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl14-list li { margin-bottom: 0.22rem; }
.tmpl14-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f0fdf4; border: 1px solid #ccfbf1; padding: 0.5rem 0.65rem; border-radius: 6px; color: #0f766e; }

/* ==========================================================================
   TEMPLATE 15: OXFORD SCHOLAR CLASSIC (Serif Double Rule)
   ========================================================================== */
.template-15 { font-family: 'Merriweather', Georgia, serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl15-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl15-header { text-align: left; }
.tmpl15-rule-top { border-top: 2px solid #0f172a; margin-bottom: 0.4rem; }
.tmpl15-rule-bot { border-bottom: 2px solid #0f172a; margin-top: 0.4rem; }
.tmpl15-hflex { display: flex; justify-content: space-between; align-items: center; }
.tmpl15-hinfo { flex: 1; }
.tmpl15-name { font-size: 1.9rem; font-weight: 700; color: #0f172a; text-transform: uppercase; letter-spacing: 0.05em; }
.tmpl15-tagline { font-size: 0.86rem; font-style: italic; color: #334155; margin-top: 0.15rem; }
.tmpl15-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: 0.78rem; color: #475569; margin-top: 0.35rem; font-family: 'Inter', sans-serif; }
.tmpl15-contacts span { white-space: nowrap; }
.tmpl15-photo { width: 85px; height: 105px; border-radius: 6px; border: 1px solid #0f172a; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl15-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl15-sec-head { font-size: 0.88rem; font-weight: 700; color: #0f172a; text-transform: uppercase; letter-spacing: 0.07em; border-bottom: 1px solid #0f172a; padding-bottom: 0.15rem; margin-bottom: 0.35rem; font-family: 'Inter', sans-serif; }
.tmpl15-text { font-size: 0.82rem; line-height: 1.45; color: #334155; text-align: justify; }
.tmpl15-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; font-family: 'Inter', sans-serif; }
.tmpl15-table th { border-bottom: 1.5px solid #0f172a; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; padding: 0.4rem 0.6rem; text-align: left; color: #0f172a; }
.tmpl15-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl15-table th:nth-child(1), .tmpl15-table td:nth-child(1) { width: 30%; }
.tmpl15-table th:nth-child(2), .tmpl15-table td:nth-child(2) { width: 42%; }
.tmpl15-table th:nth-child(3), .tmpl15-table td:nth-child(3) { width: 13%; text-align: center; }
.tmpl15-table th:nth-child(4), .tmpl15-table td:nth-child(4) { width: 15%; text-align: right; }
.tmpl15-list { padding-left: 1.25rem; font-size: 0.82rem; font-family: 'Inter', sans-serif; color: #334155; }
.tmpl15-list li { margin-bottom: 0.22rem; }
.tmpl15-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; font-family: 'Inter', sans-serif; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.5rem 0.7rem; border-radius: 4px; color: #334155; }

/* ==========================================================================
   TEMPLATE 16: TOKYO CONTEMPORARY (Obsidian & Slate)
   ========================================================================== */
.template-16 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl16-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl16-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #0f172a; padding-bottom: 0.55rem; }
.tmpl16-hleft { flex: 1; }
.tmpl16-name { font-size: 1.85rem; font-weight: 900; color: #0f172a; letter-spacing: -0.02em; }
.tmpl16-tagline-pill { display: inline-block; background: #0f172a; color: #ffffff; padding: 0.2rem 0.65rem; border-radius: 4px; font-size: 0.76rem; font-weight: 600; margin-top: 0.2rem; }
.tmpl16-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1.1rem; font-size: 0.77rem; color: #475569; margin-top: 0.45rem; }
.tmpl16-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl16-contacts i { color: #0f172a; }
.tmpl16-photo { width: 85px; height: 105px; border-radius: 6px; border: 2px solid #0f172a; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl16-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl16-sec-title { font-size: 0.85rem; font-weight: 800; color: #0f172a; text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1.5px solid #0f172a; padding-bottom: 0.15rem; margin-bottom: 0.35rem; }
.tmpl16-text { font-size: 0.81rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl16-edu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tmpl16-edu-item { background: #f8fafc; border: 1px solid #cbd5e1; border-top: 3px solid #0f172a; padding: 0.45rem 0.6rem; border-radius: 4px; font-size: 0.79rem; }
.tmpl16-edu-qual { font-weight: 800; color: #0f172a; }
.tmpl16-edu-inst { color: #64748b; font-size: 0.75rem; margin: 0.1rem 0; }
.tmpl16-edu-meta { display: flex; justify-content: space-between; font-size: 0.73rem; color: #475569; border-top: 1px dashed #e2e8f0; padding-top: 0.2rem; margin-top: 0.2rem; }
.tmpl16-skills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl16-skill-badge { background: #0f172a; color: #ffffff; padding: 0.25rem 0.6rem; border-radius: 4px; font-size: 0.75rem; font-weight: 600; }
.tmpl16-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl16-list li { margin-bottom: 0.22rem; }
.tmpl16-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f8fafc; border: 1px solid #cbd5e1; padding: 0.5rem 0.65rem; border-radius: 4px; color: #334155; }

/* ==========================================================================
   TEMPLATE 17: IMPERIAL EXECUTIVE (Indigo & Gold Accent)
   ========================================================================== */
.template-17 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl17-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl17-header { background: linear-gradient(135deg, #1e1b4b 0%, #312e81 100%); color: white; padding: 7mm 10mm; border-radius: 6px; border-bottom: 3px solid #fbbf24; display: flex; justify-content: space-between; align-items: center; }
.tmpl17-hleft { flex: 1; }
.tmpl17-name { font-size: 1.8rem; font-weight: 800; color: #ffffff; letter-spacing: -0.01em; }
.tmpl17-tagline { font-size: 0.85rem; color: #fef08a; margin-top: 0.15rem; font-weight: 500; }
.tmpl17-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1.1rem; font-size: 0.77rem; color: #e0e7ff; margin-top: 0.45rem; }
.tmpl17-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl17-contacts i { color: #fde047; }
.tmpl17-photo { width: 85px; height: 105px; border-radius: 8px; border: 2px solid #fbbf24; overflow: hidden; flex-shrink: 0; margin-left: 1rem; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.tmpl17-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl17-title { font-size: 0.86rem; font-weight: 800; color: #1e1b4b; background: #e0e7ff; border-left: 4px solid #4338ca; padding: 0.25rem 0.65rem; margin-bottom: 0.35rem; text-transform: uppercase; letter-spacing: 0.05em; display: flex; align-items: center; gap: 0.4rem; }
.tmpl17-text { font-size: 0.81rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl17-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; }
.tmpl17-table th { background: #f8fafc; border-bottom: 2px solid #1e1b4b; color: #0f172a; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; padding: 0.4rem 0.6rem; text-align: left; }
.tmpl17-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl17-table th:nth-child(1), .tmpl17-table td:nth-child(1) { width: 30%; }
.tmpl17-table th:nth-child(2), .tmpl17-table td:nth-child(2) { width: 42%; }
.tmpl17-table th:nth-child(3), .tmpl17-table td:nth-child(3) { width: 13%; text-align: center; }
.tmpl17-table th:nth-child(4), .tmpl17-table td:nth-child(4) { width: 15%; text-align: right; }
.tmpl17-badge { background: #fef9c3; color: #854d0e; border: 1px solid #fef08a; padding: 0.15rem 0.45rem; border-radius: 4px; font-weight: 700; font-size: 0.75rem; }
.tmpl17-skills-grid { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl17-skill-card { background: #e0e7ff; color: #1e1b4b; border: 1px solid #c7d2fe; padding: 0.28rem 0.65rem; border-radius: 6px; font-size: 0.76rem; font-weight: 600; display: inline-flex; align-items: center; gap: 0.35rem; }
.tmpl17-skill-card i { color: #4338ca; }
.tmpl17-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl17-list li { margin-bottom: 0.22rem; }
.tmpl17-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f8fafc; border: 1px solid #e0e7ff; padding: 0.5rem 0.7rem; border-radius: 6px; color: #334155; }

/* ==========================================================================
   TEMPLATE 18: ZURICH MINIMALIST (Clean Swiss Monochrome)
   ========================================================================== */
.template-18 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 12mm 16mm; justify-content: flex-start !important; }
.tmpl18-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl18-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #000000; padding-bottom: 0.6rem; }
.tmpl18-hleft { flex: 1; }
.tmpl18-name { font-size: 1.95rem; font-weight: 900; color: #000000; text-transform: uppercase; letter-spacing: 0.04em; }
.tmpl18-tagline { font-size: 0.86rem; color: #475569; margin-top: 0.15rem; font-weight: 500; }
.tmpl18-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: 0.78rem; color: #000000; margin-top: 0.4rem; }
.tmpl18-contacts span { white-space: nowrap; font-weight: 600; }
.tmpl18-photo { width: 85px; height: 105px; border-radius: 2px; border: 1.5px solid #000000; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl18-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl18-title { font-size: 0.85rem; font-weight: 900; color: #000000; border-bottom: 1px solid #000000; padding-bottom: 0.15rem; margin-bottom: 0.35rem; text-transform: uppercase; letter-spacing: 0.12em; }
.tmpl18-text { font-size: 0.82rem; color: #1e293b; line-height: 1.45; text-align: justify; }
.tmpl18-edu-list { display: flex; flex-direction: column; gap: 0.35rem; }
.tmpl18-edu-row { display: flex; justify-content: space-between; align-items: center; font-size: 0.81rem; border-bottom: 1px dashed #e2e8f0; padding-bottom: 0.25rem; }
.tmpl18-edu-left strong { color: #000000; font-weight: 700; }
.tmpl18-inst { color: #64748b; font-size: 0.76rem; }
.tmpl18-edu-right { display: flex; gap: 1rem; font-size: 0.78rem; color: #475569; }
.tmpl18-score { font-weight: 700; color: #000000; }
.tmpl18-skills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl18-skill-tag { background: #000000; color: #ffffff; padding: 0.22rem 0.55rem; border-radius: 2px; font-size: 0.75rem; font-weight: 600; }
.tmpl18-list { padding-left: 1.2rem; font-size: 0.81rem; color: #1e293b; }
.tmpl18-list li { margin-bottom: 0.22rem; }
.tmpl18-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #f8fafc; border: 1px solid #000000; padding: 0.5rem 0.7rem; border-radius: 2px; color: #000000; }

/* ==========================================================================
   TEMPLATE 19: PACIFIC FACULTY (Cobalt Senior Dean)
   ========================================================================== */
.template-19 { font-family: 'Inter', sans-serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl19-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl19-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2.5px solid #1e40af; padding-bottom: 0.6rem; }
.tmpl19-hleft { flex: 1; }
.tmpl19-name { font-size: 1.85rem; font-weight: 800; color: #1e40af; letter-spacing: -0.01em; }
.tmpl19-role { font-size: 0.86rem; color: #3b82f6; font-weight: 600; margin-top: 0.15rem; }
.tmpl19-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1.1rem; font-size: 0.77rem; color: #475569; margin-top: 0.45rem; }
.tmpl19-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl19-contacts i { color: #1e40af; }
.tmpl19-photo { width: 85px; height: 105px; border-radius: 8px; border: 2px solid #1e40af; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl19-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl19-sec-title { font-size: 0.85rem; font-weight: 800; color: #1e40af; text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1.5px solid #bfdbfe; padding-bottom: 0.15rem; margin-bottom: 0.35rem; }
.tmpl19-text { font-size: 0.81rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl19-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 0.81rem; }
.tmpl19-table th { background: #eff6ff; border-bottom: 2px solid #1e40af; color: #1e40af; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; padding: 0.4rem 0.6rem; text-align: left; }
.tmpl19-table td { padding: 0.4rem 0.6rem; border-bottom: 1px solid #e2e8f0; color: #334155; }
.tmpl19-table th:nth-child(1), .tmpl19-table td:nth-child(1) { width: 30%; }
.tmpl19-table th:nth-child(2), .tmpl19-table td:nth-child(2) { width: 42%; }
.tmpl19-table th:nth-child(3), .tmpl19-table td:nth-child(3) { width: 13%; text-align: center; }
.tmpl19-table th:nth-child(4), .tmpl19-table td:nth-child(4) { width: 15%; text-align: right; }
.tmpl19-badge { background: #dbeafe; color: #1e40af; border: 1px solid #bfdbfe; padding: 0.15rem 0.45rem; border-radius: 4px; font-weight: 700; font-size: 0.75rem; }
.tmpl19-skills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl19-skill-badge { background: #eff6ff; color: #1e40af; border: 1px solid #bfdbfe; padding: 0.25rem 0.6rem; border-radius: 5px; font-size: 0.76rem; font-weight: 600; }
.tmpl19-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl19-list li { margin-bottom: 0.22rem; }
.tmpl19-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #eff6ff; border: 1px solid #bfdbfe; padding: 0.5rem 0.7rem; border-radius: 6px; color: #1e40af; }

/* ==========================================================================
   TEMPLATE 20: MONACO MODERN (Charcoal & Rose Gold)
   ========================================================================== */
.template-20 { font-family: 'Plus Jakarta Sans', sans-serif; color: #0f172a; padding: 10mm 14mm; justify-content: flex-start !important; }
.tmpl20-container { display: flex; flex-direction: column; gap: 0.75rem; height: auto; max-height: 100%; }
.tmpl20-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #f43f5e; padding-bottom: 0.55rem; }
.tmpl20-hleft { flex: 1; }
.tmpl20-name { font-size: 1.85rem; font-weight: 800; color: #18181b; letter-spacing: -0.01em; }
.tmpl20-role-tag { display: inline-block; background: #fff1f2; color: #e11d48; border: 1px solid #fecdd3; padding: 0.2rem 0.65rem; border-radius: 14px; font-size: 0.76rem; font-weight: 600; margin-top: 0.2rem; }
.tmpl20-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1.1rem; font-size: 0.77rem; color: #475569; margin-top: 0.45rem; }
.tmpl20-contacts span { display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; }
.tmpl20-contacts i { color: #f43f5e; }
.tmpl20-photo { width: 85px; height: 105px; border-radius: 8px; border: 2px solid #f43f5e; overflow: hidden; flex-shrink: 0; margin-left: 1rem; }
.tmpl20-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl20-sec-title { font-size: 0.85rem; font-weight: 800; color: #18181b; text-transform: uppercase; letter-spacing: 0.06em; border-bottom: 1.5px solid #ffe4e6; padding-bottom: 0.15rem; margin-bottom: 0.35rem; }
.tmpl20-text { font-size: 0.81rem; color: #334155; line-height: 1.45; text-align: justify; }
.tmpl20-edu-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; }
.tmpl20-edu-card { background: #fff1f2; border: 1px solid #fecdd3; border-left: 3px solid #f43f5e; padding: 0.45rem 0.6rem; border-radius: 6px; font-size: 0.79rem; }
.tmpl20-edu-qual { font-weight: 800; color: #881337; }
.tmpl20-edu-inst { color: #64748b; font-size: 0.75rem; margin: 0.1rem 0; }
.tmpl20-edu-meta { display: flex; justify-content: space-between; font-size: 0.73rem; color: #9f1239; border-top: 1px dashed #fecdd3; padding-top: 0.2rem; margin-top: 0.2rem; }
.tmpl20-skills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl20-skill-pill { background: #18181b; color: #ffffff; padding: 0.25rem 0.6rem; border-radius: 12px; font-size: 0.75rem; font-weight: 600; }
.tmpl20-list { padding-left: 1.2rem; font-size: 0.81rem; color: #334155; }
.tmpl20-list li { margin-bottom: 0.22rem; }
.tmpl20-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.4rem; font-size: 0.78rem; background: #fff1f2; border: 1px solid #fecdd3; padding: 0.5rem 0.65rem; border-radius: 6px; color: #9f1239; }

/* ==========================================================================
   TEMPLATE 21: SILICON VALLEY VP (Teal & Slate Executive)
   ========================================================================== */
.tmpl21-container { padding: 10mm 12mm; font-family: 'Inter', sans-serif; color: #0f172a; box-sizing: border-box; }
.tmpl21-header { display: flex; justify-content: space-between; align-items: flex-start; background: #0f172a; color: white; padding: 0.75rem 1rem; border-radius: 8px; border-left: 6px solid #0284c7; margin-bottom: 0.7rem; }
.tmpl21-hleft { flex: 1; }
.tmpl21-badge-tag { font-size: 0.62rem; font-weight: 800; letter-spacing: 1px; color: #38bdf8; text-transform: uppercase; margin-bottom: 0.15rem; display: inline-flex; align-items: center; gap: 0.3rem; }
.tmpl21-name { font-size: 1.5rem; font-weight: 900; letter-spacing: 0.5px; margin: 0; color: #ffffff; text-transform: uppercase; }
.tmpl21-tagline { font-size: 0.84rem; color: #94a3b8; font-weight: 600; margin-top: 0.1rem; margin-bottom: 0.45rem; }
.tmpl21-contacts { display: flex; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: 0.74rem; color: #e2e8f0; }
.tmpl21-contacts span { display: inline-flex; align-items: center; gap: 0.35rem; }
.tmpl21-contacts i { color: #38bdf8; }
.tmpl21-photo { width: 78px; height: 90px; border-radius: 6px; border: 2px solid #38bdf8; overflow: hidden; flex-shrink: 0; background: #1e293b; margin-left: 1rem; }
.tmpl21-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl21-sec { margin-bottom: 0.65rem; }
.tmpl21-sec-title { font-size: 0.82rem; font-weight: 800; letter-spacing: 0.5px; color: #0284c7; text-transform: uppercase; border-bottom: 2px solid #e0f2fe; padding-bottom: 0.2rem; margin-bottom: 0.45rem; display: flex; align-items: center; gap: 0.4rem; }
.tmpl21-text { font-size: 0.8rem; color: #334155; line-height: 1.45; margin: 0; background: #f8fafc; border-left: 3px solid #0284c7; padding: 0.45rem 0.65rem; border-radius: 0 6px 6px 0; }
.tmpl21-edu-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0.45rem; }
.tmpl21-edu-card { background: #f0f9ff; border: 1px solid #bae6fd; padding: 0.45rem 0.55rem; border-radius: 6px; }
.tmpl21-edu-top { display: flex; justify-content: space-between; font-size: 0.78rem; font-weight: 700; color: #0369a1; }
.tmpl21-edu-inst { font-size: 0.74rem; color: #475569; margin-top: 0.1rem; }
.tmpl21-edu-score { font-size: 0.7rem; color: #0284c7; margin-top: 0.15rem; }
.tmpl21-skills-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.35rem; }
.tmpl21-skill-card { background: #ffffff; border: 1px solid #cbd5e1; padding: 0.3rem 0.45rem; border-radius: 5px; font-size: 0.76rem; font-weight: 600; color: #0f172a; display: flex; align-items: center; gap: 0.3rem; }
.tmpl21-skill-card i { color: #0284c7; font-size: 0.7rem; }
.tmpl21-list { padding-left: 1.1rem; font-size: 0.79rem; color: #334155; }
.tmpl21-list li { margin-bottom: 0.18rem; }
.tmpl21-personal-box { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.35rem; font-size: 0.76rem; background: #f8fafc; border: 1px solid #e2e8f0; padding: 0.45rem 0.6rem; border-radius: 6px; color: #334155; }

/* Template 21 Compact auto-fit rules */
.compact-tight .tmpl21-container { padding: 7mm 9mm; }
.compact-tight .tmpl21-header { padding: 0.55rem 0.8rem; margin-bottom: 0.5rem; }
.compact-tight .tmpl21-sec { margin-bottom: 0.45rem; }
.compact-tight .tmpl21-sec-title { font-size: 0.78rem; margin-bottom: 0.3rem; }
.compact-tight .tmpl21-edu-card { padding: 0.35rem 0.45rem; }
.compact-tight .tmpl21-skill-card { padding: 0.22rem 0.35rem; font-size: 0.72rem; }

.compact-super .tmpl21-container { padding: 5mm 7mm; }
.compact-super .tmpl21-header { padding: 0.45rem 0.65rem; margin-bottom: 0.35rem; }
.compact-super .tmpl21-sec { margin-bottom: 0.35rem; }
.compact-super .tmpl21-sec-title { font-size: 0.74rem; margin-bottom: 0.25rem; }
.compact-super .tmpl21-edu-card { padding: 0.25rem 0.35rem; }
.compact-super .tmpl21-skill-card { padding: 0.18rem 0.3rem; font-size: 0.68rem; }

/* ==========================================================================
   TEMPLATE 22: MANHATTAN BOARD DIRECTOR (Burgundy & Gold Serif)
   ========================================================================== */
.tmpl22-container { padding: 10mm 12mm; font-family: 'Merriweather', 'Georgia', serif; color: #1c1917; box-sizing: border-box; }
.tmpl22-header { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 0.45rem; }
.tmpl22-hleft { flex: 1; }
.tmpl22-name { font-size: 1.6rem; font-weight: 900; color: #450a0a; letter-spacing: 0.5px; margin: 0; font-family: 'Merriweather', serif; }
.tmpl22-tagline { font-size: 0.84rem; font-weight: 700; color: #b45309; font-style: italic; margin-top: 0.1rem; margin-bottom: 0.45rem; }
.tmpl22-contacts { display: flex; flex-wrap: wrap; gap: 0.3rem 1.1rem; font-size: 0.74rem; color: #44403c; font-family: 'Inter', sans-serif; }
.tmpl22-contacts span { display: inline-flex; align-items: center; gap: 0.35rem; }
.tmpl22-contacts i { color: #b45309; }
.tmpl22-photo { width: 78px; height: 90px; border-radius: 4px; border: 2px solid #b45309; overflow: hidden; flex-shrink: 0; background: #fafaf9; margin-left: 1rem; box-shadow: 0 3px 8px rgba(0,0,0,0.15); }
.tmpl22-photo img { width: 100%; height: 100%; object-fit: cover; }
.tmpl22-gold-divider { height: 3px; background: linear-gradient(90deg, #450a0a 0%, #d97706 50%, #450a0a 100%); margin-bottom: 0.7rem; border-radius: 2px; }
.tmpl22-sec { margin-bottom: 0.65rem; }
.tmpl22-title { font-size: 0.82rem; font-weight: 800; letter-spacing: 1px; color: #450a0a; text-transform: uppercase; border-bottom: 1px solid #d97706; padding-bottom: 0.15rem; margin-bottom: 0.45rem; font-family: 'Inter', sans-serif; }
.tmpl22-bio-card { background: #fffbeb; border: 1px solid #fde68a; border-left: 4px solid #b45309; padding: 0.45rem 0.65rem; border-radius: 4px; }
.tmpl22-text { font-size: 0.79rem; color: #292524; line-height: 1.45; margin: 0; font-family: 'Inter', sans-serif; }
.tmpl22-table { width: 100%; border-collapse: collapse; font-size: 0.76rem; font-family: 'Inter', sans-serif; }
.tmpl22-table th { background: #450a0a; color: #fef3c7; font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.5px; padding: 0.35rem 0.5rem; text-align: left; }
.tmpl22-table td { padding: 0.35rem 0.5rem; border-bottom: 1px solid #e7e5e4; color: #292524; }
.tmpl22-table tr:nth-child(even) { background: #fafaf9; }
.tmpl22-badge { background: #fef3c7; color: #78350f; border: 1px solid #fde68a; padding: 0.12rem 0.35rem; border-radius: 4px; font-weight: 700; font-size: 0.72rem; }
.tmpl22-skills { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tmpl22-skill-pill { background: #fffbeb; border: 1px solid #fde68a; color: #78350f; padding: 0.25rem 0.45rem; border-radius: 4px; font-size: 0.74rem; font-weight: 700; font-family: 'Inter', sans-serif; display: inline-flex; align-items: center; gap: 0.3rem; }
.tmpl22-skill-pill i { color: #b45309; }
.tmpl22-list { padding-left: 1.1rem; font-size: 0.79rem; color: #292524; font-family: 'Inter', sans-serif; }
.tmpl22-list li { margin-bottom: 0.18rem; }
.tmpl22-personal-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.35rem; font-size: 0.76rem; background: #fafaf9; border: 1px solid #e7e5e4; padding: 0.45rem 0.6rem; border-radius: 4px; color: #292524; font-family: 'Inter', sans-serif; }

/* Template 22 Compact auto-fit rules */
.compact-tight .tmpl22-container { padding: 7mm 9mm; }
.compact-tight .tmpl22-sec { margin-bottom: 0.45rem; }
.compact-tight .tmpl22-title { font-size: 0.78rem; margin-bottom: 0.3rem; }
.compact-tight .tmpl22-table th, .compact-tight .tmpl22-table td { padding: 0.25rem 0.4rem; }

.compact-super .tmpl22-container { padding: 5mm 7mm; }
.compact-super .tmpl22-sec { margin-bottom: 0.35rem; }
.compact-super .tmpl22-title { font-size: 0.74rem; margin-bottom: 0.25rem; }
.compact-super .tmpl22-table th, .compact-super .tmpl22-table td { padding: 0.18rem 0.3rem; }

/* ==========================================================================
   APP FOOTER (Aman Vishwakarma Branding)
   ========================================================================== */
.app-footer {
    background: #0f172a;
    color: #94a3b8;
    text-align: center;
    padding: 0.65rem 1rem;
    font-size: 0.78rem;
    border-top: 1px solid #1e293b;
    font-family: 'Inter', sans-serif;
    font-weight: 500;
}

/* ==========================================================================
   STRICT MOBILE RESPONSIVE DESIGN (Screen Width <= 768px)
   100% UNTOUCHED & ISOLATED FROM DESKTOP / LAPTOP VIEWS (> 768px)
   ========================================================================== */

/* Desktop Fallback: Hide mobile mode bar completely on desktop */
.mobile-mode-bar {
    display: none;
}

@media (max-width: 768px) {
    /* Compact Mobile Top Navigation Header */
    .top-nav {
        padding: 0.6rem 0.75rem;
    }
    .nav-container {
        flex-direction: column;
        align-items: stretch;
        gap: 0.55rem;
    }
    .brand {
        justify-content: center;
    }
    .template-picker-wrapper {
        width: 100%;
        justify-content: center;
        flex-wrap: wrap;
    }
    .template-picker-wrapper label {
        font-size: 0.8rem;
    }
    .template-dropdown {
        width: 100%;
        max-width: 100%;
        font-size: 0.81rem;
    }
    .actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.4rem;
        width: 100%;
    }
    .actions .btn {
        padding: 0.4rem 0.65rem;
        font-size: 0.78rem;
        flex: 1 1 calc(50% - 0.4rem);
        justify-content: center;
    }
    #toggleEditBtn {
        display: none !important;
    }

    /* Mobile Sticky Mode Tab Bar (Edit Details vs View Resume) */
    .mobile-mode-bar {
        display: flex !important;
        position: sticky;
        top: 0;
        z-index: 999;
        background: #0f172a;
        padding: 0.4rem 0.6rem;
        gap: 0.4rem;
        box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
        border-bottom: 1px solid #1e293b;
    }
    .mobile-mode-btn {
        flex: 1;
        background: #1e293b;
        color: #94a3b8;
        border: 1px solid #334155;
        padding: 0.55rem 0.75rem;
        border-radius: 6px;
        font-size: 0.85rem;
        font-weight: 700;
        cursor: pointer;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.45rem;
        transition: all 0.2s ease;
    }
    .mobile-mode-btn.active {
        background: #0284c7;
        color: #ffffff;
        border-color: #38bdf8;
        box-shadow: 0 2px 8px rgba(2, 132, 199, 0.4);
    }

    /* Mobile Main Layout & Tab Toggle Views */
    .main-layout {
        flex-direction: column;
        padding: 0 !important;
        margin: 0 auto !important;
        gap: 0.6rem;
        width: 100% !important;
        max-width: 100% !important;
    }
    .editor-sidebar {
        width: 100% !important;
        max-width: 100% !important;
        padding: 1rem 0.75rem;
    }
    .editor-sidebar.mobile-hidden {
        display: none !important;
    }

    /* Hide Top Action Header on Mobile when viewing Resume to dedicate 100% screen to preview */
    body.mobile-preview-active .top-nav {
        display: none !important;
    }

    body.mobile-preview-active .preview-area {
        min-height: calc(100vh - 55px);
        padding: 0.5rem 0 2rem 0 !important;
    }

    .preview-area {
        width: 100% !important;
        max-width: 100% !important;
        padding: 0.5rem 0 2rem 0 !important;
        margin: 0 !important;
        display: block !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }
    .preview-area.mobile-hidden {
        display: none !important;
    }

    /* Mobile Dynamic Real-Time PDF Replica Scaling Engine */
    .resume-paper {
        width: 210mm !important;
        min-width: 210mm !important;
        max-width: 210mm !important;
        height: 295mm !important;
        min-height: 295mm !important;
        max-height: 295mm !important;
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2) !important;
        box-sizing: border-box !important;
        transition: transform 0.15s ease, margin-bottom 0.15s ease;
    }
}

/* ==========================================================================
   PRINT STYLES — MUST BE LAST to override all mobile/responsive rules
   ========================================================================== */
@media print {
    * {
        -webkit-print-color-adjust: exact !important;
        print-color-adjust: exact !important;
        color-adjust: exact !important;
    }

    html, body {
        height: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background: white !important;
        overflow: hidden !important;
    }

    .no-print, .top-nav, .editor-sidebar, .mobile-mode-bar, .app-footer { display: none !important; }
    .main-layout { margin: 0 !important; padding: 0 !important; max-width: 100% !important; width: 100% !important; }
    .preview-area { padding: 0 !important; margin: 0 !important; overflow: visible !important; width: 100% !important; display: block !important; }
    .preview-area.mobile-hidden { display: block !important; }

    .resume-paper {
        box-shadow: none !important;
        width: 100% !important;
        height: 295mm !important;
        max-height: 295mm !important;
        min-height: auto !important;
        margin: 0 !important;
        border: none !important;
        border-radius: 0 !important;
        box-sizing: border-box !important;
        page-break-after: avoid !important;
        page-break-inside: avoid !important;
        overflow: hidden !important;
        transform: none !important;
        transform-origin: initial !important;
    }

    .tmpl2-layout { height: 295mm !important; max-height: 295mm !important; }
    .tmpl2-sidebar { padding: 8mm 6mm !important; -webkit-print-color-adjust: exact !important; }
    .tmpl2-main { padding: 8mm 8mm !important; }
    .tmpl4-banner, .tmpl5-header, .tmpl8-banner { -webkit-print-color-adjust: exact !important; }

    @page {
        size: A4 portrait;
        margin: 0mm;
    }
}