/* ePaper Viewer — frontend styles */

.epv-wrap {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: #f0ede8;
    border: 1px solid #d0ccc5;
    border-radius: 10px;
    overflow: hidden;
    margin: 1.5rem 0;
}

/* ─── Toolbar ───────────────────────────────────────── */
.epv-toolbar {
    background: #1a1a2e;
    padding: 10px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
}

.epv-toolbar-brand {
    display: flex;
    align-items: baseline;
    gap: 10px;
}

.epv-paper-name {
    font-family: "Georgia", serif;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    letter-spacing: -0.01em;
}

.epv-date {
    font-size: 12px;
    color: #9999bb;
}

.epv-toolbar-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.epv-btn {
    padding: 5px 13px;
    font-size: 12px;
    border-radius: 6px;
    border: 1px solid rgba(255,255,255,0.2);
    background: rgba(255,255,255,0.08);
    color: #ddd;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
    white-space: nowrap;
}
.epv-btn:hover { background: rgba(255,255,255,0.18); border-color: rgba(255,255,255,0.4); }
.epv-btn.epv-active { background: #c0392b; border-color: #c0392b; color: #fff; }

/* ─── Main layout ────────────────────────────────────── */
.epv-main {
    display: flex;
    min-height: 500px;
}

/* ─── Sidebar ────────────────────────────────────────── */
.epv-sidebar {
    width: 110px;
    background: #2a2a3e;
    overflow-y: auto;
    padding: 8px 6px;
    display: flex;
    flex-direction: column;
    gap: 7px;
    flex-shrink: 0;
}

.epv-thumb {
    border-radius: 5px;
    border: 2px solid transparent;
    overflow: hidden;
    cursor: pointer;
    background: #fff;
    transition: border-color 0.15s;
}
.epv-thumb:hover { border-color: rgba(192,57,43,0.5); }
.epv-thumb.epv-thumb-active { border-color: #c0392b; }
.epv-thumb img { width: 100%; display: block; }
.epv-thumb-label {
    font-size: 10px;
    color: #aaa;
    text-align: center;
    padding: 2px 0 3px;
    background: #2a2a3e;
}

/* ─── Viewer area ────────────────────────────────────── */
.epv-viewer-area {
    flex: 1;
    padding: 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    overflow: auto;
}

.epv-canvas-wrap {
    position: relative;
    max-width: 680px;
    width: 100%;
    cursor: crosshair;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.25);
    user-select: none;
}

.epv-paper-img {
    width: 100%;
    display: block;
    pointer-events: none;
    -webkit-user-drag: none;
}

.epv-overlay {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    pointer-events: none;
}

.epv-section-rect {
    position: absolute;
    border: 2px solid #c0392b;
    background: rgba(192,57,43,0.07);
    border-radius: 3px;
    cursor: pointer;
    pointer-events: all;
    transition: background 0.15s;
    box-sizing: border-box;
}
.epv-section-rect:hover { background: rgba(192,57,43,0.2); }

.epv-section-label {
    position: absolute;
    top: -22px;
    left: 0;
    background: #c0392b;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 3px 3px 0 0;
    white-space: nowrap;
    pointer-events: none;
}

.epv-selection {
    position: absolute;
    border: 2px dashed #e74c3c;
    background: rgba(231,76,60,0.06);
    pointer-events: none;
    display: none;
    box-sizing: border-box;
    border-radius: 3px;
}

.epv-hint {
    margin-top: 8px;
    font-size: 12px;
    color: #888;
    display: flex;
    align-items: center;
    gap: 6px;
}

.epv-hint-dot {
    display: inline-block;
    width: 7px; height: 7px;
    border-radius: 50%;
    background: #c0392b;
    flex-shrink: 0;
}

/* ─── Section name modal ──────────────────────────────── */
.epv-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 99999;
    align-items: center;
    justify-content: center;
}
.epv-modal.epv-open { display: flex; }

