/*
Theme Name: Info Cash Picks
Theme URI: https://github.com/tylerforret/infocashpicks
Description: Custom, high-performance WordPress theme for Info Cash Picks.
Version: 1.1.0
Author: Tyler Forret
Author URI: https://github.com/tylerforret
License: MIT
Text Domain: infocashpicks
*/

:root {
    /* Colors */
    --color-primary: #00D61C;
    --color-primary-glow: rgba(0, 214, 28, 0.3);
    --color-bg-dark: #0F0F0F;
    --color-bg-card: #1E1E1E;
    --color-text-heading: #FFFFFF;
    --color-text-body: #A0A0A0;
    --color-win: #00D61C;
    --color-loss: #FF3B30;
    --color-push: #FFCC00;

    /* Typography */
    --font-heading: 'Space Grotesk', sans-serif;
    --font-body: 'Inter', sans-serif;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    background-color: var(--color-bg-dark);
    color: var(--color-text-body);
    font-family: var(--font-body);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* Entrance Animations */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.active {
    opacity: 1;
    transform: translateY(0);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--color-text-heading);
    font-family: var(--font-heading);
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 1rem;
}

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    filter: brightness(1.2);
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Button Styles */
.btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background-color: var(--color-primary);
    color: #000;
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    border-radius: 4px;
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 0 25px var(--color-primary-glow);
    filter: brightness(1.1);
}

.btn-large {
    padding: 20px 40px;
    font-size: 1.1rem;
}

/* Hero Section */
.hero {
    padding: 140px 0 100px;
    text-align: center;
    background: radial-gradient(circle at center, #1A3A1A 0%, var(--color-bg-dark) 70%);
}

.hero h1 {
    font-size: clamp(3rem, 8vw, 5rem);
    margin-bottom: 24px;
    text-transform: uppercase;
}

/* Card Styling */
.article-card {
    background: var(--color-bg-card);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    overflow: hidden;
    transition: all 0.4s ease;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.article-card:hover {
    border-color: var(--color-primary);
    transform: translateY(-10px);
}

/* Responsive */
@media (max-width: 768px) {
    .hero h1 {
        font-size: 2.5rem;
    }
}

/* Header & Navigation */
.site-header {
    background-color: var(--color-bg-dark);
    border-bottom: 1px solid var(--color-bg-card);
    padding: 10px 0;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.site-title a {
    font-family: var(--font-heading);
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--color-primary);
    text-transform: uppercase;
}

.custom-logo {
    max-height: 50px;
    width: auto;
    display: block;
}

.main-navigation ul {
    list-style: none;
    display: flex;
    gap: 30px;
}

.main-navigation a {
    color: var(--color-text-heading);
    font-family: var(--font-heading);
    font-weight: 500;
    text-transform: uppercase;
    font-size: 0.9rem;
}

.menu-toggle {
    display: none;
    background: none;
    border: none;
    color: var(--color-text-heading);
    font-size: 1.5rem;
    cursor: pointer;
}

/* Footer */
.site-footer {
    background-color: #111;
    padding: 60px 0;
    margin-top: 100px;
    border-top: 1px solid var(--color-bg-card);
}

.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-info p {
    font-size: 0.8rem;
    color: #888;
}

.footer-navigation ul {
    list-style: none;
    display: flex;
    gap: 20px;
}

.footer-navigation a {
    font-size: 0.8rem;
    color: #888;
}

@media (max-width: 920px) {
    .main-navigation ul {
        display: none;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background-color: var(--color-bg-dark);
        padding: 20px;
        border-bottom: 1px solid var(--color-bg-card);
    }

    .main-navigation ul.is-active {
        display: flex;
    }

    .menu-toggle {
        display: block;
    }
}

/* =========================================
   SportsCapping PHP Export — Dark Theme Overrides
   =========================================
   Every override below targets a specific selector from respexport.css
   that sets a white/light background, dark text, or red link color.
   ========================================= */

/* Wrapper for page template export content */
.sc-export-wrapper {
    background: var(--color-bg-card);
    border: 1px solid rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    padding: 24px;
    overflow-x: auto;
}

/* ---- Container ---- */
#affliatecontainer {
    background: transparent !important;
    color: var(--color-text-body) !important;
}

/* ---- Global text color resets ---- */
/* respexport uses #444 on .white-row p, #333 on .service-main p / h2,
   #555 on hooks, #666 on release times, #888 on prices, #000 on titles */
#affliatecontainer,
#affliatecontainer p,
#affliatecontainer span,
#affliatecontainer div,
#affliatecontainer label,
#affliatecontainer td,
#affliatecontainer th {
    color: var(--color-text-body) !important;
}

