/* JefferyTV 2026 visual refresh for the Graphene theme */
:root {
    --jtv-bg: #121417;
    --jtv-bg-deep: #0D0F12;
    --jtv-panel: #1B1F24;
    --jtv-panel-2: #20242A;
    --jtv-border: #333A44;
    --jtv-text: #F2F2F2;
    --jtv-muted: #B0B7C3;
    --jtv-blue: #4D8DF7;
    --jtv-gold: #D4A72C;
    --jtv-gold-soft: #E1BC55;
}

html,
body {
    background: var(--jtv-bg) !important;
    color: var(--jtv-text) !important;
}

body,
button,
input,
select,
textarea {
    font-family: Lato, Arial, Helvetica, sans-serif;
}

#container,
.container,
#page,
.site,
#wrapper,
#content,
#content-main,
#content-main-inner,
#sidebar,
.sidebar,
#sidebar1,
#sidebar2,
.bg-gradient {
    background-color: transparent !important;
}

#container,
#page,
#wrapper {
    background: linear-gradient(180deg, var(--jtv-bg-deep) 0%, var(--jtv-bg) 100%) !important;
}

p,
li,
dd,
dt,
.entry-content,
.entry-summary,
.comment-content {
    color: var(--jtv-text);
}

small,
.wp-caption-text,
.entry-meta,
.post-meta,
.post-date,
.post-author,
.comment-meta,
.archive-title,
.breadcrumb,
.breadcrumb a,
.post-info,
.post-info a,
.widget .textwidget,
.sidebar p,
.sidebar li {
    color: var(--jtv-muted) !important;
}

a,
.entry-content a,
.sidebar a,
.widget a,
.post-info a,
.comment-content a {
    color: var(--jtv-blue) !important;
    transition: color 160ms ease, border-color 160ms ease, background-color 160ms ease, opacity 160ms ease;
}

a:hover,
a:focus,
.entry-content a:hover,
.sidebar a:hover,
.widget a:hover {
    color: var(--jtv-gold) !important;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.entry-title a,
.post-title,
.post-title a,
.widget-title,
.sidebar h3,
.sidebar h4,
#comments h3,
#respond h3 {
    color: var(--jtv-gold) !important;
    text-shadow: none !important;
}

.entry-title a:hover,
.post-title a:hover {
    color: var(--jtv-gold-soft) !important;
}

/* Header and brand area */
#header,
.header-wrap,
#top-bar,
.top-bar,
#profile-link,
#header-menu-wrap {
    background-color: var(--jtv-bg-deep) !important;
    border-color: var(--jtv-border) !important;
}

#header {
    box-shadow: 0 8px 28px rgba(0, 0, 0, .35);
}

#site-title,
#site-title a,
.site-title,
.site-title a,
#site-description,
.site-description {
    text-shadow: none !important;
}

#site-title,
#site-title a,
.site-title,
.site-title a {
    color: #FFFFFF !important;
    letter-spacing: -.03em;
}

#site-description,
.site-description {
    color: var(--jtv-gold) !important;
    letter-spacing: .22em;
    text-transform: uppercase;
}

/* Navigation */
#nav,
#nav ul,
#header-menu,
#header-menu-wrap,
#secondary-menu,
.main-navigation,
.navbar,
.nav-menu,
ul.menu {
    background: var(--jtv-panel-2) !important;
    border-color: var(--jtv-border) !important;
    box-shadow: none !important;
}

#nav li,
#header-menu li,
#secondary-menu li,
.main-navigation li,
.nav-menu li,
ul.menu li {
    background: transparent !important;
    border-color: rgba(255,255,255,.07) !important;
}

#nav a,
#header-menu a,
#secondary-menu a,
.main-navigation a,
.nav-menu a,
ul.menu a {
    color: #FFFFFF !important;
    text-shadow: none !important;
    font-weight: 700;
}

#nav a:hover,
#nav .current-menu-item > a,
#nav .current_page_item > a,
#header-menu a:hover,
#header-menu .current-menu-item > a,
#header-menu .current_page_item > a,
.main-navigation a:hover,
.main-navigation .current-menu-item > a,
.nav-menu a:hover,
.nav-menu .current-menu-item > a,
ul.menu a:hover,
ul.menu .current-menu-item > a {
    color: var(--jtv-gold) !important;
    background: rgba(212, 167, 44, .08) !important;
    box-shadow: inset 0 -3px 0 var(--jtv-gold) !important;
}

#nav ul ul,
#header-menu ul ul,
.main-navigation ul ul,
.nav-menu ul ul,
ul.menu ul {
    background: var(--jtv-panel-2) !important;
    border: 1px solid var(--jtv-border) !important;
}

