/* Redeem Voucher Kalimantan — public cloud/blue visual theme.
   CSS is only loaded by public_menu_wrap(); no admin/CS styling is changed.
   QR canvas, status logic, forms, hrefs and functionality remain untouched. */
:root{--rv-navy:#102c6c;--rv-blue:#3269f5;--rv-indigo:#654fee;--rv-sky:#e9f7ff;--rv-ink:#172d59}
body:has(.xl-public-header){background:radial-gradient(ellipse 500px 400px at 98% 1%,#c2e9ff 0%,transparent 80%),radial-gradient(ellipse 400px 420px at 0% 23%,#e1efff 0%,transparent 80%),#f9fcff;color:var(--rv-ink)}
body:has(.xl-public-header) .shell{width:100%;max-width:1240px;margin:0 auto;padding:clamp(14px,2.8vw,30px)}
body:has(.xl-public-header) h1,body:has(.xl-public-header) h2,body:has(.xl-public-header) h3{letter-spacing:-.035em}
/* Header: single discreet hamburger only */
body:has(.xl-public-header) .xl-public-header{margin:0 0 clamp(22px,4vw,42px);padding:6px 0 17px;border-color:#dfe9ff;min-height:52px}
body:has(.xl-public-header) .xl-public-menu>summary{background:rgba(255,255,255,.85);border:1px solid #dce6ff;color:#183d90;border-radius:999px;padding:11px 20px;box-shadow:0 6px 20px rgba(53,95,201,.07);transition:background .2s,box-shadow .2s}
body:has(.xl-public-header) .xl-public-menu>summary:hover{background:#eef5ff;box-shadow:0 10px 24px rgba(53,95,201,.13)}
body:has(.xl-public-header) .xl-public-links{background:#fff;border-color:#e0e9ff;border-radius:18px;box-shadow:0 22px 54px rgba(33,71,155,.16);z-index:100}
body:has(.xl-public-header) .xl-public-links a:hover,body:has(.xl-public-header) .xl-public-links a[aria-current=page]{background:#edf2ff;color:#2154c9}
/* Hero: light airy cloud aesthetic from the visual reference */
body:has(.xl-public-header) .pub-hero{background:linear-gradient(115deg,#fff 0%,#f2f9ff 44%,#d9eaff 100%);border:1px solid #e5edff;box-shadow:0 22px 74px rgba(55,101,189,.09);min-height:460px;border-radius:30px;padding:clamp(28px,5vw,68px);isolation:isolate}
body:has(.xl-public-header) .pub-hero:before{width:560px;height:560px;top:-200px;right:-130px;background:radial-gradient(circle at 50% 48%,#87d9ff88 0%,#6c85fd39 34%,transparent 69%);filter:blur(8px);z-index:-1}
body:has(.xl-public-header) .pub-hero:after{content:"";position:absolute;right:7%;bottom:-110px;width:300px;height:250px;background:radial-gradient(ellipse,#72bafe66,transparent 70%);filter:blur(24px);z-index:-1;pointer-events:none}
body:has(.xl-public-header) .pub-eyebrow{color:#4a75de;font-weight:850}
body:has(.xl-public-header) .pub-hero h1{color:#102655;font-size:clamp(37px,4.7vw,66px);line-height:1.1;font-weight:850}
body:has(.xl-public-header) .pub-hero h1 em{color:#2a6cde;background:linear-gradient(90deg,#245edc,#6255ec);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body:has(.xl-public-header) .pub-hero p{color:#587091;font-size:clamp(14px,1.4vw,17px)}
body:has(.xl-public-header) .pub-primary{color:#fff;background:linear-gradient(105deg,#356af7,#6154e9);border-radius:999px;padding:14px 24px;box-shadow:0 14px 24px rgba(55,100,231,.22);transition:transform .18s,box-shadow .18s}
body:has(.xl-public-header) .pub-primary:hover{transform:translateY(-2px);box-shadow:0 18px 30px rgba(55,100,231,.28)}
body:has(.xl-public-header) .pub-outline{border:1px solid #c8d9fb;color:#2754ab;background:rgba(255,255,255,.7);border-radius:999px}
body:has(.xl-public-header) .pub-ticket{background:linear-gradient(155deg,#fff,#f5faff);border:1px solid #eaf0ff;border-radius:28px;box-shadow:0 29px 85px #4e7fba36;transform:rotate(5deg);max-width:310px}
body:has(.xl-public-header) .pub-ticket:before{content:"";position:absolute;z-index:-1;inset:22px -20px -20px 25px;border-radius:28px;background:linear-gradient(145deg,#74c6ff,#776cf7);opacity:.35;transform:rotate(5deg)}
/* Soft-floating stats */
body:has(.xl-public-header) .pub-stats{margin:22px 0 62px}
body:has(.xl-public-header) .pub-stats>div{border-color:#e8eeff;box-shadow:0 12px 34px #2c65b50b;border-radius:20px;background:rgba(255,255,255,.93)}
body:has(.xl-public-header) .pub-stats strong{color:#3b61dc}
/* Deep-blue product band, corresponding to the reference's feature zone */
body:has(.xl-public-header) .pub-section:has(.pub-steps){position:relative;margin:64px calc(-1 * clamp(14px,2.8vw,30px));padding:clamp(40px,5.5vw,76px) clamp(20px,5vw,74px);border-radius:26px;background:radial-gradient(circle at 88% 10%,#4356d2 0%,transparent 45%),linear-gradient(110deg,#102775 0%,#122f95 55%,#0b266a 100%);overflow:hidden}
body:has(.xl-public-header) .pub-section:has(.pub-steps) .pub-heading h2,body:has(.xl-public-header) .pub-section:has(.pub-steps) .pub-heading p{color:#fff}
body:has(.xl-public-header) .pub-section:has(.pub-steps) .pub-kicker{color:#93d4ff}
body:has(.xl-public-header) .pub-steps article{position:relative;border:1px solid #ffffff38;border-radius:22px;background:linear-gradient(145deg,#ffffff28,#ffffff10);backdrop-filter:blur(6px);box-shadow:0 14px 27px #06154a33;padding:clamp(22px,3vw,32px);min-height:210px}
body:has(.xl-public-header) .pub-steps b{color:#a3e6ff;font-size:32px}
body:has(.xl-public-header) .pub-steps h3{color:white}
body:has(.xl-public-header) .pub-steps p{color:#deebff}
/* Store cards and other public content */
body:has(.xl-public-header) .pub-heading h2{color:#162d5c}
body:has(.xl-public-header) .pub-store{border-radius:19px;border:1px solid #e5edff;box-shadow:0 12px 30px #1b60ad0e;padding:20px;transition:transform .18s,box-shadow .18s}
body:has(.xl-public-header) .pub-store:hover{transform:translateY(-3px);box-shadow:0 18px 32px #265cbb1b}
body:has(.xl-public-header) .pub-store-icon{border-radius:13px;background:linear-gradient(135deg,#d6f5ff,#e4e0ff);color:#3763da}
body:has(.xl-public-header) .pub-text-link{color:#3464db}
body:has(.xl-public-header) .pub-banner{background:linear-gradient(115deg,#ecf8ff,#e9e9ff);border:1px solid #dfe8ff;border-radius:24px;padding:clamp(26px,4vw,44px)}
body:has(.xl-public-header) .pub-simple-hero{border-radius:26px;background:linear-gradient(115deg,#163981,#3659d6 70%,#7160e9);box-shadow:0 19px 45px #224ca822}
body:has(.xl-public-header) .pub-info-panel,body:has(.xl-public-header) .pub-faq details{border:1px solid #e3eafa;box-shadow:0 10px 30px #2b5aab0b;border-radius:18px}
body:has(.xl-public-header) .pub-footer{position:relative;margin:75px 0 0;border:0;padding:80px 38px 50px;background:linear-gradient(112deg,#153eab,#4555dc 55%,#6d4ee7);color:#e3edff;border-radius:48% 48% 0 0 / 55px 55px 0 0;min-height:180px}
body:has(.xl-public-header) .pub-footer a{color:white;font-weight:700}
/* Non-landing public pages: cards, inputs; never change voucher QR or logic */
body:has(.xl-public-header) .card{border-radius:24px;border:1px solid #e0eafd;box-shadow:0 19px 48px #1b57b40c}
body:has(.xl-public-header) .directory-hero{background:linear-gradient(115deg,#163b93,#435deb);border-radius:24px}
body:has(.xl-public-header) .dir-card{border:1px solid #e2ebff;border-radius:19px;box-shadow:0 12px 30px #1b57b40b}
body:has(.xl-public-header) .qr-holder canvas{max-width:100%;height:auto}
@media(max-width:800px){
 body:has(.xl-public-header) .pub-hero{grid-template-columns:minmax(0,1fr);min-height:auto}
 body:has(.xl-public-header) .pub-hero h1{font-size:clamp(34px,7vw,49px)}
 body:has(.xl-public-header) .pub-hero .pub-ticket{display:none}
 body:has(.xl-public-header) .pub-section:has(.pub-steps){margin-left:0;margin-right:0;border-radius:24px}
 body:has(.xl-public-header) .pub-footer{border-radius:26px 26px 0 0;padding:40px 26px}
}
@media(max-width:580px){
 body:has(.xl-public-header) .shell{padding:12px}
 body:has(.xl-public-header) .pub-hero{padding:30px 24px;border-radius:22px}
 body:has(.xl-public-header) .pub-hero h1{font-size:clamp(32px,9vw,43px)}
 body:has(.xl-public-header) .pub-actions{align-items:stretch;flex-direction:column}
 body:has(.xl-public-header) .pub-actions a{width:100%;box-sizing:border-box}
 body:has(.xl-public-header) .pub-stats{gap:9px;margin-bottom:35px}
 body:has(.xl-public-header) .pub-stats>div{padding:20px}
 body:has(.xl-public-header) .pub-section:has(.pub-steps){padding:34px 19px}
 body:has(.xl-public-header) .pub-steps{grid-template-columns:1fr}
 body:has(.xl-public-header) .pub-steps article{min-height:0}
 body:has(.xl-public-header) .pub-footer{margin-top:44px;flex-direction:column}
 body:has(.xl-public-header) .pub-banner{padding:24px}
}
@media(prefers-reduced-motion:reduce){body:has(.xl-public-header) .pub-store,body:has(.xl-public-header) .pub-primary{transition:none}}

/* ===== FULL-RATIO PUBLIC LAYOUT / 2026-10-12 =====
   Presentation only. Applies to customer/public pages using xl-public-header.
   Admin and CS interfaces have separate layouts. */
body:has(.xl-public-header){overflow-x:clip}
body:has(.xl-public-header) .shell{
  box-sizing:border-box;
  width:100%;
  max-width:none;
  margin-left:0;
  margin-right:0;
  padding-inline:clamp(16px,4vw,76px);
}
/* Normal content may occupy the entire available page width.
   Keep intentionally narrow modal/login/voucher/QR elements constrained. */
body:has(.xl-public-header) .shell > .card:not(.login):not(.ticket),
body:has(.xl-public-header) .shell > .card.wide,
body:has(.xl-public-header) .wide{
  width:100%;
  max-width:none;
  min-width:0;
}
body:has(.xl-public-header) .shell > *,
body:has(.xl-public-header) .pub-hero,
body:has(.xl-public-header) .pub-banner,
body:has(.xl-public-header) .pub-section{
  min-width:0;
}
/* Full-bleed gradient sections; FAQ/promo cards retain readable inner padding. */
body:has(.xl-public-header) .pub-section:has(.pub-steps){
  margin-left:calc(-1 * clamp(16px,4vw,76px));
  margin-right:calc(-1 * clamp(16px,4vw,76px));
  border-radius:0;
}
body:has(.xl-public-header) .pub-footer{
  box-sizing:border-box;
  width:auto;
  max-width:none;
  margin-left:calc(-1 * clamp(16px,4vw,76px));
  margin-right:calc(-1 * clamp(16px,4vw,76px));
  padding-left:clamp(22px,5vw,86px);
  padding-right:clamp(22px,5vw,86px);
  border-radius:48% 48% 0 0 / 55px 55px 0 0;
}
/* Preserve a practical reading width for lengthy copy, not for its page section. */
body:has(.xl-public-header) .pub-banner p,
body:has(.xl-public-header) .pub-info-panel p{overflow-wrap:break-word}
@media(max-width:800px){
 body:has(.xl-public-header) .shell{padding-inline:clamp(14px,3vw,26px)}
 body:has(.xl-public-header) .pub-section:has(.pub-steps),
 body:has(.xl-public-header) .pub-footer{
   margin-left:calc(-1 * clamp(14px,3vw,26px));
   margin-right:calc(-1 * clamp(14px,3vw,26px));
 }
 body:has(.xl-public-header) .pub-section:has(.pub-steps){border-radius:0}
 body:has(.xl-public-header) .pub-footer{border-radius:30px 30px 0 0}
}
@media(max-width:580px){
 body:has(.xl-public-header) .shell{padding-inline:12px}
 body:has(.xl-public-header) .pub-section:has(.pub-steps),
 body:has(.xl-public-header) .pub-footer{margin-left:-12px;margin-right:-12px}
 body:has(.xl-public-header) .pub-banner{padding:22px 18px}
 body:has(.xl-public-header) .pub-footer{padding:34px 20px;border-radius:22px 22px 0 0}
}