#affliatecontainer h1,
#affliatecontainer h2,
#affliatecontainer h3,
#affliatecontainer h4,
#affliatecontainer h5,
#affliatecontainer h6,
#affliatecontainer strong,
#affliatecontainer b,
.premium-picks-purchase-title,
.package-purchase-title,
.schedule-team,
.schedule-date-heading {
    color: var(--color-text-heading) !important;
}

/* ---- Links ---- */
/* respexport: a { color: #ff0000 } */
#affliatecontainer a {
    color: var(--color-primary) !important;
}
#affliatecontainer a:hover {
    filter: brightness(1.2);
    text-decoration: underline;
}

/* ---- White-background rows & panels ---- */
/* respexport: .white-row { background-color: #fff }
              .affliatetable > tbody > tr > td { background-color: #f9f9f9 } */
#affliatecontainer .white-row {
    background-color: var(--color-bg-card) !important;
}
.affliatetable,
#affliatecontainer table {
    background-color: transparent !important;
}
.affliatetable > thead > tr > th,
.affliatetable > tbody > tr > th,
.affliatetable > thead > tr > td,
.affliatetable > tbody > tr > td {
    background-color: transparent !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ---- Panel heading ---- */
/* respexport: .panel-heading { background-color: #333; color: #fff } — keep mostly, just darken bg */
#affliatecontainer .panel-heading {
    background-color: #1a1a1a !important;
    color: #fff !important;
}

/* ---- Premium Picks ---- */
/* respexport: .premium-picks-row { border: 1px solid #d9e0e2 }
              .premium-pick-full-top { background-color: #efefef } */
.premium-picks-row {
    border-color: rgba(255, 255, 255, 0.1) !important;
    background-color: var(--color-bg-card) !important;
}
.premium-pick-full-top {
    background-color: #1a1a1a !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.premium-picks-capper-full-top {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
.premium-picks-hook {
    color: var(--color-text-body) !important;
}
.premium-picks-game-analysis-head {
    color: #666 !important;
}
.premium-picks-buy-section {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
.premium-picks-price {
    color: #888 !important;
}

/* ---- Purchase buttons ---- */
/* respexport: .premium-pick-purchase-button { background-color: #5cb85c }
              .login-button { background-color: #5cb85c }
   These are <a> tags, so we need #affliatecontainer prefix to beat the
   generic link color rule above. */
#affliatecontainer .premium-pick-purchase-button,
#affliatecontainer a.premium-pick-purchase-button,
#affliatecontainer .login-button,
#affliatecontainer a.login-button,
#affliatecontainer .btn-success,
#affliatecontainer a.btn-success {
    background-color: var(--color-primary) !important;
    color: #000 !important;
}
#affliatecontainer .premium-pick-purchase-button:hover,
#affliatecontainer a.premium-pick-purchase-button:hover,
#affliatecontainer .login-button:hover,
#affliatecontainer a.login-button:hover,
#affliatecontainer .btn-success:hover,
#affliatecontainer a.btn-success:hover {
    background-color: #00b818 !important;
    color: #000 !important;
}
/* Catch spans inside buttons (e.g. .premium-picks-button-guarantee)
   which otherwise inherit grey from the global span color rule */
#affliatecontainer .premium-pick-purchase-button span,
#affliatecontainer a.premium-pick-purchase-button span,
#affliatecontainer .login-button span,
#affliatecontainer .btn-success span {
    color: #000 !important;
}
/* Catch any other button-like links inside buy/purchase sections */
#affliatecontainer .premium-picks-buy-section a,
#affliatecontainer .package-buy-section a,
#affliatecontainer .purchase-module a.btn,
#affliatecontainer .premium-packages-row-wrap a.btn {
    color: #000 !important;
}

/* ---- Package / Buy Picks ---- */
/* respexport: .premium-packages-row-wrap { background-color: #fff }
              .package-col-right { background-color: #efefef }
              .purchase-module { background-color: #efefef } */
