/*
Theme Name:   DVDCover Cinematic
Theme URI:    https://dvdcover.com
Description:  Standalone cinematic dark theme for DVDCover.com. Deep noir aesthetic, crimson accent, Outfit typeface. No parent theme required.
Author:       DVDCover
Author URI:   https://dvdcover.com
Version:      4.6
License:      GNU General Public License v2 or later
Text Domain:  dvdcover
Tags:         dark, one-column, two-columns, right-sidebar, custom-menu, featured-images, threaded-comments
*/

/* ================================================================
   DESIGN TOKENS
   ================================================================ */
:root {
    --bg:       #080808;
    --bg2:      #0f0f0f;
    --surface:  #161616;
    --surface2: #1e1e1e;
    --surface3: #262626;
    --border:   #2a2a2a;
    --border2:  #383838;
    --text:     #f0ede8;
    --text2:    #9e9991;
    --text3:    #4a4540;
    --accent:   #e63946;
    --accent-h: #c8303c;
    --accent2:  #f4a261;
    --link:     #7aafe0;
    --font:     'Outfit','Helvetica Neue',Arial,sans-serif;
    --nav-h:    56px;
    --r:        8px;
    --t:        0.18s ease;
}
body.light-mode {
    --bg:       #f5f2ed;
    --bg2:      #ece8e2;
    --surface:  #ffffff;
    --surface2: #f7f4ef;
    --surface3: #ede9e3;
    --border:   #ddd9d3;
    --border2:  #ccc8c2;
    --text:     #1a1714;
    --text2:    #5a5550;
    --text3:    #9c9890;
    --link:     #1a5fa8;
}
/* ================================================================
   BASE RESET + TYPOGRAPHY
   Dark is the absolute default — no class dependency
   ================================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
    background-color: #080808;
}
html, body {
    margin: 0; padding: 0;
    background-color: #080808;
    color: #f0ede8;
    font-family: 'Outfit','Helvetica Neue',Arial,sans-serif;
    font-size: 15px;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
/* CSS variables take over once loaded */
html { background:#080808; }
html body {
    background-color: var(--bg) !important;
    color: var(--text) !important;
    font-family: var(--font) !important;
}
body.light-mode {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}
a { color: var(--link); text-decoration: none; transition: color var(--t); }
a:hover { color: var(--accent); }
img { max-width: 100%; height: auto; display: block; }
h1,h2,h3,h4,h5,h6 {
    font-family: var(--font);
    color: var(--text);
    line-height: 1.25;
    margin: 0 0 0.5em;
    font-weight: 600;
}
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.5em; }

/* ================================================================
   FIXED NAV BAR
   ================================================================ */
#dvdc-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: var(--nav-h);
    z-index: 99999;
    background: rgba(8,8,8,.96);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    padding: 0 24px;
    gap: 8px;
    box-sizing: border-box;
    overflow: visible;
}
body.light-mode #dvdc-header {
    background: rgba(245,242,237,.96);
}

/* ================================================================
   NAV BAR — hardcoded dark so it works before CSS vars load
   ================================================================ */
header, .main-header { overflow: visible !important; box-shadow: none !important; }

header .sticky-on,
header .stickytop.sticky-on,
div.sticky-on,
.sticky-on {
    position: fixed !important;
    top: 0 !important; left: 0 !important;
    width: 100% !important;
    height: 56px !important;
    z-index: 99999 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 0 24px !important;
    gap: 8px !important;
    box-sizing: border-box !important;
    /* Hard dark — does not depend on CSS vars */
    background-color: #0f0f0f !important;
    background: rgba(8,8,8,.97) !important;
    border-bottom: 1px solid #2a2a2a !important;
    color: #f0ede8 !important;
    overflow: visible !important;
}
body.light-mode header .sticky-on,
body.light-mode div.sticky-on,
body.light-mode .sticky-on {
    background: rgba(245,242,237,.97) !important;
    border-bottom-color: var(--border) !important;
}

/* Logo */
.logo { flex-shrink:0 !important; float:none !important; display:flex !important; align-items:center !important; margin:0 12px 0 0 !important; }
.logo img { max-height:40px !important; width:auto !important; }

/* ================================================================
   NAV LINKS
   ================================================================ */
nav#myjquerymenu.jquerycssmenu { flex:1 1 auto !important; min-width:0 !important; overflow:visible !important; float:none !important; padding:0 !important; margin:0 !important; }
nav#myjquerymenu.jquerycssmenu>ul { display:flex !important; flex-wrap:nowrap !important; align-items:center !important; padding:0 !important; margin:0 !important; list-style:none !important; overflow:visible !important; gap:2px !important; }
nav#myjquerymenu.jquerycssmenu>ul>li { overflow:visible !important; position:relative !important; }
.jquerycssmenu ul li a { color:var(--text2) !important; font-size:13px !important; font-weight:400 !important; letter-spacing:.3px !important; white-space:nowrap !important; padding:6px 10px !important; border-radius:6px !important; transition:color var(--t),background var(--t) !important; display:block !important; }
.jquerycssmenu ul li a:hover,
.jquerycssmenu ul li.current_page_item>a,
.jquerycssmenu ul li.current-menu-item>a { color:var(--text) !important; background:var(--surface2) !important; }
.jquerycssmenu ul li ul,
.menu-categories .jquerycssmenu ul li ul { display:none; background:var(--surface2) !important; border:1px solid var(--border) !important; border-top:2px solid var(--accent) !important; border-radius:0 0 var(--r) var(--r) !important; box-shadow:0 16px 40px rgba(0,0,0,.65) !important; position:absolute !important; z-index:999999 !important; min-width:190px !important; overflow:visible !important; }
.jquerycssmenu ul li ul li a { color:var(--text2) !important; padding:9px 16px !important; font-size:12px !important; border-radius:0 !important; background:transparent !important; }
.jquerycssmenu ul li ul li a:hover { background:var(--surface3) !important; color:var(--accent) !important; }

