/* 
  Professional Resume Templates - V4 "100% Accurate" Collection
  Replicating exact designs from the latest reference images.
*/

:root {
    --resume-primary: #1e293b;
    --resume-primary-light: rgba(30, 41, 59, 0.1);
    --resume-text: #1e293b;
    --resume-text-light: #64748b;
    --resume-border: #cbd5e1;
}

.resume-header {
    display: flex;
    gap: 30pt;
    align-items: center;
}

.resume-header.photo-right {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

.resume-header.photo-right .header-content {
    text-align: left;
}

.resume-header.photo-right .resume-photo {
    margin: 0;
}

.header-content {
    flex: 1;
}

/* Base Document Styling */
.resume-preview {
    color: var(--resume-text);
    line-height: 1.5;
    padding: 10mm;
    text-align: left;
    background-color: #fff;
    width: 100%;
    max-width: 210mm;
    min-height: 297mm;
    box-sizing: border-box;
    font-size: 10pt;
    font-family: 'Inter', sans-serif;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Photo Styling */
.resume-photo {
    width: 100pt;
    height: 100pt;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 20pt;
    border: 4pt solid #fff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.resume-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.resume-preview,
.resume-preview * {
    box-sizing: border-box;
}

/* Shared UI Components */
.section {
    margin-bottom: 20pt;
}

.section-title {
    font-size: 11pt;
    font-weight: 800;
    
    letter-spacing: 0.1em;
    color: var(--resume-text);
    margin-bottom: 12pt;
    border-bottom: 2pt solid var(--resume-primary);
    padding-bottom: 6pt;
}

.exp-item,
.edu-item {
    margin-bottom: 15pt;
}

.exp-header,
.edu-header {
    display: flex;
    justify-content: space-between;
    font-weight: 700;
}

.exp-sub {
    display: flex;
    justify-content: space-between;
    font-size: 9pt;
    color: var(--resume-text-light);
    margin-bottom: 4pt;
}

.layout-wrapper {
    display: flex;
    flex-direction: row;
    min-height: 297mm;
    width: 100%;
}
.sidebar {
    width: 32%;
    padding: 20pt;
    background-color: #f8fafc;
    border-right: 1px solid var(--resume-border);
}
.main-col {
    width: 68%;
    padding: 20pt 30pt;
}
.layout-2-col-right .layout-wrapper {
    flex-direction: row-reverse;
}
.layout-2-col-right .sidebar {
    border-right: none;
    border-left: 1px solid var(--resume-border);
}

.contact-info {
    display: flex;
    flex-wrap: wrap;
    gap: 15pt;
    margin-bottom: 10pt;
    color: var(--resume-text-light);
    font-size: 9pt;
}

.contact-info span {
    display: flex;
    align-items: center;
    gap: 6pt;
    word-break: break-all;
    overflow-wrap: anywhere;
}

.contact-info i {
    width: 12pt;
    height: 12pt;
    color: var(--resume-primary);
}

.skills-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6pt;
}

.skill-tag {
    background-color: #f1f5f9;
    padding: 3pt 8pt;
    border-radius: 4pt;
    font-size: 8.5pt;
    font-weight: 600;
}

/* --- TEMPLATE: TIMELINE MODERN --- */
.template-timeline .resume-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30pt;
    padding-bottom: 15pt;
    border-bottom: 1.5pt solid var(--resume-border);
}

.template-timeline .resume-header h1 {
    font-size: var(--resume-name-size, 32pt);
    font-weight: 900;
    color: #1e293b;
    margin-bottom: 0;
}

.template-timeline .resume-header .job-title {
    font-size: 14pt;
    color: #64748b;
    
    letter-spacing: 2pt;
}

.template-timeline .timeline-body {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 40pt;
}

.template-timeline .timeline-right {
    position: relative;
    border-left: 2pt solid var(--resume-primary-light);
    padding-left: 30pt;
}

.template-timeline .timeline-section {
    position: relative;
    margin-bottom: 30pt;
}

.template-timeline .timeline-icon {
    position: absolute;
    left: -41pt;
    top: 0;
    width: 22pt;
    height: 22pt;
    background: var(--resume-primary);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.template-timeline .timeline-icon i {
    width: 12pt;
    height: 12pt;
}

.template-timeline .timeline-section .section-title {
    border: none;
    padding-bottom: 0;
    margin-bottom: 10pt;
    font-size: 12pt;
}

/* --- TEMPLATE: SOFT SIDEBAR --- */
.template-soft-sidebar .resume-layout-sidebar {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 0;
    margin: -10mm;
    min-height: 297mm;
}

.template-soft-sidebar .resume-sidebar {
    background-color: var(--resume-primary-transparent);
    padding: 10mm;
    text-align: center;
}

.template-soft-sidebar .resume-main {
    padding: 10mm;
}

.template-soft-sidebar .resume-sidebar .resume-photo {
    margin: 0 auto 20pt auto;
}

.template-soft-sidebar .resume-sidebar h1 {
    font-size: var(--resume-name-size, 22pt);
    font-weight: 800;
    margin-bottom: 5pt;
}

.template-soft-sidebar .resume-sidebar .job-title {
    font-size: 11pt;
    color: #666;
    
    margin-bottom: 25pt;
}

.template-soft-sidebar .resume-sidebar .section-title {
    text-align: left;
}

.template-soft-sidebar .resume-sidebar .contact-info {
    flex-direction: column;
    align-items: flex-start;
    gap: 8pt;
    margin-bottom: 25pt;
    color: #1e293b;
}

.template-soft-sidebar .skill-tag {
    background: none;
    border: none;
    padding: 0;
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}

.template-soft-sidebar .skill-tag::after {
    content: '•••••';
    color: var(--resume-primary-light);
    font-size: 14pt;
    letter-spacing: 2pt;
}

/* --- TEMPLATE: DARK EXECUTIVE --- */
.template-dark-executive .resume-layout-sidebar {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 0;
    margin: -10mm;
    min-height: 297mm;
}

.template-dark-executive .resume-sidebar {
    background-color: var(--resume-primary);
    color: #fff;
    padding: 10mm;
}

.template-dark-executive .resume-main {
    padding: 10mm;
}

.template-dark-executive .resume-sidebar h1 {
    color: #fff;
    font-size: 24pt;
    font-weight: 800;
    margin-bottom: 5pt;
}

.template-dark-executive .resume-sidebar .job-title {
    color: #fff;
    font-size: 11pt;
    font-weight: 600;
    margin-bottom: 30pt;
}

.template-dark-executive .resume-sidebar .section-title {
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, 0.2);
}

.template-dark-executive .resume-sidebar .contact-info {
    flex-direction: column;
    gap: 10pt;
    color: #cbd5e1;
}

.template-dark-executive .resume-sidebar .skill-tag {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border: none;
}

/* --- TEMPLATE: RIGA (Modern Header) --- */
.template-riga .riga-header {
    background-color: var(--resume-primary);
    color: #fff;
    margin: -10mm -10mm 0 -10mm;
    padding: 40pt 10mm 60pt 10mm;
    /* Extra bottom padding for overlap */
    text-align: center;
}

.template-riga .riga-header h1 {
    color: #fff;
    font-size: var(--resume-name-size, 26pt);
    margin-bottom: 5pt;
    letter-spacing: 1px;
}

.template-riga .riga-header .job-title {
    color: rgba(255, 255, 255, 0.9);
    font-size: 13pt;
    
    letter-spacing: 2px;
}

.template-riga .riga-sub-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: -45pt;
    /* Pull up to overlap */
    margin-bottom: 30pt;
    padding: 0 5mm;
    /* Reduced padding for more space */
    position: relative;
    z-index: 10;
}

