/* SURIN V18 — refined sport-institution identity.
   Cosmetic only. Deep aubergine + heritage emerald, restrained brass detail.
   Deliberately avoids neon, candy gradients, large soft chips and dark full-page panels. */
:root{
 --sl-plum:#302143;
 --sl-plum-strong:#251832;
 --sl-plum-soft:#f6f3f8;
 --sl-green:#17634f;
 --sl-green-strong:#104b3d;
 --sl-green-soft:#eef5f1;
 --sl-brass:#aa8f62;
 --sl-ink:#243244;
 --sl-muted:#697787;
 --sl-line:#e3e6e9;
 --sl-paper:#ffffff;
 --surin-purple:#302143;
 --surin-purple-strong:#251832;
 --surin-green:#17634f;
 --surin-green-strong:#104b3d;
 --surin-purple-soft:#f6f3f8;
 --surin-green-soft:#eef5f1;
}
/* Global typographic rhythm: dense, clear, capable of handling long Thai labels. */
body.public-site,body.admin-body,body.user-body{
 color:var(--sl-ink);
 font-family:"Noto Sans Thai",Tahoma,Arial,sans-serif;
 -webkit-font-smoothing:antialiased;
}
html body.public-site.hybrid-navigation.page-index,
html body.public-site.hybrid-navigation.page-index .page-content,
html body.public-site.hybrid-navigation.page-index .page-content > section:not(.premium-home-hero){
 background:#fff!important;background-image:none!important;
}
/* Header feels like an organized institution rather than a shopping/gaming site. */
html body.public-site.hybrid-navigation .topbar.public-premium-topbar{
 background:rgba(255,255,255,.97)!important;
 border:1px solid #e5e2e8!important;
 border-radius:19px!important;
 box-shadow:0 8px 28px rgba(30,28,46,.07)!important;
 -webkit-backdrop-filter:blur(14px)!important;
 backdrop-filter:blur(14px)!important;
}
body.public-site.hybrid-navigation .topbar.public-premium-topbar::before{
 background:linear-gradient(90deg,transparent,var(--sl-green),var(--sl-brass),var(--sl-plum),transparent)!important;
 height:1px!important;opacity:.8!important;
}
body.public-site.hybrid-navigation :is(.hybrid-brand-name strong,.mobile-topbar-brand strong){
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
 font-weight:800!important;letter-spacing:-.025em!important;
}
body.public-site.hybrid-navigation :is(.hybrid-main-nav>a,.hybrid-main-nav>details>summary){
 color:#344254!important;-webkit-text-fill-color:#344254!important;
 font-weight:700!important;border-radius:9px!important;
}
body.public-site.hybrid-navigation .hybrid-main-nav>.hybrid-nav-link.active,
body.public-site.hybrid-navigation .hybrid-main-nav>.hybrid-nav-group.active>summary,
body.public-site.hybrid-navigation .hybrid-main-nav>details[open]>summary{
 color:var(--sl-green-strong)!important;-webkit-text-fill-color:var(--sl-green-strong)!important;
 background:#eff6f2!important;border:1px solid #d5e8df!important;
 box-shadow:inset 0 -2px 0 var(--sl-green)!important;
}
body.public-site.hybrid-navigation .hybrid-main-nav>details:not(.active)>summary:hover,
body.public-site.hybrid-navigation .hybrid-main-nav>a:not(.active):hover{
 color:var(--sl-plum)!important;-webkit-text-fill-color:var(--sl-plum)!important;
 background:#f8f6fa!important;
}
body.public-site.hybrid-navigation .hybrid-dropdown,
body.public-site.hybrid-navigation .hybrid-account-dropdown{
 border:1px solid #e3dfe9!important;border-radius:13px!important;
 background:#fff!important;box-shadow:0 14px 32px rgba(31,23,45,.13)!important;
}
body.public-site.hybrid-navigation .hybrid-account>summary{
 background:var(--sl-green-strong)!important;
 border-color:var(--sl-green-strong)!important;border-radius:10px!important;
 color:#fff!important;-webkit-text-fill-color:#fff!important;
 box-shadow:0 6px 14px rgba(16,75,61,.14)!important;
}
/* Homepage: deliberately limit the emerald and plum to thin rules and concise calls to action. */
body.public-site.page-index .event-countdown{
 background:linear-gradient(105deg,#fff 0%,#fbfbfa 58%,#f7f6f9 100%)!important;
 border:1px solid #e4e5e8!important;border-radius:18px!important;
 box-shadow:0 12px 28px rgba(27,36,49,.045)!important;
}
body.public-site.page-index .event-countdown::before{
 background:linear-gradient(110deg,rgba(23,99,79,.035),transparent 45%,rgba(48,33,67,.038))!important;
 opacity:1!important;
}
body.public-site.page-index .event-countdown::after{
 width:112px!important;height:112px!important;right:16%!important;bottom:-77px!important;
 border:1px solid rgba(48,33,67,.07)!important;
 box-shadow:0 0 0 19px rgba(48,33,67,.02),0 0 0 46px rgba(23,99,79,.018)!important;
}
body.public-site.page-index .countdown-icon{
 background:var(--sl-green-soft)!important;color:var(--sl-green)!important;
 border:1px solid #d5e8de!important;border-radius:12px!important;
}
body.public-site.page-index .countdown-intro :is(small,strong){
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
}
body.public-site.page-index .countdown-intro small{
 letter-spacing:.11em!important;font-weight:800!important;color:var(--sl-green)!important;
 -webkit-text-fill-color:var(--sl-green)!important;
}
body.public-site.page-index .countdown-numbers>div{
 border:1px solid #e5e5e8!important;border-radius:10px!important;
 background:#fff!important;box-shadow:none!important;
}
body.public-site.page-index .countdown-numbers b{color:var(--sl-plum)!important;-webkit-text-fill-color:var(--sl-plum)!important;}
body.public-site.page-index .sport-hub-heading.sport-hub-hero-heading{
 background:linear-gradient(100deg,#f9fbfa 0%,#fff 60%,#f8f6fa 100%)!important;
 border:1px solid #e1e6e6!important;border-radius:17px!important;
 box-shadow:inset 4px 0 0 var(--sl-green),0 8px 25px rgba(27,36,49,.04)!important;
 padding:19px 25px!important;
}
body.public-site.page-index .sport-hub-heading.sport-hub-hero-heading::after{opacity:.2!important;filter:grayscale(1)!important;}
body.public-site.page-index .sport-hub-hero-heading h2{
 font-size:clamp(22px,2.05vw,28px)!important;font-weight:850!important;
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
 letter-spacing:-.02em!important;
}
body.public-site.page-index .sport-hub-hero-heading h2 span{
 color:var(--sl-green)!important;-webkit-text-fill-color:var(--sl-green)!important;
}
body.public-site.page-index .sport-hub-hero-heading .sport-hub-eyebrow{
 color:var(--sl-green)!important;-webkit-text-fill-color:var(--sl-green)!important;
 font-size:10px!important;letter-spacing:.12em!important;
}
/* Quick services: orderly, precise and subtle hover, not candy-color tiles. */
body.public-site.page-index .sport-hub-link{
 background:#fff!important;border:1px solid var(--sl-line)!important;
 border-radius:13px!important;box-shadow:0 7px 17px rgba(31,40,52,.038)!important;
 transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease!important;
}
body.public-site.page-index .sport-hub-link::before{
 height:3px!important;border-radius:3px 3px 0 0!important;
 background:var(--sl-green)!important;
}
body.public-site.page-index .sport-hub-link:is(.hub-schedule,.hub-result,.hub-news){--hub-accent:var(--sl-plum)!important;}
body.public-site.page-index .sport-hub-link:is(.hub-register,.hub-live,.hub-medal){--hub-accent:var(--sl-green)!important;}
body.public-site.page-index .sport-hub-link:is(.hub-schedule,.hub-result,.hub-news)::before{background:var(--sl-plum)!important;}
body.public-site.page-index .sport-hub-link .sport-hub-icon{
 border:1px solid #e6e6e9!important;border-radius:12px!important;
 background:#f7f8f8!important;color:var(--sl-green)!important;
}
body.public-site.page-index .sport-hub-link:is(.hub-schedule,.hub-result,.hub-news) .sport-hub-icon{
 color:var(--sl-plum)!important;background:#f7f6f9!important;
}
body.public-site.page-index .sport-hub-link .sport-hub-text strong{
 color:#24364b!important;-webkit-text-fill-color:#24364b!important;font-weight:800!important;
}
body.public-site.page-index .sport-hub-link .sport-hub-text small{
 color:#748090!important;-webkit-text-fill-color:#748090!important;
}
body.public-site.page-index .sport-hub-link:hover{
 transform:translateY(-2px)!important;box-shadow:0 13px 24px rgba(27,35,49,.09)!important;
 border-color:#cbd4d5!important;
}
/* Statistics: single consistent paper surface, controlled two-tone icon set. */
body.public-site.page-index .premium-kpi-grid .home-stat-card,
body.public-site.page-index .premium-kpi-grid .home-stat-card:nth-child(n){
 background:#fff!important;border:1px solid #e6e8ea!important;
 border-radius:13px!important;box-shadow:0 8px 20px rgba(30,37,47,.035)!important;
}
body.public-site.page-index .premium-kpi-grid .home-stat-card::after{display:none!important;}
body.public-site.page-index .premium-kpi-grid .home-stat-card .stat-icon{
 background:#f5f6f8!important;border:1px solid #e5e8eb!important;
 color:var(--sl-green)!important;border-radius:10px!important;
}
body.public-site.page-index .premium-kpi-grid .home-stat-card:nth-child(even) .stat-icon{color:var(--sl-plum)!important;background:#f8f6fa!important;}
body.public-site.page-index .premium-kpi-grid .home-stat-card strong{
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
}
/* Main content cards: separate white paper with fine hairlines instead of slab-like jewel bars. */
body.public-site.page-index :is(.premium-home-dashboard .premium-dashboard-card,.home-discovery-card,.home-youtube-card,.home-sports-network-card){
 background:#fff!important;border:1px solid #e3e6e9!important;
 border-radius:17px!important;box-shadow:0 12px 30px rgba(29,36,44,.055)!important;
 overflow:hidden;
}
body.public-site.page-index :is(.home-news-head,.live-dashboard-card .premium-card-head,.live-now-summary-card .premium-card-head,.home-latest-result-card .home-discovery-head,.home-upcoming-card .home-discovery-head){
 background:#fafbf9!important;
 border-bottom:1px solid #e3e6e8!important;
 box-shadow:inset 0 3px 0 var(--sl-green)!important;
 min-height:64px!important;
}
body.public-site.page-index :is(.home-news-head,.live-now-summary-card .premium-card-head,.home-upcoming-card .home-discovery-head){
 background:#faf9fb!important;box-shadow:inset 0 3px 0 var(--sl-plum)!important;
}
body.public-site.page-index :is(.home-news-head strong,.live-dashboard-card .premium-card-head strong,.live-now-summary-card .premium-card-head strong,.home-latest-result-card .home-discovery-head h2,.home-upcoming-card .home-discovery-head h2){
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
 font-weight:850!important;
}
body.public-site.page-index :is(.home-latest-result-card .home-discovery-head .home-discovery-kicker,.home-upcoming-card .home-discovery-head .home-discovery-kicker){
 color:var(--sl-green)!important;-webkit-text-fill-color:var(--sl-green)!important;
 letter-spacing:.10em!important;
}
body.public-site.page-index :is(.home-upcoming-card .home-discovery-head p,.home-latest-result-card .home-discovery-head p){
 color:#73808d!important;-webkit-text-fill-color:#73808d!important;opacity:1!important;
}
body.public-site.page-index :is(.home-news-actions>a,.home-primary-dashboard-grid .premium-card-head>a,.home-discovery-head>a){
 background:#fff!important;border:1px solid #dfe3e5!important;
 border-radius:9px!important;color:var(--sl-green-strong)!important;
 -webkit-text-fill-color:var(--sl-green-strong)!important;
 box-shadow:none!important;font-weight:800!important;
}
body.public-site.page-index :is(.home-news-actions>a,.home-primary-dashboard-grid .premium-card-head>a,.home-discovery-head>a):hover{
 background:#f0f6f2!important;border-color:#b9d5c6!important;
}
body.public-site.page-index .home-news-scroll-btn{
 background:#fff!important;color:var(--sl-plum)!important;
 -webkit-text-fill-color:var(--sl-plum)!important;border:1px solid #dfe3e5!important;
}
body.public-site.page-index :is(.premium-live-badge,.home-dashboard-empty,.home-discovery-empty){
 background:#f8faf9!important;color:var(--sl-ink)!important;
}
body.public-site.page-index .home-dashboard-empty strong,
body.public-site.page-index .home-discovery-empty strong{color:#304657!important;-webkit-text-fill-color:#304657!important;}
body.public-site.page-index .home-dashboard-empty p,
body.public-site.page-index .home-discovery-empty p{color:#788593!important;-webkit-text-fill-color:#788593!important;}
body.public-site.page-index .home-youtube-head,
body.public-site.page-index .home-sports-network-head{
 background:#fafbf9!important;border-bottom:1px solid #e5e8e8!important;
 box-shadow:inset 3px 0 0 var(--sl-plum)!important;
}
body.public-site.page-index .home-youtube-split-right .home-youtube-head{box-shadow:inset 3px 0 0 var(--sl-green)!important;}
/* Public interior pages maintain the same clear institutional style. */
body.public-site:not(.page-index) :is(.public-page-hero,.section-heading,.public-news-card,.public-page-card){
 border-color:#e3e6e8!important;
}
body.public-site:not(.page-index) .public-page-hero{
 background:linear-gradient(115deg,#fff,#fafbf9)!important;
 border-radius:16px!important;
 box-shadow:0 10px 28px rgba(30,38,49,.045)!important;
}
body.public-site:not(.page-index) :is(.section-title,.public-page-hero .section-title){
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
 font-weight:850!important;
}
body.public-site:not(.page-index) :is(.sport-facet-chip,.sport-filter,.sport-filter.active){border-radius:10px!important;}
body.public-site:not(.page-index) :is(.sport-facet-chip.is-active,.sport-filter.active,.sport-filter[aria-pressed="true"]){
 background:var(--sl-green-strong)!important;border-color:var(--sl-green-strong)!important;
 color:#fff!important;-webkit-text-fill-color:#fff!important;
}
/* All logged-in roles: aligned surfaces/controls; retain their current menu structure. */
body:is(.admin-body,.user-body) :is(.admin-panel,.user-panel){
 border:1px solid #e2e5e8!important;border-radius:15px!important;
 background:#fff!important;box-shadow:0 8px 24px rgba(27,36,48,.045)!important;
}
body:is(.admin-body,.user-body) :is(.admin-panel,.user-panel) :is(h1,h2){
 color:var(--sl-plum-strong)!important;-webkit-text-fill-color:var(--sl-plum-strong)!important;
}
body:is(.admin-body,.user-body) :is(.portal-nav-v4 a.active,.portal-nav-v4 [aria-current="page"]){
 background:var(--sl-green-soft)!important;border-color:#d6e7dd!important;
 color:var(--sl-green-strong)!important;-webkit-text-fill-color:var(--sl-green-strong)!important;
}
body:is(.admin-body,.user-body) :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
 border-color:#dce3e6!important;border-radius:9px!important;
}
body:is(.admin-body,.user-body) :is(input,select,textarea):focus{
 border-color:#91baa8!important;box-shadow:0 0 0 3px rgba(23,99,79,.10)!important;
}
/* High contrast footer and focus; do not override the configured footer content. */
body.public-site .site-footer{background:var(--sl-plum-strong)!important;}
body.public-site .site-footer :is(a,p,small,span){color:#e4e3e9!important;-webkit-text-fill-color:#e4e3e9!important;}
body.public-site .site-footer :is(strong,h2,h3){color:#e6d4a8!important;-webkit-text-fill-color:#e6d4a8!important;}
body.public-site :is(a,button,input,select,textarea):focus-visible,
body:is(.admin-body,.user-body) :is(a,button,input,select,textarea):focus-visible{
 outline:2px solid var(--sl-green)!important;outline-offset:3px!important;
}
/* Mobile: maintain 40+px hit targets, never hide labels/fields. */
@media(max-width:1100px){
 html body.public-site.hybrid-navigation .topbar.public-premium-topbar{
  border:0!important;border-bottom:1px solid #e2e4e7!important;
  border-radius:0!important;
 }
 body.public-site.hybrid-navigation .sidebar-toggle{
  background:var(--sl-plum)!important;border-color:var(--sl-plum)!important;
  box-shadow:0 4px 10px rgba(39,24,56,.13)!important;
 }
 body.public-site.hybrid-navigation .sidebar.premium-sidebar{
  background:#fff!important;box-shadow:12px 0 28px rgba(30,34,43,.12)!important;
 }
}
@media(max-width:640px){
 body.public-site.page-index .event-countdown{border-radius:15px!important;}
 body.public-site.page-index .sport-hub-heading.sport-hub-hero-heading{
  border-radius:14px!important;padding:15px!important;
  box-shadow:inset 3px 0 0 var(--sl-green)!important;
 }
 body.public-site.page-index .sport-hub-hero-heading h2{font-size:22px!important;}
 body.public-site.page-index :is(.home-news-head,.home-primary-dashboard-grid .premium-card-head,.home-discovery-card .home-discovery-head){min-height:54px!important;}
 body.public-site.page-index :is(.premium-home-dashboard .premium-dashboard-card,.home-discovery-card,.home-youtube-card,.home-sports-network-card){border-radius:13px!important;}
 body.public-site.page-index .sport-hub-link{border-radius:11px!important;}
 body.public-site.page-index :is(.home-news-actions>a,.home-primary-dashboard-grid .premium-card-head>a,.home-discovery-head>a){min-height:35px!important;}
}
@media(prefers-reduced-motion:reduce){body.public-site.page-index .sport-hub-link{transition:none!important;transform:none!important;}}