/*
 * Exentra captive portal collection.
 * All templates keep the same accessible DOM, payment flow and brand palette;
 * they change presentation only. Operator customization remains logo/content.
 */
[data-portal-template]{--pt-navy:#0a2e6b;--pt-blue:#1677ff;--pt-gold:#ffc107;--pt-ink:#0f172a;--pt-muted:#52637a;--pt-line:#dfe7f1;--pt-paper:#f8faff}
.customer-page[data-portal-template]{color:var(--pt-ink)}
.customer-page[data-portal-template] .customer-brand img{width:44px;height:44px;object-fit:contain}
.customer-page[data-portal-template] .customer-plan,.customer-page[data-portal-template] .customer-checkout,.customer-page[data-portal-template] .customer-recovery{transition:border-color .2s,box-shadow .2s,transform .2s}

/* 01 Signal — balanced default */
.customer-page[data-portal-template="signal"]{background:linear-gradient(145deg,#eef5ff,#fff9e5)}
.customer-page[data-portal-template="signal"] .customer-card{border-top:4px solid var(--pt-gold)}

/* 02 Orbit — centered halo */
.customer-page[data-portal-template="orbit"]{background:radial-gradient(circle at 50% 14%,rgba(22,119,255,.22),transparent 31%),var(--pt-navy)}
.customer-page[data-portal-template="orbit"] .customer-card{border:0;border-radius:30px;box-shadow:0 34px 100px rgba(0,0,0,.3)}
.customer-page[data-portal-template="orbit"] .customer-brand{justify-content:center;text-align:center}.customer-page[data-portal-template="orbit"] #buy-view>h1,.customer-page[data-portal-template="orbit"] #buy-view>p{text-align:center}
.customer-page[data-portal-template="orbit"] .customer-brand img{width:58px;height:58px;padding:8px;border:1px solid #cddbf0;border-radius:50%;box-shadow:0 0 0 8px #f2f7ff}

/* 03 Metro — compact list */
.customer-page[data-portal-template="metro"]{align-items:start;background:#edf2f8}
.customer-page[data-portal-template="metro"] .customer-card{width:min(900px,100%);margin-top:18px;border-radius:8px;border-left:8px solid var(--pt-blue);box-shadow:0 14px 34px rgba(15,23,42,.1)}
.customer-page[data-portal-template="metro"] .customer-plans{grid-template-columns:1fr}.customer-page[data-portal-template="metro"] .customer-plan{display:grid;grid-template-columns:1.2fr auto;column-gap:18px;border-radius:6px}
.customer-page[data-portal-template="metro"] .customer-plan span{grid-column:2;grid-row:1}.customer-page[data-portal-template="metro"] .customer-plan small,.customer-page[data-portal-template="metro"] .customer-plan b{grid-column:1/-1}

/* 04 Horizon — spacious hospitality */
.customer-page[data-portal-template="horizon"]{background:linear-gradient(180deg,var(--pt-navy) 0 33%,#f3f7fd 33%)}
.customer-page[data-portal-template="horizon"] .customer-card{width:min(920px,100%);padding:40px;border-radius:24px}
.customer-page[data-portal-template="horizon"] .customer-brand{padding-bottom:20px;border-bottom:1px solid var(--pt-line)}
.customer-page[data-portal-template="horizon"] .customer-plans{grid-template-columns:repeat(3,1fr)}

/* 05 Pulse — bold pricing */
.customer-page[data-portal-template="pulse"]{background:linear-gradient(135deg,#f8faff 50%,#e7f1ff 50%)}
.customer-page[data-portal-template="pulse"] .customer-card{border:2px solid var(--pt-navy);box-shadow:12px 12px 0 var(--pt-gold)}
.customer-page[data-portal-template="pulse"] .customer-plan{border:2px solid var(--pt-line)}.customer-page[data-portal-template="pulse"] .customer-plan span{font-size:28px;color:var(--pt-blue)}
.customer-page[data-portal-template="pulse"] .customer-pay{background:var(--pt-gold);color:var(--pt-navy);box-shadow:none}

/* 06 Slate — dark technical */
.customer-page[data-portal-template="slate"]{--ink:#f4f7ff;--muted:#9fb0c8;--line:#2a3b56;--navy:#f4f7ff;--blue:#65a6ff;--blue-soft:#162b49;background:#071426;color:#f4f7ff}
.customer-page[data-portal-template="slate"] .customer-card{background:#0e2038;border-color:#2a3b56;box-shadow:0 30px 80px rgba(0,0,0,.42)}
.customer-page[data-portal-template="slate"] .customer-plan,.customer-page[data-portal-template="slate"] .customer-checkout,.customer-page[data-portal-template="slate"] .customer-recovery,.customer-page[data-portal-template="slate"] input,.customer-page[data-portal-template="slate"] select{color:#f4f7ff;background:#132944;border-color:#304766}
.customer-page[data-portal-template="slate"] .customer-plan span,.customer-page[data-portal-template="slate"] .customer-plan b,.customer-page[data-portal-template="slate"] .customer-recovery summary{color:#7eb5ff}

/* 07 Kiosk — oversized touch targets */
.customer-page[data-portal-template="kiosk"]{background:#fff}
.customer-page[data-portal-template="kiosk"] .customer-card{width:min(640px,100%);border:0;box-shadow:none}
.customer-page[data-portal-template="kiosk"] .customer-card h1{font-size:40px}.customer-page[data-portal-template="kiosk"] .customer-plans{grid-template-columns:1fr}
.customer-page[data-portal-template="kiosk"] .customer-plan{padding:24px;border-width:2px}.customer-page[data-portal-template="kiosk"] .customer-plan strong{font-size:20px}.customer-page[data-portal-template="kiosk"] .customer-pay{min-height:58px;font-size:16px}

/* 08 Grid — network console */
.customer-page[data-portal-template="grid"]{background-color:#f7faff;background-image:linear-gradient(#dce8f8 1px,transparent 1px),linear-gradient(90deg,#dce8f8 1px,transparent 1px);background-size:28px 28px}
.customer-page[data-portal-template="grid"] .customer-card{border-radius:12px;border-color:#b9cbe2;box-shadow:0 0 0 6px rgba(255,255,255,.78)}
.customer-page[data-portal-template="grid"] .customer-brand small,.customer-page[data-portal-template="grid"] .customer-plan b{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;text-transform:uppercase;letter-spacing:.08em}
.customer-page[data-portal-template="grid"] .customer-plan{border-radius:4px}

/* 09 Breeze — soft and friendly */
.customer-page[data-portal-template="breeze"]{background:radial-gradient(circle at 10% 20%,#fff5c7,transparent 28%),radial-gradient(circle at 92% 80%,#dcecff,transparent 32%),#f8fbff}
.customer-page[data-portal-template="breeze"] .customer-card{border:0;border-radius:34px;box-shadow:0 28px 80px rgba(10,46,107,.12)}
.customer-page[data-portal-template="breeze"] .customer-plan,.customer-page[data-portal-template="breeze"] .customer-checkout,.customer-page[data-portal-template="breeze"] .customer-recovery{border-radius:20px}
.customer-page[data-portal-template="breeze"] .customer-pay{border-radius:999px}

/* 10 Night — navy and gold */
.customer-page[data-portal-template="night"]{--ink:#f8fafc;--muted:#b8c4d6;--line:#34496c;--navy:#ffc107;--blue:#ffc107;--blue-soft:#263b5c;background:radial-gradient(circle at 50% 0,rgba(22,119,255,.25),transparent 38%),#020b19;color:#f8fafc}
.customer-page[data-portal-template="night"] .customer-card{background:linear-gradient(160deg,#0a2e6b,#071d42);border-color:#385782;box-shadow:0 34px 100px rgba(0,0,0,.5)}
.customer-page[data-portal-template="night"] .customer-plan,.customer-page[data-portal-template="night"] .customer-checkout,.customer-page[data-portal-template="night"] .customer-recovery,.customer-page[data-portal-template="night"] input,.customer-page[data-portal-template="night"] select{color:#f8fafc;background:rgba(255,255,255,.07);border-color:#46638c}
.customer-page[data-portal-template="night"] .customer-plan span,.customer-page[data-portal-template="night"] .customer-plan b,.customer-page[data-portal-template="night"] .customer-recovery summary{color:var(--pt-gold)}
.customer-page[data-portal-template="night"] .customer-pay{background:var(--pt-gold);color:var(--pt-navy);box-shadow:none}

/* Dedicated runtime adapts the same collection without changing checkout JS. */
.portal-customer[data-portal-template="orbit"] .topbar,.portal-customer[data-portal-template="night"] .topbar{border-bottom:4px solid var(--gold)}
.portal-customer[data-portal-template="metro"] .topbar{padding-bottom:16px}.portal-customer[data-portal-template="metro"] .hero{margin-top:16px}.portal-customer[data-portal-template="metro"] .packages{gap:6px}.portal-customer[data-portal-template="metro"] .card{border-radius:6px}
.portal-customer[data-portal-template="horizon"] .wrap{max-width:720px}.portal-customer[data-portal-template="horizon"] .packages{display:grid;grid-template-columns:repeat(2,1fr)}
.portal-customer[data-portal-template="pulse"] .card{border:2px solid var(--navy);box-shadow:6px 6px 0 var(--gold)}.portal-customer[data-portal-template="pulse"] .pay-btn{background:var(--gold);color:var(--navy-deep)}
.portal-customer[data-portal-template="slate"],.portal-customer[data-portal-template="night"]{--paper:#071426;--ink:#f4f7ff;--ink-soft:#a9b8cc;--line:#2c405e}.portal-customer[data-portal-template="slate"] .card,.portal-customer[data-portal-template="slate"] .checkout,.portal-customer[data-portal-template="slate"] .help-card,.portal-customer[data-portal-template="night"] .card,.portal-customer[data-portal-template="night"] .checkout,.portal-customer[data-portal-template="night"] .help-card{background:#0e2038}
.portal-customer[data-portal-template="kiosk"] .wrap{max-width:620px}.portal-customer[data-portal-template="kiosk"] .hero h1{font-size:42px}.portal-customer[data-portal-template="kiosk"] .pay-btn{min-height:58px}
.portal-customer[data-portal-template="grid"]{background-color:#f7faff;background-image:linear-gradient(#dce8f8 1px,transparent 1px),linear-gradient(90deg,#dce8f8 1px,transparent 1px);background-size:28px 28px}.portal-customer[data-portal-template="grid"] .card{border-radius:4px}
.portal-customer[data-portal-template="breeze"] .card,.portal-customer[data-portal-template="breeze"] .checkout,.portal-customer[data-portal-template="breeze"] .help-card{border-radius:22px}.portal-customer[data-portal-template="breeze"] .pay-btn{border-radius:999px}

/* Voucher login page uses the same selected presentation. */
.voucher-portal[data-portal-template="signal"] .top{border-bottom:4px solid var(--gold)}
.voucher-portal[data-portal-template="orbit"]{background:radial-gradient(circle at 50% 10%,#dceaff,transparent 30%),var(--paper)}.voucher-portal[data-portal-template="orbit"] .top{border-radius:50% 50% 20px 20px}.voucher-portal[data-portal-template="orbit"] .ring{width:58px;height:58px}
.voucher-portal[data-portal-template="metro"] .wrap{max-width:620px}.voucher-portal[data-portal-template="metro"] .top,.voucher-portal[data-portal-template="metro"] .card{border-radius:7px}.voucher-portal[data-portal-template="metro"] .top{text-align:left;border-left:8px solid var(--gold)}
.voucher-portal[data-portal-template="horizon"] .wrap{max-width:680px}.voucher-portal[data-portal-template="horizon"] .top{padding:36px}.voucher-portal[data-portal-template="horizon"] .card{padding:28px}
.voucher-portal[data-portal-template="pulse"] .card{border:2px solid var(--navy);box-shadow:8px 8px 0 var(--gold)}
.voucher-portal[data-portal-template="slate"],.voucher-portal[data-portal-template="night"]{--paper:#071426;--ink:#f4f7ff;--ink-soft:#a9b8cc;--line:#2c405e}.voucher-portal[data-portal-template="slate"] .card,.voucher-portal[data-portal-template="night"] .card{background:#0e2038}.voucher-portal[data-portal-template="slate"] #code,.voucher-portal[data-portal-template="night"] #code{background:#071426;color:#fff}
.voucher-portal[data-portal-template="kiosk"] .wrap{max-width:600px}.voucher-portal[data-portal-template="kiosk"] .top h1{font-size:28px}.voucher-portal[data-portal-template="kiosk"] #code,.voucher-portal[data-portal-template="kiosk"] .btn,.voucher-portal[data-portal-template="kiosk"] .buy{min-height:58px;font-size:18px}
.voucher-portal[data-portal-template="grid"]{background-color:#f7faff;background-image:linear-gradient(#dce8f8 1px,transparent 1px),linear-gradient(90deg,#dce8f8 1px,transparent 1px);background-size:28px 28px}.voucher-portal[data-portal-template="grid"] .top,.voucher-portal[data-portal-template="grid"] .card{border-radius:4px}
.voucher-portal[data-portal-template="breeze"] .top,.voucher-portal[data-portal-template="breeze"] .card{border-radius:28px}.voucher-portal[data-portal-template="breeze"] .btn,.voucher-portal[data-portal-template="breeze"] .buy{border-radius:999px}
.voucher-portal[data-portal-template="night"] .top{border:1px solid #46638c;border-bottom:4px solid var(--gold)}

@media(max-width:720px){
 .customer-page[data-portal-template="horizon"] .customer-plans,.portal-customer[data-portal-template="horizon"] .packages{grid-template-columns:1fr}
 .customer-page[data-portal-template="horizon"] .customer-card{padding:26px}
 .customer-page[data-portal-template="kiosk"] .customer-card h1{font-size:32px}
}