.template-riga .resume-photo {
    margin: 0;
    width: 110pt;
    height: 110pt;
    border: 5pt solid #fff;
    box-shadow: var(--shadow-lg);
}

.template-riga .contact-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8pt;
    margin: 0;
    padding: 15pt;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    max-width: fit-content;
}

.template-riga .contact-info span {
    color: var(--resume-text);
    font-weight: 500;
}

/* --- TEMPLATE: ROTTERDAM (Elegant Serif) --- */
.template-rotterdam {
    font-family: 'Playfair Display', serif;
}

.template-rotterdam .resume-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2pt solid var(--resume-primary-light);
    padding-bottom: 10pt;
    margin-bottom: 30pt;
}

.template-rotterdam .resume-header h1 {
    font-size: var(--resume-name-size, 26pt);
    color: #1e293b;
}

/* --- TEMPLATE: STOCKHOLM (Deep Navy) --- */
.template-stockholm .resume-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--resume-primary);
    color: #fff;
    margin: -10mm -10mm 30pt -10mm;
    padding: 10mm;
}

.template-stockholm .resume-header h1 {
    color: #fff;
    font-size: var(--resume-name-size, 26pt);
}

.template-stockholm .resume-header .job-title {
    color: #38bdf8;
}

.template-stockholm .resume-header .contact-info {
    color: #cbd5e1;
}

/* --- TEMPLATE: BLUE CURVE --- */
.template-blue-curve .resume-layout-blue-curve {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 0;
    margin: -10mm;
    min-height: 297mm;
}

.template-blue-curve .resume-sidebar {
    background-color: #fff;
    border-right: 1px solid #e2e8f0;
}

.template-blue-curve .sidebar-header-bg {
    background-color: var(--resume-primary-light);
    padding: 10mm;
    text-align: center;
    border-bottom-right-radius: 60px;
    margin-bottom: 15pt;
}

.template-blue-curve .resume-photo {
    width: 100pt;
    height: 100pt;
    border-radius: 0;
    border: none;
    box-shadow: none;
    margin: 0 auto;
}

.template-blue-curve .sidebar-content {
    padding: 0 15mm 15mm 15mm;
}

.template-blue-curve .resume-sidebar .section-title {
    font-size: 10pt;
    color: #000;
    border-top: 2pt solid var(--resume-primary);
    border-bottom: 2pt solid var(--resume-primary);
    padding: 5pt 0;
    margin-bottom: 12pt;
    margin-top: 15pt;
    width: 100%;
}

.template-blue-curve .resume-sidebar .contact-info {
    color: #333;
    font-size: 9pt;
    display: flex;
    flex-direction: column;
    gap: 8pt;
    margin-bottom: 20pt;
}

.template-blue-curve .resume-sidebar .contact-info span {
    display: flex;
    align-items: flex-start;
    gap: 8pt;
    line-height: 1.3;
    word-break: break-all;
    overflow-wrap: anywhere;
}

.template-blue-curve .resume-sidebar .contact-info i {
    width: 12pt;
    height: 12pt;
    color: #333;
    flex-shrink: 0;
    margin-top: 1pt;
}

.template-blue-curve .resume-sidebar .skill-tag {
    background: none;
    padding: 0;
    display: list-item;
    list-style-type: disc;
    margin-left: 15pt;
    font-weight: normal;
}

.template-blue-curve .resume-sidebar .skills-grid {
    display: block;
}

