/* Ludo public UI readability and overlay priority, 7 November 2026. */
.login-container .login-content>.text-start,
.login-container .input-group-text{font-family:"Poppins",system-ui,sans-serif!important}
.login-container .login-content>.text-start{font-size:22px;line-height:1.4}
.login-container .input-group-text{font-size:18px!important}
.login-container .form-control{min-height:48px;font-size:16px}
.login-container .btn:not(.p-0){min-height:44px}
.login-container .form-control:focus{border-color:#147d68;box-shadow:0 0 0 3px #147d6824}
.login-container .btn:focus-visible,
.login-container a:focus-visible{outline:3px solid #116b5b;outline-offset:3px}
.login-container .legal-terms-text{line-height:1.65}
.rk-login-legal,.rk-login-safe{font-size:12px!important;line-height:1.7!important}
.rk-login-heading p{font-size:13px!important;line-height:1.6}
aside[aria-label="Download Android app"]>button,
aside[aria-label="App update available"]>button{min-width:44px;min-height:44px;position:absolute;right:5px;top:4px;border-radius:6px}
aside[aria-label="Download Android app"]>strong,
aside[aria-label="App update available"]>strong{padding-right:40px!important}
aside[aria-label="Download Android app"]>button:focus-visible,
aside[aria-label="App update available"]>button:focus-visible{outline:3px solid #116b5b;outline-offset:1px}
/* A secondary prompt or floating chat must not cover the active dialog. */
body:has(.modal.show,.offcanvas.show,.swal2-container) aside[aria-label="Download Android app"],
body:has(.modal.show,.offcanvas.show,.swal2-container) aside[aria-label="App update available"],
body:has(.modal.show,.offcanvas.show,.swal2-container) button[title="Live Support"]{visibility:hidden!important;pointer-events:none!important}
/* Let mobile users complete a focused form without the app banner covering it. */
body:has(.login-container input:focus,.rk-login-page input:focus) aside[aria-label="Download Android app"],
body:has(.login-container input:focus,.rk-login-page input:focus) aside[aria-label="App update available"]{visibility:hidden!important;pointer-events:none!important}
@media(max-width:480px){
 body:has(aside[aria-label="Download Android app"]) .rk-login-page{padding-bottom:210px!important}
 body:has(aside[aria-label="Download Android app"]) .login-container{padding-bottom:180px}
 .daily-channel-content{max-height:calc(100dvh - 40px);overflow-y:auto}
 .daily-channel-content .modal-header{flex-shrink:0}
 .daily-channel-content .btn-close{min-width:24px;min-height:24px;padding:10px}
}
@media(prefers-reduced-motion:reduce){.login-container .dice-gif{visibility:hidden}}

/* Compact optional prompts; retain all download/update actions. */
aside:is([aria-label="Download Android app"],[aria-label="App update available"]){
 display:grid!important;grid-template-columns:minmax(0,1fr) auto 44px;
 grid-template-rows:auto auto;align-items:center;column-gap:8px;row-gap:2px;
 padding:10px 8px 10px 12px!important;border-color:#dce4e2!important;
 border-radius:12px!important;box-shadow:0 4px 16px #17203314!important;
}
aside:is([aria-label="Download Android app"],[aria-label="App update available"])>strong{
 grid-column:1;grid-row:1;padding:0!important;font-size:13px!important;
 line-height:1.4;align-self:end;min-width:0;overflow-wrap:break-word;
}
aside:is([aria-label="Download Android app"],[aria-label="App update available"])>p{
 grid-column:1;grid-row:2;margin:0!important;font-size:11px!important;
 line-height:1.5;color:#586774;align-self:start;
}
aside:is([aria-label="Download Android app"],[aria-label="App update available"])>a{
 grid-column:2;grid-row:1/3;display:flex!important;align-items:center;
 justify-content:center;min-height:44px;max-width:104px;padding:8px 10px!important;
 font-size:12px;line-height:1.35;font-weight:600;text-align:center;
}
aside:is([aria-label="Download Android app"],[aria-label="App update available"])>button{
 position:static!important;grid-column:3;grid-row:1/3;float:none!important;
 width:44px;height:44px;align-self:center;color:#44535e;
}
aside:is([aria-label="Download Android app"],[aria-label="App update available"])>a:focus-visible{
 outline:3px solid #116b5b;outline-offset:3px;
}
@media(max-width:575px){
 /* Keep the movable support control clear of the visible download card. */
 body:has(aside:is([aria-label="Download Android app"],[aria-label="App update available"])) button[title="Live Support"]{
  top:auto!important;left:auto!important;right:16px!important;bottom:192px!important;
  width:48px!important;height:48px!important;box-shadow:0 3px 12px #176d5424!important;
 }
 body:has(aside[aria-label="Download Android app"]) .rk-login-page{padding-bottom:156px!important}
 body:has(aside[aria-label="Download Android app"]) .login-container{padding-bottom:130px}
}
/* Login: focus on the form; keep decoration secondary. */
.login-container .input-group.pt-5{padding-top:24px!important}
.login-container .dice-gif{width:84px;height:84px;object-fit:contain}
.login-container .dice-container{margin:6px 0}

/* A readable game list and quieter secondary cards on the compact home page. */
.hd-page .hd-section-head{margin:16px 0 12px!important;gap:12px}
.hd-page .hd-section-head h2{font-size:22px!important;line-height:1.25!important;letter-spacing:-.02em!important}
.hd-page .hd-rules-button{min-height:44px!important;font-size:12px!important;border-color:#d7dedb!important}
.hd-page .hd-games{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
.hd-page .hd-game{
 display:grid;grid-template-columns:72px minmax(0,1fr);align-items:center;
 gap:14px;padding:10px;border:1px solid #e6ebe8!important;
 border-radius:12px!important;box-shadow:none!important;
}
.hd-page .hd-game-image{width:72px;height:72px;aspect-ratio:1!important;border-radius:9px!important}
.hd-page .hd-game-body{padding:0!important;min-width:0}
.hd-page .hd-game-title{
 font-family:"Poppins",system-ui,sans-serif!important;font-size:14px!important;
 line-height:1.5!important;text-align:left!important;white-space:normal;
}
.hd-page .hd-game-meta{justify-content:flex-start!important;margin-top:4px!important}
.hd-page .hd-stake{
 font-family:"Poppins",system-ui,sans-serif!important;font-size:12px!important;
 line-height:1.5;color:#53645c!important;font-weight:500!important;
 white-space:normal;overflow:visible;
}
.hd-page .hd-game-live{top:4px!important;right:4px!important;padding:3px 5px!important;font-size:7px!important}
.hd-page .hd-game:focus-visible{outline:3px solid #176d54;outline-offset:3px}
.hd-page .hd-referral{margin-top:18px;background:#f8faf9;border-color:#e4eae7;gap:12px}
.hd-page .hd-referral-copy strong{font-size:14px;line-height:1.5;font-weight:600}
.hd-page .hd-referral-copy small{font-size:12px;line-height:1.6;color:#62716a}
.hd-page .hd-referral-icon{background:#edf3ef;color:#315947}
.hd-page .reward-spin-shell:has(.reward-spin-login){
 padding:16px!important;border:1px solid #e4eae7!important;
 border-radius:12px!important;background:#f8faf9!important;box-shadow:none!important;
}
.hd-page .reward-spin-login{font-size:13px!important;line-height:1.6!important;color:#45594e!important;text-shadow:none!important}
.daily-channel-logo{width:60px;height:60px;margin-bottom:12px}
.daily-channel-eyebrow{margin-bottom:8px}
.daily-channel-body h2{font-size:22px;margin-bottom:10px}
.daily-channel-body p{margin-bottom:16px}
.daily-channel-join{padding:12px;gap:10px}
.daily-channel-body .daily-channel-optional{margin:12px 0}
@media(max-width:340px){
 .hd-page .hd-game{grid-template-columns:64px minmax(0,1fr);gap:12px}
 .hd-page .hd-game-image{width:64px;height:64px}
 .hd-page .hd-section-head h2{font-size:20px!important}
}
.hd-page .dk-offer{margin:8px 0 14px;padding:10px 0 12px}
.hd-page .dk-offer .dk-offer-heading{margin-bottom:4px}
.hd-page .dk-offer h2{font-size:16px;line-height:1.6}
.hd-page .dk-offer .dk-offer-contact-copy{margin-bottom:0}
@media(max-width:575px){
 /* Use the free header space while the optional download card is visible. */
 .app:has(.hd-page){position:relative}
 body:has(aside:is([aria-label="Download Android app"],[aria-label="App update available"])) .app:has(.hd-page) button[title="Live Support"]{
  position:absolute!important;top:31px!important;bottom:auto!important;
  right:108px!important;width:44px!important;height:44px!important;
  box-shadow:none!important;
 }
}

/* Keep account forms readable and unobstructed through the whole interaction. */
body:has(.login-container:focus-within,.rk-login-page:focus-within,.rk-auth-page:focus-within) aside:is([aria-label="Download Android app"],[aria-label="App update available"]){
 visibility:hidden!important;pointer-events:none!important;
}
.rk-auth-card>label{font-size:12px!important;line-height:1.5;color:#48635b!important;letter-spacing:.02em}
.rk-auth-card label small{font-size:11px}
.rk-auth-heading p,.rk-auth-switch,.rk-auth-safe{font-size:12px!important;line-height:1.65;color:#526d64!important}
.rk-legal{font-size:12px!important;line-height:1.65;color:#526d64!important;margin:14px 2px!important}
.rk-field:focus-within,.rk-phone-input:focus-within{border-color:#147d68;box-shadow:0 0 0 3px #147d6824}
.rk-auth-card input{font-size:16px!important}
.rk-auth-card button:focus-visible,.rk-auth-card a:focus-visible{outline:3px solid #116b5b;outline-offset:3px}
.rk-auth-switch a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:575px){
 body:has(aside[aria-label="Download Android app"]) .rk-auth-page{padding-bottom:170px!important}
}

/* Scoped to HelloLudo's existing registration form, including its OTP step. */
.app .min-vh-100.d-flex.justify-content-center:has(input){padding-top:24px!important;padding-bottom:110px}
.app .min-vh-100.d-flex.justify-content-center:has(input) input{
 font-size:16px!important;min-height:48px;
}
.app .min-vh-100.d-flex.justify-content-center:has(input) input:focus{
 border-color:#6255d9!important;box-shadow:0 0 0 3px #6255d920!important;
}
.app .min-vh-100.d-flex.justify-content-center:has(input) button{min-height:44px}
.app .min-vh-100.d-flex.justify-content-center:has(input) p{font-size:12px!important;line-height:1.6}
.app .min-vh-100.d-flex.justify-content-center:has(input)>.text-center{line-height:1.6}
body:has(.min-vh-100.d-flex.justify-content-center input:focus,.min-vh-100.d-flex.justify-content-center button:focus,.min-vh-100.d-flex.justify-content-center a:focus) aside:is([aria-label="Download Android app"],[aria-label="App update available"]){
 visibility:hidden!important;pointer-events:none!important;
}
body:has(aside[aria-label="Download Android app"]) .app .min-vh-100.d-flex.justify-content-center:has(input){padding-bottom:170px}
@media(max-width:575px){
 .navbar button,.navbar a.btn{min-height:44px;min-width:44px}
}

/* The active dialog must stay above the app navigation. */
body:has(.modal.show,.offcanvas.show,.swal2-container) .app-bottom-nav{visibility:hidden!important;pointer-events:none!important}