.epv-modal-box {
    background: #fff;
    border-radius: 10px;
    padding: 22px 24px;
    width: 320px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.3);
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.epv-modal-title { font-size: 15px; font-weight: 600; color: #1a1a2e; }

.epv-modal-input {
    width: 100%;
    padding: 9px 12px;
    border-radius: 6px;
    border: 1px solid #ccc;
    font-size: 14px;
    color: #333;
    outline: none;
    box-sizing: border-box;
}
.epv-modal-input:focus { border-color: #c0392b; box-shadow: 0 0 0 3px rgba(192,57,43,0.1); }

.epv-modal-actions { display: flex; gap: 8px; justify-content: flex-end; }

.epv-btn-cancel { border-color: #ccc; color: #666; background: #fff; }
.epv-btn-cancel:hover { background: #f5f5f5; border-color: #bbb; }

.epv-btn-primary {
    background: #c0392b !important;
    border-color: #c0392b !important;
    color: #fff !important;
}
.epv-btn-primary:hover { background: #a93226 !important; }

/* ─── Zoom modal ─────────────────────────────────────── */
.epv-zoom-modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.75);
    z-index: 100000;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.epv-zoom-modal.epv-open { display: flex; }

.epv-zoom-box {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 24px 60px rgba(0,0,0,0.5);
    min-width: 300px;
}

.epv-zoom-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 16px;
    border-bottom: 1px solid #eee;
    background: #fff;
    flex-shrink: 0;
}

.epv-zoom-label {
    font-family: "Georgia", serif;
    font-size: 14px;
    font-weight: 700;
    color: #1a1a2e;
}

.epv-zoom-close {
    width: 28px; height: 28px;
    border-radius: 50%;
    border: 1px solid #ddd;
    background: none;
    cursor: pointer;
    font-size: 18px;
    color: #666;
    display: flex; align-items: center; justify-content: center;
    line-height: 1;
}
.epv-zoom-close:hover { background: #f0f0f0; }

.epv-zoom-body {
    overflow: auto;
    flex: 1;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 8px;
    background: #f5f5f5;
}

#epv-zoom-canvas-0,
[id^="epv-zoom-canvas-"] {
    display: block;
    max-width: 100%;
}

.epv-zoom-footer {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    border-top: 1px solid #eee;
    background: #fff;
    flex-shrink: 0;
}

.epv-zoom-pct {
    font-size: 13px;
    color: #555;
    min-width: 44px;
    text-align: center;
}

.epv-zoom-out,
.epv-zoom-in {
    border: 1px solid #ddd;
    background: #fff;
    color: #333;
    font-size: 14px;
    padding: 4px 12px;
    border-radius: 5px;
    cursor: pointer;
}
.epv-zoom-out:hover, .epv-zoom-in:hover { background: #f0f0f0; }

/* ─── Responsive ─────────────────────────────────────── */
@media (max-width: 600px) {
    .epv-sidebar { width: 76px; }
    .epv-paper-name { font-size: 14px; }
    .epv-main { flex-direction: column; }
    .epv-sidebar { width: 100%; flex-direction: row; overflow-x: auto; overflow-y: hidden; height: 80px; padding: 4px 6px; }
    .epv-thumb { flex-shrink: 0; width: 56px; }
}

/* ePaper Pro additions: Dainik-style pager + edit handles */
.epv-pagebar{
    display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;
    background:#fff;border-bottom:1px solid #dedbd5;padding:10px 12px;
}
.epv-page-btn{
    background:#292943;color:#fff;border:0;border-radius:4px;padding:6px 12px;font-size:12px;cursor:pointer;
}
.epv-page-btn:hover{background:#c0392b;}
.epv-page-status{font-size:13px;color:#333;padding:0 8px;}
.epv-admin-edit-link{text-decoration:none!important;display:inline-flex;align-items:center;}
.epv-section-rect.epv-selected{border-color:#0b76ef!important;box-shadow:0 0 0 2px rgba(11,118,239,.25),0 0 18px rgba(11,118,239,.25);}
.epv-section-rect.epv-editable{cursor:move;}
.epv-handle{position:absolute;width:10px;height:10px;background:#fff;border:2px solid #0b76ef;border-radius:50%;box-sizing:border-box;z-index:5;}
.epv-handle-nw{left:-6px;top:-6px;cursor:nwse-resize}.epv-handle-n{left:50%;top:-6px;transform:translateX(-50%);cursor:ns-resize}.epv-handle-ne{right:-6px;top:-6px;cursor:nesw-resize}.epv-handle-e{right:-6px;top:50%;transform:translateY(-50%);cursor:ew-resize}.epv-handle-se{right:-6px;bottom:-6px;cursor:nwse-resize}.epv-handle-s{left:50%;bottom:-6px;transform:translateX(-50%);cursor:ns-resize}.epv-handle-sw{left:-6px;bottom:-6px;cursor:nesw-resize}.epv-handle-w{left:-6px;top:50%;transform:translateY(-50%);cursor:ew-resize}
.epv-section-rect:hover{background:rgba(192,57,43,.10);backdrop-filter:blur(1px);}
.epv-btn-save-changes{background:#1f8f4d!important;border-color:#1f8f4d!important;color:#fff!important;}
.epv-btn-delete{background:#7b1f1f!important;border-color:#7b1f1f!important;color:#fff!important;}
@media (min-width: 900px){.epv-canvas-wrap{max-width:760px}.epv-wrap{max-width:1080px;margin-left:auto;margin-right:auto}}
@media (max-width: 600px){.epv-pagebar{gap:5px}.epv-page-btn{padding:5px 8px;font-size:11px}.epv-toolbar-actions{width:100%;}.epv-btn{font-size:11px;padding:5px 8px}.epv-viewer-area{padding:8px}.epv-zoom-box{max-width:96vw;max-height:88vh}}
.epv-pdf-canvas{display:none;width:100%;height:auto;background:#fff}.epv-pdf-thumb-front{height:110px;display:flex;align-items:center;justify-content:center;background:#c0392b;color:#fff;font-weight:800;font-size:18px}.epv-pdf-error{padding:40px 20px;background:#fff3cd;color:#664d03;text-align:center}.epv-section-rect{outline:1px solid rgba(255,255,255,.6)}.epv-section-rect:hover{box-shadow:0 0 0 9999px rgba(0,0,0,.03) inset}.epv-btn-preview{background:#2563eb!important;border-color:#2563eb!important;color:#fff!important}.epv-btn-draw{background:#d97706!important;border-color:#d97706!important;color:#fff!important}.epv-btn-edit{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important}

/* Fix: frontend output should look like clean full newspaper.
   Section borders/labels are hidden until hover/click on public site.
   Admin Divide/Edit page still shows all boxes for editing. */
.epv-public-wrap .epv-canvas-wrap{
    cursor: default;
}
.epv-public-wrap .epv-section-rect{
    border: 2px solid transparent !important;
    background: transparent !important;
    outline: 0 !important;
    box-shadow: none !important;
}
.epv-public-wrap .epv-section-label{
    display: none !important;
}
.epv-public-wrap .epv-section-rect:hover,
.epv-public-wrap .epv-section-rect:focus{
    border-color: #e3342f !important;
    background: rgba(227,52,47,0.08) !important;
    box-shadow: 0 0 0 1px rgba(255,255,255,0.75) inset, 0 0 12px rgba(227,52,47,0.25) !important;
}
.epv-public-wrap .epv-section-rect:hover .epv-section-label{
    display: block !important;
}
.epv-public-wrap .epv-hint{
    display: none;
}

/* Admin editor page: always show section boxes and handles clearly. */
.epv-admin-editor-wrap .epv-section-rect{
    border: 2px solid #e3342f !important;
    background: rgba(227,52,47,0.08) !important;
}
.epv-admin-editor-wrap .epv-section-label{
    display: block !important;
}

/* v1.5.1: Public frontend must be 100% clean newspaper.
   Sections stay invisible but clickable; no red border, label, overlay, or hover effect. */
.epv-public-wrap .epv-section-rect,
.epv-public-wrap .epv-section-rect:hover,
.epv-public-wrap .epv-section-rect:focus,
.epv-public-wrap .epv-section-rect:active,
.epv-public-wrap .epv-section-rect.epv-selected{
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
.epv-public-wrap .epv-section-label,
.epv-public-wrap .epv-section-rect:hover .epv-section-label,
.epv-public-wrap .epv-section-rect:focus .epv-section-label{
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}
.epv-public-wrap .epv-overlay{ pointer-events: none; }
.epv-public-wrap .epv-section-rect{ pointer-events: all; cursor: zoom-in; }

/* Admin editor keeps visible section borders for editing only. */
.epv-admin-editor-wrap .epv-section-rect,
.epv-admin-editor-wrap .epv-section-rect:hover,
.epv-admin-editor-wrap .epv-section-rect:focus{
    border: 2px solid #e3342f !important;
    outline: 1px solid rgba(255,255,255,.65) !important;
    background: rgba(227,52,47,.08) !important;
}
.epv-admin-editor-wrap .epv-section-label,
.epv-admin-editor-wrap .epv-section-rect:hover .epv-section-label{
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}
.epv-thumb-pdf{height:92px;display:flex;align-items:center;justify-content:center;background:#c7372f;color:#fff;font-weight:800;font-size:22px;border-radius:4px;}
.epv-pdf-error{padding:30px;background:#fff3cd;border:1px solid #ffeeba;color:#8a6d3b;border-radius:8px;margin:20px;}

/* ePaper archive cards + hide featured image on single paper */
.epv-archive-template{max-width:1200px;margin:0 auto;padding:30px 16px}.epv-archive-container h1{margin:0 0 20px;font-size:32px}.epv-archive-wrap{width:100%;margin:20px auto}.epv-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:22px}.epv-edition-card{background:#fff;border:1px solid #e4e7ef;border-radius:18px;overflow:hidden;box-shadow:0 8px 28px rgba(15,23,42,.10);transition:.25s}.epv-edition-card:hover{transform:translateY(-4px);box-shadow:0 15px 38px rgba(15,23,42,.16)}.epv-card-img{position:relative;display:block;height:300px;background:#f4f6fb;overflow:hidden}.epv-card-img img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}.epv-card-pdf{height:100%;display:flex;align-items:center;justify-content:center;background:#c9342b;color:#fff;font-weight:800;font-size:38px}.epv-card-cat{position:absolute;top:12px;left:12px;background:#e60012;color:#fff;border-radius:999px;padding:5px 12px;font-size:12px;font-weight:700}.epv-card-body{padding:15px}.epv-card-body h3{font-size:18px;line-height:1.3;margin:0 0 7px}.epv-card-body h3 a{text-decoration:none;color:#111827}.epv-card-date{font-size:13px;color:#64748b;margin-bottom:12px}.epv-card-btn{display:inline-block;background:#062c68;color:#fff!important;text-decoration:none;border-radius:9px;padding:9px 14px;font-weight:700}.single-epv_edition .post-thumbnail,.single-epv_edition .featured-image,.single-epv_edition .entry-thumbnail,.single-epv_edition .wp-post-image:not(.epv-paper-img){display:none!important}@media(max-width:600px){.epv-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.epv-card-img{height:210px}.epv-card-body{padding:10px}.epv-card-body h3{font-size:15px}.epv-card-btn{font-size:12px;padding:7px 10px}}

/* v1.6: Real PDF thumbnail preview instead of red PDF boxes */
.epv-thumb{position:relative;}
.epv-thumb-pdf-canvas{width:100%;height:auto;display:block;background:#fff;}
.epv-thumb-pdf-fallback{position:absolute;inset:0;}
.epv-card-pdf-canvas{width:100%;height:100%;display:block;background:#fff;object-fit:cover;}
.epv-card-pdf-fallback{position:absolute;inset:0;}

/* Archive filter: date + category */
.epv-archive-filter{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:14px 16px;margin:0 0 22px;box-shadow:0 8px 24px rgba(15,23,42,.08)}
.epv-filter-field{display:flex;flex-direction:column;gap:5px;min-width:190px;flex:1}
.epv-filter-field label{font-size:12px;font-weight:800;color:#334155;text-transform:uppercase;letter-spacing:.03em}
.epv-filter-field input,.epv-filter-field select{height:42px;border:1px solid #d1d5db;border-radius:10px;padding:0 12px;font-size:14px;background:#fff;color:#111827;box-sizing:border-box;width:100%}
.epv-filter-btn,.epv-filter-reset{height:42px;border:0;border-radius:10px;padding:0 18px;font-weight:800;text-decoration:none!important;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.epv-filter-btn{background:#062c68;color:#fff}.epv-filter-btn:hover{background:#e60012;color:#fff}.epv-filter-reset{background:#f1f5f9;color:#0f172a}.epv-filter-reset:hover{background:#e2e8f0;color:#0f172a}

/* Popup top share buttons */
.epv-zoom-header{gap:12px}.epv-zoom-share{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.epv-share-btn{border:1px solid #e5e7eb;background:#f8fafc;color:#111827;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer}.epv-share-btn:hover{background:#062c68;color:#fff;border-color:#062c68}.epv-share-wa{background:#e8fff1;border-color:#b8f3cd}.epv-share-fb{background:#eef4ff;border-color:#c7d8ff}.epv-share-copy{background:#fff7ed;border-color:#fed7aa}
@media(max-width:600px){.epv-archive-filter{gap:10px;padding:12px}.epv-filter-field{min-width:100%}.epv-filter-btn,.epv-filter-reset{width:100%;}.epv-zoom-header{align-items:flex-start}.epv-zoom-share{justify-content:flex-end}.epv-share-btn{font-size:11px;padding:4px 8px}}

/* Popup brand/logo and clean share header */
.epv-popup-brand{display:flex;align-items:center;gap:12px;min-width:0}
.epv-popup-brand img{max-height:48px;max-width:260px;width:auto;height:auto;display:block;object-fit:contain}
.epv-popup-brand .epv-zoom-label{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.epv-zoom-share{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
@media(max-width:640px){.epv-popup-brand img{max-height:34px;max-width:160px}.epv-zoom-header{gap:8px;align-items:flex-start}.epv-share-btn{font-size:11px;padding:5px 7px}}

/* v1.8.1: Small popup logo + smaller archive cards */
.epv-zoom-header .epv-popup-brand{
    flex: 0 1 170px !important;
    max-width: 170px !important;
    min-width: 0 !important;
    overflow: hidden !important;
}
.epv-zoom-header .epv-popup-brand img,
.epv-popup-brand img,
.epv-zoom-header img{
    width: 150px !important;
    max-width: 150px !important;
    height: auto !important;
    max-height: 55px !important;
    object-fit: contain !important;
    display: block !important;
}
.epv-zoom-header .epv-zoom-label{
    display: none !important;
}
.epv-zoom-header{
    align-items: center !important;
}
.epv-zoom-share{
    margin-left: auto !important;
}

.epv-card-grid{
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important;
    gap: 16px !important;
}
.epv-edition-card{
    border-radius: 12px !important;
    box-shadow: 0 5px 18px rgba(15,23,42,.10) !important;
}
.epv-card-img{
    height: 220px !important;
}
.epv-card-body{
    padding: 10px 12px !important;
}
.epv-card-body h3{
    font-size: 15px !important;
    line-height: 1.25 !important;
    margin-bottom: 5px !important;
}
.epv-card-date{
    font-size: 12px !important;
    margin-bottom: 8px !important;
}
.epv-card-btn{
    font-size: 12px !important;
    border-radius: 7px !important;
    padding: 7px 10px !important;
}
.epv-card-cat{
    top: 8px !important;
    left: 8px !important;
    padding: 4px 9px !important;
    font-size: 11px !important;
}
@media(max-width:600px){
    .epv-card-grid{grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap:10px !important;}
    .epv-card-img{height: 165px !important;}
    .epv-card-body{padding:8px !important;}
    .epv-card-body h3{font-size:13px !important;}
    .epv-zoom-header .epv-popup-brand{flex-basis:120px !important;max-width:120px !important;}
    .epv-zoom-header .epv-popup-brand img,.epv-popup-brand img,.epv-zoom-header img{width:110px !important;max-width:110px !important;max-height:42px !important;}
}