.template-blue-curve .resume-main {
    padding: 10mm;
}

.template-blue-curve .blue-curve-header {
    margin-bottom: 20pt;
}

.template-blue-curve .blue-curve-header h1 {
    font-size: var(--resume-name-size, 28pt);
    font-weight: 900;
    
    margin-bottom: 10pt;
    line-height: 1.1;
}

.template-blue-curve .job-title {
    font-size: 13pt;
    font-weight: 700;
    color: #475569;
    
    letter-spacing: 1.5pt;
    margin-bottom: 15pt;
    margin-top: -5pt;
}

.template-blue-curve .blue-curve-summary {
    font-size: 9.5pt;
    color: #333;
    line-height: 1.4;
}

.template-blue-curve .resume-main .section-title {
    border-top: 1.5pt solid var(--resume-primary);
    border-bottom: 1.5pt solid var(--resume-primary);
    padding: 6pt 0;
    color: #1e293b;
    margin-bottom: 20pt;
}

.template-blue-curve .exp-item {
    position: relative;
    padding-left: 20pt;
    margin-bottom: 40pt;
    display: block;
}

.template-blue-curve .exp-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5pt;
    bottom: -20pt;
    width: 2pt;
    background-color: #333;
    z-index: 1;
}

.template-blue-curve .exp-header {
    display: block;
    width: auto;
    position: static;
}

.template-blue-curve .exp-header strong {
    font-size: 11pt;
    font-weight: 800;
    font-style: italic;
    color: #000;
    display: block;
}

.template-blue-curve .exp-header span {
    display: flex;
    position: absolute;
    left: -20pt;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    justify-content: center;
    align-items: center;
    font-size: 8pt;
    color: #666;
    z-index: 2;
    white-space: nowrap;
}

.template-blue-curve .exp-sub {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 5pt;
}

.template-blue-curve .exp-sub em {
    font-weight: 800;
    font-style: italic;
    color: #000;
    font-size: 10pt;
}

.template-blue-curve .exp-sub span {
    display: inline-block;
    color: #666;
    font-size: 9pt;
    font-style: italic;
}

.template-blue-curve .exp-desc {
    display: block;
    margin-left: 0;
    font-size: 9pt;
}

/* Existing Templates Support */
.template-chicago .resume-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2pt solid var(--resume-primary);
    padding-bottom: 10pt;
    margin-bottom: 30pt;
}

.template-chicago .resume-header h1 {
    font-size: var(--resume-name-size, 28pt);
    font-weight: 800;
}

