/* Existing eSIM actions stay separate from the link that opens an order. */
.topup-actions { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.account-orders .topup-actions { margin:0 24px 20px 84px; padding:14px 0 0; border-top:1px solid var(--rule); }
.account-orders .topup-actions:empty { display:none; }
.topup-actions .topup-action { min-height:40px; padding:8px 13px; font-size:13px; border-radius:10px; background:var(--soft); color:var(--go); border:1px solid transparent; box-shadow:none; }
.account-orders .topup-action { min-height:40px; background:var(--soft); color:var(--go); box-shadow:none; font-weight:600; }
.account-orders .topup-action:focus-visible { outline:2px solid var(--go); outline-offset:3px; }
@media(hover:hover) { .account-orders .topup-action:hover { background:#DCEAFF; color:var(--go); box-shadow:none; } }
.topup-status { color:var(--dim); font-size:12px; line-height:1.5; }
.topup-retry { border:0; background:transparent; color:var(--go); padding:6px 0; font:500 13px var(--font); cursor:pointer; text-align:left; }
.topup-retry:focus-visible { outline:3px solid #9fc3ff; outline-offset:3px; }
.order-topups { margin:16px 0; padding:16px; background:var(--surface); border:1px solid var(--rule); border-radius:14px; }
.topup-result p { color:var(--dim); line-height:1.6; }
.topup-open { overflow:hidden; }
.topup-dialog { padding:0; width:min(560px, calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 40px); border:1px solid var(--rule); border-radius:20px; color:var(--ink); background:var(--surface); box-shadow:0 20px 70px #102c5333; }
.topup-dialog::backdrop { background:#132c4f66; }
.topup-panel { display:flex; flex-direction:column; max-height:calc(100dvh - 42px); }
.topup-header { display:flex; align-items:flex-start; gap:16px; justify-content:space-between; padding:24px 24px 16px; border-bottom:1px solid var(--rule); }
.topup-header h2 { font:600 23px/1.25 var(--font); letter-spacing:-.03em; margin:0 0 8px; }
.topup-header p { margin:0; color:var(--dim); font-size:13px; line-height:1.6; }
.topup-header .topup-current { color:var(--ink); margin-bottom:6px; font-weight:500; overflow-wrap:anywhere; }
.topup-close { border:0; background:var(--soft); color:var(--ink); width:36px; height:36px; border-radius:50%; flex:0 0 36px; font:24px/1 var(--font); cursor:pointer; }
.topup-body { padding:20px 24px; overflow:auto; overscroll-behavior:contain; }
.topup-options { margin:0; padding:0; border:0; display:grid; gap:10px; min-width:0; }
.topup-options legend { padding:0 0 12px; font-weight:600; font-size:15px; }
.topup-option { display:flex; align-items:flex-start; gap:12px; padding:15px; border:1px solid var(--rule); border-radius:13px; background:var(--surface); cursor:pointer; }
.topup-option.is-selected { border-color:var(--go); box-shadow:inset 0 0 0 1px var(--go); background:#f7faff; }
.topup-option input { margin:4px 0 0; width:17px; height:17px; flex:0 0 17px; accent-color:var(--go); }
.topup-option-main { display:flex; flex-direction:column; min-width:0; flex:1; gap:5px; }
.topup-option-main b { font-size:19px; font-weight:600; line-height:1.25; }
.topup-option-main span,.topup-option-main small { font-size:12px; line-height:1.5; color:var(--dim); overflow-wrap:anywhere; }
.topup-option-main .plan-policy { margin:0; }
.topup-option strong { font-size:16px; font-weight:600; white-space:nowrap; line-height:1.5; }
.topup-timing { color:var(--dim); font-size:12px; line-height:1.65; margin:16px 0 0; }
.topup-demo { padding:9px 12px; margin:0 0 16px; color:var(--go); background:var(--soft); border-radius:9px; font-size:12px; line-height:1.5; }
.topup-error { margin-top:14px; font-size:13px; color:var(--dim); }
.topup-error p { margin:0; }
.topup-footer { padding:16px 24px 22px; border-top:1px solid var(--rule); display:flex; align-items:center; gap:16px; justify-content:space-between; }
.topup-footer>div { display:flex; flex-direction:column; gap:4px; min-width:0; }
.topup-footer span { font-size:12px; color:var(--dim); }
.topup-footer b { font-size:22px; font-weight:600; line-height:1.3; }
.topup-footer .btn { min-height:44px; padding:10px 17px; font-size:14px; }
.topup-dialog button:disabled { opacity:.55; cursor:default; }
@media(min-width:600px) and (max-width:899px) {
  .account-orders .topup-actions { margin:0 18px 18px 74px; }
}
@media(max-width:599px) {
  .account-orders .topup-actions { margin:0 16px 16px; padding:12px 0 0; gap:8px; }
  .topup-actions .topup-action { min-height:36px; padding:7px 10px; font-size:12px; }
  .account-orders .topup-action { flex:1 1 auto; min-height:40px; line-height:1.4; }
  .order-topups { padding:12px; margin:12px 0; }
  .topup-dialog { width:calc(100vw - 20px); max-height:calc(100dvh - 20px); border-radius:16px; }
  .topup-panel { max-height:calc(100dvh - 22px); }
  .topup-header { padding:18px 16px 13px; gap:10px; }
  .topup-header h2 { font-size:20px; }
  .topup-header p { font-size:12px; }
  .topup-body { padding:14px 16px; }
  .topup-option { padding:12px; gap:9px; flex-wrap:wrap; }
  .topup-option-main { flex-basis:calc(100% - 30px); }
  .topup-option strong { padding-left:26px; font-size:16px; }
  .topup-footer { padding:13px 16px 16px; flex-wrap:wrap; gap:12px; }
  .topup-footer b { font-size:20px; }
  .topup-footer .btn { flex:1 1 150px; }
}