/* Search */
input[type="search"],
input[type="text"],
.search-field,
#searchform input[type="text"],
#searchform input[type="search"] {
    background: var(--jtv-panel) !important;
    color: var(--jtv-text) !important;
    border: 1px solid var(--jtv-border) !important;
    box-shadow: none !important;
}

input::placeholder,
textarea::placeholder {
    color: var(--jtv-muted) !important;
    opacity: .85;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.search-submit,
.more-link,
.button,
.btn {
    background: var(--jtv-blue) !important;
    border: 0 !important;
    color: #FFFFFF !important;
    border-radius: 6px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    font-weight: 700;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.search-submit:hover,
.more-link:hover,
.button:hover,
.btn:hover {
    background: var(--jtv-gold) !important;
    color: var(--jtv-bg-deep) !important;
}

/* Content cards */
.post,
.type-post,
.type-page,
.hentry,
article,
.entry,
.post-list,
#comments,
.comment-wrap,
#respond,
.author-info,
.child-page,
#slider,
.featured_slider,
.slider_post,
.block-button,
.widget,
.sidebar .widget,
#sidebar .widget,
#sidebar1 .widget,
#sidebar2 .widget {
    background: var(--jtv-panel) !important;
    border: 1px solid var(--jtv-border) !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.28) !important;
}

.post,
.type-post,
.type-page,
.hentry,
article,
.entry,
.widget,
.sidebar .widget {
    overflow: hidden;
}

.post,
.type-post,
.type-page,
.hentry,
article,
.entry {
    margin-bottom: 24px !important;
}

.entry-content,
.entry-summary,
.post-content,
.post-excerpt {
    background: transparent !important;
}

/* Featured slider */
#slider,
.featured_slider,
.slider_post {
    background-color: var(--jtv-panel) !important;
}

#slider .slider-entry-wrap,
#slider .slider-entry,
.slider-entry-wrap,
.slider-entry {
    background: linear-gradient(180deg, transparent, rgba(0,0,0,.72)) !important;
}

#slider h2,
#slider h2 a,
.slider_post h2,
.slider_post h2 a {
    color: #FFFFFF !important;
    text-shadow: 0 2px 10px rgba(0,0,0,.75) !important;
}

.slider_nav a,
.slider_nav span,
#slider_nav a,
#slider_nav span {
    background: var(--jtv-muted) !important;
    border-color: transparent !important;
}

.slider_nav a.activeSlide,
.slider_nav span.active,
#slider_nav a.activeSlide,
#slider_nav span.active {
    background: var(--jtv-gold) !important;
}

/* Sidebar */
.sidebar,
#sidebar,
#sidebar1,
#sidebar2 {
    color: var(--jtv-text) !important;
}

.widget-title,
.sidebar h3,
.sidebar h4,
#sidebar h3,
#sidebar h4 {
    border-bottom: 1px solid var(--jtv-border) !important;
    padding-bottom: 10px !important;
    margin-bottom: 14px !important;
    text-transform: uppercase;
    letter-spacing: .02em;
}

.widget ul,
.sidebar ul {
    list-style: none;
}

.widget li,
.sidebar li {
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    padding: 5px 0 !important;
}

.widget li:last-child,
.sidebar li:last-child {
    border-bottom: none !important;
}

/* Dates / metadata */
.date,
.post-date,
.entry-date,
.published,
.updated,
.date-box,
.calendar-date,
.post-calendar-date {
    color: var(--jtv-gold) !important;
}

.post-date-inline,
.byline,
.cat-links,
.tags-links {
    color: var(--jtv-muted) !important;
}

/* Media, images, embeds */
img,
.wp-caption,
iframe,
embed,
object,
video {
    max-width: 100%;
}

.wp-caption,
.entry-content img,
.post img,
.widget img,
iframe {
    border-radius: 6px;
}

hr,
.separator,
.divider,
.widget-area hr {
    border-color: var(--jtv-border) !important;
    background-color: var(--jtv-border) !important;
}

/* Tables and code */
table,
th,
td {
    border-color: var(--jtv-border) !important;
}

th {
    background: var(--jtv-panel-2) !important;
    color: var(--jtv-gold) !important;
}

td {
    color: var(--jtv-text) !important;
}

pre,
code {
    background: var(--jtv-bg-deep) !important;
    color: var(--jtv-text) !important;
    border: 1px solid var(--jtv-border) !important;
}