.template-oslo .resume-header {
    border-bottom: 4pt solid var(--resume-primary);
    padding-bottom: 5pt;
    margin-bottom: 25pt;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

@media print {
    .resume-preview {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        height: auto !important;
        box-shadow: none !important;
        border: none !important;
    }
}

/* --- TEMPLATE: WILLIAMS (Executive Modern) --- */
.template-williams {
    padding: 0 !important;
}

.template-williams .resume-layout-williams {
    display: flex;
    flex-direction: column;
    min-height: 297mm;
    background: #fff;
    color: #1e293b;
    font-family: 'Inter', sans-serif;
}

/* Sections shared resets */
.template-williams .section-title {
    border-bottom: 2pt solid var(--resume-primary);
    font-size: 11pt;
    font-weight: 800;
    margin-bottom: 12pt;
    
    letter-spacing: 1px;
}

/* Williams Top Area */
.template-williams .williams-top {
    display: flex;
    height: 180pt;
}

.template-williams .williams-photo-area {
    width: 250pt;
    background-color: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    border-right: 1px solid #e2e8f0;
}

.template-williams .williams-photo-area .resume-photo {
    width: 120pt;
    height: 120pt;
    margin: 0;
    border: none;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

.template-williams .williams-name-area {
    flex: 1;
    display: flex;
    padding-right: 10pt;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.template-williams .ghost-name {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 100pt;
    font-weight: 900;
    color: rgba(0, 0, 0, 0.03);
    
    z-index: 1;
    white-space: nowrap;
}

.template-williams .williams-name-area h1 {
    font-size: var(--resume-name-size, 32pt);
    font-weight: 700;
    color: #1e293b;
    z-index: 2;
    margin: 0;
    
    letter-spacing: 2px;
}

.template-williams .title-box {
    margin-top: 15pt;
    padding: 5pt 20pt;
    border: 1.5pt solid #cbd5e1;
    z-index: 2;
}

.template-williams .title-box span {
    font-size: 11pt;
    font-weight: 600;
    color: #64748b;
    
    letter-spacing: 3px;
}

/* Williams Mid Area */
.template-williams .williams-mid {
    display: flex;
    background-color: #fff;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.template-williams .williams-contact-area {
    width: 250pt;
    padding: 20pt 30pt;
    border-right: 1px solid #e2e8f0;
}

.template-williams .williams-contact-area .contact-info {
    flex-direction: column;
    gap: 8pt;
    margin: 0;
}

.template-williams .williams-contact-area .contact-info span {
    color: #475569;
    font-size: 10pt;
}

.template-williams .williams-contact-area .contact-info i {
    color: #334155;
    width: 14pt;
}

.template-williams .williams-summary-area {
    flex: 1;
    background-color: var(--resume-primary);
    padding: 30pt;
    color: #fff;
    position: relative;
    display: flex;
    align-items: center;
}

.template-williams .quote-icon {
    position: absolute;
    top: 10pt;
    left: 15pt;
    font-size: 40pt;
    font-family: serif;
    color: rgba(255, 255, 255, 0.1);
    line-height: 1;
}

.template-williams .williams-summary-area p {
    font-size: 10pt;
    line-height: 1.6;
    margin: 0;
    color: #e2e8f0;
    font-weight: 400;
}

/* Williams Body Area */
.template-williams .williams-body {
    display: flex;
    flex: 1;
}

.template-williams .williams-sidebar {
    width: 250pt;
    background-color: #f8fafc;
    padding: 30pt;
    border-right: 1px solid #e2e8f0;
}

.template-williams .williams-sidebar .section {
    margin-bottom: 30pt;
}

.template-williams .williams-content {
    flex: 1;
    padding: 30pt;
}

.template-williams .williams-content .section {
    margin-bottom: 35pt;
}

/* Timeline/Experience overrides for Williams */
.template-williams .exp-item {
    position: relative;
    padding-left: 25pt;
    margin-bottom: 25pt;
}

.template-williams .exp-item::before {
    content: '';
    position: absolute;
    left: 0;
    top: 5pt;
    bottom: -25pt;
    width: 1px;
    background-color: #e2e8f0;
}

.template-williams .exp-item:last-child::before {
    display: none;
}

.template-williams .exp-item::after {
    content: '';
    position: absolute;
    left: -4pt;
    top: 5pt;
    width: 9pt;
    height: 9pt;
    border-radius: 50%;
    background-color: #fff;
    border: 2pt solid var(--resume-primary);
}

.template-williams .exp-header {
    flex-direction: column;
    margin-bottom: 5pt;
    font-weight: 700;
}

.template-williams .exp-header h3 {
    font-size: 11pt;
    
    color: #1e293b;
    margin: 0;
}

.template-williams .exp-header span {
    font-size: 9pt;
    color: #64748b;
    margin-top: 2pt;
    font-weight: 400;
}

.template-williams .exp-sub {
    margin-bottom: 8pt;
    font-style: italic;
    color: #475569;
}

/* Skill styling for Williams Sidebar */
.template-williams .skills-container {
    display: flex;
    flex-direction: column;
    gap: 8pt;
}

.template-williams .skill-tag {
    background: none;
    border: none;
    padding: 0;
    color: #475569;
    font-size: 10pt;
    display: list-item;
    margin-left: 15pt;
}

.template-williams .skill-tag::marker {
    color: var(--resume-primary);
}

/* Reference Section for Williams */
.template-williams .projects-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20pt;
}

.template-williams .project-item h3 {
    font-size: 10pt;
    
    color: #1e293b;
}

/* --- TEMPLATE: SEAFARER CV --- */
.template-seafarer {
    font-family: Arial, Helvetica, sans-serif;
    color: #000;
    line-height: 1.2;
    padding: 10mm !important;
}

.template-seafarer .seafarer-header {
    text-align: center;
    margin-bottom: 20pt;
}

.template-seafarer .seafarer-header h1 {
    font-size: 16pt;
    font-weight: 700;
    text-decoration: underline;
    margin: 0;
}

.template-seafarer .seafarer-top-section {
    margin-bottom: 15pt;
}

.template-seafarer .meta-row {
    display: flex;
    gap: 10pt;
    margin-bottom: 4pt;
    font-size: 10pt;
}

.template-seafarer .meta-row strong {
    min-width: 120pt;
}

.template-seafarer .seafarer-section-title {
    background-color: #d1d5db;
    border: 1px solid #000;
    padding: 3pt 10pt;
    font-size: 10pt;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 10pt;
    margin-top: 15pt;
}

.template-seafarer .seafarer-section-title i {
    width: 14pt;
    height: 14pt;
}

.template-seafarer .seafarer-personal-grid {
    display: grid;
    grid-template-columns: 1fr 140pt;
    gap: 15pt;
    margin-top: -1px;
    /* Overlap with title border */
}

.template-seafarer .cv-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #000;
}

.template-seafarer .cv-table td,
.template-seafarer .cv-table th {
    border: 1px solid #000;
    padding: 4pt 8pt;
    font-size: 9pt;
    text-align: left;
}

.template-seafarer .cv-table th {
    background-color: #f3f4f6;
    text-align: center;
    font-weight: 700;
}

.template-seafarer .personal-table .cv-table td:first-child {
    width: 150pt;
}

.template-seafarer .personal-photo {
    display: flex;
    justify-content: flex-end;
}

.template-seafarer .cv-photo-placeholder {
    width: 130pt;
    height: 140pt;
    border: 1px solid #000;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.template-seafarer .cv-photo-placeholder img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-seafarer .cv-table.full-width {
    margin-top: -1px;
}

.template-seafarer .seafarer-footer {
    margin-top: 30pt;
    font-size: 10pt;
}

.template-seafarer .declaration {
    margin-bottom: 40pt;
}

.template-seafarer .signature-line {
    width: 200pt;
    margin-left: auto;
    text-align: center;
}

.template-seafarer .signature-line .line {
    border-top: 1px solid #000;
    margin-bottom: 5pt;
}

.template-seafarer .signature-line span {
    font-weight: 700;
}

/* --- TEMPLATE: SEAFARER TABULAR (Classic) --- */
.template-seafarer-tabular {
    font-family: "Calibri", "Arial", sans-serif;
    color: #000;
    line-height: 1.3;
    padding: 0 !important;
}

.template-seafarer-tabular .tabular-header {
    margin-bottom: 20pt;
}

.template-seafarer-tabular .applying-for-box {
    background-color: #fdb913; /* Bright yellow/orange */
    color: #000;
    padding: 6pt 15pt;
    font-size: 14pt;
    font-weight: 800;
    display: inline-block;
    border: 1px solid #000;
}

.template-seafarer-tabular .tabular-section {
    margin-bottom: 25pt;
    page-break-inside: avoid;
    break-inside: avoid;
}

.template-seafarer-tabular .tabular-section-title {
    font-size: 12pt;
    font-weight: 800;
    margin-bottom: 8pt;
    
}

.template-seafarer-tabular .tabular-personal-grid {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.template-seafarer-tabular .personal-info-cols {
    flex: 1;
}

.template-seafarer-tabular .info-row {
    display: flex;
    margin-bottom: 4pt;
    font-size: 10pt;
}

.template-seafarer-tabular .info-row span:first-child {
    min-width: 120pt;
}

.template-seafarer-tabular .personal-photo-box {
    width: 130pt;
    height: 150pt;
    border: 1px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f8fafc;
    overflow: hidden;
}

.template-seafarer-tabular .personal-photo-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-seafarer-tabular .tabular-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #000;
}

.template-seafarer-tabular .tabular-table th,
.template-seafarer-tabular .tabular-table td {
    border: 1px solid #000;
    padding: 5pt 8pt;
    font-size: 9pt;
    text-align: left;
}

.template-seafarer-tabular .tabular-table thead th {
    background-color: #d1d5db; /* Gray background for headers */
    font-weight: 700;
    text-align: center;
    font-size: 8pt;
    
}

.template-seafarer-tabular .tabular-table tbody td {
    font-size: 9.5pt;
}

.template-seafarer-tabular .tabular-table tbody td:empty::before {
    content: "\00a0"; /* Non-breaking space for empty cells to maintain height */
}

@media print {
    .template-seafarer-tabular .applying-for-box {
        background-color: #fdb913 !important;
        -webkit-print-color-adjust: exact;
    }
    .template-seafarer-tabular .tabular-table thead th {
        background-color: #d1d5db !important;
        -webkit-print-color-adjust: exact;
    }
}


/* --- London Template --- */
.template-london .resume-layout-london {
    padding: 0;
    color: #333;
    font-family: 'Inter', sans-serif;
    background: #fff;
}

.template-london .london-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 40pt 40pt 20pt 40pt;
}