/* Upload button */
div.uploadbtn { flex-shrink:0 !important; float:none !important; margin-left:4px !important; }
div.uploadbtn a.simplebtn { background:var(--accent) !important; color:#fff !important; border-radius:6px !important; padding:7px 16px !important; font-size:12px !important; font-weight:600 !important; border:none !important; display:flex !important; align-items:center !important; gap:5px !important; white-space:nowrap !important; transition:background var(--t),transform var(--t) !important; }
div.uploadbtn a.simplebtn:hover { background:var(--accent-h) !important; transform:translateY(-1px) !important; }
div.pxspace { display:none !important; }

/* Dark/Light toggle */
#dvdc-theme-toggle { flex-shrink:0 !important; display:flex !important; align-items:center !important; gap:5px !important; background:transparent !important; border:1px solid var(--border) !important; border-radius:20px !important; padding:5px 12px !important; color:var(--text3) !important; font-size:12px !important; font-family:var(--font) !important; cursor:pointer !important; transition:all var(--t) !important; white-space:nowrap !important; }
#dvdc-theme-toggle:hover { border-color:var(--accent) !important; color:var(--text2) !important; }

/* ================================================================
   HEADER AD BANNER + RED CATEGORY BAR
   ================================================================ */
.main-header { overflow:visible !important; }
.dvdc-header-ad { text-align:center !important; padding:5px 0 !important; background:var(--bg2) !important; border-bottom:1px solid var(--border) !important; max-height:102px !important; overflow:hidden !important; }
header .wrap-center { background:transparent !important; padding:0 !important; border:none !important; max-width:none !important; width:100% !important; }
.bar-header, div.bar-header { background:#e63946 !important; position:relative !important; z-index:1 !important; }
.bar-header .wrap-center { background:transparent !important; border-bottom:none !important; padding:0 !important; max-width:none !important; width:100% !important; }
/* Category bar nav - force horizontal flex */
nav#myjquerymenu-cat.jquerycssmenu { display:block !important; }
nav#myjquerymenu-cat.jquerycssmenu>ul { display:flex !important; flex-wrap:wrap !important; align-items:center !important; padding:0 !important; margin:0 !important; list-style:none !important; overflow:visible !important; gap:0 !important; }
nav#myjquerymenu-cat.jquerycssmenu>ul>li { overflow:visible !important; position:relative !important; display:block !important; }
nav#myjquerymenu-cat.jquerycssmenu>ul>li::marker { display:none !important; content:'' !important; }
.menu-categories .jquerycssmenu ul { list-style:none !important; padding:0 !important; margin:0 !important; }
.menu-categories .jquerycssmenu ul li { list-style:none !important; }
.menu-categories .jquerycssmenu ul li::before,
.menu-categories .jquerycssmenu ul li::marker { display:none !important; content:'' !important; }
.menu-categories .jquerycssmenu ul li a { color:rgba(255,255,255,.88) !important; font-size:11px !important; font-weight:600 !important; letter-spacing:.6px !important; text-transform:uppercase !important; padding:8px 12px !important; background:transparent !important; display:block !important; white-space:nowrap !important; }
.menu-categories .jquerycssmenu ul li a:hover { color:#fff !important; background:rgba(0,0,0,.15) !important; }
body.light-mode .bar-header,
body.light-mode div.bar-header { background-color:var(--accent) !important; }
body.light-mode .menu-categories .jquerycssmenu ul li a { color:rgba(255,255,255,.88) !important; }
body.light-mode .menu-categories .jquerycssmenu ul li ul { background:#fff !important; border:1px solid #ddd !important; }
body.light-mode .menu-categories .jquerycssmenu ul li ul li a { color:#333 !important; }
body.light-mode .menu-categories .jquerycssmenu ul li ul li a:hover { color:var(--accent) !important; background:#f5f5f5 !important; }

body { padding-top: 0 !important; } /* header static flow provides spacing */

/* ================================================================
   HOMEPAGE LAYOUT — left sidebar + masonry grid
   ================================================================ */
.home-fullwidth {
    width: 100%;
    box-sizing: border-box;
    background: linear-gradient(to right, var(--bg2) 300px, transparent 300px);
}
.home-fullwidth::after { content:''; display:block; clear:both; }

.sidebar-left {
    float: left;
    width: 300px;
    min-width: 300px;
    box-sizing: border-box;
    padding: 16px 0;
    background: var(--bg2);
    color: var(--text2);
    overflow: visible;
    position: relative;
    z-index: 1;
}
.sidebar-left * { color:var(--text2) !important; border-color:var(--border) !important; }
.sidebar-left a { color:var(--text2) !important; }
.sidebar-left a:hover { color:var(--accent) !important; }
.sidebar-left .widget { overflow: visible; width: 300px; max-width: 300px; margin-bottom: 16px; padding: 0; box-sizing: border-box; }
/* Ads inside sidebar: 300px wide, not clipped */
.sidebar-left ins.adsbygoogle,
.sidebar-left .widget ins.adsbygoogle {
    display: block !important;
    width: 300px !important;
    max-width: 300px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}
.sidebar-left .asp_w_container, .sidebar-left .asp_w.ajaxsearchpro { max-width:100% !important; overflow:hidden !important; }
.sidebar-left .wpp-list li { padding:7px 0; border-bottom:1px solid var(--border); font-size:12px; line-height:1.45; }
.sidebar-left .wpp-list li:last-child { border-bottom:none; }
.sidebar-left .wpp-post-title { color:var(--text2) !important; }
.sidebar-left .wpp-meta { color:var(--text3) !important; font-size:11px !important; }

.wrap-content {
    margin-left: 300px;
    overflow: visible;
    float: none;
    width: auto;
}

/* ================================================================
   MASONRY CARDS
   ================================================================ */
ul#infinite-articles, ul.masonry_list { width:100% !important; position:relative !important; }

/* CRITICAL: explicit column width so Masonry calculates correctly */
ul.masonry_list li,
ul#infinite-articles li.ms-item,
li.ms-item {
    width: 284px !important;
    background:#161616 !important;
    background:var(--surface) !important;
    color:#f0ede8 !important;
    color:var(--text) !important;
    border:1px solid #2a2a2a !important;
    border-color:var(--border) !important;
    border-radius:var(--r) !important;
    overflow:hidden !important;
    transition:transform .22s ease, box-shadow .22s ease, border-color .22s !important;
    margin: 0 0 8px 8px !important;
    box-sizing: border-box !important;
}
ul.masonry_list li.homeimg,
ul.masonry_list li.homeimg iframe,
ul.masonry_list li.homeimg img { width: 284px !important; }
ul.masonry_list li:hover,
ul#infinite-articles li.ms-item:hover {
    transform:translateY(-5px) !important;
    box-shadow:0 14px 40px rgba(0,0,0,.6) !important;
    border-color:var(--border2) !important;
}
ul.masonry_list li img { width:100% !important; display:block !important; border-radius:0 !important; }
ul.masonry_list .an-widget-title h2 a,
ul.masonry_list .article-title a { color:var(--text) !important; font-size:13px !important; font-weight:500 !important; line-height:1.4 !important; }
ul.masonry_list .an-widget-title h2 a:hover { color:var(--accent) !important; }
ul.masonry_list .vcard,
ul.masonry_list .an-widget-title span { color:var(--text3) !important; font-size:11px !important; }
ul.masonry_list .vcard a { color:var(--accent2) !important; border-bottom:none !important; }
ul.masonry_list li p { color:var(--text2) !important; font-size:12px !important; }
.small-content { padding:10px 12px 6px !important; }
.masonry_list .home-meta { border-top:1px solid var(--border) !important; padding:6px 12px !important; }
.masonry_list .an-display-time,
.masonry_list .an-display-view,
.masonry_list .an-display-comm { color:var(--text3) !important; font-size:11px !important; }
ul.masonry_list .article-category,
ul.article_list .article-category { background:var(--accent) !important; color:#fff !important; font-size:9px !important; font-weight:700 !important; letter-spacing:.7px !important; text-transform:uppercase !important; border-radius:0 0 5px 0 !important; }
ul.masonry_list .article-category i, ul.article_list .article-category i { display:none !important; }
ul.masonry_list .article-category a, ul.article_list .article-category a { color:#fff !important; background:transparent !important; }
.article-comm { background:rgba(0,0,0,.65) !important; color:#fff !important; border-radius:4px !important; }
.article-comm a { color:#fff !important; }
ul.masonry_list li.ms-item-ad, li.ms-item-ad { background:var(--surface) !important; border:1px dashed var(--border2) !important; display:flex !important; align-items:center !important; justify-content:center !important; }
li.ms-item-ad ins.adsbygoogle { max-width:100% !important; }

/* ================================================================
   PAGINATION
   ================================================================ */
.wp-pagenavi, .defaultpag, #nav-below {
    clear:both !important; float:none !important; width:100% !important;
    display:block !important; visibility:visible !important; opacity:1 !important;
    padding:24px 0 16px !important; text-align:center !important;
    position:relative !important; z-index:100 !important;
    background:var(--bg) !important; isolation:isolate !important; margin-top:12px !important;
}
.wp-pagenavi a, .wp-pagenavi span {
    background:var(--surface) !important; border:1px solid var(--border) !important;
    color:var(--text2) !important; border-radius:6px !important; margin:2px !important;
    min-width:34px !important; height:34px !important; line-height:32px !important;
    display:inline-flex !important; align-items:center !important; justify-content:center !important;
    font-size:13px !important; transition:all .15s !important; padding:0 6px !important;
}
.wp-pagenavi a:hover { background:var(--surface2) !important; color:var(--text) !important; border-color:var(--border2) !important; }
.wp-pagenavi span.current { background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; font-weight:600 !important; }


/* ================================================================
   SINGLE POST — Cinematic cover frame
   ================================================================ */
.cover-cinema-frame {
    display:flex !important;
    justify-content:center !important;
    width:100% !important;
    margin:0 auto 20px auto !important;
    position:relative !important;
    border-radius:0 !important;
    background: transparent !important;
}
.cover-cinema-frame img {
    display:block !important;
    max-width:700px !important;
    width:auto !important;
    height:auto !important;
    border-radius:3px !important;
    margin:0 auto !important;
    position:relative !important;
    z-index:1 !important;
    /* Cinematic shadow on the image itself */
    box-shadow:
        0 2px 4px rgba(0,0,0,.4),
        0 8px 20px rgba(0,0,0,.55),
        0 20px 60px rgba(0,0,0,.45),
        0 0 0 1px rgba(255,255,255,.06) !important;
}

/* Light mode: slightly lighter shadow */
body.light-mode .cover-cinema-frame img {
    box-shadow:
        0 2px 4px rgba(0,0,0,.15),
        0 8px 20px rgba(0,0,0,.2),
        0 20px 40px rgba(0,0,0,.15) !important;
}







/* ================================================================
   BBPRESS
   ================================================================ */
#bbpress-forums,
#bbpress-forums *:not(img):not(input):not(button):not(select):not(textarea) { background:transparent !important; color:var(--text2) !important; border-color:var(--border) !important; }
#bbpress-forums li.bbp-forum, #bbpress-forums li.bbp-topic, #bbpress-forums li.bbp-reply { background:var(--surface) !important; border:1px solid var(--border) !important; border-radius:var(--r) !important; margin-bottom:6px !important; padding:10px 14px !important; }
#bbpress-forums li.bbp-forum:hover, #bbpress-forums li.bbp-topic:hover { background:var(--surface2) !important; }
#bbpress-forums .bbp-forum-title a, #bbpress-forums .bbp-topic-title a { color:var(--text) !important; font-weight:500 !important; }
#bbpress-forums .bbp-forum-title a:hover, #bbpress-forums .bbp-topic-title a:hover { color:var(--accent) !important; }
#bbpress-forums input[type=text], #bbpress-forums input[type=email], #bbpress-forums textarea { background:var(--surface) !important; border:1px solid var(--border) !important; color:var(--text) !important; border-radius:5px !important; padding:8px 10px !important; }
#bbpress-forums input[type=submit], #bbpress-forums .bbp-submit-wrapper button { background:var(--accent) !important; color:#fff !important; border:none !important; border-radius:5px !important; padding:8px 18px !important; font-weight:600 !important; }
.bbp-forum-header, .bbp-topic-header, .bbp-reply-header, .bbp-forums-header { background:var(--surface2) !important; color:var(--text3) !important; padding:6px 14px !important; font-size:10px !important; letter-spacing:1.5px !important; text-transform:uppercase !important; border-bottom:1px solid var(--border) !important; border-radius:var(--r) var(--r) 0 0 !important; }

/* ================================================================
   PMPRO MEMBERSHIP
   ================================================================ */
.pmpro, .pmpro *, .pmpro_card, .pmpro_table { color:var(--text) !important; border-color:var(--border) !important; }
.pmpro_table thead { background:var(--surface2) !important; }
.pmpro_table tbody tr { background:var(--surface) !important; }
.pmpro_table tbody tr:hover { background:var(--surface2) !important; }
.pmpro_table th, .pmpro_table td { background:transparent !important; color:var(--text) !important; border-color:var(--border) !important; }
.pmpro_card { background:var(--surface) !important; border:1px solid var(--border) !important; border-radius:var(--r) !important; }
.pmpro_btn.pmpro_btn-select { background:var(--accent) !important; color:#fff !important; border-radius:6px !important; padding:8px 20px !important; font-weight:600 !important; }
.pmpro_btn.pmpro_btn-select:hover { background:var(--accent-h) !important; }


/* ================================================================
   SINGLE POST — Layout (content + sidebar)
   ================================================================ */
.wrap-fullwidth {
    width: 100% !important;
    overflow: hidden !important;
    display: block !important;
    box-sizing: border-box !important;
}
.wrap-fullwidth::after { content:''; display:table; clear:both; }

.wrap-fullwidth .single-content,
.single-content {
    float: left !important;
    width: calc(100% - 320px) !important;
    box-sizing: border-box !important;
    padding: 20px 28px !important;
    min-width: 0 !important;
    overflow: visible !important;
}

.wrap-fullwidth aside.sidebar,
div.sidebar,
.sidebar {
    float: right !important;
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    box-sizing: border-box !important;
    padding: 16px 0 0 0 !important;
    overflow: hidden !important;
    word-wrap: break-word !important;
}

/* Sidebar widget styling — full 300px for ad units */
aside.sidebar .widget,
div.sidebar .widget,
.sidebar .widget {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    padding: 0 !important;
    margin-bottom: 12px !important;
    overflow: hidden !important;
    width: 300px !important;
    max-width: 300px !important;
    box-sizing: border-box !important;
}
/* Non-ad widget content gets internal padding */
aside.sidebar .widget .widget-title,
aside.sidebar .widget h3.title,
.sidebar .widget .widget-title,
.sidebar .widget h3.title {
    padding: 12px 14px 8px 14px !important;
}
aside.sidebar .widget .textwidget,
aside.sidebar .widget ul,
aside.sidebar .widget p,
aside.sidebar .widget form,
.sidebar .widget .textwidget,
.sidebar .widget ul,
.sidebar .widget p,
.sidebar .widget form {
    padding-left: 14px !important;
    padding-right: 14px !important;
}
/* ASP search widget inside sidebar — full width */
aside.sidebar .asp_w_container,
.sidebar .asp_w_container {
    width: 300px !important;
    max-width: 300px !important;
    box-sizing: border-box !important;
    padding: 10px 14px !important;
}
/* Ad units — full 300px, no padding */
aside.sidebar .widget ins.adsbygoogle,
.sidebar .widget ins.adsbygoogle {
    display: block !important;
    width: 300px !important;
    max-width: 300px !important;
    margin: 0 !important;
    padding: 0 !important;
}
aside.sidebar .widget *,
.sidebar .widget * { color: var(--text2) !important; }
aside.sidebar .widget a,
.sidebar .widget a { color: var(--text2) !important; }
aside.sidebar .widget a:hover,
.sidebar .widget a:hover { color: var(--accent) !important; }
aside.sidebar .widget h3.title,
.sidebar .widget h3.title {
    color: var(--text3) !important;
    font-size: 9px !important;
    letter-spacing: 2.5px !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid var(--border) !important;
    padding-bottom: 7px !important;
    margin-bottom: 10px !important;
    font-weight: 600 !important;
}
aside.sidebar .widget h3.title:after,
.sidebar .widget h3.title:after { display: none !important; }
aside.sidebar ins.adsbygoogle,
.sidebar ins.adsbygoogle { max-width: 100% !important; width: 100% !important; display: block !important; }
.sidebar .wpp-list li { padding: 7px 0 !important; border-bottom: 1px solid var(--border) !important; font-size: 12px !important; line-height: 1.4 !important; }
.sidebar .wpp-list li:last-child { border-bottom: none !important; }
.sidebar .wpp-post-title { color: var(--text2) !important; }
.sidebar .wpp-meta { color: var(--text3) !important; font-size: 11px !important; }


/* ================================================================
   SINGLE POST — Typography & Meta
   ================================================================ */
.entry-top { padding: 16px 0 10px 0 !important; }
.entry-top h1.article-title,
h1.article-title.entry-title { font-size: 22px !important; font-weight: 700 !important; color: var(--text) !important; margin: 0 0 6px 0 !important; line-height: 1.3 !important; }
.entry-top .vcard { font-size: 12px !important; color: var(--text3) !important; display: block !important; }
.entry-top .vcard a { color: var(--accent) !important; }

.media-single-content { margin-bottom: 4px !important; }
.media-single-content img { display: block !important; margin: 0 auto !important; max-width: 100% !important; height: auto !important; }
.single-gallery { text-align: center !important; margin-bottom: 6px !important; }
.single-gallery img { max-width: 100% !important; }
.media-single-content center,
.media-single-content > p { color: var(--text3) !important; font-size: 11px !important; margin: 7px 0 0 0 !important; display: block !important; }

.meta-wrap { margin-top: 10px !important; padding: 9px 0 0 0 !important; border-top: 1px solid var(--border) !important; }
.single-meta { display: flex !important; flex-wrap: wrap !important; gap: 14px !important; align-items: center !important; }
.single-meta, .single-meta *, .single-meta a { color: var(--text3) !important; font-size: 11px !important; }
.single-meta i { margin-right: 3px !important; }
.single-meta > div { display: inline-flex !important; align-items: center !important; gap: 3px !important; }

.entry { margin-top: 16px !important; }
.entry-excerpt h3 { font-size: 14px !important; color: var(--text2) !important; font-weight: 400 !important; margin-bottom: 12px !important; }
.entry p { color: var(--text) !important; font-size: 14px !important; line-height: 1.7 !important; margin-bottom: 12px !important; }
.entry a { color: var(--link) !important; }
.entry a:hover { color: var(--accent) !important; }
/* Center the cinematic cover within entry */
.entry .cover-cinema-frame { margin: 0 auto 20px auto !important; }
/* Comments + entry-bottom — full styles below in COMMENTS SECTION BOX */
/* Keeping this block for layout compatibility */

.entry-img-300 { float: right !important; margin: 0 0 10px 16px !important; max-width: 300px !important; }

/* Ensure article/post content flows correctly */
article { display: block !important; width: 100% !important; }
article .post { display: block !important; width: 100% !important; }
.media-single-content { width: 100% !important; display: block !important; }
.entry { display: block !important; width: 100% !important; }
.entry-bottom { display: block !important; width: 100% !important; clear: both !important; }

/* Center the cover image wrappers */
.entry .cover-cinema-frame,
.media-single-content .cover-cinema-frame {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    margin-bottom: 20px !important;
}
.entry .cover-cinema-frame a,
.media-single-content .cover-cinema-frame a {
    display: block !important;
    line-height: 0 !important;
}

/* Comment form */
#commentform { width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; }
#commentform textarea,
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    background: var(--surface) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    padding: 8px !important;
}
body:not(.light-mode) #commentform label { color: var(--text2) !important; }




/* ================================================================
   NAV LOGO — adaptive color for dark/light mode
   ================================================================ */
/* Dark mode defaults */
.dvdc-nav-logo .dvdc-logo-dvd    { fill: #f0ede8; }
.dvdc-nav-logo .dvdc-logo-cover  { fill: #9e9991; }
.dvdc-nav-logo .dvdc-logo-hole   { fill: #080808; }

/* Light mode: make logo readable on beige nav */
body.light-mode .dvdc-nav-logo .dvdc-logo-dvd   { fill: #111111; }
body.light-mode .dvdc-nav-logo .dvdc-logo-cover { fill: #444444; }
body.light-mode .dvdc-nav-logo .dvdc-logo-hole  { fill: #f5f2ed; }

/* ================================================================
   MISC UI
   ================================================================ */
h1.page-title { color:var(--text) !important; }
.wrap-fullwidth a { color:var(--link) !important; }
.wrap-fullwidth a:hover { color:var(--accent) !important; }
#back-top span { background:var(--surface2) !important; background-image:none !important; border:1px solid var(--border) !important; border-radius:50% !important; width:36px !important; height:36px !important; }
.archive-header h3:after, .widget h3.title:after, h3.top-title:after { background:none !important; display:none !important; }
div.tagcloud a { background:var(--surface2) !important; color:var(--text2) !important; border:1px solid var(--border) !important; border-radius:4px !important; font-size:11px !important; padding:3px 8px !important; transition:all var(--t) !important; }
div.tagcloud a:hover { background:var(--accent) !important; color:#fff !important; border-color:var(--accent) !important; }
#commentform #sendemail, form.wpcf7-form input.wpcf7-submit, div.fieldset--submit button { background:var(--accent) !important; color:#fff !important; border-radius:5px !important; font-weight:600 !important; }
#searchform2 .buttonicon { background-color:var(--surface2) !important; background-image:url(/wp-content/themes/pin-wp/images/btn_search.png) !important; background-repeat:no-repeat !important; background-position:center !important; background-size:14px !important; filter:invert(50%) !important; border-radius:5px !important; }
body.light-mode #searchform2 .buttonicon { filter:invert(20%) !important; }
.featured-articles .title-box span a, ul.masonry_list .an-widget-title span a, .entry-top span a, .copyright a { border-bottom:none !important; }
.home-share { display:none !important; }
.thumbs-rating-container .thumbs-rating-up { color:#6ecb0a !important; }
.thumbs-rating-container .thumbs-rating-down { color:#fe6969 !important; }

/* ================================================================
   FOOTER
   ================================================================ */
footer .wrap-footer, .social-section { background:var(--bg2) !important; border-top:1px solid var(--border) !important; }
footer, footer * { color:var(--text3) !important; }
footer a, footer a:hover { color:var(--text3) !important; }
.copyright, .copyright a { color:var(--text3) !important; font-size:12px !important; }



/* ================================================================
   CINEMATIC HEADER — film poster strip above nav
   ================================================================ */
.main-header {
    overflow: visible !important;
    position: relative !important;
}

/* The poster strip: a wide cinematic banner behind the sticky nav */
.cinematic-banner {
    width: 100% !important;
    height: 130px !important;
    background: #080808 !important;
    position: relative !important;
    overflow: hidden !important;
    display: block !important;
    margin-top: 56px !important;
}

/* Scrolling film-strip of poster thumbnails */
.cinematic-banner::before {
    content: '' !important;
    position: absolute !important;
    inset: 0 !important;
    /* Dark gradient vignette over the posters */
    background: linear-gradient(
        to right,
        rgba(8,8,8,1) 0%,
        rgba(8,8,8,.3) 15%,
        rgba(8,8,8,.1) 40%,
        rgba(8,8,8,.1) 60%,
        rgba(8,8,8,.3) 85%,
        rgba(8,8,8,1) 100%
    ) !important;
    z-index: 2 !important;
    pointer-events: none !important;
}
/* Bottom crimson line */
.cinematic-banner::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: var(--accent) !important;
    z-index: 3 !important;
}

/* The scrolling poster images strip */
.cinematic-poster-strip {
    display: flex !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    height: 100% !important;
    animation: posterScroll 60s linear infinite !important;
    z-index: 1 !important;
    gap: 2px !important;
}
.cinematic-poster-strip img {
    height: 120px !important;
    width: auto !important;
    object-fit: cover !important;
    opacity: .55 !important;
    display: block !important;
    flex-shrink: 0 !important;
    filter: saturate(.7) !important;
    border-radius: 0 !important;
}
@keyframes posterScroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

/* Logo area inside the cinematic banner */
.cinematic-logo-wrap {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 4 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 14px !important;
    pointer-events: none !important; /* let clicks pass to poster strip links */
}
.cinematic-logo-wrap > * { pointer-events: auto !important; }
.cinematic-logo-wrap .dvdc-logo-link {
    display: flex !important;
    align-items: center !important;
}

/* Film grain texture overlay */
.cinematic-banner .grain {
    position: absolute !important;
    inset: 0 !important;
    z-index: 2 !important;
    opacity: .06 !important;
    pointer-events: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E") !important;
    background-size: 200px 200px !important;
}

/* Hide the old sticky-on logo when cinematic banner exists */
.has-cinematic-banner .sticky-on .dvdc-logo-link { display:none !important; }



/* Remove any gap between header sections */
header { margin:0 !important; padding:0 !important; }
header > * { margin-bottom:0 !important; }
.main-header { margin:0 !important; padding:0 !important; min-height:0 !important; height:0 !important; }
.cinematic-banner { margin-bottom:0 !important; }
.bar-header, div.bar-header { margin-top:0 !important; }


body.light-mode .cinematic-banner { background:#1a1714 !important; }
body.light-mode .cinematic-poster-strip img { opacity:.7 !important; filter: saturate(.8) !important; }
body.light-mode .cinematic-banner::before { background: linear-gradient(to right, rgba(13,13,13,1) 0%, rgba(13,13,13,.3) 15%, rgba(13,13,13,.1) 40%, rgba(13,13,13,.1) 60%, rgba(13,13,13,.3) 85%, rgba(13,13,13,1) 100%) !important; }
/* ================================================================
   LOGO
   ================================================================ */
.dvdc-logo-link { flex-shrink:0 !important; text-decoration:none !important; }
.dvdc-logo-link:hover { opacity:.85 !important; }
.dvdc-logo-link img { max-height:36px !important; width:auto !important; }
/* Light mode: invert the dark parts of SVG logo */
body.light-mode .dvdc-logo-text-dvd { fill:#1a1714 !important; }
body.light-mode .dvdc-logo-text-cover { fill:#5a5550 !important; }


/* ================================================================
   DARK MODE — Nuclear text override
   Catches ALL plugin content with hardcoded colors
   ================================================================ */
body:not(.light-mode) {
    color: var(--text) !important;
}
body:not(.light-mode) *:not(svg):not(path):not(rect):not(circle):not(polyline):not(line):not(.sticky-on):not(.bar-header):not(.cinematic-banner):not(.cinematic-poster-strip):not(.cinematic-logo-wrap):not(script):not(style) {
    color: inherit !important;
}
/* But re-set specific color tokens properly */
body:not(.light-mode) h1, body:not(.light-mode) h2, body:not(.light-mode) h3,
body:not(.light-mode) h4, body:not(.light-mode) h5, body:not(.light-mode) h6 { color: var(--text) !important; }
body:not(.light-mode) p, body:not(.light-mode) li, body:not(.light-mode) td,
body:not(.light-mode) th, body:not(.light-mode) label, body:not(.light-mode) span,
body:not(.light-mode) div { color: var(--text) !important; }
body:not(.light-mode) a { color: var(--link) !important; }
body:not(.light-mode) a:hover { color: var(--accent) !important; }

/* Re-allow white text on colored buttons */
body:not(.light-mode) input[type=submit],
body:not(.light-mode) button,
body:not(.light-mode) .button,
body:not(.light-mode) .pmpro_btn,
body:not(.light-mode) .btn { color: #fff !important; }

/* Inputs */
body:not(.light-mode) input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
body:not(.light-mode) textarea,
body:not(.light-mode) select {
    background: var(--surface) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
}

/* PMPro: fix card backgrounds */
body:not(.light-mode) .pmpro_card,
body:not(.light-mode) .pmpro-member-profile,
body:not(.light-mode) .pmpro_box { background: var(--surface) !important; border-color: var(--border) !important; }

body:not(.light-mode) .pmpro_levels_table,
body:not(.light-mode) #pmpro_levels_table { background: var(--surface) !important; }
body:not(.light-mode) .pmpro_levels_table tr,
body:not(.light-mode) #pmpro_levels_table tr { background: transparent !important; border-bottom: 1px solid var(--border) !important; }

/* CRP Related Posts */
.crp_related { margin-top: 24px !important; }
.crp_related .crp-thumbs-grid { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; justify-content: flex-start !important; }
.crp_related ul, .crp_related ol { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.crp_related li { flex: 0 0 auto !important; }
.crp_related .crp_title { color: var(--text2) !important; font-size: 12px !important; line-height: 1.3 !important; }
.crp_related a { color: var(--text2) !important; }
.crp_related a:hover { color: var(--accent) !important; }
body:not(.light-mode) .crp_related * { color: var(--text2) !important; }



/* ================================================================
   SINGLE POST — Redesigned components
   ================================================================ */

/* Title row with inline author */
.single-title-row { padding: 18px 0 8px 0 !important; border-bottom: 1px solid var(--border) !important; margin-bottom: 4px !important; }
.single-title-row h1.article-title { font-size: 22px !important; font-weight: 700 !important; color: var(--text) !important; margin: 0 0 8px 0 !important; line-height: 1.3 !important; }
.single-author-inline { display: flex !important; align-items: center !important; gap: 8px !important; font-size: 12px !important; color: var(--text3) !important; }
.single-author-inline .single-author-avatar { width: 28px !important; height: 28px !important; border-radius: 50% !important; flex-shrink: 0 !important; }
.single-author-inline a { color: var(--accent) !important; text-decoration: none !important; }

/* Meta strip */
.meta-strip { display: flex !important; flex-wrap: wrap !important; gap: 16px !important; align-items: center !important; padding: 10px 0 !important; border-bottom: 1px solid var(--border) !important; margin-bottom: 18px !important; }
.meta-item { display: inline-flex !important; align-items: center !important; gap: 5px !important; font-size: 11px !important; color: var(--text3) !important; }
.meta-item svg { flex-shrink: 0 !important; opacity: .7 !important; }
.meta-item a { color: var(--text3) !important; text-decoration: none !important; }
.meta-item a:hover { color: var(--accent) !important; }
.meta-edit { margin-left: auto !important; }
.meta-edit a { color: var(--text3) !important; font-size: 11px !important; }

/* ── FILM STRIP WRAPPER ── */
/* ── Film strip: dark by default, warm-gray in light mode ── */
.filmstrip-wrap {
    width: 100% !important;
    background: #0c0c0c !important;
    border: 1px solid rgba(255,255,255,.07) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    margin: 0 0 22px 0 !important;
    box-shadow: 0 4px 28px rgba(0,0,0,.55) !important;
    transition: background .3s, border-color .3s !important;
}
body.light-mode .filmstrip-wrap {
    background: #e8e4df !important;
    border-color: rgba(0,0,0,.12) !important;
    box-shadow: 0 2px 16px rgba(0,0,0,.14) !important;
}

/* Sprocket holes row */
.filmstrip-perfs {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 14px !important;
    background: #060606 !important;
    overflow: hidden !important;
    min-height: 24px !important;
    transition: background .3s !important;
}
body.light-mode .filmstrip-perfs {
    background: #c8c4be !important;
}
.filmstrip-perfs span {
    display: inline-block !important;
    width: 18px !important;
    height: 12px !important;
    border-radius: 3px !important;
    background: #282828 !important;
    flex-shrink: 0 !important;
    border: 1px solid #1a1a1a !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.9) !important;
    min-width: 18px !important;
    transition: background .3s, border-color .3s !important;
}
body.light-mode .filmstrip-perfs span {
    background: #a8a49e !important;
    border-color: #908c87 !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.2) !important;
}

/* Image area inside film strip */
.filmstrip-img {
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    width: 100% !important;
    margin: 0 !important;
    background: #0c0c0c !important;
    padding: 18px 20px !important;
    box-sizing: border-box !important;
    transition: background .3s !important;
}
body.light-mode .filmstrip-img {
    background: #e8e4df !important;
}
.filmstrip-img img {
    display: block !important;
    max-width: 680px !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,.6), 0 12px 35px rgba(0,0,0,.45) !important;
    border-radius: 2px !important;
}

/* Info bar */
.filmstrip-infobar {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 10px 16px !important;
    background: #080808 !important;
    border-top: 1px solid rgba(255,255,255,.05) !important;
    transition: background .3s, border-color .3s !important;
}
body.light-mode .filmstrip-infobar {
    background: #d8d4ce !important;
    border-top-color: rgba(0,0,0,.1) !important;
}
.fsi-item {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    font-size: 11px !important;
    color: rgba(255,255,255,.5) !important;
    font-family: var(--font) !important;
    letter-spacing: .3px !important;
    white-space: nowrap !important;
}
body.light-mode .fsi-item { color: rgba(0,0,0,.55) !important; }
.fsi-item svg { opacity: .55 !important; flex-shrink: 0 !important; }
body.light-mode .fsi-item svg { opacity: .7 !important; }
.fsi-locked { color: rgba(220,60,60,.7) !important; }
.fsi-locked svg { opacity: .9 !important; }
body.light-mode .fsi-locked { color: rgba(180,30,30,.8) !important; }
/* Upgrade link inside locked badge */
.fsi-upgrade-link { color: var(--accent) !important; text-decoration: underline !important; text-underline-offset: 2px !important; }
.fsi-upgrade-link:hover { color: var(--accent-h) !important; }

/* Buttons in info bar */
.fsi-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-left: 0 !important;
    padding: 7px 16px !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all .18s !important;
    letter-spacing: .3px !important;
    background: rgba(255,255,255,.1) !important;
    color: rgba(255,255,255,.85) !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    white-space: nowrap !important;
}
body.light-mode .fsi-btn {
    background: rgba(0,0,0,.08) !important;
    color: rgba(0,0,0,.7) !important;
    border-color: rgba(0,0,0,.15) !important;
}
.fsi-btn:hover { background: var(--accent) !important; color: #fff !important; border-color: var(--accent-h) !important; }
body.light-mode .fsi-btn:hover { background: var(--accent) !important; color: #fff !important; border-color: var(--accent-h) !important; }
.fsi-btn-play {
    background: var(--surface2) !important;
    color: var(--text2) !important;
    border-color: var(--border) !important;
}
.fsi-btn-play:hover { background: var(--surface) !important; color: var(--text) !important; border-color: var(--text3) !important; }
body.light-mode .fsi-btn-play { background: rgba(0,0,0,.06) !important; color: rgba(0,0,0,.6) !important; }

/* VIP upgrade button — gold/amber, premium feel */
.fsi-btn-gallery {
    background: var(--accent) !important;
    color: #fff !important;
    border: 1px solid var(--accent-h) !important;
}
.fsi-btn-gallery:hover {
    background: var(--accent-h) !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(230,57,70,.35) !important;
}
.fsi-btn-print {
    background: rgba(255,255,255,.07) !important;
    color: rgba(255,255,255,.75) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
}
.fsi-btn-print:hover {
    background: rgba(255,255,255,.14) !important;
    color: #fff !important;
}
body.light-mode .fsi-btn-print {
    background: rgba(0,0,0,.05) !important;
    color: rgba(0,0,0,.6) !important;
    border-color: rgba(0,0,0,.14) !important;
}
body.light-mode .fsi-btn-print:hover {
    background: rgba(0,0,0,.1) !important;
    color: #111 !important;
}
.fsi-btn-vip {
    background: linear-gradient(135deg, #c9a227 0%, #e8bc2e 50%, #c9a227 100%) !important;
    color: #1a1200 !important;
    border-color: #b08c1a !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 12px rgba(201,162,39,.35) !important;
    text-shadow: none !important;
}
.fsi-btn-vip:hover {
    background: linear-gradient(135deg, #dbb02e 0%, #f5cc3a 50%, #dbb02e 100%) !important;
    color: #1a1200 !important;
    border-color: #c9a227 !important;
    box-shadow: 0 4px 18px rgba(201,162,39,.55) !important;
    transform: translateY(-1px) !important;
}
.fsi-btn-vip svg { opacity: 1 !important; }

/* VIP: gallery images inside the_content */
.vip-content { padding: 4px 0 !important; }
.vip-content p { color: var(--text2) !important; font-size: 13px !important; margin-bottom: 8px !important; line-height: 1.6 !important; }
.vip-content a { color: var(--link) !important; }

/* VIP gallery — horizontal filmstrip of clickable covers */
.vip-content .gallery {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    background: #070707 !important;
    border: 1px solid rgba(255,255,255,.06) !important;
    border-radius: 6px !important;
    margin: 16px 0 !important;
    padding: 0 !important;
    list-style: none !important;
    -webkit-overflow-scrolling: touch !important;
    /* Styled scrollbar — red accent */
    scrollbar-width: thin !important;
    scrollbar-color: #e63946 rgba(255,255,255,.06) !important;
}
.vip-content .gallery::-webkit-scrollbar {
    height: 6px !important;
}
.vip-content .gallery::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05) !important;
    border-radius: 3px !important;
}
.vip-content .gallery::-webkit-scrollbar-thumb {
    background: #e63946 !important;
    border-radius: 3px !important;
}
.vip-content .gallery::-webkit-scrollbar-thumb:hover {
    background: #c8303c !important;
}
body.light-mode .vip-content .gallery {
    background: #e8e4df !important;
    border-color: rgba(0,0,0,.1) !important;
    scrollbar-color: #e63946 rgba(0,0,0,.08) !important;
}
body.light-mode .vip-content .gallery::-webkit-scrollbar-track {
    background: rgba(0,0,0,.06) !important;
}

.vip-content .gallery-item,
.vip-content .gallery-item figure { margin: 0 !important; flex-shrink: 0 !important; }

.vip-content .gallery-item .gallery-icon { margin: 0 !important; line-height: 0 !important; }

.vip-content .gallery-item a {
    display: block !important;
    padding: 12px 8px !important;
    line-height: 0 !important;
    background: transparent !important;
    transition: background .15s !important;
}
.vip-content .gallery-item a:hover { background: rgba(255,255,255,.05) !important; }

.vip-content .gallery-item a img {
    display: block !important;
    height: 160px !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 3px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.7) !important;
    transition: transform .18s, box-shadow .18s !important;
}
.vip-content .gallery-item a:hover img {
    transform: translateY(-2px) scale(1.02) !important;
    box-shadow: 0 6px 20px rgba(0,0,0,.8) !important;
}
/* Gallery captions hidden — replaced by auto-injected metadata badges */
.vip-content .gallery-caption,
.vip-content .wp-caption-text,
.vip-content .gallery-item figcaption,
.vip-content figure figcaption,
.vip-content .wp-caption,
.vip-content dd.gallery-caption {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
}
/* Auto-injected resolution badge */
.dvdc-gallery-res {
    display: block !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    color: rgba(255,255,255,.5) !important;
    text-align: center !important;
    padding: 2px 8px 8px !important;
    letter-spacing: .3px !important;
    white-space: nowrap !important;
    font-family: var(--font) !important;
}
body.light-mode .dvdc-gallery-res { color: rgba(0,0,0,.45) !important; }
/* Scroll hint arrow — shows when gallery has more content */
.dvdc-gallery-hint {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 40px !important;
    background: linear-gradient(to right, transparent, rgba(7,7,7,.85)) !important;
    pointer-events: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 1 !important;
    transition: opacity .3s !important;
    border-radius: 0 6px 6px 0 !important;
    z-index: 2 !important;
}
.dvdc-gallery-hint.hidden { opacity: 0 !important; }
.dvdc-gallery-hint svg { opacity: .7 !important; }
body.light-mode .dvdc-gallery-hint {
    background: linear-gradient(to right, transparent, rgba(232,228,223,.9)) !important;
}
/* Wrapper for positioning the hint */
.dvdc-gallery-wrap-outer {
    position: relative !important;
}

/* Free gate notice */
.free-gate-notice {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-left: 3px solid var(--accent) !important;
    border-radius: 0 6px 6px 0 !important;
    padding: 12px 16px !important;
    margin-bottom: 16px !important;
    font-size: 13px !important;
    color: var(--text2) !important;
    line-height: 1.6 !important;
}
.free-gate-notice svg { flex-shrink: 0 !important; margin-top: 2px !important; color: var(--accent) !important; opacity: .8 !important; }
.free-gate-notice a { color: var(--accent) !important; text-decoration: underline !important; text-underline-offset: 3px !important; }

/* Print tip line */
.print-tip { font-size: 12px !important; color: var(--text3) !important; margin: 12px 0 4px 0 !important; }
.print-tip a { color: var(--link) !important; }

/* ── AUTHOR CARD ── */
.author-card {
    display: flex !important;
    gap: 16px !important;
    align-items: flex-start !important;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    padding: 18px !important;
    margin: 0 0 16px 0 !important;
}
/* When author card sits directly after filmstrip (VIP) */
.filmstrip-wrap + .author-card {
    margin-top: 0 !important;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
    border-top: none !important;
    border-color: var(--border) !important;
}
.author-card-avatar img {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    display: block !important;
    flex-shrink: 0 !important;
    border: 2px solid var(--border) !important;
}
.author-card-body { flex: 1 !important; min-width: 0 !important; }
.author-card-name { display: flex !important; align-items: center !important; gap: 8px !important; margin-bottom: 6px !important; }
.author-card-name a:first-child { font-size: 14px !important; font-weight: 600 !important; color: var(--text) !important; text-decoration: none !important; }
.author-card-name a:first-child:hover { color: var(--accent) !important; }
.author-card-web { color: var(--text3) !important; display: inline-flex !important; align-items: center !important; }
.author-card-web:hover { color: var(--accent) !important; }
.author-card-bio { font-size: 12px !important; color: var(--text2) !important; line-height: 1.6 !important; margin: 0 0 10px 0 !important; }
.author-card-socials { display: flex !important; gap: 8px !important; }
.acs-link { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 28px !important; height: 28px !important; border-radius: 6px !important; background: var(--surface2) !important; color: var(--text2) !important; border: 1px solid var(--border) !important; transition: all .15s !important; text-decoration: none !important; }
.acs-link:hover { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }

/* Comments title */
.comments-title { font-size: 14px !important; font-weight: 600 !important; color: var(--text2) !important; margin: 0 0 14px 0 !important; padding-bottom: 10px !important; border-bottom: 1px solid var(--border) !important; }
.comments-title span { color: var(--text3) !important; font-weight: 400 !important; }


/* Free user filmstrip: thumbnail-single-image, no blur */
.filmstrip-img-free {
    padding: 18px 20px !important;
}
.filmstrip-img-free img {
    max-width: 700px !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
}
.filmstrip-img-free a {
    display: block !important;
    line-height: 0 !important;
    cursor: pointer !important;
}
.filmstrip-img-free a:hover img {
    opacity: .92 !important;
    transition: opacity .2s !important;
}


/* ================================================================
   VIP GALLERY FILMSTRIP — wraps the_content() .gallery blocks
   ================================================================ */
.filmstrip-gallery-wrap {
    margin: 16px 0 22px 0 !important;
}
.filmstrip-gallery-wrap .filmstrip-gallery-top,
.filmstrip-gallery-wrap .filmstrip-gallery-bottom {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 14px !important;
    background: #060606 !important;
    overflow: hidden !important;
    min-height: 24px !important;
}
body.light-mode .filmstrip-gallery-wrap .filmstrip-gallery-top,
body.light-mode .filmstrip-gallery-wrap .filmstrip-gallery-bottom {
    background: #c8c4be !important;
}
.filmstrip-gallery-wrap .filmstrip-gallery-top span,
.filmstrip-gallery-wrap .filmstrip-gallery-bottom span {
    display: inline-block !important;
    width: 18px !important;
    height: 12px !important;
    border-radius: 3px !important;
    background: #282828 !important;
    flex-shrink: 0 !important;
    border: 1px solid #1a1a1a !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.9) !important;
    min-width: 18px !important;
}
body.light-mode .filmstrip-gallery-wrap .filmstrip-gallery-top span,
body.light-mode .filmstrip-gallery-wrap .filmstrip-gallery-bottom span {
    background: #a8a49e !important;
    border-color: #908c87 !important;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.2) !important;
}
.filmstrip-gallery-wrap .gallery {
    background: #0c0c0c !important;
    padding: 14px 12px !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
}
body.light-mode .filmstrip-gallery-wrap .gallery {
    background: #e8e4df !important;
}


/* No blur on free preview image */
.filmstrip-free img,
.filmstrip-free .filmstrip-img img,
.filmstrip-img-free img {
    filter: none !important;
    -webkit-filter: none !important;
    opacity: 1 !important;
}


/* Free filmstrip: only top perf row, bottom removed via PHP */
.filmstrip-free {
    /* identical to .filmstrip-wrap, just a modifier class */
}
/* Free infobar: left-align items differently */
.free-infobar {
    justify-content: center !important;
    gap: 16px !important;
    flex-wrap: wrap !important;
}


/* ================================================================
   SIDEBAR — nuclear force override for plugin conflicts
   ================================================================ */
aside.sidebar,
div.sidebar,
.sidebar,
.wrap-fullwidth > aside,
.wrap-fullwidth > .sidebar {
    float: right !important;
    width: 300px !important;
    min-width: 300px !important;
    max-width: 300px !important;
    box-sizing: border-box !important;
    padding: 16px 0 0 0 !important;
    overflow: hidden !important;
    position: relative !important;
}
/* Sidebar widget overflow control */
aside.sidebar > *, .sidebar > *, aside.sidebar .widget, .sidebar .widget {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
/* ASP widget inside sidebar */
aside.sidebar .asp_w_container,
.sidebar .asp_w_container { width: 100% !important; max-width: 272px !important; }

/* ================================================================
   BANNER UPLOAD BUTTON — inside cinematic-logo-wrap
   ================================================================ */
.banner-upload-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 8px 20px !important;
    background: var(--accent) !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: .4px !important;
    text-decoration: none !important;
    border: 1px solid var(--accent-h) !important;
    box-shadow: 0 2px 12px rgba(230,57,70,.4) !important;
    transition: background .18s, transform .18s, box-shadow .18s !important;
    white-space: nowrap !important;
}
.banner-upload-btn:hover {
    background: var(--accent-h) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 18px rgba(230,57,70,.55) !important;
    color: #fff !important;
}
.banner-upload-btn svg { flex-shrink: 0 !important; }

/* ================================================================
   GALLERY SECTION LABEL — above the_content() gallery
   ================================================================ */
.gallery-section-label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 4px 0 10px 0 !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid var(--border) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--text3) !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
}
.gallery-section-label svg { opacity: .6 !important; flex-shrink: 0 !important; }

/* ================================================================
   SIDEBAR — ensure 300px widget area fits a 300px ad unit
   ================================================================ */
/* Override: remove max-width constraint so widgets use full container */
aside.sidebar > *,
.sidebar > *,
aside.sidebar .widget,
.sidebar .widget {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
/* AdSense and ad units inside sidebar: allow full 300px */
aside.sidebar .widget ins.adsbygoogle,
.sidebar .widget ins.adsbygoogle,
aside.sidebar ins.adsbygoogle,
.sidebar ins.adsbygoogle {
    max-width: 100% !important;
    width: 100% !important;
    display: block !important;
}


/* ================================================================
   COMMENTS SECTION BOX
   ================================================================ */
.entry-bottom {
    clear: both !important;
    margin-top: 20px !important;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    overflow: hidden !important;
}

/* Header bar — matches gallery-section-label style */
.comments-title {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 12px 18px !important;
    background: var(--surface2) !important;
    border-bottom: 1px solid var(--border) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--text3) !important;
    text-transform: uppercase !important;
    letter-spacing: 1.2px !important;
}
.comments-title span {
    font-weight: 400 !important;
    color: var(--text3) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    font-size: 12px !important;
    opacity: .7 !important;
}

/* Inner comments area padding */
#comments {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 18px !important;
}
#comments form,
#comments input,
#comments textarea { max-width: 100% !important; box-sizing: border-box !important; }

/* Comment list */
.comment-list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
}
.comment-list li {
    padding: 14px 0 !important;
    border-bottom: 1px solid var(--border) !important;
}
.comment-list li:last-child { border-bottom: none !important; }

/* Comment author + meta */
.comment-author { font-weight: 600 !important; font-size: 13px !important; color: var(--text) !important; }
.comment-author .fn { color: var(--accent) !important; }
.comment-meta, .comment-metadata { font-size: 11px !important; color: var(--text3) !important; margin-top: 2px !important; }
.comment-meta a, .comment-metadata a { color: var(--text3) !important; }

/* Comment body text */
.comment-content, .comment-body p { font-size: 13px !important; color: var(--text2) !important; line-height: 1.65 !important; margin: 8px 0 0 0 !important; }

/* Reply link */
.reply { margin-top: 6px !important; }
.reply a, .comment-reply-link {
    font-size: 11px !important;
    color: var(--text3) !important;
    text-decoration: none !important;
    padding: 3px 8px !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
    transition: all .15s !important;
}
.reply a:hover, .comment-reply-link:hover {
    color: var(--accent) !important;
    border-color: var(--accent) !important;
    background: rgba(230,57,70,.06) !important;
}

/* "Leave a Reply" form section */
#respond {
    margin-top: 20px !important;
    padding-top: 20px !important;
    border-top: 1px solid var(--border) !important;
}
#reply-title {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text2) !important;
    margin: 0 0 14px 0 !important;
}
/* Comment textarea + inputs */
#comments textarea,
#comments input[type="text"],
#comments input[type="email"],
#comments input[type="url"] {
    width: 100% !important;
    background: var(--bg2) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text) !important;
    padding: 10px 12px !important;
    font-size: 13px !important;
    font-family: var(--font) !important;
    transition: border-color .18s !important;
    box-sizing: border-box !important;
    resize: vertical !important;
}
#comments textarea:focus,
#comments input[type="text"]:focus,
#comments input[type="email"]:focus,
#comments input[type="url"]:focus {
    border-color: var(--accent) !important;
    outline: none !important;
}
/* Submit button */
#comments input[type="submit"],
#comments .submit {
    background: var(--accent) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px !important;
    padding: 9px 22px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: background .18s, transform .15s !important;
    font-family: var(--font) !important;
}
#comments input[type="submit"]:hover,
#comments .submit:hover {
    background: var(--accent-h) !important;
    transform: translateY(-1px) !important;
}
/* "logged in as" / form notes */
.logged-in-as, .comment-notes {
    font-size: 12px !important;
    color: var(--text3) !important;
    margin-bottom: 12px !important;
}
.logged-in-as a, .comment-notes a { color: var(--link) !important; }

/* Comment count heading (e.g. "3 Comments") */
#comments > h2:first-child,
.comments-area > h2 {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--text2) !important;
    margin: 0 0 16px 0 !important;
    padding-bottom: 10px !important;
    border-bottom: 1px solid var(--border) !important;
}

/* Light mode tweaks */
body.light-mode .entry-bottom { background: #fafaf8 !important; }
body.light-mode .comments-title { background: #f0ede8 !important; }
body.light-mode #comments textarea,
body.light-mode #comments input[type="text"],
body.light-mode #comments input[type="email"],
body.light-mode #comments input[type="url"] { background: #fff !important; }


/* ================================================================
   FOOTER — nav menu + widget area
   ================================================================ */
footer {
    margin-top: 40px !important;
    border-top: 1px solid var(--border) !important;
    background: var(--bg2) !important;
}

/* Footer widget area */
.footer-widgets {
    padding: 30px 0 10px 0 !important;
    border-bottom: 1px solid var(--border) !important;
}
.footer-widgets .wrap-center {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 20px !important;
}
.footer-widgets .widget {
    flex: 1 1 200px !important;
    min-width: 0 !important;
}

/* Footer nav */
.footer-nav {
    display: flex !important;
    justify-content: center !important;
    padding: 14px 0 8px 0 !important;
}
.footer-nav ul {
    display: flex !important;
    flex-wrap: wrap !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 0 !important;
}
.footer-nav ul li {
    display: inline-flex !important;
    align-items: center !important;
    list-style: none !important;
}
.footer-nav ul li::before,
.footer-nav ul li::marker,
.footer-nav ul li::after { display: none !important; content: '' !important; }
/* Dot separator: placed as a non-li span-like inline element via border */
.footer-nav ul li + li {
    border-left: 1px solid var(--border) !important;
    margin-left: 2px !important;
    padding-left: 2px !important;
}
.footer-nav ul li a {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    color: var(--text3) !important;
    text-decoration: none !important;
    padding: 4px 10px !important;
    border-radius: 4px !important;
    transition: color var(--t), background var(--t) !important;
    letter-spacing: .3px !important;
    white-space: nowrap !important;
}
.footer-nav ul li a:hover {
    color: var(--text) !important;
    background: var(--surface) !important;
}

/* Copyright line */
.wrap-footer {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 0 0 16px 0 !important;
}
.copyright {
    font-size: 11px !important;
    color: var(--text3) !important;
    text-align: center !important;
    padding: 6px 0 !important;
    opacity: .6 !important;
}


/* Cookie settings link in footer */
.copyright .dvdc-cookie-settings {
    color: var(--text3) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
    font-size: 11px !important;
    transition: color .15s !important;
}
.copyright .dvdc-cookie-settings:hover { color: var(--accent) !important; }


/* ================================================================
   ULTIMATE MEMBER — Profile Posts Grid
   ================================================================ */

/* ── Force UM profile posts area to use full width ────────────── */
/* UM wraps tab content in .um-col-123 type divs — override all */
.um[class*="um-"] .um-profile-body,
.um .um-profile-body {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}
/* Remove any left offset UM adds for the profile photo column */
.um .um-profile-body > div,
.um .um-profile-note,
.um .um-profile-subnav-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
    float: none !important;
}
/* The actual tab content wrapper */
.um .um-profile-subnav-content,
.um-profile-subnav-content {
    padding: 16px 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}


/* Hide UM default post list items — only show our custom grid */
.um-profile-body .um-profile-note > .um-item,
.um-profile-body .um-profile-note > a.um-item,
.um-profile-body .um-profile-note > .um-item-meta,
.um-profile-body .um-profile-note > br,
.um-profile-body .um-profile-note > .um-load-more:not(.dvdc-um-load-more),
.um-profile-body .um-profile-note > .um-ajax-paginate:not(.dvdc-um-load-more) {
    display: none !important;
}
/* But keep our grid visible */
.um-profile-body .um-profile-note > .dvdc-um-posts-wrap,
.dvdc-um-posts-wrap { display: block !important; }


/* Wrapper */
.dvdc-um-posts-wrap {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 8px 0 !important;
}

/* Force UM's inner containers to full width */
.um-profile-body .um-profile-note,
.um .um-profile-note {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 0 !important;
}
.um-profile-body .um-profile-subnav-wrapper,
.um-profile-body .um-profile-subnav-content {
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 16px !important;
}

/* Grid — 4 columns desktop, 3 tablet, 2 phone */
ul.dvdc-um-post-grid {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 0 20px 0 !important;
}

/* Individual post card */
.dvdc-um-post-card {
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    transition: transform .18s, box-shadow .18s !important;
}
.dvdc-um-post-card:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 24px rgba(0,0,0,.35) !important;
}

/* Thumbnail area */
.dvdc-um-post-thumb {
    display: block !important;
    position: relative !important;
    overflow: hidden !important;
    aspect-ratio: 16/10 !important;
    background: var(--surface2) !important;
    text-decoration: none !important;
    line-height: 0 !important;
}
.dvdc-um-post-thumb img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    transition: transform .3s !important;
}
.dvdc-um-post-card:hover .dvdc-um-post-thumb img {
    transform: scale(1.04) !important;
}

/* No-thumbnail placeholder */
.dvdc-um-post-nothumb {
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--text3) !important;
}

/* Category badge */
.dvdc-um-post-cat {
    position: absolute !important;
    bottom: 8px !important;
    left: 8px !important;
    background: var(--accent) !important;
    color: #fff !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .8px !important;
    padding: 3px 7px !important;
    border-radius: 3px !important;
}

/* Post info area */
.dvdc-um-post-info {
    padding: 12px !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}
.dvdc-um-post-title {
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}
.dvdc-um-post-title a {
    color: var(--text) !important;
    text-decoration: none !important;
}
.dvdc-um-post-title a:hover { color: var(--accent) !important; }

/* Meta row */
.dvdc-um-post-meta {
    display: flex !important;
    gap: 10px !important;
    flex-wrap: wrap !important;
}
.dvdc-um-post-meta span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 10px !important;
    color: var(--text3) !important;
}
.dvdc-um-post-meta svg { opacity: .6 !important; flex-shrink: 0 !important; }

/* UM pagination override — match site style */
.dvdc-um-load-more-wrap {
    text-align: center !important;
    padding: 8px 0 16px 0 !important;
}
.dvdc-um-load-more {
    display: inline-flex !important;
    align-items: center !important;
    padding: 8px 18px !important;
    background: var(--surface2) !important;
    border: 1px solid var(--border) !important;
    border-radius: 6px !important;
    color: var(--text2) !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    margin: 16px auto 0 !important;
    transition: all .18s !important;
    cursor: pointer !important;
}
.um-profile-body .um-profile-nav-posts a:hover,
.um .um-load-more:hover {
    background: var(--accent) !important;
    color: #fff !important;
    border-color: var(--accent-h) !important;
}

/* Light mode */
body.light-mode .dvdc-um-post-card { background: #fff !important; }

/* Empty state */
.dvdc-um-no-posts {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 40px 20px !important;
    color: var(--text3) !important;
    font-size: 13px !important;
}
.dvdc-um-no-posts svg { opacity: .4 !important; }
.dvdc-um-no-posts p { margin: 0 !important; }

@media (max-width: 900px) {
    ul.dvdc-um-post-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 640px) {
    ul.dvdc-um-post-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
}
@media (max-width: 380px) {
    ul.dvdc-um-post-grid { grid-template-columns: 1fr !important; }
}


/* UM Posts pagination */
.dvdc-um-pagination {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    padding: 20px 0 8px 0 !important;
    flex-wrap: wrap !important;
}
.dvdc-um-pagination a,
.dvdc-um-pagination span {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 10px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    font-family: var(--font) !important;
    text-decoration: none !important;
    transition: all .15s !important;
    border: 1px solid var(--border) !important;
    background: var(--surface) !important;
    color: var(--text2) !important;
    cursor: pointer !important;
}
.dvdc-um-pagination a:hover {
    background: var(--surface2) !important;
    color: var(--text) !important;
    border-color: var(--text3) !important;
}
.dvdc-um-pagination .dvdc-um-page-current {
    background: var(--accent) !important;
    color: #fff !important;
    border-color: var(--accent-h) !important;
    cursor: default !important;
    font-weight: 700 !important;
}
.dvdc-um-pagination .dvdc-um-page-dots {
    border: none !important;
    background: transparent !important;
    color: var(--text3) !important;
    cursor: default !important;
}


/* ================================================================
   MASONRY GRID AD CARDS
   ================================================================ */
/* Ad cards in masonry — 250×250 square to match card style */
ul.masonry_list li.dvdc-ad-card {
    width: 250px !important;
    height: 250px !important;
    background: var(--surface) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--r) !important;
    overflow: visible !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
}
ul.masonry_list li.dvdc-ad-card ins.adsbygoogle {
    display: block !important;
    width: 250px !important;
    height: 250px !important;
}

/* Single post ad slots */
.single-ad {
    width: 100% !important;
    text-align: center !important;
    margin: 16px 0 !important;
    overflow: hidden !important;
}


/* ================================================================
   SINGLE POST — Action buttons (Print Cover / Open Gallery)
   ================================================================ */
.dvdc-action-btns {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 14px 0 4px 0 !important;
    flex-wrap: wrap !important;
}
.dvdc-action-btns-free {
    padding: 14px 0 6px 0 !important;
}
.dvdc-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 9px 18px !important;
    border-radius: 7px !important;
    font-family: var(--font) !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    transition: all .18s !important;
    border: none !important;
    white-space: nowrap !important;
}
/* Print button — outlined style */
.dvdc-btn-print {
    background: transparent !important;
    color: var(--text2) !important;
    border: 1px solid var(--border) !important;
}
.dvdc-btn-print:hover {
    background: var(--surface2) !important;
    color: var(--text) !important;
    border-color: var(--text3) !important;
}
/* Gallery button — accent fill */
.dvdc-btn-gallery {
    background: var(--accent) !important;
    color: #fff !important;
    border: 1px solid var(--accent-h) !important;
}
.dvdc-btn-gallery:hover {
    background: var(--accent-h) !important;
    color: #fff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 14px rgba(230,57,70,.35) !important;
}
.dvdc-btn svg { flex-shrink: 0 !important; }

/* Light mode */
body.light-mode .dvdc-btn-print {
    border-color: rgba(0,0,0,.2) !important;
    color: rgba(0,0,0,.6) !important;
}
body.light-mode .dvdc-btn-print:hover {
    background: rgba(0,0,0,.05) !important;
    color: rgba(0,0,0,.85) !important;
}


/* ================================================================
   RELATED POSTS (CRP) — style CRP's native output
   CRP outputs: .crp_related ul > li > a.crp_link > figure > img
   ================================================================ */
.crp_related {
    margin-top: 24px !important;
}
.crp_related h2,
.crp_related h3 {
    font-size: 13px !important;
    font-weight: 700 !important;
    color: var(--text3) !important;
    text-transform: uppercase !important;
    letter-spacing: .8px !important;
    margin: 0 0 12px 0 !important;
}
/* CRP outputs plain <ul> with no class */
.crp_related ul {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.crp_related ul li {
    flex: 0 0 auto !important;
    width: 150px !important;
    margin: 0 !important;
    position: relative !important;
}
/* The link wrapper */
a.crp_link {
    display: block !important;
    text-decoration: none !important;
    color: var(--text2) !important;
}
a.crp_link:hover { color: var(--text) !important; }

/* Figure — rounded corners + shadow */
a.crp_link {
    position: relative !important;
    display: block !important;
}
a.crp_link figure {
    display: block !important;
    width: 150px !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.5) !important;
    transition: box-shadow .2s, transform .2s !important;
    background: var(--surface) !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    line-height: 0 !important;
}
a.crp_link:hover figure {
    box-shadow: 0 8px 28px rgba(0,0,0,.7) !important;
    transform: translateY(-2px) !important;
}

/* Image inside figure */
a.crp_link figure img.crp_thumb {
    width: 150px !important;
    height: auto !important;
    object-fit: unset !important;
    display: block !important;
    border-radius: 0 !important;
    transition: transform .2s !important;
    margin: 0 !important;
    contain-intrinsic-size: 150px 101px !important; /* override WP's 3000px 1500px default */
}
a.crp_link:hover figure img.crp_thumb {
    transform: scale(1.04) !important;
}

/* CRP title — the <span class="crp_title"> CRP outputs after the figure */
.crp_related a.crp_link span.crp_title {
    display: block !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    margin-top: 5px !important;
    color: var(--text2) !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    text-align: left !important;
    word-break: break-word !important;
}
body.light-mode .crp_related a.crp_link span.crp_title {
    color: rgba(0,0,0,.6) !important;
}

/* Light mode */
body.light-mode a.crp_link figure {
    box-shadow: 0 4px 14px rgba(0,0,0,.18) !important;
}
body.light-mode a.crp_link:hover figure {
    box-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
}

/* Mobile */
@media (max-width: 480px) {
    .crp_related ul.crp_list li { width: 130px !important; }
    .crp_related ul li { width: 120px !important; }
    a.crp_link figure, a.crp_link figure img.crp_thumb { width: 120px !important; }
}

/* ================================================================
   WORDPRESS POPULAR POSTS — popular covers page grid
   ================================================================ */
.wpp-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 14px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.wpp-list li {
    flex: 0 0 auto !important;
    width: 150px !important;
    margin: 0 !important;
}
.wpp-list li a {
    text-decoration: none !important;
    color: var(--text2) !important;
}
.wpp-list li a:not(.wpp-post-title) {
    display: block !important;
    line-height: 0 !important;
}
.wpp-list li a:hover { color: var(--text) !important; }

/* Thumbnail wrapper */
.wpp-list li .wpp-thumbnail,
.wpp-list li img {
    display: block !important;
    width: 150px !important;
    height: auto !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 16px rgba(0,0,0,.5) !important;
    transition: box-shadow .2s, transform .2s !important;
}
.wpp-list li a:hover img,
.wpp-list li a:hover .wpp-thumbnail {
    box-shadow: 0 8px 28px rgba(0,0,0,.7) !important;
    transform: translateY(-2px) !important;
}

/* Title below image */
.wpp-list li .wpp-post-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    margin-top: 5px !important;
    color: var(--text2) !important;
    overflow: hidden !important;
    text-decoration: none !important;
    word-break: break-word !important;
}
/* Override sidebar rules that might hide the title on the stats page */
.single-content .wpp-list li .wpp-post-title,
.media-single-content .wpp-list li .wpp-post-title {
    display: -webkit-box !important;
    color: var(--text2) !important;
}
/* Hide views count on the popular page if you want clean grid */
.wpp-list li .post-stats { display: none !important; }

body.light-mode .wpp-list li .wpp-post-title { color: rgba(0,0,0,.6) !important; }
body.light-mode .wpp-list li img,
body.light-mode .wpp-list li .wpp-thumbnail {
    box-shadow: 0 4px 14px rgba(0,0,0,.18) !important;
}
body.light-mode .wpp-list li a:hover img {
    box-shadow: 0 8px 24px rgba(0,0,0,.28) !important;
}

@media (max-width: 480px) {
    .wpp-list li { width: 120px !important; }
    .wpp-list li img,
    .wpp-list li .wpp-thumbnail { width: 120px !important; }
}


/* ================================================================
   RESPONSIVE — 1260px
   ================================================================ */
@media screen and (max-width: 1260px) {
    .wrap-fullwidth .single-content, .single-content { width:calc(100% - 300px) !important; float:left !important; }
    .wrap-fullwidth aside.sidebar, .wrap-fullwidth div.sidebar, .wrap-fullwidth .sidebar,
    aside.sidebar, div.sidebar, .sidebar { width:300px !important; min-width:300px !important; max-width:300px !important; float:left !important; }
}


/* ================================================================
   DARK MODE — Nuclear text override
   Catches ALL plugin content with hardcoded colors
   ================================================================ */
body:not(.light-mode) {
    color: var(--text) !important;
}
body:not(.light-mode) *:not(svg):not(path):not(rect):not(circle):not(polyline):not(line):not(.sticky-on):not(.bar-header):not(.cinematic-banner):not(.cinematic-poster-strip):not(.cinematic-logo-wrap):not(script):not(style) {
    color: inherit !important;
}
/* But re-set specific color tokens properly */
body:not(.light-mode) h1, body:not(.light-mode) h2, body:not(.light-mode) h3,
body:not(.light-mode) h4, body:not(.light-mode) h5, body:not(.light-mode) h6 { color: var(--text) !important; }
body:not(.light-mode) p, body:not(.light-mode) li, body:not(.light-mode) td,
body:not(.light-mode) th, body:not(.light-mode) label, body:not(.light-mode) span,
body:not(.light-mode) div { color: var(--text) !important; }
body:not(.light-mode) a { color: var(--link) !important; }
body:not(.light-mode) a:hover { color: var(--accent) !important; }

/* Re-allow white text on colored buttons */
body:not(.light-mode) input[type=submit],
body:not(.light-mode) button,
body:not(.light-mode) .button,
body:not(.light-mode) .pmpro_btn,
body:not(.light-mode) .btn { color: #fff !important; }

/* Inputs */
body:not(.light-mode) input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
body:not(.light-mode) textarea,
body:not(.light-mode) select {
    background: var(--surface) !important;
    color: var(--text) !important;
    border: 1px solid var(--border) !important;
    border-radius: 4px !important;
}

/* PMPro: fix card backgrounds */
body:not(.light-mode) .pmpro_card,
body:not(.light-mode) .pmpro-member-profile,
body:not(.light-mode) .pmpro_box { background: var(--surface) !important; border-color: var(--border) !important; }

body:not(.light-mode) .pmpro_levels_table,
body:not(.light-mode) #pmpro_levels_table { background: var(--surface) !important; }
body:not(.light-mode) .pmpro_levels_table tr,
body:not(.light-mode) #pmpro_levels_table tr { background: transparent !important; border-bottom: 1px solid var(--border) !important; }

/* CRP Related Posts */
.crp_related { margin-top: 24px !important; }
.crp_related .crp-thumbs-grid { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; justify-content: flex-start !important; }
.crp_related ul, .crp_related ol { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; list-style: none !important; padding: 0 !important; margin: 0 !important; }
.crp_related li { flex: 0 0 auto !important; }
.crp_related .crp_title { color: var(--text2) !important; font-size: 12px !important; line-height: 1.3 !important; }
.crp_related a { color: var(--text2) !important; }
.crp_related a:hover { color: var(--accent) !important; }
body:not(.light-mode) .crp_related * { color: var(--text2) !important; }



/* ================================================================
   RESPONSIVE — 640px mobile
   ================================================================ */
@media screen and (max-width: 640px) {
    header .sticky-on, div.sticky-on, .sticky-on {
        display:flex !important; position:fixed !important; top:0 !important; left:0 !important;
        width:100% !important; height:50px !important; z-index:99999 !important;
        padding:0 12px !important; gap:4px !important;
        background:rgba(8,8,8,.96) !important; box-sizing:border-box !important;
    }
    .logo img { max-height:30px !important; }
    nav#myjquerymenu.jquerycssmenu { display:none !important; }
    #dvdc-theme-toggle { padding:4px 8px !important; }
    #dvdc-theme-toggle .toggle-label { display:none !important; }
    .wrap-center.dvdc-header-ad, .dvdc-header-ad, header .wrap-center.dvdc-header-ad { display:none !important; }
    /* body padding-top: mobile handled by natural flow */
    ul.masonry_list, ul#infinite-articles { position:static !important; height:auto !important; }
    ul.masonry_list li, ul.masonry_list li.ms-item, ul#infinite-articles li.ms-item { position:static !important; width:100% !important; left:auto !important; top:auto !important; margin:0 0 10px 0 !important; display:block !important; box-sizing:border-box !important; }
    .wp-pagenavi, .defaultpag, #nav-below { position:static !important; margin-top:10px !important; display:block !important; visibility:visible !important; opacity:1 !important; }
    .wp-pagenavi a, .wp-pagenavi span { min-width:34px !important; height:34px !important; line-height:32px !important; font-size:13px !important; margin:2px !important; display:inline-flex !important; }
    .wrap-fullwidth .single-content, .single-content { width:100% !important; float:none !important; padding:10px 12px !important; }
    .wrap-fullwidth aside.sidebar, aside.sidebar, div.sidebar, .sidebar { width:100% !important; float:none !important; min-width:0 !important; max-width:100% !important; }
    .sidebar-left { display:none !important; }
    .wrap-content, div.wrap-content { margin-left:0 !important; }
    .entry-img-300 { float:none !important; margin:0 0 10px 0 !important; max-width:100% !important; }
}
@media screen and (max-width: 480px) {
    /* body padding-top: mobile handled by natural flow */
    .logo img { max-height:26px !important; }
}