.premium-packages-row-wrap {
    background-color: var(--color-bg-card) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.package-col-right,
.purchase-module {
    background-color: #1a1a1a !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.package-price {
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: #888 !important;
}
.package-row p {
    color: var(--color-text-body) !important;
}

/* ---- Capper / Service page ---- */
/* respexport: .service-main p { color: #333 }
              .service-main h2 { color: #333333 }
              .single-capper-row { border: 1px solid #d9e0e2 } */
.service-main p,
.service-main h2 {
    color: var(--color-text-heading) !important;
}
.single-capper-row {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ---- Free Picks ---- */
/* respexport: .free-pick-row { border: 1px solid #d9e0e2 }
              .free-pick-full-top { background-color: #efefef }
              .free-pick-game-info { border-*: 1px solid #efefef } */
.free-pick-row {
    border-color: rgba(255, 255, 255, 0.1) !important;
    background-color: var(--color-bg-card) !important;
}
.free-pick-full-top {
    background-color: #1a1a1a !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.free-pick-game-info {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
.free-pick-game-info-head,
.free-pick-game-analysis-head {
    color: #666 !important;
}
.free-pick-hook {
    color: var(--color-text-body) !important;
}
.pick-release-time {
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--color-text-body) !important;
}

/* ---- Paid Picks ---- */
/* respexport: .paid-picks-full-top { background-color: #efefef } */
.paid-picks-full-top {
    background-color: #1a1a1a !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.paid-picks-full-top h3 {
    color: var(--color-text-heading) !important;
}
.paid-picks-hook {
    color: var(--color-text-body) !important;
}
.paid-picks-row {
    border-color: rgba(255, 255, 255, 0.1) !important;
    background-color: var(--color-bg-card) !important;
}
.paid-picks-game-info {
    border-color: rgba(255, 255, 255, 0.08) !important;
}
.paid-picks-release-time {
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--color-text-body) !important;
}

/* ---- Pick Results ---- */
/* respexport: .pick-result-success { background-color:#d2ebb8; color: #3c763d }
              .pick-result-info { background-color:#aae1f5; color: #31708F }
              etc. — adapt for dark bg */
.pick-result {
    border-radius: 6px !important;
}
.pick-result-success {
    background-color: rgba(0, 214, 28, 0.15) !important;
    border-left-color: var(--color-win) !important;
    color: var(--color-win) !important;
}
.pick-result-info {
    background-color: rgba(49, 112, 143, 0.2) !important;
    border-left-color: #5bc0de !important;
    color: #5bc0de !important;
}
.pick-result-warning {
    background-color: rgba(255, 204, 0, 0.15) !important;
    border-left-color: var(--color-push) !important;
    color: var(--color-push) !important;
}
.pick-result-danger {
    background-color: rgba(255, 59, 48, 0.15) !important;
    border-left-color: var(--color-loss) !important;
    color: var(--color-loss) !important;
}
.pick-result-lost {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border-left-color: #777 !important;
    color: #999 !important;
}

/* ---- Leaderboard ---- */
/* respexport: .leaderboards-module-table { background-color: #fff }
              .leaderboard-row { border: 1px solid #efefef } */
.leaderboards-module-table {
    background-color: var(--color-bg-card) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    box-shadow: none !important;
}
.leaderboard-row,
.top-capper-row,
.top-trends-row {
    border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ---- Subscription / Price Table ---- */
/* respexport: .price-table { background: #fff }
              .price-table h3 { border-bottom: 2px solid #e7e7e7 }
              .price-table h5 { color: #333333 }
              div.price-table p { color: #666 } */
.price-table {
    background: var(--color-bg-card) !important;
}
.price-table h3 {
    border-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--color-text-heading) !important;
}
.price-table h5 {
    color: var(--color-text-body) !important;
}
div.price-table p {
    color: var(--color-text-body) !important;
}

/* ---- Schedule / Live Odds ---- */
/* respexport: .schedule-row { border: 1px solid #ddd }
              .schedule-head { background-color: #333; border-bottom: 5px solid #ff0000 }
              .schedule-available-picks { background-color:#efefef } */
.schedule-row {
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.schedule-table {
    border-color: rgba(255, 255, 255, 0.1) !important;
}
.schedule-head {
    background-color: #1a1a1a !important;
    border-bottom-color: var(--color-primary) !important;
}
.schedule-available-picks {
    background-color: #1a1a1a !important;
}
hr.schedule-divider {
    border-color: rgba(255, 255, 255, 0.1) !important;
}
hr.premium-package-divider {
    border-color: rgba(255, 255, 255, 0.1) !important;
}

/* ---- Odds Table ---- */
/* respexport: even rows #f6f6f6, odd rows #fff, hover #fdf991,
              header bg #333/#555, scores and books bg white */
.odds-main td.data_main_date_even,
.odds-main td.data_main_rot_even,
.odds-main td.data_main_teams_even,
.odds-main td.data_main_numbers_even,
.odds-main td.data_main_hidden_even,
.odds-main td.data_main_buy_even {
    background-color: #1a1a1a !important;
    color: var(--color-text-body) !important;
}
.odds-main td.data_main_date_odd,
.odds-main td.data_main_rot_odd,
.odds-main td.data_main_teams_odd,
.odds-main td.data_main_numbers_odd,
.odds-main td.data_main_hidden_odd,
.odds-main td.data_main_buy_odd {
    background-color: transparent !important;
    color: var(--color-text-body) !important;
}
.odds-main tr.odds_row:hover td {
    background-color: rgba(0, 214, 28, 0.1) !important;
}
.odds-main td {
    border-color: rgba(255, 255, 255, 0.08) !important;
    color: var(--color-text-body) !important;
}
.odds-main td.sub_header_times,
.odds-main td.sub_header_main {
    background-color: #2a2a2a !important;
    color: #aaa !important;
}
.odds_header_date {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #000 !important;
}
.odds-main td.header_main_date,
.odds-main td.header_main_rot,
.odds-main td.header_main_hidden,
.odds-main td.header_main_teams,
.odds-main td.header_main_books,
.odds-main td.header_main_picks {
    border-color: #1a1a1a !important;
    color: var(--color-text-heading) !important;
}

/* ---- Login Module ---- */
/* respexport: .login-form-control { background-color: #ffffff; border: 1px solid rgba(0,0,0,0.15) } */
.login-form-control {
    background-color: #1a1a1a !important;
    color: #fff !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
}
.login-control-label {
    color: var(--color-text-body) !important;
}

/* ---- Generic form inputs (fallback) ---- */
#affliatecontainer input[type="text"],
#affliatecontainer input[type="email"],
#affliatecontainer input[type="password"],
#affliatecontainer select,
#affliatecontainer textarea {
    background: #1a1a1a !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
}

/* ---- Feature Package ---- */
.feature-package-row {
    background-color: var(--color-bg-card) !important;
}

/* ---- Trends / Archive ---- */
.archive-trends-main h3,
.archive-trends-main p {
    color: var(--color-text-body) !important;
}
.trends-pagination li a,
.trends-pagination-current {
    color: var(--color-text-body) !important;
}
.trends-pagination {
    color: var(--color-text-heading) !important;
}

/* ---- Border resets for all divider/border elements ---- */
.affliatetable > thead > tr > th {
    border-bottom-color: rgba(255, 255, 255, 0.15) !important;
}

/* ---- Images — prevent blowout ---- */
#affliatecontainer img {
    max-width: 100%;
    height: auto;
}

