/* EPAPER V17 — DISTINCT PROFESSIONAL VISUAL SYSTEM */
:root{--p-primary:#6d28d9;--p-primary2:#4f46e5;--p-ink:#111827;--p-muted:#667085;--p-bg:#f6f7fb;--p-card:#fff;--p-line:#e7e9f0;--p-dark:#111827;--p-dark2:#1f2937;--p-gold:#f59e0b;--p-radius:20px;--p-shadow:0 14px 45px rgba(17,24,39,.08)}
html,body{background:var(--p-bg)!important;color:var(--p-ink)!important;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 0%,rgba(109,40,217,.08),transparent 28%),radial-gradient(circle at 90% 15%,rgba(245,158,11,.06),transparent 25%);z-index:-1}
/* PUBLIC BRAND HEADER */
body:not(.main-body) .header{background:linear-gradient(135deg,#fff 0%,#fbf9ff 60%,#f7f4ff 100%)!important;padding:28px 28px 22px!important;border-bottom:1px solid var(--p-line)!important;box-shadow:none!important;position:relative!important}
body:not(.main-body) .header:before{height:6px!important;background:linear-gradient(90deg,var(--p-primary),var(--p-primary2),var(--p-gold))!important}
body:not(.main-body) .header:after{content:none!important;display:none!important}
body:not(.main-body) .header img{max-width:min(78vw,520px)!important;max-height:86px!important;filter:drop-shadow(0 10px 18px rgba(79,70,229,.12))!important}
body:not(.main-body) .navbar{background:#111827!important;padding:8px 0!important;border-bottom:3px solid var(--p-primary)!important;box-shadow:0 10px 30px rgba(17,24,39,.16)!important}
body:not(.main-body) .navbar .container{max-width:1380px!important}
body:not(.main-body) .navbar-nav{gap:5px!important}
body:not(.main-body) .navbar .nav-link{font-size:13px!important;font-weight:800!important;text-transform:uppercase;letter-spacing:.035em;color:#e5e7eb!important;padding:12px 15px!important;border-radius:12px!important}
body:not(.main-body) .navbar .nav-link:hover,body:not(.main-body) .navbar .nav-item.show>.nav-link{background:linear-gradient(135deg,var(--p-primary),var(--p-primary2))!important;color:#fff!important}
body:not(.main-body) .navbar .dropdown-menu{border:1px solid var(--p-line)!important;border-radius:14px!important;box-shadow:0 22px 60px rgba(17,24,39,.18)!important;padding:8px!important}
body:not(.main-body) .navbar .dropdown-item{font-weight:700!important;border-radius:10px!important;padding:10px 13px!important}
body:not(.main-body) .navbar .dropdown-item:hover{background:#f4f0ff!important;color:var(--p-primary)!important}
/* LANDING */
body:not(.main-body) .container{max-width:1380px!important}
body:not(.main-body) .edition-category{background:rgba(255,255,255,.88)!important;border:1px solid var(--p-line)!important;border-radius:24px!important;padding:28px!important;margin:28px 0!important;box-shadow:var(--p-shadow)!important;backdrop-filter:blur(12px)!important}
body:not(.main-body) .edition-category:before{width:0!important}
body:not(.main-body) .titleTag{font-size:21px!important;font-weight:900!important;letter-spacing:-.03em!important}
body:not(.main-body) .titleunderline{height:4px!important;width:72px!important;background:linear-gradient(90deg,var(--p-primary),var(--p-gold))!important;margin-top:9px!important}
body:not(.main-body) .edition-card{border:1px solid #e8e8f0!important;border-radius:18px!important;background:#fff!important;padding:8px!important;box-shadow:0 8px 25px rgba(17,24,39,.07)!important;transition:.28s cubic-bezier(.2,.8,.2,1)!important}
body:not(.main-body) .edition-card:hover{transform:translateY(-10px) scale(1.01)!important;box-shadow:0 24px 55px rgba(79,70,229,.18)!important;border-color:#c4b5fd!important}
body:not(.main-body) .edition-thumb{border-radius:13px!important;background:#f2f4f7!important}
body:not(.main-body) .edition-date-overlay{background:linear-gradient(90deg,rgba(17,24,39,.96),rgba(79,70,229,.84))!important;border-radius:12px!important;padding:10px 13px!important;bottom:13px!important;left:13px!important;width:calc(100% - 26px)!important}
body:not(.main-body) .edition-date-overlay h4{font-size:12px!important;font-weight:900!important;letter-spacing:.03em!important}
body:not(.main-body) #calendar{background:#fff!important;border:1px solid var(--p-line)!important;border-radius:18px!important;box-shadow:var(--p-shadow)!important;padding:18px!important}
/* VIEWER */
body:not(.main-body) .navstick{background:rgba(255,255,255,.92)!important;backdrop-filter:blur(18px)!important;border:1px solid var(--p-line)!important;box-shadow:0 8px 30px rgba(17,24,39,.07)!important}
body:not(.main-body) #newspaper-container{background:linear-gradient(145deg,#171923,#252938)!important;border:1px solid #303444!important;border-radius:22px!important;padding:14px!important;box-shadow:0 30px 80px rgba(17,24,39,.28)!important}
body:not(.main-body) .side-thumb{background:#fff!important;border:1px solid var(--p-line)!important;border-radius:14px!important;padding:7px!important;box-shadow:0 7px 20px rgba(17,24,39,.07)!important}
body:not(.main-body) .side-thumb:hover{border-color:#a78bfa!important;transform:translateY(-3px)!important}
body:not(.main-body) .custom-pagination .page-link{border-radius:10px!important;font-weight:800!important}
/* Edition pagination: keep readable text on hover (prevents Bootstrap white-on-white). */
body:not(.main-body) .edition-pagination .page-link,
body:not(.main-body) .edition-pagination .page-link:visited{
    color:#374151!important;
    background:#fff!important;
    border-color:#d7dce5!important;
    text-decoration:none!important;
}
body:not(.main-body) .edition-pagination .page-item:not(.disabled) .page-link:hover,
body:not(.main-body) .edition-pagination .page-item:not(.disabled) .page-link:focus{
    color:#fff!important;
    background:#4f46e5!important;
    border-color:#4f46e5!important;
}
body:not(.main-body) .edition-pagination .page-item.active .page-link{
    color:#fff!important;
    background:#4f46e5!important;
    border-color:#4f46e5!important;
}
body:not(.main-body) .edition-pagination .page-item.disabled .page-link{
    color:#9ca3af!important;
    background:#f3f4f6!important;
    border-color:#e5e7eb!important;
}

body:not(.main-body) .custom-pagination .active .page-link{background:var(--p-primary)!important;border-color:var(--p-primary)!important}
/* GLOBAL PUBLIC FORMS */
body:not(.main-body) .card{border:1px solid var(--p-line)!important;border-radius:20px!important;box-shadow:var(--p-shadow)!important}
body:not(.main-body) .form-control,body:not(.main-body) .form-select{border:1px solid #d9dce5!important;border-radius:12px!important;min-height:45px!important}
body:not(.main-body) .btn{border-radius:12px!important;font-weight:800!important}
/* ADMIN — FORCE NEW APP SHELL */
body.main-body{background:#f5f6fa!important;overflow-x:hidden!important}
body.main-body .page{min-height:100vh!important}
body.main-body .app-sidebar{width:286px!important;background:linear-gradient(180deg,#111827 0%,#151b2d 48%,#0b1020 100%)!important;border:0!important;box-shadow:20px 0 60px rgba(17,24,39,.16)!important}
body.main-body .main-sidebar-header{height:92px!important;background:linear-gradient(135deg,#161d31,#101522)!important;border-bottom:1px solid rgba(255,255,255,.08)!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:15px!important}
body.main-body .main-sidebar-header img{position:static!important;top:auto!important;left:auto!important;width:auto!important;max-width:190px!important;max-height:46px!important;height:auto!important;filter:brightness(0) invert(1) drop-shadow(0 4px 12px rgba(255,255,255,.12))!important}
body.main-body .main-sidemenu{padding:18px 14px 24px!important}
body.main-body .main-sidemenu #menuSearch{height:46px!important;border:1px solid rgba(255,255,255,.11)!important;border-radius:14px!important;background:rgba(255,255,255,.07)!important;color:#fff!important;padding:0 15px!important}
body.main-body .main-sidemenu #menuSearch::placeholder{color:#98a2b3!important}
body.main-body .side-menu{margin-top:16px!important;padding:0!important}
body.main-body .side-item-category{background:transparent!important;color:#667085!important;height:auto!important;padding:22px 10px 8px!important;font-size:10px!important;font-weight:900!important;letter-spacing:.16em!important;text-transform:uppercase!important}
body.main-body .side-menu>li.slide{margin:3px 0!important}
body.main-body .side-menu__item{display:flex!important;align-items:center!important;gap:11px!important;width:100%!important;min-height:48px!important;padding:10px 13px!important;border-radius:13px!important;color:#cbd5e1!important;text-decoration:none!important;text-align:left!important;transition:.2s ease!important}
body.main-body .side-menu__item:hover{background:rgba(255,255,255,.08)!important;color:#fff!important;transform:translateX(2px)!important}
body.main-body .slide.active>.side-menu__item{background:linear-gradient(135deg,#6d28d9,#4f46e5)!important;color:#fff!important;box-shadow:0 10px 24px rgba(79,70,229,.28)!important}
body.main-body .side-menu__item .menu{width:22px!important;height:22px!important;object-fit:contain!important;box-shadow:none!important;border:0!important;padding:2px!important;border-radius:7px!important;background:rgba(255,255,255,.08)!important;filter:none!important}
body.main-body .side-menu__item svg{margin-left:auto!important;width:15px!important;fill:currentColor!important;opacity:.55!important}
body.main-body .slide.active svg{display:block!important;opacity:.9!important}
body.main-body .side-menu__label{font-size:12px!important;font-weight:800!important;letter-spacing:.01em!important;white-space:normal!important}
body.main-body .main-content{margin-left:286px!important;min-height:100vh!important;background:#f5f6fa!important}
body.main-body .main-header{left:286px!important;width:calc(100% - 286px)!important;height:82px!important;background:rgba(255,255,255,.94)!important;border:0!important;border-bottom:1px solid #e8eaf0!important;box-shadow:0 5px 25px rgba(17,24,39,.05)!important;backdrop-filter:blur(18px)!important;z-index:100!important}
body.main-body .main-header .container-fluid{height:100%!important;padding:0 28px!important}
body.main-body .main-header-left{height:100%!important;display:flex!important;align-items:center!important}
body.main-body .main-header-left:after{content:"EPAPER CONTROL CENTER";display:block!important;margin-left:16px!important;font-size:12px!important;font-weight:900!important;letter-spacing:.14em!important;color:#6d28d9!important}
body.main-body .main-header-left>div[style]{display:none!important}
body.main-body .app-sidebar__toggle a{width:42px!important;height:42px!important;border-radius:12px!important;background:#f3f4f6!important;color:#111827!important;display:flex!important;align-items:center!important;justify-content:center!important;text-decoration:none!important}
body.main-body .main-header-right .btn{border-radius:12px!important;padding:10px 16px!important;font-size:12px!important;font-weight:900!important}
body.main-body .main-header-right .btn-dark{background:#111827!important;border-color:#111827!important}
body.main-body .main-header-right .btn-danger{background:#ef4444!important;border-color:#ef4444!important}
body.main-body .main-content>.container,.main-content>.container-fluid{padding:24px 28px!important}
body.main-body .breadcrumb-header{padding:26px 28px 8px!important}
body.main-body .card{border:1px solid #e7e9f0!important;border-radius:20px!important;box-shadow:0 12px 35px rgba(17,24,39,.06)!important;background:#fff!important}
body.main-body .card:hover{box-shadow:0 18px 45px rgba(17,24,39,.09)!important}
body.main-body .card-header{background:transparent!important;border-bottom:1px solid #eef0f4!important;font-weight:900!important}
body.main-body .form-control,body.main-body .form-select,body.main-body select{border:1px solid #d9dce5!important;border-radius:12px!important;min-height:44px!important;background:#fff!important}
body.main-body .form-control:focus,body.main-body .form-select:focus,body.main-body select:focus{border-color:#8b5cf6!important;box-shadow:0 0 0 4px rgba(139,92,246,.12)!important}
body.main-body button[type=submit],body.main-body input[type=submit],body.main-body .btn-main-primary{display:inline-flex!important;visibility:visible!important;opacity:1!important;align-items:center!important;justify-content:center!important;border-radius:12px!important;font-weight:900!important;min-height:42px!important}
body.main-body .btn-primary{background:linear-gradient(135deg,#6d28d9,#4f46e5)!important;border-color:#6d28d9!important}
body.main-body .table{background:#fff!important;border-radius:16px!important;overflow:hidden!important}
body.main-body .table thead th{background:#f8f8fc!important;color:#667085!important;font-size:10px!important;letter-spacing:.1em!important;text-transform:uppercase!important;border-bottom:1px solid #e7e9f0!important}
body.main-body .table tbody td{border-color:#eef0f4!important;vertical-align:middle!important}
body.main-body .badge{border-radius:999px!important;padding:6px 10px!important;font-weight:800!important}
/* DASHBOARD HERO */
body.main-body .bg-2{border:0!important;overflow:hidden!important;border-radius:22px!important;box-shadow:0 20px 50px rgba(79,70,229,.18)!important}
body.main-body .bg-2 .card-body{background:linear-gradient(135deg,#17152e 0%,#34237a 55%,#6d28d9 100%)!important;border-radius:22px!important;position:relative!important;overflow:hidden!important}
body.main-body .bg-2 .card-body:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-80px;top:-90px;background:rgba(255,255,255,.09)!important}
body.main-body .sales-card{border:0!important;border-radius:20px!important;overflow:hidden!important}
body.main-body .sales-card h6{font-size:10px!important;letter-spacing:.1em!important;text-transform:uppercase!important}
/* MODALS */
body.main-body .modal-content,body:not(.main-body) .modal-content{border:0!important;border-radius:22px!important;box-shadow:0 30px 100px rgba(17,24,39,.25)!important;overflow:hidden!important}
body.main-body .modal-header,body:not(.main-body) .modal-header{border-bottom:1px solid #eef0f4!important;padding:18px 22px!important}
/* COLLAPSE */
body.main-body.sidenav-toggled .app-sidebar{width:82px!important}
body.main-body.sidenav-toggled .main-content{margin-left:82px!important}
body.main-body.sidenav-toggled .main-header{left:82px!important;width:calc(100% - 82px)!important}
@media(max-width:991px){body.main-body .app-sidebar{width:286px!important;transform:translateX(-100%)!important}body.main-body .main-content{margin-left:0!important}body.main-body .main-header{left:0!important;width:100%!important}body.main-body.sidenav-toggled .app-sidebar{transform:translateX(0)!important;width:286px!important}body.main-body.sidenav-toggled .main-content{margin-left:0!important}body.main-body.sidenav-toggled .main-header{left:0!important;width:100%!important}}

/* V17.1 viewer fixes: page navigation must not collide with clip navigation; clips must never stretch. */
.custom-pagination .btn-prev,.custom-pagination .btn-next{position:static!important;transform:none!important;height:auto!important;padding:9px 14px!important;font-size:13px!important}
#popup-image-container .crop-preview-image{width:auto!important;height:auto!important;max-width:calc(100vw - 40px)!important;max-height:calc(85vh - 150px)!important;object-fit:contain!important;display:block!important}

/* V17.3 — viewer toolbar: equal controls, no focus/outline halo, compact archive */
body:not(.main-body) .navstick .btn-crop,
body:not(.main-body) .navstick #croppertool,
body:not(.main-body) .navstick #btnlarge,
body:not(.main-body) .navstick .cal_outer,
body:not(.main-body) .navstick #datepicker{box-sizing:border-box!important;height:42px!important;min-height:42px!important}
body:not(.main-body) .navstick #croppertool,
body:not(.main-body) .navstick #btnlarge{width:96px!important;padding:0 12px!important;border:1px solid transparent!important;outline:0!important;box-shadow:none!important;appearance:none!important;-webkit-appearance:none!important}
body:not(.main-body) .navstick #croppertool:focus,
body:not(.main-body) .navstick #croppertool:focus-visible,
body:not(.main-body) .navstick #btnlarge:focus,
body:not(.main-body) .navstick #btnlarge:focus-visible{outline:0!important;box-shadow:none!important}
body:not(.main-body) .navstick .cal_outer{width:96px!important;border:0!important;box-shadow:none!important;outline:0!important;border-radius:12px!important;overflow:hidden!important}
body:not(.main-body) .navstick .cal_outer .arcpa{width:38px!important;min-width:38px!important;height:42px!important;display:flex!important;align-items:center!important;justify-content:center!important;border:0!important}
body:not(.main-body) .navstick #datepicker{width:58px!important;padding:0 7px!important;text-align:center!important;border:0!important;outline:0!important;box-shadow:none!important;font-size:12px!important;font-weight:800!important}
body:not(.main-body) .navstick #datepicker:focus,
body:not(.main-body) .navstick #datepicker:focus-visible{outline:0!important;box-shadow:none!important}
body:not(.main-body) .navstick .pull-right{margin-left:8px!important}
body:not(.main-body) .navstick .custom-pagination .page-link:focus,
body:not(.main-body) .navstick .custom-pagination .page-link:focus-visible{outline:0!important;box-shadow:none!important}
/* Crop/share viewer: preserve the generated image aspect ratio exactly. */
#popup-image-container img,
.ep-crop-content img,
.ep-image img{width:auto!important;height:auto!important;max-width:100%!important;object-fit:contain!important}


/* Archive control: keep the text visible next to the calendar icon. */
body:not(.main-body) .navstick .cal_outer{display:flex!important;align-items:stretch!important;width:auto!important;min-width:118px!important;overflow:visible!important}
body:not(.main-body) .navstick .cal_outer .arcpa{width:38px!important;min-width:38px!important;height:42px!important;display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 38px!important}
body:not(.main-body) .navstick #datepicker{width:80px!important;min-width:80px!important;height:42px!important;min-height:42px!important;padding:0 8px!important;text-align:center!important;border:0!important;outline:0!important;box-shadow:none!important;font-size:13px!important;font-weight:800!important;display:block!important;color:inherit!important;background:transparent!important;cursor:pointer!important}

/* Front-end toolbar: consistent professional control size and responsive layout. */
body:not(.main-body) .navstick{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:8px!important;padding:8px 10px!important}
body:not(.main-body) .navstick .pull-left,body:not(.main-body) .navstick .pull-right{float:none!important;margin:0!important;display:flex!important;align-items:center!important}
body:not(.main-body) .navstick #croppertool,body:not(.main-body) .navstick #btnlarge,body:not(.main-body) .navstick .cal_outer{height:42px!important;min-height:42px!important;width:112px!important;min-width:112px!important;border-radius:9px!important}
body:not(.main-body) .navstick #croppertool,body:not(.main-body) .navstick #btnlarge{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
body:not(.main-body) .navstick .cal_outer{display:flex!important;align-items:stretch!important;overflow:hidden!important}
body:not(.main-body) .navstick .cal_outer .arcpa{width:38px!important;min-width:38px!important;height:42px!important;background:#212529!important;color:#fff!important}
body:not(.main-body) .navstick #datepicker{width:74px!important;min-width:74px!important;height:42px!important;background:#212529!important;color:#fff!important;-webkit-text-fill-color:#fff!important;font-size:13px!important;font-weight:800!important}
body:not(.main-body) .navstick .custom-pagination{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:4px!important;margin:0!important}
@media(max-width:600px){body:not(.main-body) .navstick{gap:6px!important;padding:7px!important}.navstick .custom-pagination{order:10;width:100%}.navstick #croppertool,.navstick #btnlarge,.navstick .cal_outer{width:calc((100vw - 34px)/3)!important;min-width:0!important}.navstick #datepicker{width:calc((100vw - 72px)/3)!important;min-width:0!important}.navstick .custom-pagination .page-link{padding:6px 8px!important;font-size:12px!important}}

/* V20.3 — final viewer toolbar */
body:not(.main-body) .navstick{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;flex-wrap:wrap!important}
body:not(.main-body) .navstick .pull-left,body:not(.main-body) .navstick .pull-right{float:none!important;margin:0!important;display:flex!important;align-items:center!important}
body:not(.main-body) .navstick #croppertool,body:not(.main-body) .navstick #btnlarge,body:not(.main-body) .navstick .cal_outer{height:42px!important;min-height:42px!important;border-radius:10px!important;box-sizing:border-box!important}
body:not(.main-body) .navstick #croppertool,body:not(.main-body) .navstick #btnlarge{width:105px!important;min-width:105px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important}
body:not(.main-body) .navstick .cal_outer{width:105px!important;min-width:105px!important;display:flex!important;overflow:hidden!important;background:#212529!important}
body:not(.main-body) .navstick .cal_outer .arcpa{width:38px!important;min-width:38px!important;height:42px!important;background:#212529!important;color:#fff!important;display:flex!important;align-items:center!important;justify-content:center!important}
body:not(.main-body) .navstick #datepicker{width:67px!important;min-width:67px!important;height:42px!important;background:#212529!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border:0!important;font-size:13px!important;font-weight:800!important}
body:not(.main-body) .navstick .custom-pagination{display:flex!important;align-items:center!important;justify-content:center!important;flex-wrap:wrap!important;gap:4px!important;margin:0!important}
@media(max-width:600px){body:not(.main-body) .navstick{gap:6px!important;padding:7px!important}.navstick #croppertool,.navstick #btnlarge,.navstick .cal_outer{width:calc((100vw - 34px)/3)!important;min-width:0!important}.navstick #datepicker{width:calc((100vw - 72px)/3)!important;min-width:0!important}.navstick .custom-pagination{order:10;width:100%}.navstick .custom-pagination .page-link{padding:6px 8px!important;font-size:12px!important}}
/* Crop share control must remain clickable above Cropper.js overlays. */
body:not(.main-body) #newspaper-container #share-crop{pointer-events:auto!important;z-index:2147483647!important;cursor:pointer!important}
