/*
Theme Name: JALALIVE 1.1.12 Modern
Theme URI: https://jalalive.example
Description: JALALIVE 1.1.12 functionality with a modern, clean Matchday UI.
Version: 1.1.12-modern
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
Author: Soco / Custom Modern Skin
Text Domain: jalalive
Tags: sports, streaming, football, live-score, modern
*/

:root{
  --navy:#07111f;
  --navy-2:#0d1b2e;
  --blue:#1769ff;
  --cyan:#19d3ff;
  --orange:#ff9f43;
  --red:#ff4d5a;
  --bg:#f4f7fb;
  --card:#fff;
  --text:#102033;
  --muted:#64748b;
  --line:#e4eaf2;
  --radius:20px;
  --wrap:1480px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.6;
}
body.dark{background:var(--bg);color:var(--text)}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto}
.container{width:min(var(--wrap),calc(100% - 40px));margin:auto}

/* Modern header */
header[data-jala-header]{
  position:sticky!important;top:0;z-index:100;
  background:rgba(7,17,31,.95)!important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
}
header[data-jala-header] > div:first-child{max-width:1500px!important;width:calc(100% - 36px)!important;margin:auto!important}
header[data-jala-header] .h-16{height:76px!important}
header[data-jala-header] nav{gap:2px!important;flex:1 1 auto!important;justify-content:center!important;overflow:visible!important}
header[data-jala-header] nav a{
  color:#dce7f5!important;font-size:13.5px!important;font-weight:700!important;
  padding:9px 9px!important;border-radius:10px;white-space:nowrap;
  transition:.2s;
}
header[data-jala-header] nav a:hover,
header[data-jala-header] nav a[aria-current="page"]{
  color:#fff!important;background:rgba(255,255,255,.07);
}
header[data-jala-header] .text-\[\#FACC15\]{color:var(--cyan)!important}
header[data-jala-header] .bg-\[\#FACC15\]{background:var(--orange)!important}
header[data-jala-header] .hover\:border-\[\#FACC15\]\/40:hover{border-color:rgba(25,211,255,.4)!important}

/* Give the existing JALALIVE header a clean logo treatment */
header[data-jala-header] img{max-height:40px!important;width:auto!important}
header[data-jala-header] .max-w-7xl{max-width:1500px!important;width:calc(100% - 36px)!important}
header[data-jala-header] .max-w-7xl > .flex{gap:16px!important}
header[data-jala-header] nav[data-jala-desktop]{white-space:nowrap!important;min-width:0!important}
header[data-jala-header] nav[data-jala-desktop] a{flex:0 0 auto!important}
@media(min-width:1200px){
  header[data-jala-header] nav[data-jala-desktop] a{padding-left:8px!important;padding-right:8px!important;font-size:13px!important}
}

/* Main shell */
.min-h-screen{min-height:100vh}
main.flex-1.pt-16{padding-top:0!important}

/* Home hero */
.jala-modern-hero{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(circle at 85% 20%,rgba(25,211,255,.22),transparent 28%),
    radial-gradient(circle at 10% 80%,rgba(23,105,255,.24),transparent 30%),
    linear-gradient(135deg,var(--navy),var(--navy-2));
  padding:82px 0 65px;
}
.jala-modern-hero:after{
  content:"";position:absolute;left:-5%;right:-5%;bottom:-75px;height:130px;
  background:var(--bg);transform:rotate(-2deg);
}
.jala-hero-grid{
  width:min(var(--wrap),calc(100% - 40px));margin:auto;
  position:relative;z-index:2;display:grid;grid-template-columns:1.2fr .8fr;
  gap:48px;align-items:center;
}
.jala-eyebrow{display:inline-flex;align-items:center;gap:9px;color:var(--cyan);font-weight:900;font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.jala-live-dot{width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 0 7px rgba(255,77,90,.12)}
.jala-modern-hero h1{font-size:clamp(42px,6vw,70px);line-height:.98;letter-spacing:-.055em;margin:18px 0}
.jala-modern-hero .hero-copy{color:#b9c8da;max-width:650px;font-size:17px}
.jala-hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.jala-btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 19px;border-radius:12px;font-weight:850}
.jala-btn-primary{background:var(--cyan);color:#06111f}
.jala-btn-secondary{border:1px solid rgba(255,255,255,.2);color:#fff;background:rgba(255,255,255,.05)}

.jala-hero-card{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);
  border-radius:24px;padding:22px;box-shadow:0 30px 70px rgba(0,0,0,.25)
}
.jala-hero-card-title{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:#9fb2c9;font-weight:800;margin-bottom:14px}
.jala-hero-match{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.1)}
.jala-hero-match:last-child{border-bottom:0}
.jala-hero-team{font-weight:800}
.jala-hero-time{font-size:13px;color:var(--cyan);font-weight:800}

/* Home content */
.jala-home-wrap{width:min(var(--wrap),calc(100% - 40px));margin:auto}
.jala-stats{
  position:relative;z-index:3;display:grid;grid-template-columns:repeat(4,1fr);
  gap:1px;background:var(--line);border:1px solid var(--line);
  border-radius:18px;overflow:hidden;box-shadow:0 16px 40px rgba(15,23,42,.07);
  margin-top:-12px;
}
.jala-stat{background:#fff;padding:22px;text-align:center}
.jala-stat strong{display:block;font-size:29px;letter-spacing:-.04em;color:var(--blue)}
.jala-stat span{font-size:12px;color:var(--muted);font-weight:750}
.jala-section{padding:72px 0}
.jala-section.alt{background:#fff}
.jala-section-head{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:28px}
.jala-kicker{font-size:12px;color:var(--blue);font-weight:900;text-transform:uppercase;letter-spacing:.1em}
.jala-section h2{font-size:clamp(28px,4vw,43px);line-height:1.05;letter-spacing:-.045em;margin:7px 0 0;color:var(--text)}
.jala-section-intro{color:var(--muted);max-width:570px;margin:0}

/* Existing dynamic match card, restyled */
.jala-modern-match{
  background:#fff!important;border:1px solid var(--line)!important;
  border-radius:18px!important;overflow:hidden!important;
  box-shadow:0 8px 24px rgba(15,23,42,.05);
  transition:.2s!important;
}
.jala-modern-match:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(15,23,42,.10)!important}
.jala-modern-match .jala-match-banner{height:190px;position:relative;overflow:hidden;background:#eaf0f7}
.jala-modern-match .jala-match-banner > div:first-child{filter:blur(0)!important;brightness(.82)!important}
.jala-modern-match .jala-match-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(7,17,31,.88),rgba(7,17,31,.08))}
.jala-modern-match .jala-match-body{position:absolute;inset:auto 0 0;padding:16px;color:#fff}
.jala-modern-match .jala-comp{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#cbd7e6;margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jala-modern-match .jala-teams{display:flex;align-items:center;justify-content:space-between;gap:12px}
.jala-modern-match .jala-team{display:flex;align-items:center;gap:8px;min-width:0;font-size:14px;font-weight:850}
.jala-modern-match .jala-team span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jala-modern-match .jala-team img{width:26px;height:26px;object-fit:contain;border-radius:50%;background:rgba(255,255,255,.12)}
.jala-modern-match .jala-score{font-size:21px;font-weight:950;color:var(--cyan);white-space:nowrap}
.jala-modern-match .jala-match-meta{display:flex;justify-content:space-between;gap:10px;padding:12px 15px;color:var(--muted);font-size:11px}
.jala-modern-match .jala-match-meta strong{color:var(--blue)}
.jala-status{position:absolute;top:12px;left:12px;padding:5px 9px;border-radius:999px;background:var(--red);color:#fff;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.jala-status.soon{background:var(--orange);color:#111827}
.jala-status.done{background:#e8edf3;color:#617083}
.jala-time-badge{position:absolute;top:12px;right:12px;padding:5px 9px;border-radius:999px;background:#fff;color:var(--text);font-size:10px;font-weight:900}

/* News */
.jala-news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.jala-modern-news{
  background:#fff!important;border:1px solid var(--line)!important;border-radius:18px!important;
  overflow:hidden!important;display:flex!important;flex-direction:column!important;
  transition:.2s!important;
}
.jala-modern-news:hover{transform:translateY(-3px);box-shadow:0 16px 35px rgba(15,23,42,.08)}
.jala-modern-news .jala-news-thumb{aspect-ratio:16/9;overflow:hidden;background:#eef2f7}
.jala-modern-news .jala-news-thumb img{width:100%;height:100%;object-fit:cover;transition:.25s}
.jala-modern-news:hover .jala-news-thumb img{transform:scale(1.025)}
.jala-modern-news .jala-news-content{padding:20px;display:flex;flex-direction:column;gap:8px;flex:1}
.jala-modern-news .jala-news-tag{display:inline-block;width:max-content;background:#edf3ff;color:var(--blue);font-size:10px;font-weight:900;text-transform:uppercase;padding:4px 9px;border-radius:999px}
.jala-modern-news h3{margin:0;color:var(--text);font-size:18px;line-height:1.25}
.jala-modern-news p{margin:0;color:var(--muted);font-size:13px}
.jala-modern-news .jala-news-date{margin-top:auto;color:#8a98aa;font-size:11px;padding-top:10px}

/* Generic modern content for existing source pages */
.seo-content,.jala-content{color:var(--text)!important}
.seo-content p,.jala-content p{color:#334155!important}
.seo-content h1,.seo-content h2,.seo-content h3,.seo-content h4,
.jala-content h1,.jala-content h2,.jala-content h3,.jala-content h4{color:var(--text)!important}
.jala-content a{color:var(--blue)!important}
.jala-content img{border-radius:14px}
.jala-modern-page-card{
  width:min(920px,calc(100% - 40px));margin:60px auto;background:#fff;
  border:1px solid var(--line);border-radius:22px;padding:38px;
  box-shadow:0 12px 35px rgba(15,23,42,.05)
}

/* Footer skin while retaining source footer data */
footer[data-jala-footer]{
  background:#050c15!important;color:#9fb0c4!important;border-top:0!important;margin-top:0!important
}
footer[data-jala-footer] .text-\[\#E5E5E5\]{color:#fff!important}
footer[data-jala-footer] .text-\[\#A3A3A3\]{color:#9fb0c4!important}
footer[data-jala-footer] a:hover{color:#fff!important}
footer[data-jala-footer] .footer-cms{max-width:1180px!important}

/* Hide the original dark utility look on common cards */
.jala-modern-surface{background:#fff!important;border-color:var(--line)!important;color:var(--text)!important}

/* Responsive */
@media(max-width:980px){
 .jala-hero-grid{grid-template-columns:1fr}
 .jala-stats{grid-template-columns:repeat(2,1fr)}
 .jala-news-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
 .container,.jala-home-wrap,.jala-hero-grid{width:min(100% - 28px,var(--wrap))}
 .jala-modern-hero{padding:65px 0 45px}
 .jala-modern-hero h1{font-size:43px}
 .jala-section{padding:55px 0}
 .jala-section-head{display:block}
 .jala-section-intro{margin-top:10px}
 .jala-news-grid{grid-template-columns:1fr}
 .jala-stats{grid-template-columns:repeat(2,1fr)}
 .jala-modern-page-card{width:calc(100% - 28px);padding:24px;margin:35px auto}
 header[data-jala-header] nav[data-jala-desktop]{display:none!important}
}

/* =========================================================
   JALALIVE MODERN CLARITY PACK
   High-contrast light data pages + deep-blue content cards
   ========================================================= */
:root{
  --clarity-blue:#1769ff;
  --clarity-blue-dark:#0b1f3a;
  --clarity-navy:#071a33;
  --clarity-bg:#f7f9fc;
  --clarity-white:#ffffff;
  --clarity-text:#10233f;
  --clarity-muted:#64748b;
  --clarity-line:#dbe4f0;
}

body{background:var(--clarity-bg)!important;color:var(--clarity-text)!important}
body.dark{background:var(--clarity-bg)!important;color:var(--clarity-text)!important}

/* Keep the top navigation dark, but make every control readable. */
header[data-jala-header]{background:#071426!important;border-bottom:1px solid #18304d!important}
header[data-jala-header] nav a{color:#dbe8f7!important}
header[data-jala-header] nav a:hover,
header[data-jala-header] nav a[aria-current="page"]{background:#15345c!important;color:#fff!important}
header[data-jala-header] .text-\[\#FACC15\]{color:#4da3ff!important}
header[data-jala-header] .bg-\[\#FACC15\]{background:#1769ff!important;color:#fff!important}

/* Breadcrumb */
body .border-b.border-\[\#1F1F1F\].bg-\[\#0A0A0A\]{background:#fff!important;border-color:#e2e8f0!important}
body .border-b.border-\[\#1F1F1F\].bg-\[\#0A0A0A\] a{color:#64748b!important}
body .border-b.border-\[\#1F1F1F\].bg-\[\#0A0A0A\] a:hover{color:#1769ff!important}
body .border-b.border-\[\#1F1F1F\].bg-\[\#0A0A0A\] [aria-current="page"]{color:#1769ff!important}

/* Data page shell */
body .max-w-7xl.mx-auto.px-4.sm\:px-6.py-8{color:var(--clarity-text)!important}
body .max-w-7xl.mx-auto.px-4.sm\:px-6.py-8 > *{color:var(--clarity-text)}

/* Sport tabs */
body .bg-\[\#111111\].border.border-\[\#262626\].rounded-lg.p-1{
  background:#fff!important;border-color:#dbe4f0!important;box-shadow:0 5px 18px rgba(15,35,65,.06)
}
body .bg-\[\#111111\].border.border-\[\#262626\].rounded-lg.p-1 a{color:#51657f!important}
body .bg-\[\#111111\].border.border-\[\#262626\].rounded-lg.p-1 a.bg-\[\#FACC15\]{background:#1769ff!important;color:#fff!important}

/* Page title / competition header */
body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4{
  background:transparent!important
}
body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4 h1{
  color:#10233f!important;font-size:30px!important;font-weight:850!important;letter-spacing:-.03em!important
}
body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4 p{color:#64748b!important}
body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4 .w-10.h-10{
  background:#eef5ff!important;border:1px solid #bcd4ff!important
}
body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4 .text-\[\#FACC15\]{color:#1769ff!important}

/* Competition dropdown */
body [data-jala-combo] > button{
  background:#1769ff!important;border:1px solid #1769ff!important;color:#fff!important;
  border-radius:12px!important;min-height:48px!important;box-shadow:0 7px 18px rgba(23,105,255,.18)
}
body [data-jala-combo] > button svg{color:#fff!important}
body [data-jala-combo-panel]{
  background:#fff!important;border-color:#cdd9e8!important;color:#10233f!important;
  box-shadow:0 18px 45px rgba(15,35,65,.16)!important
}
body [data-jala-combo-panel] input{
  background:#f7f9fc!important;border-color:#dbe4f0!important;color:#10233f!important
}
body [data-jala-combo-panel] a{color:#415773!important}
body [data-jala-combo-panel] a:hover,
body [data-jala-combo-panel] a.text-\[\#FACC15\]{background:#edf4ff!important;color:#1769ff!important}

/* League tabs: horizontal, bright and easy to read. */
body .bg-\[\#111111\].border.border-\[\#262626\].p-1.rounded-md.flex.gap-1{
  background:#fff!important;border:1px solid #cbd9ea!important;border-radius:16px!important;
  padding:4px!important;box-shadow:0 6px 20px rgba(15,35,65,.07)
}
body .bg-\[\#111111\].border.border-\[\#262626\].p-1.rounded-md.flex.gap-1 a{
  color:#405672!important;border-radius:12px!important;font-weight:750!important
}
body .bg-\[\#111111\].border.border-\[\#262626\].p-1.rounded-md.flex.gap-1 a:hover{
  color:#1769ff!important;background:#eef5ff!important
}
body .bg-\[\#111111\].border.border-\[\#262626\].p-1.rounded-md.flex.gap-1 a.bg-\[\#FACC15\]{
  background:#1769ff!important;color:#fff!important;box-shadow:0 5px 12px rgba(23,105,255,.2)
}

/* Empty-state panel */
body [data-jala-refresh-zone="topskor"] > .text-center{
  background:#f3f8ff!important;border:1px dashed #73a9ff!important;border-radius:18px!important;
  color:#334e6f!important;font-size:16px!important;font-weight:600!important;
  min-height:165px;display:flex;align-items:center;justify-content:center;padding:40px 20px!important;
  box-shadow:inset 0 0 0 1px rgba(23,105,255,.04)
}

/* SEO / article content: dark navy card with white text for maximum contrast. */
.seo-content,.jala-content{
  color:#f4f8ff!important;background:#0a1d36!important
}
.seo-content p,.jala-content p{color:#d9e6f5!important}
.seo-content h1,.seo-content h2,.seo-content h3,.seo-content h4,
.jala-content h1,.jala-content h2,.jala-content h3,.jala-content h4{
  color:#fff!important
}
.seo-content strong,.jala-content strong{color:#fff!important}
.jala-content a{color:#5aa5ff!important}
.jala-content a:hover{color:#8bc2ff!important}

/* Content-with-TOC card */
body [data-jala-toc-section]{
  background:#0a1d36!important;border:1px solid #193a62!important;border-radius:20px!important;
  box-shadow:0 14px 38px rgba(7,26,51,.12)!important
}
body [data-jala-toc-wrap]{background:#071a33!important;border-color:#193a62!important}
body [data-jala-toc-wrap] h3{color:#fff!important}
body [data-jala-toc-wrap] .text-\[\#FACC15\]{color:#4da3ff!important}

/* Generic dark Tailwind cards on light pages: improve contrast without touching functionality. */
body .bg-\[\#111111\].border.border-\[\#262626\].rounded-xl,
body .bg-\[\#111111\].border.border-\[\#262626\].rounded-2xl{
  background:#0a1d36!important;border-color:#193a62!important;color:#fff!important
}

@media(max-width:760px){
  body .flex.flex-col.sm\:flex-row.sm\:items-center.justify-between.gap-4 h1{font-size:25px!important}
  body [data-jala-combo] > button{width:100%!important}
  body .bg-\[\#111111\].border.border-\[\#262626\].p-1.rounded-md.flex.gap-1 a{flex:0 0 auto!important}
}