.template-london .london-name-title h1 {
    font-size: 36pt;
    font-weight: 400;
    margin: 0;
    letter-spacing: 2pt;
    color: #000 !important;
    
}

.template-london .london-name-title .professional-title {
    font-size: 16pt;
    font-weight: 400;
    margin: 5pt 0 0 0;
    color: #666;
    letter-spacing: 1pt;
    
}

.template-london .london-photo .resume-photo {
    width: 120pt;
    height: 120pt;
    border-radius: 50%;
    border: none;
    background: #eee;
    overflow: hidden;
}

.template-london .london-photo .resume-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-london .london-contact-bar {
    background-color: #f1f5f9 !important;
    padding: 10pt 40pt;
    display: flex;
    justify-content: center;
    gap: 20pt;
    font-size: 9pt;
    color: #555;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.template-london .london-contact-bar span {
    display: flex;
    align-items: center;
    gap: 5pt;
    color: #555 !important;
}

.template-london .london-contact-bar span:not(:last-child)::after {
    content: "|";
    margin-left: 15pt;
    color: #cbd5e1;
}

.template-london .london-content {
    padding: 20pt 40pt;
}

.template-london .london-section {
    margin-bottom: 25pt;
}

.template-london .london-section-title {
    font-size: 13pt;
    font-weight: 600;
    color: #334155 !important;
    margin-bottom: 8pt;
    letter-spacing: 1pt;
    border-bottom: 1px solid #cbd5e1;
    padding-bottom: 4pt;
    
}

.template-london .london-summary {
    font-size: 10.5pt;
    line-height: 1.6;
    color: #475569;
}

.template-london .london-skills-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 10pt;
    font-size: 10pt;
    color: #475569;
}

.template-london .london-skills-grid span {
    position: relative;
    display: block;
}

.template-london .london-exp-item {
    margin-bottom: 15pt;
}

.template-london .london-exp-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5pt;
}

.template-london .london-exp-role-company {
    font-size: 11pt;
}

.template-london .london-exp-date {
    font-size: 10pt;
    color: #64748b;
}

.template-london .london-exp-desc {
    font-size: 10pt;
    line-height: 1.5;
    color: #475569;
}

.template-london .london-exp-desc p {
    margin: 2pt 0;
}

.template-london .london-edu-item {
    margin-bottom: 10pt;
}

.template-london .london-edu-header {
    display: flex;
    justify-content: space-between;
    font-size: 11pt;
}

.template-london .london-edu-date {
    font-size: 10pt;
    color: #64748b;
}

/* --- ATS Friendly Standard --- */
.template-ats-standard .resume-layout-ats {
    padding: 0;
    color: #000;
    font-family: 'Arial', 'Helvetica', 'Calibri', sans-serif;
    line-height: 1.6;
    background: #fff;
    width: 100%;
}

.template-ats-standard .ats-header {
    margin-bottom: 25pt;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 25pt;
}

.template-ats-standard .ats-header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20pt;
}

.template-ats-standard .ats-header-text {
    flex: 1;
}

