/* Floating glass navigation, with a clear active state and a compact mobile panel. */
.cp-menu-strokes{display:none}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header{background:transparent!important;border:1px solid transparent!important;border-radius:24px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;transition:background .3s ease,box-shadow .3s ease,border-color .3s ease,backdrop-filter .3s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible){background:linear-gradient(125deg,#f5fbfff2,#f0f9f6e6)!important;border-color:#ffffffd9!important;backdrop-filter:blur(24px) saturate(145%)!important;-webkit-backdrop-filter:blur(24px) saturate(145%)!important;box-shadow:0 8px 26px #173a521c,inset 0 1px 0 #fff!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-container{padding:9px 14px!important;gap:16px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-brand{gap:12px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .logo-container-brand{padding:5px 7px;border-radius:13px;background:#ffffff59;border:1px solid #ffffff85}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-subtitle{color:#4a7184!important;letter-spacing:.09em}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule{background:#ffffff45!important;border:1px solid #ffffff70!important;box-shadow:inset 0 1px 0 #fff9!important;padding:5px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link{color:#365164!important;font-size:12px!important;transition:color .2s ease,background .2s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link:hover{color:#153c50!important;background:#ffffff80}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule .cp-nav-indicator{background:linear-gradient(125deg,#21475f,#326f7a)!important;box-shadow:0 4px 12px #204c6133,inset 0 1px 0 #ffffff29!important;border:1px solid #ffffff38}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link.active{color:#fff!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule:not(.has-indicator) .cp-nav-link.active{background:linear-gradient(125deg,#21475f,#326f7a)!important;box-shadow:0 4px 12px #204c6126}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link.cp-nav-account{color:#204a65!important;border:1px solid #9fbdce8c;border-radius:100px;background:#ffffff70;margin-left:5px;font-weight:700}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link.cp-nav-account.active{color:#fff!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-aux-pill{background:#ffffff70!important;border-color:#ffffffbf!important;color:#38556b;box-shadow:inset 0 1px 0 #fff}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler{display:grid;place-items:center;padding:0!important;width:44px!important;height:44px!important;border:1px solid rgba(255,255,255,.45)!important;background:transparent!important;box-shadow:none!important;color:#fff!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler:is(:hover,:focus){background:rgba(255,255,255,.12)!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler>.bi{display:none}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-menu-strokes{display:flex;flex-direction:column;gap:6px;width:18px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-menu-strokes span{height:2px;width:18px;background:#fff;border-radius:2px;transition:transform .25s ease,background-color .25s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible) .btn-mobile-toggler{border-color:rgba(33,71,95,.3)!important;background:transparent!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible) .btn-mobile-toggler:is(:hover,:focus){background:rgba(33,71,95,.08)!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible) .cp-menu-strokes span{background:#21475f!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .btn-mobile-toggler[aria-expanded=true] .cp-menu-strokes span:first-child{transform:translateY(4px) rotate(45deg)}
html:not(.pbpi-mobile-app) .pbpi-public-page .btn-mobile-toggler[aria-expanded=true] .cp-menu-strokes span:last-child{transform:translateY(-4px) rotate(-45deg)}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse{padding:0 10px 10px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .mobile-nav-card{background:linear-gradient(145deg,#ffffffd9,#eaf5f2c9)!important;border:1px solid #ffffffdb!important;border-radius:20px!important;box-shadow:0 10px 24px #21475f12!important;max-height:calc(100dvh - 130px);overflow-y:auto;overscroll-behavior:contain}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .dropdown-item{font-size:13px!important;color:#24485a!important;border-radius:10px;padding:10px 12px!important;min-height:44px;white-space:normal;transition:background .2s ease,transform .2s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .dropdown-item:is(:hover,:focus-visible){background:#d1e9ed99!important;transform:translateX(3px)}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .navbar-nav{gap:2px!important}
@media(min-width:992px){html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler{display:none!important}}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header{border-radius:22px!important}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-container{padding:8px 10px!important;gap:8px}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-brand{gap:8px}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .logo-container-brand{padding:5px;border-radius:10px}}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler>.bi{display:none!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-subtitle{font-size:7px!important;letter-spacing:.02em;white-space:nowrap}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-text{min-width:0}}
@media(min-width:768px) and (max-width:1199.98px){html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule{display:none!important}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler{display:grid!important}html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse.show,html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse.collapsing{display:block!important}}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .mobile-nav-card{background:linear-gradient(145deg,rgba(249,253,255,.97),rgba(234,245,242,.95))!important;backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%)}


/* Editorial closing: spacious typography, direct contact, and a compact sitemap. */
.cp-footer-editorial{display:none}
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer{position:relative;isolation:isolate;overflow:hidden;padding:0!important;background:radial-gradient(ellipse at 95% 0,#245c60,transparent 55%),linear-gradient(130deg,#0a1e2b,#102e3b 65%,#183e43)!important;border-top:0!important;border-radius:36px 36px 0 0}
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer>.container-fluid,html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer>.cp-footer-main,html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer>.cp-footer-giant-watermark{display:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer::before{content:''!important;position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#0a1e2bf2 10%,#0a1e2b99 65%,#0a1e2bb3),url('../images/padel-cinematic-v1.jpg') right center/cover;opacity:.3!important;border:0!important;transform:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer::after{content:'';position:absolute;width:600px;height:600px;border:1px solid #bdded71a;border-radius:50%;right:-260px;top:-300px;z-index:-1;pointer-events:none;box-shadow:0 0 0 50px #bdded709,0 0 0 100px #bdded705;animation:cp-glass-orbit 26s ease-in-out infinite alternate;animation-play-state:paused}
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer.cp-in-view::after{animation-play-state:running}
html:not(.pbpi-mobile-app) .pbpi-public-page.cp-page-hidden .pbpi-footer::after{animation-play-state:paused!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial{display:block;max-width:1264px;margin:0 auto;padding:68px 32px 24px;color:#e8f2f1}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro{display:grid;grid-template-columns:minmax(0,1fr) 270px;align-items:center;gap:60px;padding-bottom:52px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-kicker{display:block;font-size:10px;font-weight:700;letter-spacing:.16em;color:#a7c8ce;margin-bottom:22px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial h2{color:#f5faf8!important;font-size:clamp(42px,5vw,68px)!important;line-height:1.08;letter-spacing:-.055em;font-weight:800;margin:0 0 22px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial h2 span{color:#b2d7d0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro p{color:#b7cbd2;font-size:14px;line-height:1.8;margin:0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect{display:flex;flex-direction:column;gap:12px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect>span{font-size:11px;color:#b7cbd2;margin-bottom:4px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;padding:15px 22px;border-radius:100px;font-size:13px;font-weight:700;text-decoration:none;transition:transform .25s ease,background .25s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-contact-primary{background:#e8f4ef;color:#16343f!important;box-shadow:0 8px 24px #0002}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-contact-social{background:linear-gradient(135deg,#ffffff14,#ffffff08);border:1px solid #d5ece83d;color:#e8f2f1!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect a span{font-size:19px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:40px;border-top:1px solid #c8dfdf26;padding:38px 0 36px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-brand{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-logo-shelf{display:flex;align-items:center;gap:14px;background:#eff6f1ed;padding:9px 13px;border-radius:13px;margin-bottom:4px;border:1px solid #fff6}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-logo-shelf img{width:auto;max-width:58px;height:38px;object-fit:contain}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-brand strong{font-size:14px;line-height:1.5;color:#e8f2f1}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-brand>span{font-size:10px;color:#a7c8ce}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-brand p{max-width:260px;color:#a7bdc8;font-size:12px;line-height:1.8;margin:0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav{display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links h3{font-size:12px!important;letter-spacing:.03em;color:#f1f8f7!important;margin:8px 0 12px;font-weight:700}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav a{font-size:12px;color:#b8cdd5!important;line-height:1.5;min-height:30px;text-decoration:none;padding:4px 0;transition:color .2s ease,translate .2s ease}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:22px;border-top:1px solid #c8dfdf26;font-size:10px;color:#8eabb8}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-bottom a{color:#b8cdd5!important;text-decoration:none;padding:8px 0}
@media(hover:hover){html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect a:hover{transform:translateY(-3px)}html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav a:hover{color:#fff!important;translate:3px 0}}
@media(max-width:991.98px){html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro{grid-template-columns:minmax(0,1fr) 230px;gap:24px}html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-brand{grid-column:1/-1}}
@media(max-width:767.98px){
html:not(.pbpi-mobile-app) .pbpi-public-page .pbpi-footer{border-radius:28px 28px 0 0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial{padding:40px 22px 20px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro{grid-template-columns:1fr;gap:26px;padding-bottom:30px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial h2{font-size:clamp(36px,10vw,44px)!important;line-height:1.12}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro p{font-size:13px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-intro p br{display:none}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-connect{gap:10px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 18px;padding:30px 0}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav a{min-height:40px;font-size:12px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav:last-child{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-links nav:last-child h3{grid-column:1/-1;margin-bottom:4px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-editorial-bottom{display:grid;grid-template-columns:1fr;gap:10px;font-size:10px}
}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-footer-logo-shelf img{content-visibility:visible}


/* Navigation v2: clear glass shell, compact identity, and an editorial mobile grid. */
.cp-mobile-menu-intro{display:none}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header{--cp-nav-account-color:#fff;background:transparent!important;padding:0!important;border-radius:20px!important;border:1px solid transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible){background:linear-gradient(120deg,#fcfffffa,#f3faf7f2)!important;border-color:#ffffffed!important;box-shadow:0 12px 32px #0c263322,inset 0 1px 0 #fff!important;backdrop-filter:blur(20px) saturate(145%)!important;-webkit-backdrop-filter:blur(20px) saturate(145%)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-container{padding:12px 18px!important;gap:20px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .logo-container-brand{padding:0;background:none;border:0;border-radius:0;gap:9px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-brand{gap:12px;flex-shrink:0}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-logo-primary{height:36px!important;max-width:48px;content-visibility:visible}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-logo-secondary{height:36px!important;max-width:120px;width:auto;content-visibility:visible;object-fit:contain}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-logo-divider{height:25px;background:#90abb34d}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-title{display:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-title-mobile{display:block!important;font-size:18px!important;font-weight:800;line-height:1.15;color:#142e3d;letter-spacing:-.02em}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-subtitle{font-size:8px!important;letter-spacing:.065em;white-space:nowrap;color:#62808d!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-right{gap:14px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule{background:transparent!important;border:0!important;box-shadow:none!important;padding:4px 0!important;gap:1px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link{font-size:12px!important;padding:10px 12px;color:#47616e!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link:hover{background:#d8e9e759;color:#183d51!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link.active{color:#14384a!important;background:transparent!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule:not(.has-indicator) .cp-nav-link.active{background:transparent!important;box-shadow:none!important;text-decoration:underline;text-underline-offset:10px}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-capsule .cp-nav-indicator{top:auto;bottom:2px;height:2px;border:0;border-radius:2px;background:linear-gradient(90deg,#24747d,#72afa4)!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-nav-link.cp-nav-account{padding:10px 20px;margin-left:10px;background:#173d50!important;border:1px solid #173d50!important;border-radius:12px;color:#fff!important;box-shadow:0 5px 12px #173d501a}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-aux-pill{background:transparent!important;border:1px solid #b8ced559!important;box-shadow:none;border-radius:10px;font-size:11px}
/* Teks navbar warna putih bersih tanpa shadow saat di posisi atas */
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) :is(.cp-brand-title-mobile,.cp-brand-title){color:#ffffff!important;text-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-brand-subtitle{color:rgba(255,255,255,.9)!important;text-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-logo-divider{background:rgba(255,255,255,.45)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-nav-link{color:rgba(255,255,255,.92)!important;font-weight:600!important;text-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-nav-link:hover{color:#ffffff!important;background:rgba(255,255,255,.18)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-nav-link.active{color:#ffffff!important;text-shadow:none!important;font-weight:700!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-aux-pill{color:#ffffff!important;border:1px solid rgba(255,255,255,.45)!important;background:rgba(0,0,0,.2)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);text-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-aux-pill :is(i,.bi,span,#translateBtnLabel){color:#ffffff!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-nav-link.cp-nav-account{background:rgba(23,61,80,.9)!important;border:1px solid rgba(255,255,255,.45)!important;color:#ffffff!important;box-shadow:0 4px 14px rgba(0,0,0,.35)!important;text-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header:not(.cp-header-scrolled):not(.is-scrolled):not(.scrolled-visible) .cp-nav-capsule .cp-nav-indicator{background:linear-gradient(90deg,#38bdf8,#4ade80)!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler{background:transparent!important;border-radius:13px!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse{top:calc(100% + 8px)!important;padding:0!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .mobile-nav-card{background:linear-gradient(130deg,#fcffff,#eef7f5)!important;border-radius:18px!important;border-color:#fff!important;padding:14px 12px!important;max-height:calc(100dvh - 100px)!important;box-shadow:0 16px 40px #092a3d2e!important}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-mobile-menu-intro{display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-mobile-menu-intro>span{font-size:7.5px;font-weight:700;letter-spacing:.12em;color:#5c8590}
html:not(.pbpi-mobile-app) .pbpi-public-page .cp-mobile-menu-intro>strong{font-size:18px;letter-spacing:-.03em;color:#143647;line-height:1.2}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .navbar-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .navbar-nav>li:first-child{grid-column:1/-1;margin-bottom:2px;gap:6px}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .navbar-nav>li.cp-nav-account-item{grid-column:1/-1;border-top:0!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .dropdown-item{display:flex!important;align-items:center;min-height:42px;font-size:11.5px!important;font-weight:600!important;padding:7px 10px!important;border:1px solid #cfdee373;border-radius:10px;background:#ffffffc4!important;color:#244b5b!important;height:100%;line-height:1.35;transform:none!important;white-space:normal}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .dropdown-item:is(:hover,:focus-visible){background:#dbeeea!important;border-color:#a5cbc7;transform:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .navbar-nav>li.cp-nav-account-item>a{background:#173d50!important;color:#fff!important;border:0;border-radius:10px!important;min-height:38px;display:grid;place-items:center;font-size:12px}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-container{padding:8px 14px!important;gap:8px}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-navbar-brand{gap:8px}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-logo-primary,html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-logo-secondary{height:25px!important;max-width:32px}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-title-mobile{font-size:14.5px!important}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .cp-brand-subtitle{font-size:6.5px!important;letter-spacing:.01em}html:not(.pbpi-mobile-app) .pbpi-public-page .public-header .btn-mobile-toggler{padding:6px 10px!important;border-radius:10px!important;min-height:34px!important}html:not(.pbpi-mobile-app) .pbpi-public-page #mobileNavCollapse .mobile-nav-card{padding:12px 10px!important}}

/* Shared surfaces for public content and account forms. Homepage keeps its scenic composition. */
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page){--cp-blue:#28687a;--cp-blue-gradient:linear-gradient(135deg,#367e88,#204b64);--cp-text-main:#173647;--cp-border:#d6e5e8;--bs-primary:#28687a;--bs-primary-rgb:40,104,122}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page){background:radial-gradient(ellipse at 0 15%,#cde5ef8c,transparent 45%),radial-gradient(ellipse at 100% 60%,#cce9df73,transparent 45%),#f4f8f7!important;color:#244352}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main{min-width:0}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.ocg-hero-section,.court-hero-section,.tournament-hero-section){background:linear-gradient(110deg,#0b2437e6,#164c56b3),url('../images/padel-cinematic-v1.jpg') center 52%/cover!important;border-radius:0 0 28px 28px;padding-top:clamp(88px, 10vw, 118px)!important;padding-bottom:clamp(26px, 4vw, 42px)!important;color:#eff8f6!important;overflow:hidden;isolation:isolate}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.ocg-hero-title,.court-hero-title,.tournament-hero-title){color:#f4faf7!important;letter-spacing:-.035em;line-height:1.2;font-weight:800;font-size:clamp(1.25rem, 3.2vw, 2.1rem)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.ocg-hero-subtitle,.court-hero-subtitle,.tournament-hero-subtitle){color:#cbdfdf!important;line-height:1.6;font-size:clamp(0.82rem, 1.6vw, 0.96rem)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.page-section,.court-content-section,.tournament-content-section){background:transparent!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .page-section{padding-top:120px!important;padding-bottom:60px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.card,.ocg-card,.court-card,.tournament-card,.pbpi-mission-card,.dispensasi-card,.club-card,.news-card){background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;border:1px solid #ffffffdb!important;border-radius:22px!important;box-shadow:0 12px 34px #1538490d,inset 0 1px 0 #fff!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.card,.ocg-card,.court-card,.tournament-card,.pbpi-mission-card,.dispensasi-card,.club-card,.news-card) :is(h2,h3,h4,h5,h6,.card-title){color:#173647!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main .text-muted{color:#617a87!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main .pbpi-icon{background:linear-gradient(135deg,#367e88,#204b64)!important;box-shadow:0 5px 14px #28687a26!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .profil-tab-wrapper{background:#eaf7f2b3!important;border:1px solid #fff!important;box-shadow:0 8px 22px #15384912!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .profil-tab-item{color:#285267!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .profil-tab-item.active{background:#285267!important;color:#fff!important}
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(.btn-primary,.cp-btn-blue){background:linear-gradient(135deg,#367e88,#204b64)!important;border-color:#346d7c!important;color:#fff!important}
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(.btn,.cp-btn-pill){transition:transform .22s ease,box-shadow .22s ease,background .22s ease}
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(.btn,.cp-btn-pill):active{transform:scale(.98)}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) :is(.form-control,.form-select,.input-group-text){background:#f9fdfbe8!important;border-color:#cadfe2!important;color:#234659!important;border-radius:12px;min-height:42px}
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(.form-control,.form-select):focus{border-color:#5eabb0!important;box-shadow:0 0 0 3px #54aaa921!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .table-responsive{border-radius:16px;border:1px solid #d6e5e8;overflow-x:auto}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) table{--bs-table-bg:transparent;--bs-table-color:#244352;--bs-table-border-color:#d6e5e8}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .page-link{color:#28687a;border-color:#d6e5e8}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .page-item.active .page-link{background:#28687a;border-color:#28687a;color:#fff}
html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(a,button,input,select,textarea):focus-visible{outline:3px solid #73b9be;outline-offset:3px}
html:not(.pbpi-mobile-app) .pbpi-auth-page{background:linear-gradient(115deg,#0b2437eb,#164c56bd),url('../images/padel-cinematic-v1.jpg') center/cover fixed!important}
html:not(.pbpi-mobile-app) .pbpi-auth-page :is(.cp-auth-video,.cp-auth-portal-backdrop,.cp-studio-grid,.cp-auth-ambient-glow){display:none!important}
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card{background:linear-gradient(130deg,#ffffffed,#edf7f2db)!important;border:1px solid #ffffffad!important;border-radius:28px!important;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 24px 60px #061d3a40!important}
.cp-theme-arrive{animation:cp-theme-arrive .65s cubic-bezier(.2,.7,.2,1) both}
@keyframes cp-theme-arrive{from{opacity:.6;translate:0 16px}to{opacity:1;translate:0 0}}
@media(hover:hover) and (pointer:fine){html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) :is(.btn,.cp-btn-pill):hover{transform:translateY(-2px);box-shadow:0 8px 20px #17445226}html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) :is(.court-card,.tournament-card,.pbpi-mission-card,.news-card):hover{box-shadow:0 18px 40px #1538491a!important}}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.ocg-hero-section,.court-hero-section,.tournament-hero-section){padding-top:108px!important;padding-bottom:34px!important;border-radius:0 0 24px 24px}html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) .page-section{padding-top:110px!important;padding-bottom:40px!important}html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.ocg-hero-title,.court-hero-title,.tournament-hero-title){font-size:clamp(28px,8vw,38px)!important}html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.card,.ocg-card,.court-card,.tournament-card,.pbpi-mission-card,.dispensasi-card){border-radius:18px!important}}
@media(prefers-reduced-motion:reduce){html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) *,html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) *::before,html:not(.pbpi-mobile-app) :is(.pbpi-public-page,.pbpi-auth-page) *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@keyframes cp-glass-orbit{from{transform:translate3d(0,0,0) scale(.96)}to{transform:translate3d(35px,28px,0) scale(1.05)}}
/* Ranking has separate legacy hero markup. */
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section{background:linear-gradient(110deg,#0b2437e6,#164c56b3),url('../images/padel-cinematic-v1.jpg') center 52%/cover!important;padding:142px 20px 52px!important;border-radius:0 0 32px 32px;isolation:isolate}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section::before{background:radial-gradient(ellipse at 85% 10%,#80d6c822,transparent 65%)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section>.container{position:relative;z-index:1}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section h1{font-size:clamp(30px,3.5vw,48px)!important;line-height:1.15!important;letter-spacing:-.045em}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section p{color:#cbdfdf!important;line-height:1.7!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section .btn-danger,html:not(.pbpi-mobile-app) .pbpi-public-page main #btnLiveSearchAtlet,html:not(.pbpi-mobile-app) .pbpi-public-page main .cat-pill-btn.active{background:linear-gradient(135deg,#367e88,#204b64)!important;border-color:#619aab!important;color:#fff!important;box-shadow:0 6px 18px #092a3d24!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section .btn-outline-light{background:#ffffff14!important;border-color:#ffffff61!important;backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-public-page main .podium-card{background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;box-shadow:0 12px 34px #15384912!important;backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-public-page main .table-ranking th{background:#173d50!important;color:#e8f6ef!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .table-ranking tr:hover td{background:#d8ece744!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section{padding:132px 16px 34px!important;border-radius:0 0 24px 24px}html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section h1{font-size:clamp(28px,8vw,38px)!important}html:not(.pbpi-mobile-app) .pbpi-public-page main .ranking-hero-section p{font-size:14px!important}}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main .padel-court-card{background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;border:1px solid #ffffffdb!important;border-radius:22px!important;box-shadow:0 12px 34px #1538490d!important;overflow:hidden;backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main .btn-search{background:linear-gradient(135deg,#367e88,#204b64)!important;border-color:#346d7c!important;color:#fff!important;box-shadow:0 5px 14px #28687a26!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection>.container>.row:first-child .badge{background:#d8ece7!important;color:#28687a!important}
html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-login{background:linear-gradient(135deg,#367e88,#204b64)!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) :is(#sectionProfilUtama,#sectionPengurus){background:transparent!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) main :is(.pbpi-identity-card,.pbpi-visi-card,.pbpi-misi-card){background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;border:1px solid #ffffffdb!important;box-shadow:0 12px 34px #1538490d!important;backdrop-filter:blur(12px);border-radius:22px!important}
html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit{background:linear-gradient(135deg,#367e88,#204b64)!important;box-shadow:0 8px 20px #17445230!important}
@media(max-width:767.98px){
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .row>div:has(>.pbpi-mission-card){width:100%!important;flex:0 0 100%!important;max-width:100%!important;padding:8px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .pbpi-mission-card{padding:22px!important;text-align:left!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .pbpi-mission-card h3{font-size:19px!important;line-height:1.35!important;margin-bottom:10px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .pbpi-mission-card p{font-size:14px!important;line-height:1.65!important;display:block!important;overflow:visible!important;margin-bottom:18px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .pbpi-mission-card .badge{font-size:10px!important;padding:5px 8px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page:not(.pbpi-home-page) #pageSection .pbpi-mission-card .cp-btn-pill{font-size:13px!important;min-height:42px!important}
}
html:not(.pbpi-mobile-app) .pbpi-ranking-page main .court-empty-state{background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;border:1px solid #ffffffdb!important;box-shadow:0 12px 34px #15384912!important;backdrop-filter:blur(12px)}
html:not(.pbpi-mobile-app) .pbpi-ranking-page main .court-empty-state>.rounded-circle{background:#d8ece7!important;border-color:#a5cbc9!important;color:#28687a!important}
html:not(.pbpi-mobile-app) .pbpi-ranking-page main .court-empty-state :is(.text-danger,.text-primary){color:#28687a!important}
html:not(.pbpi-mobile-app) .pbpi-ranking-page main .btn-danger{background:linear-gradient(135deg,#367e88,#204b64)!important;border-color:#619aab!important;color:#fff!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-ranking-page main .ranking-hero-section{padding-bottom:60px!important}}
/* Tournament content sits on a light surface, independently of its dark hero. */
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-section-heading{color:#173647!important;line-height:1.35!important;margin:0!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-main-title{color:#f4faf7!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-subtitle{color:#cbdfdf!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-search-box{max-width:420px}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-search-box .input-group{background:#ffffffd9!important;border:1px solid #cadfe2!important;border-radius:16px!important;padding:4px!important;box-shadow:0 6px 20px #1538490d!important;flex-wrap:nowrap;overflow:hidden}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-search-box .form-control{min-width:0;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:12px!important;font-size:14px!important;min-height:42px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-search-box .btn-search{width:44px!important;height:44px!important;min-width:44px!important;flex-shrink:0;border-radius:12px!important;margin:0!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-content-section .rounded-circle{background:#d8ece7!important;border-color:#a5cbc9!important;color:#28687a!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-section-heading{font-size:21px!important}html:not(.pbpi-mobile-app) .pbpi-public-page main .tournament-search-box{max-width:100%}}
/* Frosted navigation on scroll only: transparent at top, readable frosted glass when scrolled */
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header{background:transparent!important;border-color:transparent!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible){background:linear-gradient(120deg,#f5ffffc7,#e6f4eeb3)!important;border-color:#ffffff91!important;backdrop-filter:blur(24px) saturate(145%)!important;-webkit-backdrop-filter:blur(24px) saturate(145%)!important;box-shadow:0 12px 32px #061c3326,inset 0 1px 0 #ffffff80!important}
@supports not (backdrop-filter:blur(1px)){html:not(.pbpi-mobile-app) .pbpi-public-page header.public-header:is(.cp-header-scrolled,.is-scrolled,.scrolled-visible){background:#edf6f2f2!important}}
/* /* ==========================================================================
   PBPI LOGIN — ULTRA-PREMIUM LIQUID GLASS ARCHITECTURE
   ========================================================================== */

/* ==========================================================================
   PBPI AUTH PAGES — APPLE CLEAR LIQUID GLASS (LOGIN & REGISTRASI AKUN)
   ========================================================================== */

/* Page Background & Cinematic Scenic Underlay */
/* Page Background & Cinematic Scenic Underlay */
.pbpi-auth-page,
.auth-login-page,
.auth-register-page,
html:not(.pbpi-mobile-app) .pbpi-auth-page {
    background: #081d26 !important;
    position: relative;
    overflow-x: hidden;
}

.pbpi-auth-page::before,
.auth-login-page::before,
.auth-register-page::before,
html:not(.pbpi-mobile-app) .pbpi-auth-page::before,
html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page::before,
html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page::before {
    content: '';
    position: fixed;
    inset: -48px;
    background: 
        radial-gradient(ellipse 95% 85% at 50% 15%, rgba(13, 56, 70, 0.45) 0%, rgba(6, 22, 30, 0.78) 80%),
        url('../images/padel-cinematic-v1.jpg') center/cover no-repeat;
    opacity: 1;
    z-index: 0;
    pointer-events: none;
    animation: cp-login-photo-drift 14s ease-in-out infinite alternate;
}

/* Auth Container */
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-container {
    position: relative;
    z-index: 10;
    width: 100% !important;
    max-width: 440px !important;
    margin: 0 auto;
    padding-inline: 16px !important;
    box-sizing: border-box;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page .auth-container {
    max-width: 560px !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-container::before {
    display: none !important;
}

/* THE LIQUID GLASS CARD (100% IDENTIK DENGAN CARD DI PANEL MENU TEMPLATE.PHP & DASHBOARD) */
.pbpi-auth-page .auth-card,
.auth-login-page .auth-card,
.auth-register-page .auth-card,
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card {
    position: relative !important;
    width: 100% !important;
    max-width: 440px !important;
    padding: 38px 32px 32px !important;
    box-sizing: border-box !important;
    border-radius: 26px !important;
    --cp-blue: #ffd239;
    overflow: hidden !important;
    isolation: isolate !important;

    /* Apple Clear iOS Liquid Glass Surface (Persis Panel Menu template.php line 68 & dashboard/index.php line 11) */
    background: 
        radial-gradient(circle 320px at var(--glass-x, 50%) var(--glass-y, 0%), rgba(255, 255, 255, 0.08), transparent 70%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.10) 0%, rgba(255, 255, 255, 0.02) 40%, rgba(255, 255, 255, 0.005) 100%) !important;
    backdrop-filter: blur(2px) saturate(115%) !important;
    -webkit-backdrop-filter: blur(2px) saturate(115%) !important;

    /* Multi-sided beveled crystal border (Persis Panel Menu template.php lines 71-75) */
    border: 1.5px solid rgba(255, 255, 255, 0.35) !important;
    border-top: 2px solid rgba(255, 255, 255, 0.70) !important;
    border-left: 1.5px solid rgba(255, 255, 255, 0.45) !important;
    border-right: 1px solid rgba(255, 255, 255, 0.20) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;

    /* Signature Inset Highlights & Depth Shadows (Persis Panel Menu template.php lines 77-80) */
    box-shadow: 
        inset 0 2px 3px rgba(255, 255, 255, 0.60),
        inset 0 -1px 2px rgba(255, 255, 255, 0.20),
        inset 0 0 16px rgba(255, 255, 255, 0.06),
        0 16px 36px rgba(0, 0, 0, 0.25) !important;

    color: #ffffff !important;
    animation: cp-login-enter 0.8s cubic-bezier(0.16, 1, 0.3, 1) both !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.3s ease !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page .auth-card,
.auth-register-page .auth-card {
    max-width: 560px !important;
}

/* Liquid Glass Gloss Dome Sheen 45% (Persis Panel Menu template.php line 101 & dashboard/index.php line 49) */
.pbpi-auth-page .auth-card::before,
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 45% !important;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0.03) 70%, rgba(255, 255, 255, 0) 100%) !important;
    border-radius: 26px 26px 0 0 !important;
    pointer-events: none !important;
    z-index: 1 !important;
    mask-image: none !important;
    -webkit-mask-image: none !important;
}

/* Signature Gold & White Specular Accent Edge (Persis dashboard.css line 763) */
.pbpi-auth-page .auth-card::after,
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 2px !important;
    background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.45) 20%, rgba(255, 210, 57, 0.70) 50%, rgba(255, 255, 255, 0.45) 80%, transparent 100%) !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

.pbpi-auth-page .auth-card:hover,
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card:hover {
    border-top-color: rgba(255, 255, 255, 0.85) !important;
    border-left-color: rgba(255, 255, 255, 0.60) !important;
    box-shadow: 
        inset 0 2.5px 4px rgba(255, 255, 255, 0.75),
        inset 0 0 20px rgba(255, 255, 255, 0.10),
        0 22px 48px rgba(0, 0, 0, 0.35) !important;
    transform: translateY(-2px) !important;
}

/* Logo Box & Squircle Capsule (persis sidebar-brand-squircle di admin-glass.css) */
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-box {
    text-align: center;
    margin-bottom: 24px;
    position: relative;
    z-index: 3;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-cluster {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-bottom: 14px;
    padding: 10px 24px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.95) !important;
    border: 1.5px solid rgba(255, 255, 255, 0.80) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.30) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-cluster:hover {
    transform: translateY(-2px) scale(1.02);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35) !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-primary {
    height: 42px;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-secondary {
    height: 46px;
    width: auto;
    max-width: 105px;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.08));
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-logo-divider {
    width: 1.5px;
    height: 26px;
    background: rgba(100, 116, 139, 0.35);
    border-radius: 2px;
}

/* Typography & Titles (Clean & Crisp Modern Glass - No Text Shadow) */
.pbpi-auth-page .auth-card :is(h1, h2, h3, h4, h5, h6, p, span, label, a, button, small, div, strong) {
    text-shadow: none !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-title {
    font-size: 0.8rem !important;
    font-weight: 800 !important;
    line-height: 1.5 !important;
    letter-spacing: 0.06em !important;
    margin: 8px auto 4px !important;
    color: #ffffff !important;
    text-transform: uppercase;
    text-shadow: none !important;
}

/* Sub-title Kabupaten Bogor & Aksen Emas (#ffd239) */
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card :is(.text-uppercase.fw-bold.text-muted, [style*="var(--cp-blue)"]) {
    color: #ffd239 !important;
    font-weight: 800 !important;
    letter-spacing: 1.2px !important;
    text-shadow: none !important;
}

/* Judul Selamat Datang Kembali - Modern Medium Weight (Sleek, tidak terlalu tebal) */
.pbpi-auth-page .cp-login-welcome,
html:not(.pbpi-mobile-app) .pbpi-auth-page .cp-login-welcome {
    color: #ffffff !important;
    font-size: 1.68rem !important;
    font-weight: 600 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.25 !important;
    margin: 14px 0 8px !important;
    text-shadow: none !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-subtitle {
    font-size: 0.86rem !important;
    font-weight: 450 !important;
    line-height: 1.5 !important;
    color: #afcbd0 !important;
    margin-bottom: 0 !important;
    text-shadow: none !important;
}

/* Alert Boxes (Frosted Glass) */
html:not(.pbpi-mobile-app) .pbpi-auth-page .alert-info {
    background: rgba(15, 52, 70, 0.65) !important;
    border: 1px solid rgba(143, 209, 194, 0.30) !important;
    color: #e7f3ef !important;
    border-radius: 14px !important;
    font-size: 0.8rem !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .alert-info i {
    color: #8fd1c2 !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .alert-danger {
    background: rgba(85, 20, 25, 0.75) !important;
    border: 1px solid rgba(248, 113, 113, 0.40) !important;
    color: #fee2e2 !important;
    border-radius: 14px !important;
    font-size: 0.8rem !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .alert-success {
    background: rgba(15, 65, 45, 0.75) !important;
    border: 1px solid rgba(74, 222, 128, 0.40) !important;
    color: #dcfce7 !important;
    border-radius: 14px !important;
    font-size: 0.8rem !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

/* Form Section & Input Controls (Sesuai admin-glass.css line 34) */
html:not(.pbpi-mobile-app) .pbpi-auth-page form {
    position: relative;
    z-index: 3;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .form-label {
    font-size: 0.81rem !important;
    font-weight: 650 !important;
    color: #ffffff !important;
    margin-bottom: 6px !important;
    text-shadow: none !important;
    display: inline-block;
    white-space: nowrap;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .form-label .text-danger {
    color: #ff6b6b !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth {
    position: relative;
    display: flex;
    align-items: center;
    height: 50px !important;
    min-height: 50px !important;
    border-radius: 9999px !important;
    background: rgba(11, 43, 59, 0.75) !important;
    border: 1px solid rgba(255, 255, 255, 0.25) !important;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.08), 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    color: #e7f3ef !important;
    transition: all 0.22s ease !important;
    overflow: hidden;
    isolation: isolate;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth:focus-within {
    background: rgba(15, 52, 70, 0.88) !important;
    border-color: #8fd1c2 !important;
    box-shadow: 0 0 0 3px rgba(128, 197, 182, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0.15) !important;
    transform: translateY(-1px);
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth .input-icon {
    width: 46px;
    height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #8fd1c2 !important;
    font-size: 1.15rem;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth:focus-within .input-icon {
    color: #ffffff !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth input {
    flex: 1;
    min-width: 0;
    height: 100%;
    border: 0 !important;
    background: transparent !important;
    padding: 0 14px 0 0;
    font-size: 0.92rem;
    font-weight: 600;
    color: #e7f3ef !important;
    outline: none !important;
    font-family: inherit;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth input::placeholder {
    color: #a7c3c4 !important;
    font-weight: 450;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth input:-webkit-autofill {
    -webkit-text-fill-color: #e7f3ef !important;
    -webkit-box-shadow: 0 0 0 1000px #0b2b3b inset !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .toggle-password {
    background: transparent !important;
    border: none !important;
    width: 46px;
    min-width: 46px;
    height: 100%;
    color: #8fd1c2 !important;
    cursor: pointer;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem !important;
    flex-shrink: 0;
    transition: color 0.2s ease, transform 0.15s ease;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .toggle-password:hover {
    color: #ffffff !important;
    transform: scale(1.12);
}

/* Remember Me & Links */
html:not(.pbpi-mobile-app) .pbpi-auth-page .form-check-label {
    color: #ffffff !important;
    font-size: 0.82rem;
    font-weight: 550;
    text-shadow: none !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .form-check-input {
    background-color: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.35);
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .form-check-input:checked {
    background-color: #438e91;
    border-color: #8fd1c2;
    box-shadow: 0 0 10px rgba(143, 209, 194, 0.5);
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-link {
    color: #ffd239 !important;
    font-weight: 700 !important;
    line-height: 1.5;
    text-decoration: none;
    transition: all 0.2s ease;
    text-shadow: none !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-link:hover {
    color: #ffffff !important;
    text-decoration: underline;
    text-shadow: none !important;
}

/* SUBMIT BUTTON (Sesuai .btn-primary admin-glass.css line 40) */
html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit {
    position: relative;
    width: 100%;
    height: 50px !important;
    min-height: 50px !important;
    border-radius: 9999px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-size: 0.94rem !important;
    font-weight: 800 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase;
    color: #ffffff !important;
    cursor: pointer;
    background: linear-gradient(135deg, #438e91, #28647b) !important;
    border: 1px solid #6db4b4 !important;
    box-shadow: 0 6px 18px rgba(3, 29, 52, 0.35), inset 0 1px 1px rgba(255, 255, 255, 0.3) !important;
    text-shadow: none !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
    overflow: hidden;
    isolation: isolate;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(110deg, transparent 20%, rgba(255, 255, 255, 0.4) 50%, transparent 80%);
    transform: translateX(-120%);
    transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit:hover {
    transform: translateY(-2px);
    background: linear-gradient(135deg, #4fa3a6, #30738d) !important;
    box-shadow: 0 10px 24px rgba(3, 29, 52, 0.45), inset 0 1px 2px rgba(255, 255, 255, 0.45) !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit:hover::after,
html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit:focus-visible::after {
    transform: translateX(120%);
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit i {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    display: inline-block;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit:hover i {
    transform: translateX(4px) !important;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .btn-auth-submit:active {
    transform: scale(0.98);
}

/* Spinner */
.cp-login-spinner {
    display: inline-block;
    width: 18px;
    height: 18px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: #ffffff;
    border-radius: 50%;
    animation: cp-login-spin 0.75s linear infinite;
}
@keyframes cp-login-spin {
    to { transform: rotate(360deg); }
}

/* Auth Footer Separator & Links */
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-links {
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid rgba(255, 255, 255, 0.15) !important;
    text-align: center;
    position: relative;
    z-index: 3;
}

html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-links .text-muted {
    color: #afcbd0 !important;
    text-shadow: none !important;
}

/* Staggered Arrive Animation */
html:not(.pbpi-mobile-app) .pbpi-auth-page .auth-card :is(.auth-logo-box, form, .auth-links) {
    animation: cp-login-content-arrive 0.7s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}
html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card form {
    animation-delay: 0.12s;
}
html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card .auth-links {
    animation-delay: 0.22s;
}

@keyframes cp-login-photo-drift {
    from { transform: translate(-24px, 0); }
    to { transform: translate(24px, -10px); }
}

@keyframes cp-login-enter {
    from {
        opacity: 0;
        transform: translateY(24px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes cp-login-content-arrive {
    from {
        opacity: 0.1;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Fallback for browsers without backdrop-filter support */
@supports not (backdrop-filter: blur(1px)) {
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card {
        background: #0f303ced !important;
    }
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .input-group-auth {
        background: #17424eed !important;
    }
}

/* Mobile Responsive */
@media (max-width: 767.98px) {
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card {
        padding: 26px 20px 22px !important;
        border-radius: 28px !important;
    }
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .cp-login-welcome {
        font-size: 1.65rem !important;
    }
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-container {
        padding-inline: 12px !important;
    }
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .form-label {
        font-size: 12px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page::before,
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-container::before,
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card,
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .auth-card :is(.auth-logo-box, form, .auth-links),
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-login-page .btn-auth-submit::after,
    .cp-login-spinner {
        animation: none !important;
        transition: none !important;
    }
}

/* Draw one focus border on grouped controls, not a second outline on the inner field. */
html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth input:focus-visible,html:not(.pbpi-mobile-app) .pbpi-public-page .input-group:has(.btn-search) input:focus-visible{outline:none!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-auth-page .input-group-auth{overflow:hidden;isolation:isolate}
html:not(.pbpi-mobile-app) .pbpi-public-page .tournament-search-box .input-group:focus-within{border-color:#438b91!important;box-shadow:0 0 0 3px #4ea79520!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main #pageSection.tournament-content-section{padding-top:24px!important;margin-top:0!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page main #pageSection.tournament-content-section{padding-top:18px!important}}
/* Club directory: readable full-width mobile cards. */
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .club-card-custom{background:linear-gradient(135deg,#ffffffed,#edf7f2d9)!important;border:1px solid #ffffffdb!important;border-radius:22px!important;padding:24px!important;overflow:hidden;box-shadow:0 12px 34px #15384912!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .btn-pbpi-detail-klub{background:linear-gradient(135deg,#367e88,#204b64)!important;border-color:#346d7c!important;min-height:42px!important;font-size:13px!important;border-radius:12px!important}
@media(max-width:767.98px){
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .klub-item-col{width:100%!important;max-width:100%!important;flex:0 0 100%!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .club-card-custom{padding:20px!important;min-width:0}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .club-card-custom h5{font-size:19px!important;line-height:1.4!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .club-card-custom p{font-size:13px!important;line-height:1.7!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub .club-card-custom .badge{font-size:10px!important;white-space:normal!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub>.row:first-child{--bs-gutter-y:10px}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub>.row:first-child .p-3{padding:14px!important;border-radius:16px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub>.row:first-child .fs-4{font-size:17px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelKlub>.row:first-child .rounded-circle{width:40px!important;height:40px!important;flex-shrink:0}
}
/* Registration: unified liquid glass layout and natural scrolling on phones */
html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page {
    padding: 72px 16px 32px !important;
    min-height: 100svh;
    box-sizing: border-box;
}
html:not(.pbpi-mobile-app) .auth-register-page .auth-container {
    width: 100% !important;
    max-width: 580px !important;
    padding: 0 !important;
    box-sizing: border-box;
    margin: auto;
}
@media(max-width:767.98px){
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page {
        padding: 64px 12px 24px !important;
        display: block !important;
    }
    html:not(.pbpi-mobile-app) .pbpi-auth-page.auth-register-page .auth-card {
        padding: 24px 20px !important;
    }
}
/* Shared search controls: one glass frame and one focus indicator. */
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.court-search-box,.pendaftaran-search-box,.tournament-search-box .input-group,.input-group:has(input[type=search]),.input-group:has(#inputSearchAtlet),.input-group:has(#inputSearchPeringkatKlub)){display:flex!important;align-items:center!important;flex-wrap:nowrap!important;gap:4px!important;padding:5px!important;background:linear-gradient(120deg,#ffffffdf,#e7f5f1bf)!important;border:1px solid #bddbd6!important;border-radius:18px!important;box-shadow:0 8px 24px #1736470b,inset 0 1px 0 #fff!important;overflow:hidden!important;transition:border-color .2s,box-shadow .2s}
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.court-search-box,.pendaftaran-search-box,.tournament-search-box .input-group,.input-group:has(input[type=search]),.input-group:has(#inputSearchAtlet),.input-group:has(#inputSearchPeringkatKlub)):focus-within{border-color:#5a9fa1!important;box-shadow:0 0 0 3px #4ea7951c,0 8px 24px #1736470b!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.court-search-box,.pendaftaran-search-box,.tournament-search-box .input-group,.input-group:has(input[type=search]),.input-group:has(#inputSearchAtlet),.input-group:has(#inputSearchPeringkatKlub)) input{flex:1 1 0!important;min-width:0!important;width:0!important;min-height:44px!important;background:transparent!important;border:0!important;border-radius:0!important;outline:none!important;box-shadow:none!important;font-size:14px!important;color:#244352!important;padding:8px 12px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.input-group:has(input[type=search]),.input-group:has(#inputSearchAtlet),.input-group:has(#inputSearchPeringkatKlub)) .input-group-text{border:0!important;background:transparent!important;min-height:0;padding:0 0 0 10px!important;color:#628693!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.btn-search,#btnLiveSearchAtlet,#btnTriggerPeringkatKlub,.input-group:has(input[type=search]) button[type=submit]){position:relative;overflow:hidden;flex:0 0 auto!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:7px!important;min-height:44px!important;height:44px!important;min-width:46px!important;width:auto!important;padding:0 16px!important;margin:0!important;border:1px solid #609ca7!important;border-radius:13px!important;background:linear-gradient(135deg,#3c8a90,#204b64)!important;color:#fff!important;font-size:13px!important;font-weight:700!important;box-shadow:0 4px 12px #204b6426!important;transition:background .2s,box-shadow .2s}
html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.btn-search,#btnLiveSearchAtlet,#btnTriggerPeringkatKlub,.input-group:has(input[type=search]) button[type=submit]):hover{transform:none!important;background:linear-gradient(135deg,#4b9b9b,#285d72)!important;box-shadow:0 5px 16px #204b6438!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.court-search-box,.pendaftaran-search-box,.tournament-search-box .input-group,.input-group:has(input[type=search]),.input-group:has(#inputSearchAtlet),.input-group:has(#inputSearchPeringkatKlub)) input{font-size:16px!important}html:not(.pbpi-mobile-app) .pbpi-public-page main :is(.btn-search,#btnLiveSearchAtlet,#btnTriggerPeringkatKlub,.input-group:has(input[type=search]) button[type=submit]){padding-inline:12px!important}}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ocg-search-box{display:flex!important;align-items:center!important;gap:4px!important;padding:5px 5px 5px 14px!important;background:linear-gradient(120deg,#ffffffdf,#e7f5f1bf)!important;border:1px solid #bddbd6!important;border-radius:18px!important;overflow:hidden!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ocg-search-box input{flex:1;min-width:0;min-height:44px;outline:none!important;box-shadow:none!important;background:transparent!important;border:0!important;font-size:14px!important;padding:8px 12px!important;color:#244352!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ocg-search-box:focus-within{border-color:#5a9fa1!important;box-shadow:0 0 0 3px #4ea7951c!important}
html:not(.pbpi-mobile-app) .pbpi-public-page main .ocg-search-box>.text-danger{color:#628693!important}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page main .ocg-search-box input{font-size:16px!important}}
/* Compact court cards keep both secondary actions within their mobile column. */
@media(max-width:767.98px){
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .padel-court-card{border-radius:16px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-card-banner{height:145px!important;min-height:0!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-name-on-banner{font-size:13px!important;line-height:1.35!important;left:10px!important;right:10px!important;bottom:10px!important;gap:5px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-card-body{padding:12px 10px!important;min-width:0}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-location-text{font-size:11px!important;line-height:1.55!important;gap:6px!important;margin-bottom:12px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-card-footer-action{gap:7px!important;margin-top:10px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .court-card-footer-action>.d-flex{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt :is(.btn-court-detail,.btn-maps-view){min-width:0!important;width:100%!important;padding:8px 3px!important;min-height:36px!important;font-size:10px!important;gap:3px!important;border-radius:9px!important;box-sizing:border-box;white-space:nowrap!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt .btn-booking-ayo{padding:10px 6px!important;min-height:42px!important;font-size:11px!important;line-height:1.4!important;gap:5px!important;border-radius:10px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #panelCourt :is(.btn-court-detail,.btn-maps-view,.btn-booking-ayo) i{font-size:11px!important}
}
/* Body-level glass dialogs stay above the backdrop and remain clickable. */
html:not(.pbpi-mobile-app) .pbpi-public-page>.modal{z-index:1060!important}
html:not(.pbpi-mobile-app) .pbpi-public-page>.modal-backdrop{z-index:1050!important}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) .modal-content{background:linear-gradient(135deg,#173e4ce8,#153249de)!important;border:1px solid #d9f8f178!important;border-radius:24px!important;backdrop-filter:blur(20px) saturate(135%)!important;-webkit-backdrop-filter:blur(20px) saturate(135%)!important;box-shadow:0 24px 70px #031d3466,inset 0 1px 0 #ffffff59!important;color:#edf8f4}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) :is(.modal-header,.modal-body,.modal-footer){background:transparent!important;border-color:#d9f8f12e!important}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) :is(.text-dark,h5,h6){color:#edf8f4!important}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) :is(.text-muted,.text-white-50){color:#c3dcd9!important}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) :is(.card,.bg-light){background:#d9f8f114!important;border:1px solid #d9f8f13b!important;box-shadow:none!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #pills-tab-ranking{border-radius:16px!important;padding:6px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #pills-tab-ranking .nav-link{color:#d8ece6!important;font-size:13px!important;line-height:1.5;white-space:normal;border-radius:12px!important}
html:not(.pbpi-mobile-app) .pbpi-public-page #pills-tab-ranking .nav-link.active{background:linear-gradient(135deg,#478f94,#285f76)!important;color:#fff!important;box-shadow:0 4px 12px #07233133!important}
html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) .modal-footer .btn-outline-secondary{color:#d8ece6;border-color:#d9f8f161}
@media(max-width:767.98px){html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) .modal-dialog{margin:12px}html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) :is(.modal-header,.modal-body,.modal-footer){padding:18px!important}html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) .modal-title{font-size:16px!important}html:not(.pbpi-mobile-app) .pbpi-public-page :is(#modalPopupPeringkat,#modalPopupDirektoriKlub) .modal-footer{gap:8px}}