/* Footer */
#footer,
.footer,
.footer-menu-wrap,
#copyright,
#developer {
    background: var(--jtv-bg-deep) !important;
    color: var(--jtv-muted) !important;
    border-color: var(--jtv-border) !important;
}

#footer a,
.footer a {
    color: var(--jtv-blue) !important;
}

/* Small motion polish */
.post,
.widget,
article,
.hentry,
#slider {
    transition: transform 160ms ease, box-shadow 160ms ease, border-color 160ms ease;
}

.post:hover,
.widget:hover,
article:hover,
.hentry:hover {
    border-color: rgba(77, 141, 247, .45) !important;
    box-shadow: 0 6px 22px rgba(0,0,0,.34) !important;
}

/* Mobile refinements */
@media (max-width: 768px) {
    body {
        font-size: 16px;
    }

    #nav a,
    #header-menu a,
    .main-navigation a,
    .nav-menu a,
    ul.menu a {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
    }

    .post,
    .type-post,
    .type-page,
    .hentry,
    article,
    .entry,
    .widget,
    .sidebar .widget {
        border-radius: 6px !important;
        margin-bottom: 18px !important;
    }
}

/* JefferyTV 2026 Edition v1.1 — stronger magazine-style polish */
:root {
    --jtv-radius: 12px;
    --jtv-radius-sm: 8px;
    --jtv-shadow: 0 10px 30px rgba(0,0,0,.35);
    --jtv-shadow-soft: 0 4px 18px rgba(0,0,0,.28);
    --jtv-font-body: Inter, "Segoe UI", Roboto, Arial, Helvetica, sans-serif;
    --jtv-font-heading: Montserrat, "Segoe UI", Roboto, Arial, Helvetica, sans-serif;
}

body,
button,
input,
select,
textarea {
    font-family: var(--jtv-font-body) !important;
    line-height: 1.58;
}

h1,
h2,
h3,
h4,
h5,
h6,
.entry-title,
.post-title,
.widget-title,
.sidebar h3,
.sidebar h4,
#site-title,
.site-title {
    font-family: var(--jtv-font-heading) !important;
    font-weight: 800 !important;
}

/* Layout breathing room */
#container,
#page,
#wrapper {
    padding-bottom: 36px !important;
}

#content,
#content-main,
#content-main-inner {
    padding-top: 24px !important;
}

/* Header: cleaner, flatter brand treatment over the existing banner */
#header,
.header-wrap {
    border-radius: var(--jtv-radius) var(--jtv-radius) 0 0 !important;
    overflow: hidden !important;
    position: relative !important;
}

#header::after,
.header-wrap::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(13,15,18,.34), rgba(13,15,18,.08) 45%, rgba(13,15,18,.24));
}

#site-title,
#site-title a,
.site-title,
.site-title a {
    font-size: clamp(48px, 6vw, 82px) !important;
    line-height: .95 !important;
    color: #fff !important;
    text-shadow: 0 4px 18px rgba(0,0,0,.75) !important;
    font-weight: 900 !important;
    letter-spacing: -.055em !important;
}

#site-description,
.site-description {
    color: var(--jtv-gold) !important;
    font-family: var(--jtv-font-heading) !important;
    font-weight: 800 !important;
    text-shadow: 0 2px 8px rgba(0,0,0,.75) !important;
}

/* If the theme shows an empty/old description, visually replace it with the new positioning style only */
#site-description:empty::before,
.site-description:empty::before {
    content: "Music • Thought • Culture";
}

/* Navigation: taller, cleaner, with modern hover underline */
#header-menu-wrap,
#nav,
#header-menu,
.main-navigation,
.nav-menu,
ul.menu {
    min-height: 58px !important;
    background: rgba(32,36,42,.96) !important;
    backdrop-filter: blur(8px);
}

#nav a,
#header-menu a,
#secondary-menu a,
.main-navigation a,
.nav-menu a,
ul.menu a {
    font-size: 15px !important;
    padding: 18px 20px !important;
    line-height: 22px !important;
    position: relative !important;
    color: #fff !important;
}

#nav a:hover,
#header-menu a:hover,
.main-navigation a:hover,
.nav-menu a:hover,
ul.menu a:hover,
#nav .current-menu-item > a,
#header-menu .current-menu-item > a,
.main-navigation .current-menu-item > a,
.nav-menu .current-menu-item > a,
ul.menu .current-menu-item > a {
    background: rgba(212,167,44,.06) !important;
    color: #fff !important;
    box-shadow: inset 0 -4px 0 var(--jtv-gold) !important;
}

#nav ul ul a,
#header-menu ul ul a,
.main-navigation ul ul a,
.nav-menu ul ul a,
ul.menu ul a {
    padding: 12px 16px !important;
}

