/* ============================================================================
   FLAT RE-SKIN — Seven Rock Radio
   Style: Flat / Minimalist / Brutalist-Elegant (Lucille4 Reference)
   ============================================================================
   This file overrides visual presentation ONLY.
   No functionality, Alpine.js logic, or Blade variables are affected.
   Loaded LAST to override all previous stylesheets.
   ============================================================================ */

/* ── 0. DESIGN TOKENS ─────────────────────────────────────────────────────── */
:root {
    --sr-flat-bg: #0a0a0a;
    --sr-flat-bg-alt: #111111;
    --sr-flat-bg-card: #0f0f0f;
    --sr-flat-border: rgba(255, 255, 255, 0.08);
    --sr-flat-border-hover: rgba(255, 255, 255, 0.22);
    --sr-flat-text: #f0f0f0;
    --sr-flat-text-muted: rgba(255, 255, 255, 0.5);
    --sr-flat-text-dim: rgba(255, 255, 255, 0.35);
    --sr-flat-accent: #d83131;
    --sr-flat-hover: #ffffff;
    --sr-flat-transition: all 0.25s ease;

    /* Override responsive-optimization.css card tokens */
    --sr-card-radius: 0 !important;
    --sr-card-shadow: none !important;
    --sr-card-shadow-hover: none !important;
}

/* ── 1. GLOBAL RESET — Kill shadows, gradients, border-radius ─────────────── */

/* Remove ALL shadows globally */
*,
*::before,
*::after {
    text-shadow: none !important;
}

/* Remove body pseudo-element textures/gradients */
body.white_on_black {
    background-color: var(--sr-flat-bg) !important;
}

body.white_on_black::before {
    background: var(--sr-flat-bg) !important;
    opacity: 1 !important;
}

body.white_on_black::after {
    display: none !important;
}

/* ── 2. HEADER / NAVIGATION ───────────────────────────────────────────────── */
header#lc_page_header {
    background-color: rgba(10, 10, 10, 0.96) !important;
    border-bottom: 1px solid var(--sr-flat-border) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

header#lc_page_header.sticky_enabled {
    background-color: rgba(10, 10, 10, 0.98) !important;
    box-shadow: none !important;
}

nav.classic_menu.centered_menu_logo_left ul.menu > li > a {
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    transition: var(--sr-flat-transition) !important;
}

nav.classic_menu.centered_menu_logo_left ul.menu > li > a:hover {
    color: var(--sr-flat-accent) !important;
}

nav.classic_menu ul.menu > li.current-menu-item > a {
    color: var(--sr-flat-accent) !important;
}