/* =========================================
   Sports Menu — Tab bar + mobile dropdown
   ========================================= */
.sports-menu-container {
    margin-bottom: 24px;
}

/* Desktop tabs */
.sports-menu--desktop {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}
.sports-menu--desktop::-webkit-scrollbar {
    display: none;
}

.sport-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 20px;
    font-family: var(--font-heading);
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--color-text-body) !important;
    background: var(--color-bg-card);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 6px;
    white-space: nowrap;
    transition: all 0.2s ease;
}
.sport-tab:hover {
    color: var(--color-text-heading) !important;
    border-color: rgba(255, 255, 255, 0.2);
    filter: none;
    text-decoration: none !important;
}
.sport-tab.active {
    color: #000 !important;
    background: var(--color-primary);
    border-color: var(--color-primary);
}

/* Mobile dropdown — hidden on desktop */
.sports-menu--mobile {
    display: none;
}
.sport-dropdown {
    width: 100%;
    padding: 12px 16px;
    font-family: var(--font-heading);
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--color-text-heading);
    background: var(--color-bg-card);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a0a0a0' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    cursor: pointer;
}
.sport-dropdown:focus {
    outline: none;
    border-color: var(--color-primary);
}

@media (max-width: 600px) {
    .sports-menu--desktop {
        display: none;
    }
    .sports-menu--mobile {
        display: block;
    }
}