.template-ats-standard .ats-photo {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.template-ats-standard .ats-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-ats-standard .ats-header h1 {
    font-size: 22pt;
    font-weight: bold;
    margin: 0;
    
    color: #000 !important;
}

.template-ats-standard .ats-contact {
    font-size: 10pt;
    color: #444;
    margin-top: 8pt;
}

.template-ats-standard .ats-section {
    margin-bottom: 15pt;
}

.template-ats-standard .ats-section-title {
    font-size: 11pt;
    font-weight: bold;
    
    border-bottom: 1px solid #000;
    margin-bottom: 6pt;
    padding-bottom: 2pt;
    color: #000 !important;
}

.template-ats-standard .ats-summary,
.template-ats-standard .ats-skills,
.template-ats-standard .ats-item-desc {
    font-size: 10pt;
    color: #000;
    text-align: justify;
}

.template-ats-standard .ats-item {
    margin-bottom: 12pt;
}

.template-ats-standard .ats-item-header {
    display: flex;
    justify-content: space-between;
    font-size: 10pt;
    font-weight: bold;
}

.template-ats-standard .ats-item-sub {
    display: flex;
    justify-content: space-between;
    font-size: 10pt;
    margin-bottom: 2pt;
}

/* --- TEMPLATE: CLASSIC ATS PREMIUM --- */
.template-classic-ats-premium {
    padding: 0 !important;
    font-family: 'Inter', 'Roboto', 'Open Sans', sans-serif;
    line-height: 1.4;
    color: #000;
}

.template-classic-ats-premium .premium-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25pt;
    border-bottom: none;
}

.template-classic-ats-premium .header-left {
    flex: 1;
    text-align: left;
}

.template-classic-ats-premium .header-right {
    margin-left: 20pt;
}

.template-classic-ats-premium .premium-photo {
    width: 90pt;
    height: 90pt;
    border-radius: 4pt;
    overflow: hidden;
    border: 1px solid #ddd;
}

.template-classic-ats-premium .premium-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-classic-ats-premium .premium-header h1 {
    font-size: var(--resume-name-size, 26pt);
    font-weight: 700;
    margin: 0 0 4pt 0;
    color: #000;
    text-transform: none;
    line-height: 1.1;
}

.template-classic-ats-premium .premium-job-title {
    font-size: 13pt;
    color: #475569;
    font-weight: 600;
    margin-bottom: 8pt;
    
    letter-spacing: 0.5px;
}

.template-classic-ats-premium .contact-line {
    font-size: 9.5pt;
    color: #333;
    display: flex;
    justify-content: flex-start;
    gap: 8pt;
    flex-wrap: wrap;
    line-height: 1.2;
}

.template-classic-ats-premium .section {
    margin-bottom: 18pt;
}

.template-classic-ats-premium .section-title {
    font-size: 11pt;
    font-weight: 700;
    
    color: #000;
    border: none;
    border-bottom: 1px solid #000;
    padding-bottom: 2pt;
    margin-bottom: 10pt;
    letter-spacing: 0.05em;
}

.template-classic-ats-premium .exp-item,
.template-classic-ats-premium .edu-item {
    margin-bottom: 14pt;
}

.template-classic-ats-premium .exp-header,
.template-classic-ats-premium .edu-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-weight: 700;
    font-size: 10.5pt;
    margin-bottom: 1pt;
}

.template-classic-ats-premium .exp-sub,
.template-classic-ats-premium .edu-sub {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-style: italic;
    font-size: 10pt;
    color: #333;
    margin-bottom: 4pt;
}

.template-classic-ats-premium .exp-desc,
.template-classic-ats-premium .summary-text {
    font-size: 10pt;
    color: #333;
    text-align: justify;
    overflow-wrap: break-word;
    word-break: break-word;
}

.template-classic-ats-premium .skills-text {
    font-size: 10pt;
    color: #333;
}

/* Bullet points for descriptions */
.template-classic-ats-premium .exp-desc br + br {
    display: block;
    margin-top: 5pt;
    content: "";
}

/* Print specific adjustments for Classic Premium */
@media print {
    .template-classic-ats-premium {
        padding: 0 !important;
    }
}


.template-ats-standard .ats-item-desc p {
    margin: 1pt 0;
    padding-left: 5pt;
}

/* --- Williams Federal Executive --- */
.template-williams-federal .resume-layout-williams-federal {
    padding: 0;
    color: #333;
    background: #fff;
    min-height: 100%;
}

.template-williams-federal .wf-header {
    margin-bottom: 25pt;
}

.template-williams-federal .wf-header-top {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 10pt;
}

.template-williams-federal .wf-photo {
    width: 110px;
    height: 110px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #ddd;
    flex-shrink: 0;
}

.template-williams-federal .wf-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.template-williams-federal .wf-name {
    font-family: 'Merriweather', 'Playfair Display', serif;
    font-size: 26pt;
    font-weight: 700;
    color: #000 !important;
    margin-bottom: 4pt;
}

.template-williams-federal .wf-job-title {
    font-family: 'Inter', 'Helvetica', sans-serif;
    font-size: 13pt;
    font-weight: 600;
    color: #333 !important;
    margin-bottom: 4pt;
}

.template-williams-federal .wf-contact {
    font-family: 'Inter', sans-serif;
    font-size: 9.5pt;
    color: #666;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin-top: 2pt;
}

.template-williams-federal .wf-section {
    margin-bottom: 22pt;
}

.template-williams-federal .wf-section-title {
    font-family: 'Inter', sans-serif;
    font-size: 14pt;
    font-weight: 600;
    color: #000 !important;
    border-bottom: 1px solid #bbb;
    padding-bottom: 3pt;
    margin-bottom: 12pt;
}

.template-williams-federal .wf-summary {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    line-height: 1.6;
    color: #333;
}

