/*
Theme Name: Casino Slot Poker
Theme URI: https://www.vbwebconsultant.com
Author: VB Web Consultant
Author URI: https://www.vbwebconsultant.com
Description: Custom review & business-directory theme for casino/poker review sites. Backend-selectable color palette, custom Business & Review post types, schema.org markup, and AdSense-ready layout.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: cspoker
*/

:root{
  --radius: 14px;
  --shadow: 0 20px 50px rgba(0,0,0,.35);
}

/* ---------- PALETTES (overridden inline by Customizer selection, see inc/customizer.php) ---------- */
body[data-theme="midnight-gold"]{ --bg:#0B0E14; --surface:#12151F; --surface2:#1A1F2E; --text:#ECEEF3; --muted:#99A1B3; --accent:#D4AF37; --accent2:#8C2F45; --border:rgba(255,255,255,.08); }
body[data-theme="emerald-felt"]{ --bg:#081512; --surface:#0E211C; --surface2:#143229; --text:#EAF3EE; --muted:#93AFA3; --accent:#C9A227; --accent2:#1F7A5C; --border:rgba(255,255,255,.08); }
body[data-theme="royal-purple"]{ --bg:#120A1F; --surface:#1B0F30; --surface2:#271641; --text:#F1ECFB; --muted:#A99BC4; --accent:#E3B23C; --accent2:#7C3AED; --border:rgba(255,255,255,.09); }
body[data-theme="vegas-neon"]{ --bg:#0A0A12; --surface:#12121D; --surface2:#191928; --text:#F5F5FF; --muted:#9797B3; --accent:#FF3D81; --accent2:#22D3EE; --border:rgba(255,255,255,.09); }
body[data-theme="ruby-noir"]{ --bg:#120608; --surface:#1D0B10; --surface2:#2A0F17; --text:#F5E9EA; --muted:#B08791; --accent:#E0B15C; --accent2:#C81D46; --border:rgba(255,255,255,.08); }
body[data-theme="sapphire-chip"]{ --bg:#060B18; --surface:#0D1626; --surface2:#142238; --text:#EAF1FF; --muted:#8FA3C4; --accent:#BFD7FF; --accent2:#2F6FED; --border:rgba(255,255,255,.08); }
body[data-theme="onyx-champagne"]{ --bg:#100E0C; --surface:#1A1714; --surface2:#24201B; --text:#F3EEE6; --muted:#A79C8C; --accent:#E6C89C; --accent2:#8A6F4E; --border:rgba(255,255,255,.08); }
body[data-theme="crimson-card"]{ --bg:#150707; --surface:#240D0D; --surface2:#331313; --text:#F6E9E7; --muted:#B8918D; --accent:#F2C14E; --accent2:#B3172B; --border:rgba(255,255,255,.08); }
body[data-theme="platinum-ice"]{ --bg:#F4F6F9; --surface:#FFFFFF; --surface2:#EDF1F6; --text:#16202E; --muted:#5B6B80; --accent:#1D3A6E; --accent2:#C9A227; --border:rgba(16,32,48,.1); }
body[data-theme="jade-jackpot"]{ --bg:#061512; --surface:#0B241E; --surface2:#113328; --text:#E9F5F0; --muted:#8FB3A6; --accent:#E8C468; --accent2:#12B886; --border:rgba(255,255,255,.08); }

*{box-sizing:border-box;}
body{ margin:0; background:var(--bg); color:var(--text); font-family:'Manrope',sans-serif; overflow-x:hidden; }
h1,h2,h3,.display{ font-family:'Fraunces',serif; letter-spacing:-.01em; margin:0; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.wrap{ max-width:1180px; margin:0 auto; padding:0 24px; }
.muted{ color:var(--muted); }
.btn{ display:inline-flex; align-items:center; gap:8px; padding:13px 24px; border-radius:999px; font-weight:700; font-size:.95rem; cursor:pointer; border:1px solid transparent; transition:transform .25s ease, box-shadow .25s ease; }
.btn-primary{ background:linear-gradient(135deg,var(--accent),color-mix(in srgb, var(--accent) 60%, white)); color:#141414; }
.btn-primary:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.28); }
.btn-ghost{ background:transparent; border-color:var(--border); color:var(--text); }
.btn-ghost:hover{ border-color:var(--accent); }

/* header */
.site-header{ position:sticky; top:0; z-index:40; background:color-mix(in srgb, var(--bg) 78%, transparent); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.site-header .wrap{ display:flex; align-items:center; justify-content:space-between; height:76px; }
.logo{ font-family:'Fraunces',serif; font-weight:700; font-size:1.35rem; display:flex; align-items:center; gap:10px; }
.logo-mark{ width:34px; height:34px; border-radius:50%; background:conic-gradient(from 210deg, var(--accent), var(--accent2), var(--accent)); box-shadow:0 0 0 3px var(--surface2), 0 0 20px color-mix(in srgb, var(--accent) 50%, transparent); }
.main-nav ul{ display:flex; gap:32px; list-style:none; margin:0; padding:0; }
.main-nav a{ font-weight:600; font-size:.95rem; color:var(--muted); }
.main-nav a:hover{ color:var(--text); }
.header-actions{ display:flex; gap:10px; }

/* hero */
.hero{ position:relative; padding:100px 0 80px; overflow:hidden; }
.hero .wrap{ display:grid; grid-template-columns:1.1fr .9fr; gap:60px; align-items:center; }
.hero-copy h1{ font-size:clamp(2.4rem,4.6vw,3.6rem); line-height:1.08; font-weight:600; }
.hero-copy p{ margin-top:22px; font-size:1.1rem; line-height:1.65; color:var(--muted); max-width:46ch; }
.hero-cta{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; }
.hero-stats{ display:flex; gap:40px; margin-top:52px; }
.hero-stats div strong{ display:block; font-family:'Fraunces',serif; font-size:1.7rem; }
.hero-stats div span{ font-size:.85rem; color:var(--muted); }
.hero-visual{ position:relative; height:420px; }
.chip-orbit{ position:absolute; inset:0; perspective:1000px; }
.chip{ position:absolute; width:150px; height:150px; border-radius:50%; top:50%; left:50%; margin:-75px 0 0 -75px; background:radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--accent) 85%, white), var(--accent) 55%, var(--accent2) 100%); border:6px dashed color-mix(in srgb, var(--bg) 55%, white 10%); box-shadow:var(--shadow), inset 0 0 0 10px color-mix(in srgb, var(--bg) 40%, transparent); animation:orbitSpin 14s linear infinite; transform-style:preserve-3d; }
.chip.c2{ width:110px; height:110px; margin:-55px 0 0 -55px; animation-duration:20s; animation-direction:reverse; opacity:.85; transform:translate(120px,-90px); }
.chip.c3{ width:80px; height:80px; margin:-40px 0 0 -40px; animation-duration:11s; opacity:.7; transform:translate(-110px,110px); }
@keyframes orbitSpin{ 0%{ transform:translate(0,0) rotateY(0deg) rotateX(8deg); } 100%{ transform:translate(0,0) rotateY(360deg) rotateX(8deg); } }
.hero-card{ position:absolute; right:8%; bottom:6%; width:190px; padding:18px; border-radius:16px; background:color-mix(in srgb, var(--surface) 88%, transparent); border:1px solid var(--border); backdrop-filter:blur(10px); box-shadow:var(--shadow); transition:transform .15s ease-out; }
.hero-card .stars{ color:var(--accent); letter-spacing:2px; }

/* sections */
.section{ padding:88px 0; }
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:44px; gap:20px; flex-wrap:wrap; }
.section-head h2{ font-size:clamp(1.6rem,3vw,2.2rem); font-weight:600; }
.section-head p{ color:var(--muted); margin-top:8px; max-width:52ch; }
.view-all{ font-weight:700; border-bottom:2px solid var(--accent); padding-bottom:2px; white-space:nowrap; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }

/* business cards */
.biz-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; transition:transform .35s cubic-bezier(.2,.8,.2,1), box-shadow .35s ease; transform-style:preserve-3d; will-change:transform; }
.biz-card:hover{ box-shadow:var(--shadow); }
.biz-media{ height:150px; background:var(--surface2) center/cover no-repeat; display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; font-size:1.4rem; color:var(--muted); }
.biz-body{ padding:20px; }
.biz-body h3{ font-size:1.05rem; font-weight:600; }
.rating-row{ display:flex; align-items:center; gap:8px; margin-top:10px; font-size:.85rem; }
.stars{ color:var(--accent); letter-spacing:2px; }
.badge{ display:inline-block; margin-top:14px; padding:5px 12px; border-radius:999px; font-size:.72rem; font-weight:700; background:color-mix(in srgb, var(--accent) 18%, transparent); color:var(--accent); }

/* reviews */
.review-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:22px; }
.review-top{ display:flex; align-items:center; gap:12px; }
.avatar{ width:38px; height:38px; border-radius:50%; background:linear-gradient(135deg,var(--accent),var(--accent2)); }
.review-card h4{ font-size:.98rem; margin-top:14px; }
.review-card p{ color:var(--muted); font-size:.9rem; margin-top:6px; line-height:1.55; }
.review-form{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:28px; margin-top:40px; }
.review-form label{ display:block; font-size:.85rem; margin-bottom:6px; color:var(--muted); }
.review-form input, .review-form textarea, .review-form select{ width:100%; padding:12px 14px; border-radius:10px; border:1px solid var(--border); background:var(--bg); color:var(--text); margin-bottom:16px; font-family:inherit; }
.rating-picker{ display:flex; gap:6px; margin-bottom:16px; }
.rating-picker input{ display:none; }
.rating-picker label{ font-size:1.6rem; color:var(--border); cursor:pointer; margin:0; }
.rating-picker input:checked ~ label, .rating-picker label:hover, .rating-picker label:hover ~ label{ color:var(--accent); }

/* blog */
.blog-card{ border-radius:var(--radius); overflow:hidden; background:var(--surface); border:1px solid var(--border); transition:transform .3s ease; }
.blog-card:hover{ transform:translateY(-6px); }
.blog-media{ height:170px; background:var(--surface2) center/cover no-repeat; }
.blog-body{ padding:18px 20px 22px; }
.blog-body span{ font-size:.75rem; color:var(--accent); font-weight:700; }
.blog-body h3{ font-size:1.02rem; margin-top:8px; font-weight:600; line-height:1.4; }
.blog-body p{ color:var(--muted); font-size:.86rem; margin-top:8px; }

/* ad slots (AdSense-ready containers; leave empty until ad code/plugin is added) */
.ad-slot{ margin:40px auto; text-align:center; min-height:90px; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:.75rem; border:1px dashed var(--border); border-radius:10px; }

/* footer */
.site-footer{ border-top:1px solid var(--border); padding:70px 0 0; margin-top:60px; }
.footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:50px; }
.site-footer h4{ font-size:.95rem; margin-bottom:16px; }
.site-footer ul{ list-style:none; display:grid; gap:10px; margin:0; padding:0; }
.site-footer ul a{ color:var(--muted); font-size:.9rem; }
.site-footer ul a:hover{ color:var(--accent); }
.social-row{ display:flex; gap:10px; margin-top:16px; }
.social-row a{ width:34px; height:34px; border-radius:50%; border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:.85rem; }
.bottom-bar{ border-top:1px solid var(--border); padding:22px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.85rem; color:var(--muted); }
.bottom-bar a{ font-weight:700; color:var(--text); }
.bottom-bar a:hover{ color:var(--accent); }

@media (max-width:900px){
  .hero .wrap{ grid-template-columns:1fr; }
  .hero-visual{ height:300px; margin-top:20px; }
  .grid-3{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .main-nav{ display:none; }
}
@media (max-width:560px){
  .grid-3{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce){
  .chip{ animation:none; }
  *{ transition:none !important; }
}