/* Professional access-choice modal used by Main/Mainkan on agent websites. */
.banner-choice-overlay{
  position:fixed;
  inset:0;
  z-index:12000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  overflow:auto;
  background:rgba(2,7,16,.82);
  backdrop-filter:blur(11px);
  -webkit-backdrop-filter:blur(11px);
}
.banner-choice-overlay.open{display:flex;animation:access-overlay-in .18s ease-out}
.banner-choice-dialog{
  position:relative;
  width:min(780px,100%);
  max-height:min(88vh,850px);
  overflow:auto;
  border:1px solid color-mix(in srgb,var(--gold,#f0c040) 22%,rgba(148,163,184,.22));
  border-radius:23px;
  background:linear-gradient(180deg,#17233c 0%,#0b1425 100%);
  box-shadow:0 34px 110px rgba(0,0,0,.67),inset 0 1px rgba(255,255,255,.035);
  transform-origin:center;
  animation:access-dialog-in .22s cubic-bezier(.2,.8,.2,1);
}
.banner-choice-dialog::before{
  content:"PILIH AKSES";
  display:block;
  padding:20px 68px 17px 23px;
  border-bottom:1px solid rgba(148,163,184,.16);
  background:linear-gradient(135deg,rgba(255,255,255,.045),transparent);
  color:var(--gold-light,#f8da80);
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
}
.banner-choice-dialog::after{
  content:"Pilih akses Login atau Daftar untuk melanjutkan";
  position:absolute;
  left:23px;
  top:43px;
  color:#92a4c1;
  font-size:10px;
}
.banner-choice-close{
  position:absolute;
  top:12px;
  right:13px;
  z-index:3;
  width:41px;
  height:41px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(148,163,184,.21);
  border-radius:12px;
  background:#1c2a46;
  color:#c9d4e7;
  font-size:25px;
  line-height:1;
  cursor:pointer;
  transition:.18s ease;
}
.banner-choice-close:hover{background:#293b5f;color:#fff;transform:translateY(-1px)}
.banner-choice-list{display:grid;grid-template-columns:1fr;gap:16px;padding:25px 20px 20px}
.banner-choice-item{
  margin:0;
  padding:16px;
  border:1px solid rgba(148,163,184,.15);
  border-radius:17px;
  background:rgba(5,12,25,.58);
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 12px 34px rgba(0,0,0,.15);
}
.banner-choice-title{margin:0 0 12px;color:#f5f8ff;font-size:16px;font-weight:800;letter-spacing:-.01em}
.banner-choice-image{display:block;width:100%;max-height:320px;object-fit:cover;border:1px solid rgba(148,163,184,.12);border-radius:13px;background:#07101f}
.banner-choice-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-top:14px}
.banner-choice-actions a{
  min-height:47px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:11px 14px;
  border:1px solid transparent;
  border-radius:12px;
  text-decoration:none;
  text-align:center;
  font-size:13px;
  font-weight:900;
  transition:.18s ease;
}
.banner-choice-actions a::before{font-family:"Font Awesome 6 Free";font-weight:900}
.banner-login{background:#223250!important;color:#f3f6fb!important;border-color:rgba(148,163,184,.18)!important}
.banner-login::before{content:"\f2f6"}.banner-login:hover{background:#2d4268!important;transform:translateY(-1px)}
.banner-register{background:linear-gradient(135deg,var(--gold-light,#f8da80),var(--gold,#f0c040))!important;color:#111722!important;box-shadow:0 11px 27px var(--gold-dim,rgba(240,192,64,.16))}
.banner-register::before{content:"\f234"}.banner-register:hover{filter:brightness(1.05);transform:translateY(-1px)}
.banner-choice-empty{margin:22px;padding:35px 18px;border:1px dashed rgba(148,163,184,.22);border-radius:15px;text-align:center;color:#9fb0ca;background:rgba(5,12,25,.42)}
@keyframes access-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes access-dialog-in{from{opacity:0;transform:translateY(10px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:600px){
  .banner-choice-overlay{align-items:center;justify-content:center;padding:12px}
  .banner-choice-dialog{width:100%;max-height:88vh;border-radius:19px}
  .banner-choice-dialog::before{padding:18px 58px 16px 16px}
  .banner-choice-dialog::after{left:16px;top:40px;max-width:calc(100% - 80px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .banner-choice-close{top:9px;right:9px;width:38px;height:38px}
  .banner-choice-list{padding:23px 12px 13px;gap:12px}
  .banner-choice-item{padding:12px;border-radius:14px}
  .banner-choice-title{font-size:14px}
  .banner-choice-image{max-height:235px;border-radius:10px}
  .banner-choice-actions{grid-template-columns:1fr 1fr;gap:8px}
  .banner-choice-actions a{min-height:44px;padding:9px 8px;font-size:12px}
}
@media(max-height:620px){.banner-choice-dialog{max-height:94vh}.banner-choice-list{padding-top:18px}.banner-choice-image{max-height:190px}}
@media(prefers-reduced-motion:reduce){.banner-choice-overlay.open,.banner-choice-dialog{animation:none}}

/* V5.4 accessibility and loading refinements */
body.has-access-modal{overflow:hidden!important}
.banner-choice-image-empty{
  min-height:150px;
  display:grid;
  place-items:center;
  color:var(--grey-300,#9a9a9a);
  font-size:2rem;
  background:linear-gradient(145deg,rgba(148,163,184,.08),rgba(4,9,18,.62));
}
.banner-choice-empty{
  display:grid;
  justify-items:center;
  gap:7px;
}
.banner-choice-empty strong{color:var(--white,#fff);font-size:.88rem}
.banner-choice-empty span{color:var(--mute,#93a4c7);font-size:.7rem}
.banner-choice-empty.is-loading{min-height:160px;align-content:center}
.access-loader{
  width:30px;
  height:30px;
  border:3px solid rgba(148,163,184,.2);
  border-top-color:var(--gold,#f0c040);
  border-radius:50%;
  animation:access-spin .75s linear infinite;
}
@keyframes access-spin{to{transform:rotate(360deg)}}
.banner-choice-dialog:focus{outline:none}
.banner-choice-actions a:focus-visible,
.banner-choice-close:focus-visible{
  outline:3px solid color-mix(in srgb,var(--gold,#f0c040) 50%,transparent);
  outline-offset:3px;
}
body[data-agent-theme] .banner-choice-image-empty{color:var(--theme-muted);background:linear-gradient(145deg,rgba(var(--theme-rgb),.08),var(--theme-card))}
body[data-agent-theme] .access-loader{border-color:rgba(var(--theme-rgb),.2);border-top-color:var(--theme-accent)}
@media(prefers-reduced-motion:reduce){.access-loader{animation:none}}