/* Dropdown menus */
nav.classic_menu ul.sub-menu {
    background: #111 !important;
    border: 1px solid var(--sr-flat-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

nav.classic_menu ul.sub-menu li a {
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    font-size: 11px !important;
}

/* Mobile navigation */
.mobile_navigation_container {
    background: rgba(10, 10, 10, 0.98) !important;
    backdrop-filter: none !important;
}

.hmb_mobile {
    border-radius: 0 !important;
    box-shadow: none !important;
    background: rgba(10, 10, 10, 0.96) !important;
    border: 1px solid var(--sr-flat-border) !important;
}

.mobile_navigation ul li {
    border-bottom: 1px solid var(--sr-flat-border) !important;
    background: transparent !important;
}

/* Headline ticker */
.sr-headline-ticker {
    background: #0a0a0a !important;
    border-bottom: 1px solid var(--sr-flat-border) !important;
}

/* ── 3. HERO SECTION ──────────────────────────────────────────────────────── */
.sr-home-hero {
    background: #0a0a0a !important;
}

.sr-home-hero-title {
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.02em !important;
    text-shadow: none !important;
}

.sr-home-hero-title span {
    color: var(--sr-flat-accent) !important;
}

.sr-hero-dot {
    border-radius: 0 !important;
    width: 12px !important;
    height: 3px !important;
}

.sr-hero-dot.is-active {
    width: 24px !important;
}

/* ── 4. SECTION INTROS ────────────────────────────────────────────────────── */
.sr-home-intro,
.sr-home-page .sr-home-intro {
    background: var(--sr-flat-bg) !important;
    background-image: none !important;
    padding-top: 96px !important;
    padding-bottom: 36px !important;
}

.sr-home-intro h2,
.sr-home-page .sr-home-intro h2 {
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
    color: #fff !important;
}

.sr-home-intro h2 span {
    color: var(--sr-flat-accent) !important;
}

.sr-home-intro p,
.sr-home-page .sr-home-intro p {
    text-transform: uppercase !important;
    letter-spacing: 6px !important;
    font-size: 12px !important;
    color: var(--sr-flat-text-dim) !important;
}

/* ── 5. SECTIONS — Kill gradients, apply flat bg ──────────────────────────── */
.sr-home-section,
.sr-home-page .sr-home-section,
.sr-home-page .sr-home-intro,
.sr-home-page .sr-home-section {
    background: var(--sr-flat-bg) !important;
    background-image: none !important;
}

.lc_content_full.sr-home-news-section {
    background: var(--sr-flat-bg) !important;
}

/* ── 6. COMMAND CENTER ────────────────────────────────────────────────────── */
.sr-home-command {
    background: var(--sr-flat-bg) !important;
}

.sr-home-command-card {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
    background: var(--sr-flat-bg-card) !important;
    transition: var(--sr-flat-transition) !important;
}

.sr-home-command-card:hover {
    border-color: var(--sr-flat-border-hover) !important;
    box-shadow: none !important;
    transform: none !important;
}

.sr-home-command-lead {
    background: transparent !important;
}

.sr-home-command-stat {
    border-radius: 0 !important;
}

/* ── 7. NEXT PROGRAM ──────────────────────────────────────────────────────── */
.sr-home-next-program {
    background: var(--sr-flat-bg) !important;
}

.sr-home-next-program-card {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
}

.sr-home-next-program-upcoming-card {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-home-next-program-modal-card {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-home-next-program-toggle,
.sr-home-next-program-toggle-inline {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 8. EDITORIAL SECTION ─────────────────────────────────────────────────── */
.sr-home-editorial-spotlight {
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.sr-home-editorial-card {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
    background: var(--sr-flat-bg-card) !important;
}

.sr-home-editorial-chips span {
    border-radius: 0 !important;
}

/* ── 9. CREATOR REELS / FEATURED STORIES ──────────────────────────────────── */
.sr-home-reel-spotlight {
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

.sr-home-reel-spotlight-media {
    border-radius: 0 !important;
}

.sr-home-reel-card {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
    background: var(--sr-flat-bg-card) !important;
}

.sr-home-reel-card:hover {
    box-shadow: none !important;
    border-color: var(--sr-flat-border-hover) !important;
}

.sr-home-reel-image-wrap {
    border-radius: 0 !important;
}

.sr-home-reel-spotlight-badge,
.sr-home-reel-badge {
    border-radius: 0 !important;
}

/* ── 10. ROUTE GRID (Discovery Routes) ────────────────────────────────────── */
.sr-home-route-card {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
    background: var(--sr-flat-bg-card) !important;
    transition: var(--sr-flat-transition) !important;
}

.sr-home-route-card:hover {
    border-color: var(--sr-flat-border-hover) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* ── 11. EVENTS / SHOWS ───────────────────────────────────────────────────── */
.sr-home-shows {
    background: var(--sr-flat-bg) !important;
}

.sr-events-list .single_event_list {
    border-bottom: 1px solid var(--sr-flat-border) !important;
}

.sr-events-list .event_buy a {
    border-radius: 0 !important;
}

/* ── 12. ALBUM SECTION ────────────────────────────────────────────────────── */
.sr-home-album {
    background: var(--sr-flat-bg) !important;
}

.sr-album-cover img {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-track {
    border-radius: 0 !important;
    background-color: var(--sr-flat-bg-card) !important;
}

.sr-track-progress {
    border-radius: 0 !important;
}

.sr-album-buy-btn {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 13. PODCAST SECTION ──────────────────────────────────────────────────── */
.sr-podcast-nojs {
    border-radius: 0 !important;
    background: var(--sr-flat-bg-card) !important;
    background-image: none !important;
}

.sr-podcast-nojs-cover img {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-podcast-nojs-card {
    border-radius: 0 !important;
}

.sr-podcast-row {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-podcast-play-btn {
    border-radius: 0 !important;
}

/* Podcast player cover image */
#podcastHomePlayerContainer img {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 14. GALLERY ──────────────────────────────────────────────────────────── */
.sr-gallery-item-wrap {
    border-radius: 0 !important;
    box-shadow: none !important;
    filter: none !important;
}

.sr-gallery-item-wrap:hover {
    box-shadow: none !important;
    transform: scale(1.02) !important;
}

.sr-gallery-item {
    border-radius: 0 !important;
}

/* ── 15. VIDEO SECTION ────────────────────────────────────────────────────── */
.sr-video-item {
    border-radius: 0 !important;
    box-shadow: none !important;
    border: 1px solid var(--sr-flat-border) !important;
}

.sr-video-item:hover {
    box-shadow: none !important;
    border-color: var(--sr-flat-border-hover) !important;
    transform: none !important;
}

.sr-video-item.main-video {
    border-radius: 0 !important;
}

.sr-video-play-layer {
    text-shadow: none !important;
}

.sr-video-item.main-video .sr-video-play-layer {
    animation: none !important;
}

/* ── 16. NEWS CARDS ───────────────────────────────────────────────────────── */
.sr-news-card-pure {
    background: var(--sr-flat-bg-card) !important;
    border: 1px solid var(--sr-flat-border) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.sr-news-card-pure:hover {
    transform: translateY(-4px) !important;
    border-color: var(--sr-flat-border-hover) !important;
    box-shadow: none !important;
}

.sr-news-image-container {
    background: #080808 !important;
    border-bottom: 1px solid var(--sr-flat-border) !important;
    border-radius: 0 !important;
}

.sr-news-body {
    background: var(--sr-flat-bg-card) !important;
    border-radius: 0 !important;
}

.sr-news-cta {
    border-radius: 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-size: 11px !important;
    padding: 12px 28px !important;
}

.sr-news-cta:hover {
    background: #fff !important;
    color: #000 !important;
    border-color: #fff !important;
}

/* ── 17. CONTACT FORM ─────────────────────────────────────────────────────── */
.sr-contact-input {
    border-radius: 0 !important;
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid var(--sr-flat-border) !important;
    box-shadow: none !important;
}

.sr-contact-input:focus {
    border-color: var(--sr-flat-accent) !important;
    background: rgba(255, 255, 255, 0.05) !important;
    box-shadow: none !important;
}

.sr-contact-btn {
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 14px 48px !important;
    letter-spacing: 2px !important;
    font-size: 12px !important;
}

.sr-contact-btn:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* Session status alert */
.sr-home-contact div[style*="border-radius"] {
    border-radius: 0 !important;
}

/* ── 18. FOOTER ───────────────────────────────────────────────────────────── */
#footer_sidebars {
    background: var(--sr-flat-bg-alt) !important;
}

#footer_sidebars_inner {
    border: none !important;
}

.lc_footer_sidebar {
    background: transparent !important;
}

.lc_footer_sidebar .widget-title {
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    margin-bottom: 18px !important;
}

.lc_copy_area {
    background: var(--sr-flat-bg) !important;
    border-top: 1px solid var(--sr-flat-border) !important;
    padding: 28px 0 !important;
}

.sr-footer-social-link {
    border-radius: 0 !important;
    box-shadow: none !important;
}

.lc_social_profiles a {
    border-radius: 0 !important;
}

/* ── 19. BACK TO TOP BUTTON ───────────────────────────────────────────────── */
.lc_back_to_top_btn {
    border-radius: 0 !important;
    box-shadow: none !important;
    background: rgba(10, 10, 10, 0.92) !important;
    border: 1px solid var(--sr-flat-border) !important;
}

.lc_back_to_top_btn:hover {
    border-color: var(--sr-flat-accent) !important;
    background: rgba(10, 10, 10, 0.98) !important;
    box-shadow: none !important;
}

/* ── 20. BUTTONS — Universal flat override ────────────────────────────────── */
.lc_button,
.lc_button a,
.lc_button button,
button[type="submit"],
input[type="submit"],
a.sr-home-command-link,
.sr-album-buy-btn,
.sr-contact-btn,
.sr-news-cta,
.sr-home-next-program-toggle {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 21. GLOBAL CARDS — Kill all rounded corners and shadows ──────────────── */
.sr-home-command-card,
.sr-home-editorial-card,
.sr-home-editorial-spotlight,
.sr-home-reel-card,
.sr-home-reel-spotlight,
.sr-home-route-card,
.sr-news-card-pure,
.sr-podcast-nojs-card,
.sr-podcast-row,
.sr-video-item,
.sr-gallery-item-wrap,
article[class*="sr-home"] {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 22. HEADING AREA (Subpages) ──────────────────────────────────────────── */
#heading_area {
    background: var(--sr-flat-bg-alt) !important;
}

.heading_area_title h1 {
    text-transform: uppercase !important;
    letter-spacing: 0.03em !important;
    font-weight: 800 !important;
}

.heading_area_subtitle h2 {
    text-transform: uppercase !important;
    letter-spacing: 4px !important;
    font-size: 13px !important;
    color: var(--sr-flat-text-dim) !important;
}

/* ── 23. RADIO PLAYER — Flatten gradients & shadows ────────────────────────── */
.sr-radio-player {
    background: var(--sr-flat-bg) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

.sr-radio-player::before {
    background: var(--sr-flat-accent) !important;
    opacity: 0.7 !important;
}

.sr-radio-player-panel {
    border-radius: 0 !important;
}

.sr-radio-player-panel::after {
    background: none !important;
}

.sr-radio-player-panel--track {
    background: var(--sr-flat-bg) !important;
}

.sr-radio-player-panel--controls,
.sr-radio-player-panel--actions {
    background: var(--sr-flat-bg) !important;
}

.sr-radio-visualizer canvas {
    filter: none !important;
}

.sr-radio-volume-fill {
    background: var(--sr-flat-accent) !important;
}

/* ── 24. SEARCH OVERLAY ───────────────────────────────────────────────────── */
#lc_global_search {
    background: rgba(10, 10, 10, 0.96) !important;
    backdrop-filter: none !important;
}

/* ── 25. PAGINATION ───────────────────────────────────────────────────────── */
.pagination a,
.pagination span,
.page-numbers a,
.page-numbers span {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ── 26. HOTFIX OVERRIDES — main-overrides-hotfix.css ──────────────────────── */
/* News grid cards from hotfix: kill border-radius */
#lc_swp_content .sr-home-page .sr-home-news .post_item.sr-grid-card {
    border-radius: 0 !important;
    box-shadow: none !important;
}

#lc_swp_content .sr-home-page .sr-home-news .post_item.sr-grid-card:hover {
    box-shadow: none !important;
}

/* Album buy button hover: no shadow */
#lc_swp_content .sr-home-page .sr-home-album .lc_button a:hover {
    box-shadow: none !important;
}

/* Event buy links: no border-radius */
.sr-home-shows .sr-events-list .event_buy a {
    border-radius: 0 !important;
}

/* Skeleton frames: no gradient, solid */
.sr-skeleton-frame {
    background: rgba(255, 255, 255, 0.04) !important;
}

.sr-skeleton-frame::after {
    background: none !important;
    animation: none !important;
}

/* ── 27. RESPONSIVE ADJUSTMENTS ───────────────────────────────────────────── */
@media (max-width: 768px) {
    .sr-home-intro,
    .sr-home-page .sr-home-intro {
        padding-top: 64px !important;
        padding-bottom: 24px !important;
    }

    .sr-contact-btn {
        padding: 12px 32px !important;
    }
}

/* ── 27. PRINT — Clean output ─────────────────────────────────────────────── */
@media print {
    body.white_on_black {
        background: #fff !important;
        color: #000 !important;
    }
    
    body.white_on_black::before,
    body.white_on_black::after {
        display: none !important;
    }
}
