/* =============================================
   CRITICAL: Force black background everywhere
   Fixes any theme bleeding through
   ============================================= */
html,
body,
#page,
#content,
.site,
.site-content,
.main-container,
.ct-container,
.ct-page-content,
.content-area,
.site-main,
main,
article,
.entry-content,
.post-content,
.page-content,
[data-prefix],
[data-prefix] > *,
.ct-container-fluid,
body > div:not(.ct-header):not(#ct-footer):not(.ct-offcanvas-container),
body > section,
body::before,
body::after,
html::before,
html::after,
#page::before,
#page::after,
.site::before,
.site::after,
*::before,
*::after {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* Target the area immediately below header */
.ct-header + *,
header + *,
.site-header + * {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* =============================================
   VEGAS LUXE DARK MODE v3.1.0
   Top of Las Vegas - Premium Dark Theme

   Background: #0B0B0B (Pure Black)
   Cards: #111111 with #222222 borders
   Accent: Gold (var(--primary-accent))
   Secondary: Terracotta (#E07A5F)
   ============================================= */

:root {
    /* Core Dark Palette */
    --vl-black: #0B0B0B;
    --vl-card: #161616;
    --vl-card-hover: #454545;
    --vl-border: #222222;
    --vl-border-light: #333333;

    /* Gold Accent */
    --vl-gold: var(--primary-accent);
    --vl-gold-dark: var(--primary-accent-dark);
    --vl-gold-light: var(--primary-accent-light);

    /* Terracotta for Locals Recommend */
    --vl-terracotta: #E07A5F;
    --vl-terracotta-dark: #C86A52;

    /* Text Colors */
    --vl-text: #FFFFFF;
    --vl-text-muted: #999999;
    --vl-text-subtle: #666666;

    /* Status */
    --vl-success: #81B29A;
    --vl-rating: var(--primary-accent);

    /* Override existing Vegas variables */
    --vg-obsidian: #0B0B0B;
    --vg-charcoal: #111111;
    --vg-charcoal-light: #1a1a1a;
    --vg-terracotta: #E07A5F;
    --vg-sand: var(--primary-accent);
    --vg-eggshell: #FFFFFF;
    --vg-eggshell-muted: #999999;
    --vg-rating: var(--primary-accent);
}

/* =============================================
   GLOBAL BACKGROUND - PURE BLACK
   ============================================= */

html, body {
    background: var(--vl-black) !important;
}

body, .site-main, .content-area, main, article, .entry-content,
.ct-container, .ct-page-content, .post-content, .page-content,
#main, .site-content, .wp-site-blocks {
    background: var(--vl-black) !important;
    color: var(--vl-text) !important;
}

/* =============================================
   HERO SECTION - GOLD GRADIENT
   ============================================= */

.tx-hero, .vg-hero {
    background: var(--star-gold) !important;
    color: var(--vl-black) !important;
}

.tx-hero h1, .vg-hero h1 {
    color: var(--vl-black) !important;
    text-shadow: none !important;
}

.tx-hero .tagline, .vg-hero .tagline {
    color: rgba(0,0,0,0.8) !important;
}

/* =============================================
   CARDS - ELEVATED DARK DESIGN
   ============================================= */

.std-card, .tx-card, .vg-card,
.featured-card, .restaurant-card, .business-card {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5) !important;
    transition: all 0.3s ease !important;
}

.std-card:hover, .tx-card:hover, .vg-card:hover,
.featured-card:hover, .restaurant-card:hover, .business-card:hover {
    transform: translateY(-6px) !important;
    box-shadow: 0 12px 40px rgba(0,0,0,0.7), 0 0 20px rgba(212,175,55,0.15) !important;
    border-color: var(--primary-accent) !important;
}

.std-card-content, .card-content {
    background: var(--vl-card) !important;
}

.std-card-name, .card-title, .restaurant-name {
    color: var(--vl-text) !important;
}

.std-card-city, .std-card-cuisine, .card-meta:not(.explore-tag):not(.explore-btn) {
    color: var(--vl-text-muted) !important;
}

/* =============================================
   RATING BADGES - BRIGHT GOLD
   ============================================= */

.std-card-badge, .badge-rating, .rating-badge {
    background: var(--star-gold) !important;
    color: var(--vl-black) !important;
    font-weight: 700 !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 8px rgba(212,175,55,0.4) !important;
}

/* =============================================
   SATISFACTION/SCORE BADGES - GOLD GRADIENT
   ============================================= */

.satisfaction-badge, .score-badge, .guest-satisfaction .progress-fill,
.ti-progress-fill, .satisfaction-progress {
    background: var(--star-gold) !important;
}

.guest-satisfaction, .satisfaction-card {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
}

.satisfaction-label, .progress-label {
    color: var(--vl-text) !important;
}

.satisfaction-value, .progress-value {
    color: var(--primary-accent) !important;
    font-weight: 700 !important;
}

/* =============================================
   LOCALS RECOMMEND - TERRACOTTA
   ============================================= */

.locals-recommend, .local-favorite-badge,
[class*="local"], .heart-icon {
    color: var(--vl-terracotta) !important;
}

.locals-recommend-card {
    border-left: 4px solid var(--vl-terracotta) !important;
    background: var(--vl-card) !important;
}

/* =============================================
   BUTTONS - GOLD PRIMARY
   ============================================= */

.vg-btn-primary, .ti-btn-primary, .btn-primary,
.search-btn, .filter-btn, button[type="submit"] {
    background: var(--star-gold) !important;
    color: var(--vl-black) !important;
    border: none !important;
    font-weight: 600 !important;
    transition: all 0.2s !important;
}

.vg-btn-primary:hover, .ti-btn-primary:hover, .btn-primary:hover,
.search-btn:hover, .filter-btn:hover, button[type="submit"]:hover {
    background: linear-gradient(135deg, var(--primary-accent-light) 0%, var(--primary-accent) 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 15px rgba(212,175,55,0.4) !important;
}

/* Ghost/Secondary Buttons */
.vg-btn-secondary, .btn-outline, .ghost-btn, .city-filter-btn {
    background: transparent !important;
    border: 2px solid var(--primary-accent) !important;
    color: var(--primary-accent) !important;
}

.vg-btn-secondary:hover, .btn-outline:hover, .ghost-btn:hover, .city-filter-btn:hover {
    background: var(--primary-accent) !important;
    color: var(--vl-black) !important;
}

/* =============================================
   CUISINE PILLS/BADGES
   ============================================= */

.cuisine-badge, .cuisine-pill, .cuisine-filter,
.badge-cuisine, .category-badge {
    background: rgba(212,175,55,0.15) !important;
    color: var(--primary-accent) !important;
    border: 1px solid rgba(212,175,55,0.3) !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
}

.cuisine-badge:hover, .cuisine-pill:hover {
    background: var(--primary-accent) !important;
    color: var(--vl-black) !important;
}

/* =============================================
   PRICE BADGES
   ============================================= */

.price-badge, .badge-price, .std-card-price {
    color: var(--vl-success) !important;
    font-weight: 600 !important;
}

/* =============================================
   OPEN/CLOSED STATUS
   ============================================= */

.status-open, .hours-badge-open, .badge-open {
    background: var(--vl-success) !important;
    color: var(--vl-black) !important;
}

.status-closed, .hours-badge-closed, .badge-closed {
    background: var(--vl-terracotta) !important;
    color: var(--vl-text) !important;
}

/* =============================================
   SIDEBAR CARDS
   ============================================= */

.sidebar-card, .tx-sidebar-card, .vg-sidebar-card,
.info-card, .contact-card, .hours-card {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
    border-radius: 12px !important;
}

.sidebar-card h3, .sidebar-card h4 {
    color: var(--primary-accent) !important;
    border-bottom: 1px solid var(--vl-border) !important;
}

/* =============================================
   HIDDEN GEMS / SPECIAL SECTIONS
   ============================================= */

.hidden-gems-section, .special-section, .featured-section {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
}

.hidden-gems-section h2, .section-title {
    color: var(--primary-accent) !important;
}

/* =============================================
   QUOTE BOXES
   ============================================= */

.tx-quote-box, .vg-quote-box, .quote-box, blockquote {
    background: var(--vl-card) !important;
    border-left: 4px solid var(--primary-accent) !important;
    color: var(--vl-text) !important;
    padding: 20px !important;
}

/* =============================================
   VIBES/TAGS
   ============================================= */

.vg-vibe-tag, .tag-pill {
    background: rgba(212,175,55,0.1) !important;
    border: 1px solid rgba(212,175,55,0.25) !important;
    color: var(--primary-accent) !important;
    border-radius: 20px !important;
    padding: 6px 12px !important;
}

/* =============================================
   LINKS
   ============================================= */

/* Global link color rules removed - let specific components handle their own link colors */
/* =============================================
   HEADER
   ============================================= */

.ct-header, .ct-header [data-row="middle"],
.site-header, header {
    background: var(--vl-black) !important;
    border-bottom: 1px solid var(--vl-border) !important;
}

.ct-header .ct-container {
    background: transparent !important;
}

/* =============================================
   FOOTER
   ============================================= */

footer, .site-footer, #ct-footer {
    background: var(--vl-card) !important;
    color: var(--vl-text-muted) !important;
    border-top: 1px solid var(--vl-border) !important;
}

footer a, .site-footer a:not(.explore-tag):not(.explore-btn) {
    color: var(--primary-accent) !important;
}

footer h3, footer h4 {
    color: var(--vl-text) !important;
}

/* =============================================
   WEBIGNITER PREFOOTER
   ============================================= */

.webigniter-prefooter, .prefooter-cta:not(.explore-tag):not(.explore-btn) {
    background: var(--vl-card) !important;
}

.webigniter-prefooter a, .prefooter-cta .btn {
    background: var(--primary-accent) !important;
    color: var(--vl-black) !important;
}

/* =============================================
   PAGINATION
   ============================================= */

.pagination a, .nav-links a, .page-numbers {
    color: var(--primary-accent) !important;
    border: 1px solid var(--primary-accent) !important;
    background: transparent !important;
}

.pagination a:hover, .nav-links a:not(.explore-tag):not(.explore-btn):hover {
    background: var(--primary-accent) !important;
    color: var(--vl-black) !important;
}

.pagination .current, .nav-links .current {
    background: var(--primary-accent) !important;
    color: var(--vl-black) !important;
}

/* =============================================
   FORMS & INPUTS
   ============================================= */

input, textarea, select {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
    color: var(--vl-text) !important;
}

input:focus, textarea:focus, select:focus {
    border-color: var(--primary-accent) !important;
    box-shadow: 0 0 0 2px rgba(212,175,55,0.2) !important;
}

::placeholder {
    color: var(--vl-text-subtle) !important;
}

/* =============================================
   GRID LAYOUTS
   ============================================= */

.std-card-grid {
    gap: 24px !important;
}

/* =============================================
   TOP RATED / CHAMPION CARDS
   ============================================= */

.champion-card, .top-rated-card {
    background: var(--vl-card) !important;
    border: 2px solid var(--primary-accent) !important;
    box-shadow: 0 0 30px rgba(212,175,55,0.2) !important;
}

.champion-badge, .rank-badge {
    background: var(--star-gold) !important;
    color: var(--vl-black) !important;
}

/* =============================================
   BREADCRUMBS
   ============================================= */

.breadcrumbs, .breadcrumb {
    color: var(--vl-text-muted) !important;
}

.breadcrumbs a:not(.explore-tag):not(.explore-btn) {
    color: var(--primary-accent) !important;
}

/* =============================================
   FAQ SECTION
   ============================================= */

.faq-item, .accordion-item {
    background: var(--vl-card) !important;
    border: 1px solid var(--vl-border) !important;
}

.faq-question, .accordion-header {
    color: var(--vl-text) !important;
}

.faq-answer, .accordion-content {
    color: var(--vl-text-muted) !important;
}

/* =============================================
   RELATED RESTAURANTS
   ============================================= */

.related-section {
    background: var(--vl-black) !important;
}

.related-section h2 {
    color: var(--primary-accent) !important;
}

/* =============================================
   MAP CONTAINER
   ============================================= */

.map-container, .google-map {
    border: 1px solid var(--vl-border) !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* =============================================
   HEADINGS
   ============================================= */

h1, h2, h3, h4, h5, h6 {
    color: var(--vl-text) !important;
}

.section-heading, .page-title {
    color: var(--vl-text) !important;
}

/* =============================================
   MOBILE RESPONSIVE
   ============================================= */

@media (max-width: 768px) {
    .std-card:hover {
        transform: translateY(-3px) !important;
    }

    .tx-hero h1, .vg-hero h1 {
        font-size: 1.8rem !important;
    }
}

/* =============================================
   OVERRIDE CONFLICTING STYLES
   ============================================= */

/* Remove any cream/beige backgrounds */
[style*="FFF8E1"], [style*="fff8e1"],
[style*="FFFBEB"], [style*="fffbeb"],
[style*="F7E7CE"], [style*="f7e7ce"] {
    background: var(--vl-card) !important;
}

/* Ensure text visibility */
.std-card-name, .restaurant-name, .card-title,
.business-name, h3 a, h4 a:not(.explore-tag):not(.explore-btn) {
    color: var(--vl-text) !important;
}

/* Fix any remaining light text on light backgrounds */
p, li, span, div {
    color: inherit;
}

/* =============================================
   WORDPRESS/BLOCKSY THEME OVERRIDES
   Force dark background on all page types
   ============================================= */

/* Global body and content overrides */
html body,
body.page,
body.single,
body.archive,
body.home,
body.search,
body.error404,
#page,
#content,
#primary,
#main,
.site,
.site-content,
.ct-container,
.ct-page-content,
.entry-content,
.page-content,
.post-content,
.content-area,
main.site-main,
article,
.wp-site-blocks {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* Blocksy specific overrides */
[data-prefix],
[data-prefix] .ct-container,
.ct-container-fluid,
body [class*="ct-"],
.ct-page-title,
.hero-section {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* Remove any white/gray backgrounds */
*[style*="background: #ddd"],
*[style*="background-color: #ddd"],
*[style*="background: #fff"],
*[style*="background-color: #fff"],
*[style*="background: white"],
*[style*="background-color: white"],
*[style*="background: #eee"],
*[style*="background-color: #eee"] {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* Text color on dark backgrounds */
body, p, span, div, li, td, th, label,
.entry-content, .page-content, .post-content {
    color: #FFFFFF;
}

/* Section containers */
section, .section, .container, .wrapper,
.inner-content, .main-content, .page-wrapper {
    background: transparent !important;
}

/* Specific page templates */
.page-template-page-explore-vibes,
.page-template-page-restaurants,
.page-template-page-top-rated,
.page-template-page-city-hub,
.page-template-page-services,
.single-business,
.tax-business_category,
.tax-restaurant_vibe {
    background: var(--theme-palette-color-7) !important;
}

/* Hero sections keep their gradients */
.tx-hero, .vg-hero, .ti-hero,
[class*="hero"] {
    /* Allow gradient backgrounds */
}


/* =============================================
   BODY BACKGROUND FIX
   Override Blocksy theme default body background
   ============================================= */
body {
    background-color: var(--theme-palette-color-7) !important;
    background: var(--theme-palette-color-7) !important;
}

/* =============================================
   CARD CONTRAST FIX
   Make cards stand out from background
   ============================================= */


/* =============================================
   FORCE CARD BACKGROUND - FINAL OVERRIDE
   This MUST be at the end of the file
   ============================================= */
.std-card,
a.std-card,
.std-card-grid .std-card,
.std-card-grid a.std-card,
body .std-card,
body a.std-card,
.top-rated-cards .std-card,
.featured-card,
.restaurant-card,
.business-card {
    background: #161616 !important;
    background-color: #161616 !important;
}

.std-card-content,
.std-card .std-card-content,
body .std-card-content {
    background: #161616 !important;
    background-color: #161616 !important;
}

/* =============================================
   COMPACT RATING BADGE - TOP RIGHT
   ============================================= */
.std-card-badge {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    left: auto !important;
    width: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    background: var(--star-gold) !important;
    color: #000 !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
    z-index: 10 !important;
}

/* =============================================
   LOCALS RECOMMEND - GOLD TEXT
   ============================================= */
.std-card-recommend-label {
    color: #ffffff !important;
}

.std-card-recommend-label .heart {
    display: none !important;
}

/* =============================================
   HEADER - PURE BLACK
   ============================================= */
.ct-header,
.ct-header [data-row],
.ct-header [data-row] > div,
.ct-header [data-row="middle"],
.ct-header [data-row="middle"] > div,
header,
.site-header {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
    border-bottom: 1px solid #222222 !important;
}

/* =============================================
   GLOBAL UI POLISH v1.0
   Applied across all pages for consistency
   ============================================= */

/* Breadcrumbs - Brand colored links */
.cbd-breadcrumbs {
    font-size: 0.85rem;
    color: #AAAAAA;
    margin-bottom: 10px;
}
.cbd-breadcrumbs a { 
    color: var(--primary-accent); 
    text-decoration: none; 
}
.cbd-breadcrumbs a:hover { 
    color: var(--primary-accent-light, #E8C547); 
    text-decoration: underline; 
}
.cbd-breadcrumbs span { 
    margin: 0 8px; 
    color: #888; 
}

/* Form Elements - Styled dropdowns */
select, 
.sort-dropdown select,
.filter-select {
    background: #0D0D0D;
    border: 1px solid var(--primary-accent);
    border-radius: 6px;
    padding: 10px 36px 10px 14px;
    color: #EDEDED;
    font-size: 0.9rem;
    font-weight: 500;
    line-height: 1.4;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3E%3Cpath fill='%23D4AF37' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    transition: all 0.2s;
}

select:hover,
.sort-dropdown select:hover,
.filter-select:hover {
    border-color: var(--primary-accent-light, #E8C547);
    background-color: #111;
}

select:focus,
.sort-dropdown select:focus,
.filter-select:focus {
    outline: none;
    border-color: var(--primary-accent);
}

/* Back/Navigation Links - Styled as outline buttons */
.back-link,
a.back-link {
    display: inline-block;
    color: var(--primary-accent);
    text-decoration: none;
    font-weight: 600;
    padding: 10px 20px;
    border: 2px solid var(--primary-accent);
    border-radius: 8px;
    transition: all 0.2s;
    margin-bottom: 20px;
}

.back-link:hover,
a.back-link:hover {
    background: var(--primary-accent);
    color: #000;
}

/* Hero sections - Tighter spacing */
.cuisine-hero,
.restaurants-hero,
.cbd-hero {
    padding-top: 40px;
    padding-bottom: 25px;
}

/* Content areas - Tighter spacing */
.cuisine-content,
.restaurants-content,
.cbd-content {
    padding-top: 25px;
}

/* Subtitle text - Constrained width */
.subtitle,
.hero-subtitle,
.page-subtitle {
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    color: #888888;
    line-height: 1.6;
}

/* =============================================
   FINAL OVERRIDE - FORCE DARK ON ALL MAIN CONTENT
   ============================================= */
main,
main.site-main,
main.site-main.hfeed,
.site-main,
.hfeed,
body main,
body .site-main {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* =============================================
   OVERRIDE WHITE PAGE BACKGROUNDS
   Targeting specific body.page selector from style.css
   ============================================= */
body.page:not(.home):not(.archive):not(.category):not(.tax) .site-main,
body.page:not(.home):not(.archive):not(.category):not(.tax) #main,
body.page:not(.home):not(.archive):not(.category):not(.tax) main,
body.page:not(.home):not(.archive):not(.category):not(.tax) #primary,
body.page:not(.home):not(.archive):not(.category):not(.tax) .entry-content,
body.page:not(.home):not(.archive):not(.category):not(.tax) article {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* =============================================
   NUCLEAR OPTION: Force black everywhere
   ============================================= */
html, body, #page, .site, .site-content, #content,
.main-container, .ct-container, .ct-page-content,
body > *, #page > *, .site > * {
    background: var(--theme-palette-color-7) !important;
    background-color: var(--theme-palette-color-7) !important;
}

/* Remove any gradients or images */
body, #page, .site {
    background-image: none !important;
}

/* Ensure no spacing between header and content */
.ct-header,
header.site-header {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.site-main,
main#main,
.ct-page-content {
    margin-top: 0 !important;
    padding-top: 0 !important;
}