.template-williams-federal .wf-item {
    margin-bottom: 15pt;
}

.template-williams-federal .wf-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 4pt;
}

.template-williams-federal .wf-item-main {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    flex: 1;
    line-height: 1.4;
}

.template-williams-federal .wf-item-date {
    font-family: 'Inter', sans-serif;
    font-size: 10pt;
    font-weight: 600;
    color: #000 !important;
    white-space: nowrap;
    margin-left: 20pt;
}

.template-williams-federal .wf-item-desc,
.template-williams-federal .wf-skills-list {
    margin-top: 4pt;
    padding-left: 20pt;
}

.template-williams-federal .wf-item-desc li,
.template-williams-federal .wf-skills-list li {
    font-family: 'Inter', sans-serif;
    font-size: 10pt;
    line-height: 1.4;
    margin-bottom: 2pt;
    list-style-type: disc;
    color: #333;
}

.template-williams-federal .wf-edu-school {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    color: #444;
}

.template-williams-federal strong {
    font-weight: 600;
    color: #000 !important;
}

/* --- Resignation Letter --- */
.template-resignation-letter .resume-layout-resignation {
    padding: 0.5in 0.8in 0.8in 0.8in;
    color: #000;
    font-family: 'Open Sans', 'Arial', sans-serif;
    line-height: 1.5;
    background: #fff;
    min-height: 100%;
}

.template-resignation-letter .res-header {
    margin-bottom: 40pt;
}

.template-resignation-letter .res-logo-box {
    display: flex;
    align-items: flex-start;
    gap: 15pt;
}

.template-resignation-letter .res-logo-symbol {
    flex-shrink: 0;
}

.template-resignation-letter .res-logo-text {
    display: flex;
    flex-direction: column;
}

.template-resignation-letter .res-company-name {
    font-size: 14pt;
    font-weight: 700;
    line-height: 1.1;
    color: #000;
    
}

.template-resignation-letter .res-tagline {
    font-style: italic;
    color: #333;
    font-size: 11pt;
    margin-top: 5pt;
}

.template-resignation-letter .res-meta {
    margin-bottom: 20pt;
}

.template-resignation-letter .res-sub-text,
.template-resignation-letter .res-sig-title {
    font-style: italic;
    color: #444;
    font-size: 10.5pt;
}

.template-resignation-letter .res-meta-item {
    display: flex;
    margin-bottom: 15pt;
}

.template-resignation-letter .res-label {
    width: 65pt;
    font-weight: bold;
    flex-shrink: 0;
}

.template-resignation-letter .res-value {
    flex: 1;
    font-size: 11pt;
}

.template-resignation-letter .res-subject-row {
    margin-top: 25pt;
}

.template-resignation-letter .res-divider {
    border-bottom: 2.5px solid #000;
    margin-bottom: 35pt;
}

.template-resignation-letter .res-body {
    font-size: 11.5pt;
}

.template-resignation-letter .res-body p {
    margin-bottom: 12pt;
    text-align: justify;
}

.template-resignation-letter .res-indent {
    display: inline-block;
    width: 40pt;
}

.template-resignation-letter .res-closing {
    margin-top: 50pt;
}

.template-resignation-letter .res-signature {
    margin-top: 30pt;
}

.template-williams-federal .wf-job-title {
    font-family: 'Inter', 'Helvetica', sans-serif;
    font-size: 13pt;
    font-weight: 600;
    color: #333 !important;
    margin-bottom: 4pt;
}

.template-williams-federal .wf-contact {
    font-family: 'Inter', sans-serif;
    font-size: 9.5pt;
    color: #666;
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    margin-top: 2pt;
}

.template-williams-federal .wf-section {
    margin-bottom: 22pt;
}

.template-williams-federal .wf-section-title {
    font-family: 'Inter', sans-serif;
    font-size: 14pt;
    font-weight: 600;
    color: #000 !important;
    border-bottom: 1px solid #bbb;
    padding-bottom: 3pt;
    margin-bottom: 12pt;
}

.template-williams-federal .wf-summary {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    line-height: 1.6;
    color: #333;
}

.template-williams-federal .wf-item {
    margin-bottom: 15pt;
}

.template-williams-federal .wf-item-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 4pt;
}

.template-williams-federal .wf-item-main {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    flex: 1;
    line-height: 1.4;
}

.template-williams-federal .wf-item-date {
    font-family: 'Inter', sans-serif;
    font-size: 10pt;
    font-weight: 600;
    color: #000 !important;
    white-space: nowrap;
    margin-left: 20pt;
}

.template-williams-federal .wf-item-desc,
.template-williams-federal .wf-skills-list {
    margin-top: 4pt;
    padding-left: 20pt;
}

.template-williams-federal .wf-item-desc li,
.template-williams-federal .wf-skills-list li {
    font-family: 'Inter', sans-serif;
    font-size: 10pt;
    line-height: 1.4;
    margin-bottom: 2pt;
    list-style-type: disc;
    color: #333;
}

.template-williams-federal .wf-edu-school {
    font-family: 'Inter', sans-serif;
    font-size: 10.5pt;
    color: #444;
}

.template-williams-federal strong {
    font-weight: 600;
    color: #000 !important;
}

/* --- Resignation Letter --- */
.template-resignation-letter .resume-layout-resignation {
    padding: 0.5in 0.8in 0.8in 0.8in;
    color: #000;
    font-family: 'Open Sans', 'Arial', sans-serif;
    line-height: 1.5;
    background: #fff;
    min-height: 100%;
}

.template-resignation-letter .res-header {
    margin-bottom: 40pt;
}