/* Search: modern pill-like control */
#searchform,
.search-form {
    display: flex;
    gap: 0;
}

input[type="search"],
.search-field,
#searchform input[type="text"],
#searchform input[type="search"] {
    min-height: 38px !important;
    padding: 8px 12px !important;
}

.search-submit,
#searchform input[type="submit"] {
    min-height: 38px !important;
    padding: 0 16px !important;
    border-radius: 0 8px 8px 0 !important;
}

/* Slider: make the featured image feel intentional */
#slider,
.featured_slider,
.slider_post {
    border-radius: var(--jtv-radius) !important;
    box-shadow: var(--jtv-shadow) !important;
    overflow: hidden !important;
}

#slider h2,
#slider h2 a,
.slider_post h2,
.slider_post h2 a,
.slider-entry .entry-title,
.slider-entry .entry-title a {
    font-size: clamp(24px, 2.4vw, 36px) !important;
    font-weight: 900 !important;
}

#slider .slider-entry-wrap,
#slider .slider-entry,
.slider-entry-wrap,
.slider-entry {
    padding: 28px !important;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.82)) !important;
}

.slider_nav,
#slider_nav {
    margin-top: 12px !important;
}

/* Post cards: stronger magazine-card treatment */
.post,
.type-post,
.type-page,
.hentry,
article,
.entry {
    border-radius: var(--jtv-radius) !important;
    box-shadow: var(--jtv-shadow-soft) !important;
    padding: 0 !important;
}

.entry-header,
.post-header,
.entry-content,
.entry-summary,
.post-content,
.post-excerpt {
    padding-left: 18px !important;
    padding-right: 18px !important;
}

.entry-title,
.post-title,
.entry-title a,
.post-title a {
    font-size: clamp(26px, 2.1vw, 34px) !important;
    line-height: 1.1 !important;
}

.entry-meta,
.post-meta,
.post-info {
    font-size: 13px !important;
}

.date-box,
.post-calendar-date,
.calendar-date,
.date {
    border: 1px solid var(--jtv-border) !important;
    border-radius: 4px !important;
    background: #fff !important;
    color: #111 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.22) !important;
}

/* Sidebar: cards instead of loose old widgets */
.widget,
.sidebar .widget,
#sidebar .widget,
#sidebar1 .widget,
#sidebar2 .widget {
    border-radius: var(--jtv-radius) !important;
    padding: 18px !important;
    margin-bottom: 24px !important;
    background: linear-gradient(180deg, #1B1F24 0%, #15191E 100%) !important;
    box-shadow: var(--jtv-shadow-soft) !important;
}

.widget-title,
.sidebar h3,
.sidebar h4,
#sidebar h3,
#sidebar h4 {
    color: var(--jtv-gold) !important;
    font-size: 15px !important;
    letter-spacing: .055em !important;
    border-bottom: 1px solid var(--jtv-border) !important;
    padding-bottom: 12px !important;
}

.widget a,
.sidebar a {
    text-decoration: none !important;
}

.widget li,
.sidebar li {
    padding: 6px 0 !important;
}

/* Buttons: no more old bootstrap-like rectangles */
button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.search-submit,
.more-link,
.button,
.btn,
.block-button a,
a.more-link {
    border-radius: 8px !important;
    padding: 11px 18px !important;
    font-family: var(--jtv-font-heading) !important;
    font-size: 14px !important;
    letter-spacing: .01em !important;
    box-shadow: 0 6px 16px rgba(77,141,247,.24) !important;
    transform: translateY(0);
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
.search-submit:hover,
.more-link:hover,
.button:hover,
.btn:hover,
.block-button a:hover,
a.more-link:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(212,167,44,.22) !important;
}

/* Images and embeds */
.entry-content img,
.post img,
.widget img,
iframe,
.wp-caption {
    border-radius: var(--jtv-radius-sm) !important;
}

/* Footer */
#footer,
.footer {
    margin-top: 36px !important;
    border-top: 1px solid var(--jtv-border) !important;
}

/* Mobile tune-up */
@media (max-width: 768px) {
    #nav a,
    #header-menu a,
    .main-navigation a,
    .nav-menu a,
    ul.menu a {
        padding: 14px 16px !important;
        font-size: 15px !important;
    }

    #site-title,
    #site-title a,
    .site-title,
    .site-title a {
        font-size: 44px !important;
    }

    .widget,
    .sidebar .widget,
    .post,
    article,
    .hentry,
    #slider {
        border-radius: 10px !important;
    }
}
