/*
Theme Name: Chess Ludo Betting Theme
Theme URI: https://example.com
Author: Chess Ludo Betting
Author URI: https://example.com
Description: Dark chess.com-inspired theme for Chess & Ludo Betting plugin. Dark background, green accents, cream text — optimized for gaming platforms.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chess-ludo-theme
Tags: dark, gaming, chess, betting, one-page, custom-menu
*/

/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { background: #1f1d1a; color: #d4d0cc; font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; font-size: 16px; line-height: 1.6; min-height: 100vh; }
img { max-width: 100%; height: auto; display: block; }
a { color: #769656; text-decoration: none; transition: color .2s; }
a:hover { color: #8fb76c; }
p { margin-bottom: 1em; color: #b8b4b0; }
h1,h2,h3,h4,h5,h6 { color: #EEEED2; font-weight: 700; line-height: 1.3; margin-bottom: 0.5em; }
ul, ol { padding-left: 1.5em; }
button { cursor: pointer; font-family: inherit; }
input, select, textarea { font-family: inherit; }

/* ===== HEADER ===== */
#clb-site-header { background: #262421; border-bottom: 1px solid #3a3734; position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 8px rgba(0,0,0,0.4); }
.clb-header-inner { max-width: 1200px; margin: 0 auto; padding: 0 20px; display: flex; align-items: center; height: 60px; gap: 20px; }
.clb-site-logo { display: flex; align-items: center; gap: 10px; font-weight: 800; font-size: 1.2rem; color: #EEEED2; white-space: nowrap; }
.clb-logo-icon { font-size: 1.6rem; }
.clb-nav { display: flex; align-items: center; gap: 4px; flex: 1; }
.clb-nav a { color: #d4d0cc; padding: 6px 14px; border-radius: 6px; font-size: .9rem; font-weight: 500; transition: all .2s; white-space: nowrap; }
.clb-nav a:hover, .clb-nav a.current-menu-item { background: rgba(118,150,86,0.15); color: #EEEED2; }
.clb-nav a.current-menu-item { color: #769656; }
.clb-header-right { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.clb-balance-chip { background: rgba(118,150,86,0.15); border: 1px solid #769656; color: #769656; padding: 4px 12px; border-radius: 20px; font-size: .85rem; font-weight: 600; white-space: nowrap; }
.clb-user-chip { display: flex; align-items: center; gap: 8px; background: #302E2B; border: 1px solid #3a3734; padding: 4px 12px 4px 8px; border-radius: 20px; }
.clb-user-chip img { width: 24px; height: 24px; border-radius: 50%; object-fit: cover; }
.clb-header-logout-btn { background: rgba(200,60,60,0.15); border: 1px solid #c0392b; color: #e05555; padding: 5px 14px; border-radius: 20px; font-size: .82rem; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .2s,color .2s; }
.clb-header-logout-btn:hover { background: #c0392b; color: #fff; }
.clb-header-login-btn { background: rgba(118,150,86,0.15); border: 1px solid #769656; color: #769656; padding: 5px 14px; border-radius: 20px; font-size: .82rem; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .2s,color .2s; }
.clb-header-login-btn:hover { background: #769656; color: #fff; }
.clb-header-chat-btn { position:relative; display:inline-flex; align-items:center; gap:4px; color:var(--clb-text-muted,#9a9693); font-size:1.1rem; text-decoration:none; padding:4px 8px; border-radius:20px; transition:color .2s; }
.clb-header-chat-btn:hover { color:#EEEED2; }
.clb-header-badge { position:absolute; top:-4px; right:-4px; background:#e74c3c; color:#fff; font-size:.65rem; font-weight:700; min-width:16px; height:16px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; padding:0 3px; line-height:1; pointer-events:none; }
.clb-hamburger { display: none; background: none; border: 1px solid #3a3734; color: #d4d0cc; padding: 6px 10px; border-radius: 6px; font-size: 1.1rem; }

/* ===== NAVIGATION MENU ===== */
#site-navigation ul { list-style: none; padding: 0; margin: 0; display: flex; gap: 4px; }
#site-navigation ul li { position: relative; }
#site-navigation ul li ul { display: none; position: absolute; top: 100%; left: 0; background: #262421; border: 1px solid #3a3734; border-radius: 8px; min-width: 180px; padding: 6px 0; box-shadow: 0 8px 24px rgba(0,0,0,0.4); z-index: 100; }
#site-navigation ul li:hover > ul { display: block; }
#site-navigation ul li ul li a { padding: 8px 14px; display: block; }
#site-navigation ul li ul li a:hover { background: rgba(118,150,86,0.1); }

/* ===== MAIN CONTENT ===== */
#clb-main { min-height: calc(100vh - 120px); padding: 20px 0 40px; }
.entry-content { max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.site-content { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ===== FOOTER ===== */
#clb-site-footer { background: #151412; border-top: 1px solid #2a2825; padding: 30px 20px; margin-top: 40px; }
.clb-footer-inner { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr auto; gap: 20px; align-items: center; }
.clb-footer-logo { font-size: 1.1rem; font-weight: 700; color: #EEEED2; display: flex; align-items: center; gap: 8px; }
.clb-footer-links { display: flex; gap: 20px; flex-wrap: wrap; }
.clb-footer-links a { color: #888; font-size: .85rem; }
.clb-footer-links a:hover { color: #769656; }
.clb-footer-copy { color: #555; font-size: .8rem; margin-top: 16px; text-align: center; padding-top: 16px; border-top: 1px solid #2a2825; }

/* ===== WIDGETS ===== */
.widget { background: #262421; border: 1px solid #3a3734; border-radius: 10px; padding: 20px; margin-bottom: 16px; }
.widget-title { color: #EEEED2; font-size: 1rem; font-weight: 600; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #3a3734; }
.widget ul { list-style: none; padding: 0; }
.widget ul li { padding: 4px 0; border-bottom: 1px solid #2a2825; }
.widget ul li a { color: #b8b4b0; font-size: .9rem; }
.widget ul li a:hover { color: #769656; }

/* ===== WP ALIGNMENTS ===== */
.alignleft { float: left; margin: 0 20px 10px 0; }
.alignright { float: right; margin: 0 0 10px 20px; }
.aligncenter { margin: 0 auto 10px; text-align: center; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: .85rem; color: #888; text-align: center; }

/* ===== CHESS BOARD PATTERN HERO ===== */
.clb-hero { background: linear-gradient(135deg, #1f1d1a 0%, #302E2B 50%, #1a1816 100%); padding: 60px 20px; text-align: center; position: relative; overflow: hidden; }
.clb-hero::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: repeating-conic-gradient(rgba(118,150,86,0.05) 0% 25%, transparent 0% 50%); background-size: 40px 40px; pointer-events: none; }
.clb-hero h1 { font-size: 2.5rem; color: #EEEED2; position: relative; margin-bottom: 12px; }
.clb-hero p { font-size: 1.1rem; color: #b8b4b0; position: relative; margin-bottom: 24px; }
.clb-hero .clb-cta-wrap { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; position: relative; }
.clb-btn-hero { background: #769656; color: #fff; padding: 14px 32px; border-radius: 8px; font-weight: 700; font-size: 1rem; transition: all .2s; }
.clb-btn-hero:hover { background: #8fb76c; color: #fff; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(118,150,86,0.4); }
.clb-btn-hero-outline { background: transparent; color: #769656; padding: 14px 32px; border-radius: 8px; font-weight: 700; font-size: 1rem; border: 2px solid #769656; transition: all .2s; }
.clb-btn-hero-outline:hover { background: #769656; color: #fff; }

/* ===== PAGE TITLES ===== */
.page-title, .entry-title { font-size: 1.6rem; color: #EEEED2; margin-bottom: 20px; padding-bottom: 12px; border-bottom: 2px solid #3a3734; }

/* ===== RESPONSIVE ===== */
@media (max-width: 768px) {
  .clb-hamburger { display: block; }
  .clb-nav { display: none; position: absolute; top: 60px; left: 0; right: 0; background: #262421; border-bottom: 1px solid #3a3734; padding: 12px; flex-direction: column; gap: 4px; }
  .clb-nav.open { display: flex; }
  .clb-nav a { padding: 10px 14px; }
  #site-navigation ul { flex-direction: column; }
  #site-navigation ul li ul { position: static; box-shadow: none; border: none; border-radius: 0; padding-left: 12px; }
  .clb-hero h1 { font-size: 1.8rem; }
  .clb-footer-inner { grid-template-columns: 1fr; text-align: center; }
  .clb-footer-links { justify-content: center; }
  .clb-balance-chip { display: none; }
}