.template-resignation-letter .res-logo-box {
    display: flex;
    align-items: flex-start;
    gap: 15pt;
}

.template-resignation-letter .res-logo-symbol {
    flex-shrink: 0;
}

.template-resignation-letter .res-logo-text {
    display: flex;
    flex-direction: column;
}

.template-resignation-letter .res-company-name {
    font-size: 14pt;
    font-weight: 700;
    line-height: 1.1;
    color: #000;
    
}

.template-resignation-letter .res-tagline {
    font-style: italic;
    color: #333;
    font-size: 11pt;
    margin-top: 5pt;
}

.template-resignation-letter .res-meta {
    margin-bottom: 20pt;
}

.template-resignation-letter .res-sub-text,
.template-resignation-letter .res-sig-title {
    font-style: italic;
    color: #444;
    font-size: 10.5pt;
}

.template-resignation-letter .res-meta-item {
    display: flex;
    margin-bottom: 15pt;
}

.template-resignation-letter .res-label {
    width: 65pt;
    font-weight: bold;
    flex-shrink: 0;
}

.template-resignation-letter .res-value {
    flex: 1;
    font-size: 11pt;
}

.template-resignation-letter .res-subject-row {
    margin-top: 25pt;
}

.template-resignation-letter .res-divider {
    border-bottom: 2.5px solid #000;
    margin-bottom: 35pt;
}

.template-resignation-letter .res-body {
    font-size: 11.5pt;
}

.template-resignation-letter .res-body p {
    margin-bottom: 12pt;
    text-align: justify;
}

.template-resignation-letter .res-indent {
    display: inline-block;
    width: 40pt;
}

.template-resignation-letter .res-closing {
    margin-top: 50pt;
}

.template-resignation-letter .res-signature {
    margin-top: 30pt;
}

.template-resignation-letter .res-signature strong {
    font-size: 11.5pt;
    font-weight: 700;
    
    display: block;
    margin-bottom: 2pt;
}

/* --- Print Optimization Best Practices --- */
@media print {
    @page {
        margin: 0;
    }

    .resume-preview {
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        width: 100% !important;
        min-height: auto !important;
        display: block !important;
    }

    /* Switch sidebars from grid/flex to block for natural flow */
    .resume-layout-sidebar, .timeline-body {
        display: block !important;
    }

    /* CRITICAL: Keep resume-header as flex so photo stays side-by-side with name */
    .resume-header {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    /* CRITICAL: Keep photo wrapper shrink-proof */
    .resume-header > div:first-child {
        flex-shrink: 0 !important;
        display: block !important;
    }

    /* CRITICAL: img inside resume-header must NOT be display:block (breaks flex) */
    .resume-header img {
        display: inline-block !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    h2, h3, .section-title, .tabular-section-title {
        break-after: avoid !important;
        page-break-after: avoid !important;
        display: block !important;
    }

    .section, .exp-item, .edu-item, .proj-item, .tabular-section, .cv-table {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
        display: block !important;
        margin-bottom: 10pt;
    }

    /* Only apply block display to non-header images */
    img:not(.resume-header img) {
        break-inside: avoid !important;
        page-break-inside: avoid !important;
        display: block !important;
    }
}

/* Base break-inside rules to help JS-based pagination too */
.section, .exp-item, .edu-item, .proj-item, .tabular-section, .cv-table, img { 
    break-inside: avoid; 
}

/* --- TEMPLATE: MODERN TECH --- */
.template-modern-tech {
    font-family: 'Inter', system-ui, sans-serif;
    color: #1a202c;
}
.template-modern-tech .resume-header {
    background: linear-gradient(135deg, #1e293b, #0f172a);
    color: #f8fafc;
    padding: 25pt;
    margin: -10mm -10mm 20pt -10mm;
    border-bottom: 4pt solid #38bdf8;
    border-radius: 8px 8px 0 0;
}
.template-modern-tech .resume-header h1 {
    font-size: 26pt;
    font-weight: 900;
    margin-bottom: 4pt;
    color: #f8fafc;
    letter-spacing: -0.5pt;
}
.template-modern-tech .resume-header > div:last-child > div {
    color: #38bdf8 !important;
    font-weight: 600 !important;
    font-size: 13pt !important;
    letter-spacing: 1pt;
    text-transform: uppercase;
}
.template-modern-tech .main-content {
    padding: 0 10pt !important;
}
.template-modern-tech .section-title {
    color: #0f172a;
    font-size: 13pt;
    font-weight: 800;
    text-transform: uppercase;
    border-bottom: 2pt solid #e2e8f0;
    padding-bottom: 5pt;
    margin-bottom: 12pt;
    position: relative;
    margin-top: 15pt;
}
.template-modern-tech .section-title::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -2pt;
    width: 30pt;
    height: 2pt;
    background-color: #38bdf8;
}
.template-modern-tech .exp-header, .template-modern-tech .edu-header {
    font-weight: 700;
    color: #1e293b;
    font-size: 11pt;
    margin-bottom: 3pt;
}
.template-modern-tech .exp-item, .template-modern-tech .edu-item {
    margin-bottom: 15pt;
}
.template-modern-tech .exp-sub, .template-modern-tech .edu-sub {
    color: #475569;
}
.template-modern-tech .skill-tag {
    background-color: #f1f5f9;
    border: 1px solid #cbd5e1;
    color: #334155;
    border-radius: 4px;
    font-size: 9pt;
    font-weight: 600;
}

@media print {
    .template-modern-tech .resume-header {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        border-radius: 0;
    }
}