/* Maps WHMCS and Bootstrap markup onto the site's own design tokens, so every WHMCS page that has no custom template
   (tickets, account details, knowledge base, domains, ...) still looks like the rest of the site.
   Load order: Twenty-One all.min.css (Bootstrap grid and components), then site.css, then this file. */
body.whmcs{background:var(--bg);color:var(--ink);font-family:var(--f-ui);margin:0}
body.whmcs a{color:inherit}
.whmcs-main{padding-bottom:40px}
.whmcs-layout{display:block}
.whmcs-layout.client{display:grid;grid-template-columns:240px minmax(0,1fr);gap:28px;align-items:start}
.whmcs-content{min-width:0}
@media (max-width:900px){.whmcs-layout.client{grid-template-columns:1fr}}
.rb-hide{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
label.cyc,label.os-tile,label.loc,label.paycard{cursor:pointer}
.whmcs-content label.loc,.whmcs-content label.os-tile,.whmcs-content label.cyc,.whmcs-content label.paycard{font-weight:400;color:var(--ink)}
.whmcs-content label.loc[aria-pressed="true"]{font-weight:600}
label.loc[hidden]{display:none}
label.os-tile:has(input:focus-visible),label.cyc:has(input:focus-visible){outline:2px solid var(--field);outline-offset:2px}
.qty-in{width:96px;height:44px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);color:var(--ink);padding:0 12px;font:inherit}
.side-group{margin-bottom:18px}.side-h{display:block;margin:0 0 6px 12px;color:var(--muted);font-size:.78rem;font-weight:600;letter-spacing:.02em;text-transform:uppercase}
.side-body{padding:6px 12px;color:var(--muted);font-size:.92rem}
.rb-list{display:grid}.rb-row{display:flex;justify-content:space-between;gap:12px;padding:14px 18px;border-top:1px solid var(--line);text-decoration:none;color:var(--ink)}.rb-row:hover{background:var(--hov-bg,rgba(255,191,47,.14))}
.rb-groups{margin:0 0 22px}.rb-groups a.on{background:var(--sel-bg);border-color:var(--hov-bd)}
.rb-feat{color:inherit}.rb-desc{line-height:1.7}
.inv-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px}.inv-top .logo{display:flex;align-items:center;gap:10px;font-weight:700;text-decoration:none}.inv-actions{display:flex;gap:8px;flex-wrap:wrap}
.inv-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-bottom:22px}.inv-meta address{font-style:normal;line-height:1.55;margin-top:4px}.inv-meta b{display:block}
@media (max-width:700px){.inv-meta{grid-template-columns:1fr}}
.data tr.sub td,.data tr.tot td{border-top:1px solid var(--line)}
@media print{.nav,footer,.inv-actions,.toast,#dueBar{display:none!important}body.whmcs{background:#fff;color:#111}}

/* Bootstrap components */
.whmcs-content .card,.whmcs-content .panel,.whmcs-content .well{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-win);box-shadow:none}
.whmcs-content .card-header,.whmcs-content .panel-heading{background:transparent;border-bottom:1px solid var(--line);color:var(--ink);font-family:var(--f-display);font-weight:700;padding:14px 18px}
.whmcs-content .card-body,.whmcs-content .panel-body{padding:18px}
.whmcs-content .card-footer,.whmcs-content .panel-footer{background:transparent;border-top:1px solid var(--line)}
.whmcs-content .form-control,.whmcs-content .custom-select,.whmcs-content select.form-control,.whmcs-content textarea.form-control{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-ctl);min-height:44px;box-shadow:none}
.whmcs-content .form-control:focus{border-color:var(--field);box-shadow:0 0 0 3px rgba(111,149,255,.25)}
.whmcs-content label,.whmcs-content .control-label{color:var(--ink);font-weight:600}
.whmcs-content .btn-default,.whmcs-content .btn-secondary,.whmcs-content .btn-outline-primary{background:transparent;color:var(--ink);border:1px solid var(--line);border-radius:var(--r-ctl)}
.whmcs-content .btn-default:hover,.whmcs-content .btn-secondary:hover{background:var(--hov-bg);border-color:var(--hov-bd);color:var(--ink)}
.whmcs-content .btn-success,.whmcs-content .btn-info,.whmcs-content .btn-warning{border-radius:var(--r-ctl)}
.whmcs-content .btn-danger{border-radius:var(--r-ctl)}
.whmcs-content .alert{border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);color:var(--ink)}
.whmcs-content .alert-danger{border-color:rgba(255,111,147,.5);background:rgba(255,111,147,.1)}
.whmcs-content .alert-success{border-color:rgba(126,224,168,.5);background:rgba(126,224,168,.1)}
.whmcs-content .alert-warning,.whmcs-content .alert-info{border-color:var(--hov-bd);background:var(--hov-bg)}
.whmcs-content .table{color:var(--ink);--bs-table-bg:transparent}
.whmcs-content .table th,.whmcs-content .table td{border-color:var(--line)!important}
.whmcs-content .table thead th{color:var(--muted);font-weight:600;font-size:.85rem}
.whmcs-content .table-striped tbody tr:nth-of-type(odd){background:rgba(127,140,180,.06)}
.whmcs-content .list-group-item{background:var(--surface);color:var(--ink);border-color:var(--line)}
.whmcs-content .list-group-item.active{background:var(--sel-bg);border-color:var(--hov-bd);color:var(--ink)}
.whmcs-content .nav-tabs{border-color:var(--line)}.whmcs-content .nav-tabs .nav-link{color:var(--muted);border-radius:var(--r-ctl) var(--r-ctl) 0 0}
.whmcs-content .nav-tabs .nav-link.active{background:var(--surface);color:var(--ink);border-color:var(--line) var(--line) var(--surface)}
.whmcs-content .badge,.whmcs-content .label{border-radius:var(--r-pill);font-weight:700}
.whmcs-content .modal-content{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-win)}
.whmcs-content h1,.whmcs-content h2,.whmcs-content h3,.whmcs-content h4{font-family:var(--f-display);color:var(--ink)}
.whmcs-content a:not(.btn):not(.rb-row):not(.cta){color:var(--field)}
.whmcs-content hr{border-color:var(--line)}
.dataTables_wrapper .dataTables_filter input,.dataTables_wrapper select{background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:var(--r-ctl)}
.dataTables_wrapper .page-item .page-link{background:var(--surface);color:var(--ink);border-color:var(--line)}
.dataTables_wrapper .page-item.active .page-link{background:var(--sel-bg);border-color:var(--hov-bd);color:var(--ink)}

/* portal home and plan list: light windows like order */
.rb-types{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin-bottom:14px}
.whmcs-content a.rb-type{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--line);border-radius:var(--r-win);background:var(--surface);color:var(--ink);text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .2s}
.whmcs-content a.rb-type:hover{border-color:var(--field);box-shadow:var(--shadow-win);transform:translateY(-2px);color:var(--ink)}
.rb-ti{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:var(--r-ctl);background:var(--field);color:#fff;font-size:1.3rem}
.rb-type b{display:block}.rb-type small{display:block;color:var(--muted)}.rb-type .rb-go{margin-left:auto;color:var(--field)}
.rb-scroll{overflow-x:auto}
.rb-pt{width:100%}.rb-pt td{vertical-align:middle}.rb-r{text-align:right;white-space:nowrap}.rb-pt th.rb-r{text-align:right}
.rb-price{font-size:1.25rem}.rb-pt .rb-desc{max-width:420px;color:var(--muted);line-height:1.5}
.whmcs-content .rb-pt .btn{text-decoration:none}
@media (max-width:760px){
  .rb-pt thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .rb-pt,.rb-pt tbody{display:block}
  .rb-pt tr{display:grid;gap:6px;padding:16px;border-bottom:1px solid var(--line)}
  .rb-pt td{display:block;padding:0;border:0;text-align:left}.rb-pt td.rb-r{text-align:left}
}

.alert[hidden],[hidden].alert{display:none!important}

/* ---------- "Preparing your checkout" while the order page's choices are added to the cart ---------- */
.rb-busy{position:fixed;inset:0;z-index:2000;display:grid;place-items:center;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(6px)}
.rb-busy-box{display:grid;justify-items:center;gap:8px;padding:32px 36px;border-radius:var(--r-win);background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-win);text-align:center;max-width:360px}
.rb-busy-box b{font-family:var(--f-display);font-size:1.25rem}.rb-busy-box small{color:var(--muted)}
.rb-spin{width:38px;height:38px;border-radius:50%;border:4px solid var(--surface-2);border-top-color:var(--field);animation:rbspin .8s linear infinite}
@keyframes rbspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.rb-spin{animation-duration:2.4s}}

/* ---------- cart items and totals (cart and checkout) ---------- */
.rb-item{display:grid;gap:6px;padding:14px 0;border-bottom:1px solid var(--line)}
.rb-item:first-child{padding-top:0}.rb-item:last-of-type{border-bottom:0}
.rb-item-h{display:flex;justify-content:space-between;gap:14px;align-items:baseline}
.rb-item-h b{font-size:.98rem;line-height:1.35}.rb-item-h .tnum{font-weight:700;white-space:nowrap}
.rb-item-d{display:flex;flex-wrap:wrap;gap:4px 14px;color:var(--muted);font-size:.86rem}
.rb-item-a{display:flex;gap:8px;margin-top:4px}
.rb-totals{margin-top:6px}.rb-totals .sum-due{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:baseline;margin-top:12px}
.rb-totals .sum-due small{grid-column:1/-1;color:var(--muted)}
.rb-co .summary .rb-item-h b{font-size:.9rem}
.rb-edit{margin-left:auto;margin-right:8px}

/* ---------- checkout: WHMCS's own form (card and PayPal fields hook into it), compact and in the site's style ---------- */
.rb-co-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;padding:30px 0 18px}
.rb-co-head h1{font-size:clamp(1.8rem,3vw,2.4rem);font-weight:800;letter-spacing:-.035em;margin:10px 0 6px}
.rb-co-head p{margin:0;color:var(--muted);max-width:60ch}
.rb-co-mc{width:120px;height:auto;margin-bottom:-18px;filter:drop-shadow(0 12px 18px rgba(10,19,48,.18))}
.rb-co-steps{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.rb-co-steps li{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px 0 6px;border-radius:var(--r-pill);background:var(--surface);border:1px solid var(--line);font-size:.82rem;font-weight:700;color:var(--muted)}
.rb-co-steps li span,.rb-co-steps li .ph{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--surface-2);font-size:.72rem}
.rb-co-steps li.done{color:var(--ok)}.rb-co-steps li.done .ph{background:var(--ok-bg);color:var(--ok)}
.rb-co-steps li.on{color:var(--ink)}.rb-co-steps li.on span{background:var(--field);color:#fff}
.rb-co{grid-template-columns:minmax(0,1fr) 360px;gap:24px;padding-bottom:64px}
.rb-checkout #order-standard_cart{padding:0;margin:0;color:var(--ink)}
.rb-checkout #order-standard_cart > .row{display:block;margin:0}
.rb-checkout #order-standard_cart .cart-sidebar,.rb-checkout #order-standard_cart .sidebar-collapsed,.rb-checkout #order-standard_cart .header-lined{display:none!important}
.rb-checkout #order-standard_cart .cart-body{float:none;width:100%;max-width:100%;flex:0 0 100%;padding:0}
.rb-checkout #order-standard_cart .row{margin-left:-6px;margin-right:-6px}
.rb-checkout #order-standard_cart [class*="col-"]{padding-left:6px;padding-right:6px}
/* sign-in line: one quiet row */
.rb-checkout #order-standard_cart .already-registered{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:10px 12px 10px 16px;border:1px solid var(--line);border-radius:var(--r-win);background:var(--surface)}
.rb-checkout #order-standard_cart .already-registered p{margin:0;color:var(--muted);font-size:.9rem;order:-1}
.rb-checkout #order-standard_cart .already-registered .float-right,.rb-checkout #order-standard_cart .already-registered .pull-right{float:none}
.rb-checkout #order-standard_cart .already-registered .btn{min-height:36px;padding:0 14px;border-radius:var(--r-ctl);border:1px solid var(--line);background:var(--surface);color:var(--field);font-weight:700;font-size:.88rem;box-shadow:none}
.rb-checkout #order-standard_cart .already-registered .btn:hover{border-color:var(--field)}
/* the form: one card, section titles left-aligned in one style, no bands */
.rb-checkout #frmCheckout{background:var(--surface);border:1px solid color-mix(in srgb,var(--line) 75%,transparent);border-radius:var(--r-win);box-shadow:var(--shadow-soft);padding:6px 20px 20px;margin-bottom:0}
.rb-checkout #order-standard_cart .sub-heading,.rb-checkout #order-standard_cart .sub-heading.rb-first{display:block;height:auto;margin:18px 0 10px;padding:14px 0 0;border:0;border-top:1px solid var(--line);background:none;text-align:left!important}
.rb-checkout #order-standard_cart .sub-heading.rb-first{margin-top:6px;padding-top:8px;border-top:0}
.rb-checkout #order-standard_cart .sub-heading span,.rb-checkout #order-standard_cart .sub-heading span.primary-bg-color{display:inline-flex!important;align-items:center;justify-content:flex-start;gap:8px;height:auto;padding:0;margin:0;background:none!important;border:0;color:var(--ink)!important;font-family:var(--f-ui);font-size:.95rem;font-weight:700;letter-spacing:0;line-height:1.3}
.rb-checkout #order-standard_cart .sub-heading .ph{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:color-mix(in srgb,var(--field) 10%,var(--surface));color:var(--field);font-size:.9rem}
.rb-checkout #order-standard_cart .form-group{margin-bottom:10px}
.rb-checkout #order-standard_cart input.field,.rb-checkout #order-standard_cart select.field,.rb-checkout #order-standard_cart .form-control{display:block;margin:0;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);color:var(--ink);font:inherit;font-size:.93rem;box-shadow:none}
.rb-checkout #order-standard_cart textarea.form-control,.rb-checkout #order-standard_cart textarea.field{height:auto;min-height:72px;padding:10px 12px}
.rb-checkout #order-standard_cart .prepend-icon{position:relative}
.rb-checkout #order-standard_cart .prepend-icon .field{padding-left:38px}
.rb-checkout #order-standard_cart .prepend-icon .field-icon{position:absolute;left:0;top:0;width:38px;height:42px;margin:0;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.82rem;z-index:2}
.rb-checkout #order-standard_cart .intl-tel-input{width:100%}
.rb-checkout #order-standard_cart .form-control:focus,.rb-checkout #order-standard_cart .field:focus{border-color:var(--field);box-shadow:0 0 0 3px color-mix(in srgb,var(--field) 16%,transparent);outline:none}
.rb-checkout #order-standard_cart .generate-password{min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);color:var(--ink);font-weight:600;font-size:.86rem}
.rb-checkout #order-standard_cart .password-strength-meter .progress{height:5px;border-radius:99px;background:var(--surface-2);margin-top:12px}
.rb-checkout #order-standard_cart #passwordStrengthTextLabel{margin-top:4px;font-size:.8rem;text-align:left!important}
/* payment: a slim total line, gateways as compact options */
.rb-checkout #order-standard_cart #totalDueToday{display:flex;justify-content:space-between;align-items:center;gap:12px;text-align:left;margin:0 0 10px;padding:10px 14px;border-radius:var(--r-ctl);border:1px solid var(--line);background:color-mix(in srgb,var(--surface-2) 55%,var(--surface));color:var(--muted);font-size:.9rem}
.rb-checkout #order-standard_cart #totalDueToday strong{font-family:var(--f-display);font-size:1.15rem;font-weight:800;color:var(--ink)}
.rb-checkout #order-standard_cart #paymentGatewaysContainer > p{color:var(--muted);font-size:.86rem;margin:0 0 8px}
.rb-checkout #order-standard_cart #paymentGatewaysContainer .text-center{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px;text-align:left}
.rb-checkout #order-standard_cart #paymentGatewaysContainer label.radio-inline{display:flex;align-items:center;gap:10px;margin:0;min-height:46px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);font-weight:600;cursor:pointer}
.rb-checkout #order-standard_cart #paymentGatewaysContainer label.radio-inline:has(input:checked){border-color:var(--field);background:color-mix(in srgb,var(--field) 7%,var(--surface));box-shadow:0 0 0 1px var(--field) inset}
.rb-checkout .rb-nogw{padding:10px 12px;border-radius:var(--r-ctl);background:var(--warn-bg);color:var(--warn);font-weight:600}
.rb-checkout #order-standard_cart .cc-input-container{margin-top:10px;padding:14px;border:1px solid var(--line);border-radius:var(--r-win);background:color-mix(in srgb,var(--surface-2) 45%,var(--surface))}
.rb-checkout #order-standard_cart .cc-input-container ul{list-style:none;padding:0;margin:0 0 8px;font-size:.88rem}
.rb-checkout #order-standard_cart .cc-input-container label{font-size:.82rem;font-weight:600;color:var(--muted)}
.rb-checkout #order-standard_cart .marketing-email-optin{margin-top:12px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-ctl)}
.rb-checkout #order-standard_cart .marketing-email-optin h4{font-size:.92rem;margin:0 0 2px}
.rb-checkout #order-standard_cart .marketing-email-optin p{color:var(--muted);font-size:.82rem;margin:0 0 8px}
.rb-checkout #order-standard_cart #btnCompleteOrder{width:100%;min-height:50px;margin-top:14px;border:0;border-radius:var(--r-win);background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:1rem;box-shadow:0 4px 0 rgba(0,0,0,.1)}
.rb-checkout #order-standard_cart #btnCompleteOrder:hover{background:var(--accent-hover)}
.rb-checkout #order-standard_cart .checkout-error-feedback{border-radius:var(--r-ctl)}
/* order summary: one card per server, details as a tidy list, the order button right there */
.rb-co .summary .win-body{padding:16px 18px}
.rb-co .rb-item{padding:0 0 12px;margin-bottom:12px;border-bottom:1px solid var(--line)}
.rb-co .rb-item-h{align-items:flex-start}.rb-co .rb-item-h b{font-size:.92rem;line-height:1.35}.rb-co .rb-item-h .tnum{font-size:.92rem}
.rb-item-l{list-style:none;margin:10px 0 0;padding:10px 12px;border-radius:var(--r-ctl);background:color-mix(in srgb,var(--surface-2) 55%,var(--surface));display:grid;gap:7px}
.rb-item-l li{display:grid;grid-template-columns:18px auto minmax(0,1fr);align-items:center;gap:8px;font-size:.84rem}
.rb-item-l .ph{color:var(--field);font-size:.95rem}
.rb-item-l span{color:var(--muted)}
.rb-item-l b{font-weight:600;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb-co .rb-totals{margin-top:0}
.rb-co .rb-totals .sum-due{padding:12px 14px}
.rb-co-go{width:100%;margin-top:14px;min-height:50px}
.rb-co-safe{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0;color:var(--muted);font-size:.8rem;line-height:1.4}
.rb-co-safe .ph{color:var(--ok);font-size:1rem;flex:none}
@media (max-width:1000px){.rb-co{grid-template-columns:minmax(0,1fr)}.rb-co>*{min-width:0}.rb-co .summary{position:static;order:-1}.rb-co-go{display:none}.rb-co-mc{display:none}}
.rb-checkout #order-standard_cart .already-registered p{flex:1;min-width:220px}
.rb-checkout #order-standard_cart .checkout-security-msg{display:flex;align-items:center;gap:10px;margin:12px 0 0;padding:10px 14px;border:0;border-radius:var(--r-ctl);background:transparent;color:var(--muted);font-size:.8rem;line-height:1.4}
.rb-checkout #order-standard_cart .checkout-security-msg .fas,.rb-checkout #order-standard_cart .checkout-security-msg .fa-lock{font-size:.9rem;color:var(--ok);float:none;margin:0}
.rb-checkout #order-standard_cart .cc-input-container .row{row-gap:8px}
.rb-checkout #order-standard_cart #btnCompleteOrder .fas{display:none}

/* ---------- themed dropdowns (rb-select.js): the list opens under the field, in the site's style ---------- */
.rb-sel{position:relative;display:inline-block;vertical-align:middle;min-width:160px}
.rb-sel.is-wide{display:block;width:100%}
.rb-sel-native{position:absolute!important;inset:0;width:100%!important;height:100%!important;opacity:0!important;pointer-events:none!important;margin:0!important}
.rb-sel-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;padding:0 12px 0 14px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);color:var(--ink);font:inherit;font-size:.95rem;text-align:left;cursor:pointer;transition:border-color .15s,box-shadow .15s}
.rb-sel-btn:hover{border-color:color-mix(in srgb,var(--field) 45%,var(--line))}
.rb-sel-btn:focus-visible,.rb-sel.is-open .rb-sel-btn{outline:none;border-color:var(--field);box-shadow:0 0 0 3px color-mix(in srgb,var(--field) 16%,transparent)}
.rb-sel-btn:disabled{opacity:.55;cursor:not-allowed}
.rb-sel-v{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb-sel-c{flex:none;width:8px;height:8px;margin-top:-4px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);transition:transform .2s var(--ease)}
.rb-sel.is-open .rb-sel-c{transform:rotate(225deg);margin-top:4px}
.rb-sel-list{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:1050;max-height:300px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:12px;background:var(--surface);box-shadow:var(--shadow-win);animation:rbSelIn .16s var(--ease)}
.rb-sel.up .rb-sel-list{top:auto;bottom:calc(100% + 6px)}
.rb-sel:not(.is-wide) .rb-sel-list{right:auto;min-width:100%;width:max-content;max-width:min(520px,90vw)}
@keyframes rbSelIn{from{opacity:0;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.rb-sel-list{animation:none}}
.rb-sel-o{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:38px;padding:7px 10px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-size:.92rem;text-align:left;cursor:pointer}
.rb-sel-o:hover,.rb-sel-o:focus{outline:none;background:var(--surface-2)}
.rb-sel-o.on{color:var(--field);font-weight:700}
.rb-sel-o.on::after{content:"";flex:none;width:6px;height:11px;margin-right:4px;border-right:2px solid var(--field);border-bottom:2px solid var(--field);transform:rotate(45deg) translateY(-2px)}
.rb-sel-o:disabled{color:var(--muted);opacity:.55;cursor:not-allowed}
.rb-sel-g{padding:8px 10px 4px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
/* inside WHMCS's prepend-icon fields the button makes room for the icon */
.prepend-icon .rb-sel-btn{padding-left:38px}
.rb-checkout #order-standard_cart .rb-sel-btn{min-height:42px;font-size:.93rem}

/* ---------- WHMCS pages inside the client area: cards, ticket view, attachments, side panels ---------- */
.rb-content .card{margin-bottom:18px;border-radius:16px;border:1px solid color-mix(in srgb,var(--line) 75%,transparent);box-shadow:var(--shadow-soft);overflow:hidden}
.rb-content .card + .card{margin-top:0}
.rb-content .card-body{padding:20px 22px}
.rb-content .card-title,.rb-content .card-body > h3:first-child,.rb-content .card-body > h2:first-child{font-size:1.15rem;font-weight:800;letter-spacing:-.01em;margin:0 0 14px;line-height:1.3}
.rb-content .form-group{margin-bottom:14px}
.rb-content .form-group > label,.rb-content label.col-form-label{font-size:.88rem;font-weight:700;margin-bottom:6px}
.rb-content .text-center > .btn + .btn{margin-left:8px}
/* ticket messages */
.rb-content .ticket-reply{margin:0 0 14px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.rb-content .ticket-reply.staff{background:color-mix(in srgb,var(--field) 5%,var(--surface));border-color:color-mix(in srgb,var(--field) 25%,var(--line))}
.rb-content .ticket-reply .posted-by{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid var(--line);font-size:.86rem;color:var(--muted)}
.rb-content .ticket-reply .posted-by-name{font-weight:800;color:var(--ink);font-size:.95rem}
.rb-content .ticket-reply .message{font-size:.96rem;line-height:1.65;color:var(--ink)}
.rb-content .ticket-reply .ipaddress,.rb-content .ticket-reply .ip-address{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line);font-size:.8rem;color:var(--muted)}
.rb-content .ticket-reply .attachments{margin-top:10px;font-size:.88rem}
.rb-content .label,.rb-content .badge{display:inline-flex;align-items:center;height:22px;padding:0 9px;border-radius:var(--r-pill);font-size:.72rem;font-weight:800;line-height:1}
/* attachments: file field, Browse and Add More on one aligned row */
.rb-content .attachment-group,.rb-content .input-group.attachment-group{display:flex;flex-wrap:nowrap;align-items:stretch;gap:8px;margin-bottom:8px}
.rb-content .attachment-group .custom-file{position:relative;flex:1;min-width:0;height:44px;margin:0}
.rb-content .custom-file-input{position:absolute;inset:0;width:100%;height:44px;opacity:0;cursor:pointer;z-index:2;margin:0}
.rb-content .custom-file-label{position:absolute;inset:0;display:flex;align-items:center;height:44px;margin:0;padding:0 110px 0 14px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface);color:var(--muted);font-weight:500;font-size:.92rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;box-shadow:none}
.rb-content .custom-file-label::after{top:4px;right:4px;bottom:4px;height:auto;display:flex;align-items:center;padding:0 14px;border:0;border-radius:6px;background:var(--surface-2);color:var(--ink);font-weight:700;font-size:.86rem;line-height:1}
.rb-content .attachment-group .input-group-append{display:flex;margin:0}
.rb-content .attachment-group .input-group-append .btn,.rb-content #btnTicketAttachmentsAdd{display:inline-flex;align-items:center;gap:6px;height:44px;min-height:44px;padding:0 14px;margin:0;border:1px solid var(--line);border-radius:var(--r-ctl)!important;background:var(--surface);color:var(--ink);font-weight:700;font-size:.88rem;white-space:nowrap}
.rb-content #btnTicketAttachmentsAdd:hover{border-color:var(--field);color:var(--field)}
.rb-content #fileUploadsContainer > *{margin-bottom:8px}
.rb-content #fileUploadsContainer .custom-file{position:relative;height:44px}
.rb-content .attachment-group + .text-muted,.rb-content .form-text,.rb-content small.text-muted{display:block;margin-top:4px;font-size:.8rem;color:var(--muted)}
.rb-content .markdown-editor,.rb-content .md-editor{border-radius:var(--r-ctl);overflow:hidden}
/* side panels (ticket information, account menus): label above value, nothing runs together */
.rb-ctx{min-width:0}
.rb-ctx .card{margin-bottom:14px}
.rb-ctx .card-body{padding:14px 16px;font-size:.9rem;overflow-wrap:anywhere}
.rb-ctx .list-group-item{display:block!important;padding:11px 16px!important;line-height:1.4;overflow-wrap:anywhere}
.rb-ctx .list-group-item br{display:none}
.rb-ctx .list-group-item .title{display:block;margin-bottom:3px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.rb-ctx .list-group-item .label,.rb-ctx .list-group-item .badge{margin-left:4px;vertical-align:middle}
.rb-ctx a.list-group-item:not([href]),.rb-ctx a.list-group-item[href=""]{pointer-events:none}
.rb-ctx .card-header .badge{float:right}
.rb-ctx .card-footer{padding:12px 16px;background:transparent;border-top:1px solid var(--line)}
.rb-ctx .card-footer .btn{width:100%;margin:4px 0}

/* WHMCS hides template rows and messages with these classes; site styles (.alert, .btn display) must not reveal them */
.w-hidden,.hidden,[hidden]{display:none!important}
/* CC recipients card: email list, empty hint, and an aligned add field */
.rb-sb .ticket-cc-email{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 0;border-top:1px solid var(--line);font-size:.88rem}
.rb-sb .ticket-cc-email:first-child{border-top:0;padding-top:0}
.rb-sb .ticket-cc-email:has(.email:empty){display:none}
.rb-sb .ticket-cc-email .email{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rb-sb .ticket-cc-email .float-right,.rb-sb .ticket-cc-email .pull-right{float:none!important;margin:0}
.rb-sb .delete-cc-email{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:var(--bad)!important}
.rb-sb .delete-cc-email:hover{background:var(--bad-bg)}
.rb-sb-body:not(:has(.ticket-cc-email .email:not(:empty))):has(.ticket-cc-email),.rb-sb-body:empty{padding:12px 16px}
.rb-sb-body:not(:has(.ticket-cc-email .email:not(:empty))):has(.ticket-cc-email)::before{content:"No one is copied on this ticket yet.";display:block;color:var(--muted);font-size:.86rem}
.rb-sb-foot .input-group{display:flex!important;flex-wrap:nowrap;align-items:stretch;width:100%;gap:0}
.rb-sb-foot .input-group .form-control{flex:1 1 auto;min-width:0;width:auto;height:40px;min-height:40px;margin:0;padding:0 12px;border-radius:var(--r-ctl) 0 0 var(--r-ctl)!important;font-size:.88rem}
.rb-sb-foot .input-group-btn,.rb-sb-foot .input-group-append{display:flex;margin:0}
.rb-sb-foot .input-group .btn{width:auto!important;height:40px;min-height:40px;margin:0!important;padding:0 16px;border-radius:0 var(--r-ctl) var(--r-ctl) 0!important;border-left:0;background:var(--field)!important;border-color:var(--field)!important;color:#fff!important;font-weight:700}
.rb-sb-foot .input-group .btn:hover{background:var(--field-deep)!important}
.rb-sb-foot .alert{margin:10px 0 0;padding:8px 12px;font-size:.84rem}

/* Invoice page */
.rb-inv{max-width:880px;padding:32px 16px 72px}
.rb-inv .inv-top .logo{color:var(--ink)!important}
.rb-inv .inv-top .logo span{font-family:var(--f-display);font-weight:800;font-size:1.1rem;letter-spacing:-.02em}
.rb-inv .inv-actions .btn{height:38px;min-height:38px;background:var(--surface);color:var(--ink)!important}
.inv-note{display:flex;align-items:center;gap:10px;margin-bottom:14px;padding:12px 16px;border-radius:var(--r-win);background:var(--warn-bg);color:var(--warn);font-weight:600;font-size:.92rem}
.inv-note.ok{background:var(--ok-bg);color:var(--ok)}.inv-note.bad{background:var(--bad-bg);color:var(--bad)}.inv-note .ph{font-size:1.2rem}
.inv-card{padding:26px 28px 24px;border-radius:18px}
.inv-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:18px}
.inv-eyebrow{display:block;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.inv-head h1{margin:2px 0 0;font-size:1.7rem;line-height:1.1;letter-spacing:-.02em}
.inv-st{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border-radius:var(--r-pill);font-size:.82rem;font-weight:800;background:var(--surface-2);color:var(--muted)}
.inv-st.is-unpaid,.inv-st.is-draft{background:var(--warn-bg);color:var(--warn)}
.inv-st.is-overdue,.inv-st.is-cancelled,.inv-st.is-collections{background:var(--bad-bg);color:var(--bad)}
.inv-st.is-paid,.inv-st.is-refunded{background:var(--ok-bg);color:var(--ok)}
.inv-due{display:flex;align-items:center;justify-content:space-between;gap:18px 24px;flex-wrap:wrap;margin-bottom:24px;padding:22px 24px;border-radius:14px;background:linear-gradient(135deg,var(--field-deep),var(--field) 60%,var(--field-soft));color:#fff}
.inv-due-a span{display:block;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--on-field-muted)}
.inv-due-a b{display:block;margin:2px 0;font-family:var(--f-display);font-size:2rem;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.inv-due-a small{color:var(--on-field-muted);font-size:.9rem}
.inv-due.is-paid{background:linear-gradient(135deg,#0b5e3b,var(--ok))}
.inv-seal{font-size:2.6rem;opacity:.85}
.inv-due-p{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.inv-due-l{width:100%;margin:0;font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--on-field-muted)}
.inv-gw{margin:0;min-width:220px}
.inv-gw select,.inv-gw .rb-sel-btn{height:46px!important;min-height:46px;width:100%;border-radius:10px!important;border:1px solid rgba(255,255,255,.35)!important;background-color:#fff!important;color:var(--ink)!important;font-weight:600}
.inv-gw-fixed{display:flex;align-items:center;height:46px;padding:0 14px;border-radius:10px;background:rgba(255,255,255,.14);font-weight:700}
.inv-pay{display:flex}
.inv-pay form{margin:0}
.inv-pay .btn,.inv-pay a,.inv-pay button,.inv-pay input[type=submit],.inv-pay input[type=button]{display:inline-flex!important;align-items:center;justify-content:center;gap:8px;height:46px!important;min-height:46px;padding:0 22px!important;border:0!important;border-radius:10px!important;background:var(--accent)!important;color:var(--accent-ink)!important;font:inherit;font-weight:800!important;font-size:.98rem!important;text-decoration:none!important;cursor:pointer;opacity:1!important;box-shadow:0 10px 22px -12px rgba(0,0,0,.6)}
.inv-pay .btn:hover,.inv-pay a:hover,.inv-pay button:hover,.inv-pay input[type=submit]:hover{background:var(--accent-hover)!important}
.inv-pay img{max-height:40px}

.rb-inv .inv-meta{padding-bottom:22px;border-bottom:1px solid var(--line)}
.rb-inv .inv-meta address b{display:block;color:var(--ink)}
.rb-inv .inv-meta .fine{display:block;margin-bottom:4px;font-size:.76rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.inv-dates{display:grid;gap:12px}
.inv-items{width:100%;margin-top:8px}
.inv-items th.r,.inv-items td.r{text-align:right}
.rb-inv table.data th,.rb-inv table.data td{padding:12px 4px}
.inv-tot{display:grid;justify-content:end;gap:0;margin:8px 0 0;min-width:0}
.inv-tot > div{display:grid;grid-template-columns:minmax(120px,auto) minmax(120px,auto);gap:24px;padding:8px 4px;font-size:.94rem}
.inv-tot dt{color:var(--muted);font-weight:500;text-align:right}.inv-tot dd{margin:0;text-align:right}
.inv-tot .is-total{margin-top:4px;padding-top:12px;border-top:2px solid var(--ink)}
.inv-tot .is-total dt,.inv-tot .is-total dd{color:var(--ink);font-weight:800;font-size:1.08rem}
.inv-h3{margin:28px 0 4px;font-size:1.05rem}
.inv-notes{margin-top:20px;padding:14px 16px;border-radius:10px;background:var(--surface-2);font-size:.9rem}.inv-notes p{margin:4px 0 0}
.inv-help{margin-top:16px;text-align:center;color:var(--muted);font-size:.88rem}
@media (max-width:640px){.inv-card{padding:20px 18px}.inv-due-p,.inv-gw,.inv-pay,.inv-pay .btn,.inv-pay a,.inv-pay input[type=submit]{width:100%}.inv-top{flex-wrap:wrap}}
@media print{.inv-actions,.inv-due-p,.inv-help{display:none!important}.inv-card{box-shadow:none;border:0}}

/* Checkout header: one compact card the width of the page, steps, title and the mascot inside it */
.rb-co-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:4px 0 18px;padding:18px 24px;border:1px solid color-mix(in srgb,var(--field) 18%,var(--line));border-radius:16px;background:radial-gradient(120% 140% at 100% 0%,color-mix(in srgb,var(--field) 12%,transparent),transparent 60%),var(--surface);box-shadow:var(--shadow-soft)}
.rb-co-head h1{margin:10px 0 4px;font-size:1.65rem;line-height:1.1}
.rb-co-head p{font-size:.92rem;max-width:62ch}.rb-co-head p b{color:var(--ink)}
.rb-co-mc{flex:none;width:96px;height:auto;margin:-34px 4px -20px 0;filter:drop-shadow(0 10px 14px rgba(10,19,48,.18))}
.rb-co-steps li.now{border-color:color-mix(in srgb,var(--field) 45%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--field) 10%,transparent)}
.rb-co-steps li.done{background:var(--ok-bg);border-color:transparent}
.whmcs-main .rb-co-head{margin-top:22px}
/* signed in: the "enter your personal details" line has nothing to offer */
.rb-app-body .rb-checkout #order-standard_cart .already-registered{display:none!important}
/* account chooser: each account a selectable card */
.rb-checkout #order-standard_cart .account-select-container{margin:0 0 4px;padding:0;border:0;background:none}
.rb-checkout #order-standard_cart .account-select-container [class*="col-"]:has(> .account){margin-bottom:10px}
.rb-checkout #order-standard_cart .account-select-container [class*="col-"]:has(.account){padding:0;max-width:100%;flex:1 1 100%}
.rb-checkout #order-standard_cart .account-select-container .row:has(.account){margin:0}
.rb-checkout #order-standard_cart .account{position:relative;margin:0;padding:0;border:1px solid var(--line)!important;border-radius:12px;background:var(--surface)!important;transition:border-color .15s,box-shadow .15s}
.rb-checkout #order-standard_cart .account:hover{border-color:color-mix(in srgb,var(--field) 45%,var(--line))!important}
.rb-checkout #order-standard_cart .account:has(input:checked){border-color:var(--field)!important;background:color-mix(in srgb,var(--field) 6%,var(--surface))!important;box-shadow:inset 0 0 0 1px var(--field)}
.rb-checkout #order-standard_cart .account label{display:flex;align-items:flex-start;gap:12px;width:100%;margin:0;padding:14px 16px;cursor:pointer;font-weight:500;line-height:1.4}
.rb-checkout #order-standard_cart .account input[type=radio]{flex:none;width:18px;height:18px;margin:2px 0 0;accent-color:var(--field)}
.rb-checkout #order-standard_cart .account .iradio_square-blue{flex:none;margin-top:1px}
.rb-checkout #order-standard_cart .account .address{display:block;min-width:0;font-size:.92rem;color:var(--ink)}
.rb-checkout #order-standard_cart .account .address strong{font-weight:800}
.rb-checkout #order-standard_cart .account .address .small,.rb-checkout #order-standard_cart .account .address small{display:block;margin-top:4px;color:var(--muted);font-size:.8rem;line-height:1.45;text-transform:none}
.rb-checkout #order-standard_cart .account .address > br{display:none}
.rb-checkout #order-standard_cart .account .label,.rb-checkout #order-standard_cart .account .badge{display:inline-flex;align-items:center;height:20px;margin-left:6px;padding:0 8px;border-radius:999px;background:color-mix(in srgb,var(--field) 12%,var(--surface));color:var(--field);font-size:.68rem;font-weight:800;vertical-align:1px}
.rb-checkout #order-standard_cart .account:has(input[value="new"]) .address{font-weight:700;color:var(--field)}
.rb-checkout #order-standard_cart .account:has(input[value="new"]) .address::before{content:"+";display:inline-grid;place-items:center;width:18px;height:18px;margin-right:6px;border-radius:50%;background:color-mix(in srgb,var(--field) 12%,var(--surface));font-size:.8rem}
@media (max-width:640px){.rb-co-head{padding:16px}.rb-co-mc{display:none}}

/* Checkout: payment area. Section headings with even spacing */
.rb-checkout #order-standard_cart .sub-heading{margin:22px 0 12px!important;padding-top:18px!important}
.rb-checkout #order-standard_cart .sub-heading.rb-first{margin-top:6px!important;padding-top:8px!important}
.rb-checkout #order-standard_cart .sub-heading span{font-size:1rem!important}
/* card box: saved cards and "new card" as selectable rows, then the card fields */
.rb-checkout #order-standard_cart .cc-input-container{margin:12px 0 0;padding:14px;border-radius:12px}
.rb-checkout #order-standard_cart .existing-cc-grid{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;align-items:center;column-gap:12px;margin:0 0 8px;padding:4px 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.rb-checkout #order-standard_cart .existing-cc-grid .paymethod-info{display:flex;align-items:center;min-height:44px;margin:0;padding:0;font-size:.92rem;color:var(--ink)}
.rb-checkout #order-standard_cart .existing-cc-grid .paymethod-info:empty{display:none}
.rb-checkout #order-standard_cart .existing-cc-grid .paymethod-info .fab,.rb-checkout #order-standard_cart .existing-cc-grid .paymethod-info .fas{font-size:1.3rem;color:var(--muted)}
.rb-checkout #order-standard_cart .existing-cc-grid .paymethod-info:nth-child(5n+4){justify-content:flex-end;color:var(--muted);font-variant-numeric:tabular-nums}
.rb-checkout #order-standard_cart .existing-cc-grid:has(input:checked){border-color:var(--field);background:color-mix(in srgb,var(--field) 6%,var(--surface));box-shadow:inset 0 0 0 1px var(--field)}
.rb-checkout #order-standard_cart .cc-input-container > ul{margin:0;padding:0 14px;list-style:none;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.rb-checkout #order-standard_cart .cc-input-container > ul:has(input:checked),.rb-checkout #order-standard_cart .cc-input-container > ul.selected{border-color:var(--field);background:color-mix(in srgb,var(--field) 6%,var(--surface));box-shadow:inset 0 0 0 1px var(--field)}
.rb-checkout #order-standard_cart .cc-input-container > ul li{margin:0}
.rb-checkout #order-standard_cart .cc-input-container > ul label.radio-inline{display:flex;align-items:center;gap:10px;min-height:44px;margin:0;padding:0;font-size:.92rem;font-weight:600;color:var(--ink);cursor:pointer}
.rb-checkout #order-standard_cart #existingCardInfo{margin:10px 0 0}
.rb-checkout #order-standard_cart #existingCardInfo [class*="col-"]{flex:0 0 220px;max-width:220px;padding:0}
/* Stripe's card fields: full width, labels above, one row of number / expiry / CVC */
.rb-checkout #stripeElements{margin:14px 0 0!important}
.rb-checkout #stripeElements .stripe-cards-inputs{float:none;width:100%;max-width:100%;flex:0 0 100%;margin:0!important;padding:0}
.rb-checkout #stripeElements .row{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr);gap:12px;margin:0}
.rb-checkout #stripeElements .row > [class*="col-"]{float:none;width:auto;max-width:none;flex:none;padding:0;margin:0}
.rb-checkout #stripeElements label{position:static;display:block;width:auto;height:auto;margin:0 0 6px;padding:0;background:none;border:0;font-size:.8rem;font-weight:700;color:var(--muted);line-height:1.3;text-decoration:none}
.rb-checkout #stripeElements .form-control{display:flex;flex-direction:column;justify-content:center;height:44px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r-ctl);background:var(--surface)}
.rb-checkout #stripeElements .form-control > div{width:100%}
.rb-checkout #stripeElements .StripeElement--focus{border-color:var(--field);box-shadow:0 0 0 3px color-mix(in srgb,var(--field) 16%,transparent)}
.rb-checkout #stripeElements .StripeElement--invalid{border-color:var(--bad)}
.rb-checkout #stripeElements #stripeCardType{display:none}
.rb-checkout #order-standard_cart #newCardSaveSettings{margin-top:12px}
.rb-checkout #order-standard_cart #newCardSaveSettings .row{margin:0}
.rb-checkout #order-standard_cart #inputDescriptionContainer{flex:0 0 100%;max-width:100%;margin-left:0!important;padding:0}
.rb-checkout #order-standard_cart .gateway-errors,.rb-checkout #order-standard_cart .assisted-cc-input-feedback{margin-top:10px;border-radius:var(--r-ctl);font-size:.88rem}
@media (max-width:640px){.rb-checkout #stripeElements .row{grid-template-columns:1fr 1fr}.rb-checkout #stripeElements .row > :first-child{grid-column:1 / -1}}
/* notes */
.rb-checkout #order-standard_cart textarea[name=notes]{min-height:96px;font-size:.92rem;resize:vertical}
/* the security note under the form: one quiet line, lock icon first */
.rb-checkout #order-standard_cart .alert.checkout-security-msg{position:relative;display:block;margin:14px 0 0;padding:12px 16px 12px 44px;border:1px solid color-mix(in srgb,var(--ok) 25%,var(--line));border-radius:12px;background:color-mix(in srgb,var(--ok-bg) 55%,var(--surface));color:var(--muted);font-size:.84rem;line-height:1.5;text-align:left}
.rb-checkout #order-standard_cart .checkout-security-msg > i{position:absolute;left:16px;top:13px;color:var(--ok);font-size:1rem}
.rb-checkout #order-standard_cart .checkout-security-msg strong{color:var(--ink);font-family:var(--f-mono);font-size:.8rem;font-weight:500}
.rb-checkout #order-standard_cart .checkout-security-msg .clearfix{display:none}

/* Sign in: room under the menu, and the "Or sign in with" Google button from WHMCS Sign-In Integrations */
.whmcs-main .rb-login{margin-top:clamp(28px,4.5vw,56px)}
.rbl-social:empty{display:none}
.rbl-social{margin:18px 0 0}
.rbl-social .sub-heading{display:flex;align-items:center;gap:12px;margin:0 0 14px;padding:0;border:0;background:none;text-align:center}
.rbl-social .sub-heading::before,.rbl-social .sub-heading::after{content:"";flex:1;height:1px;background:var(--line)}
.rbl-social .sub-heading span,.rbl-social .sub-heading .primary-bg-color{padding:0;background:none!important;color:var(--muted)!important;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.rbl-social .row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:0}
.rbl-social .row > [class*="col-"]{flex:1 1 220px;max-width:100%;padding:0;display:flex;justify-content:center}
.rbl-social .btn-social,.rbl-social button,.rbl-social a.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:46px;border-radius:10px!important;border:1px solid var(--line)!important;background:#fff!important;color:#1f1f1f!important;font-weight:600}
.rbl-social iframe{max-width:100%}
.rbl-social #g_id_signin,.rbl-social [id^="g_id"]{display:flex;justify-content:center;width:100%}
.rbl-social .providerLinkingFeedback{margin-top:10px;font-size:.86rem}
.rbl-social .providerLinkingFeedback .alert{margin:0}

/* Register: same split card as sign in. Brand panel left (sticky), WHMCS's form right as numbered, flat sections */
.rb-reg{display:grid;grid-template-columns:minmax(280px,380px) minmax(0,1fr);max-width:1120px;margin:clamp(28px,4.5vw,56px) auto 96px;border:1px solid color-mix(in srgb,var(--line) 80%,transparent);border-radius:20px;overflow:hidden;background:var(--surface);box-shadow:var(--shadow-win)}
.rb-reg-brand{justify-content:flex-start}
.rb-reg-brand > *{position:relative;z-index:1}
.rb-reg-in{margin-top:auto!important;padding-top:18px;border-top:1px solid rgba(255,255,255,.18);color:#dbe5ff!important;font-size:.95rem}
.rb-reg-in a{display:inline-flex;align-items:center;gap:6px;color:#ffd978!important;font-weight:700;text-decoration:none}
.rb-reg-in a:hover{text-decoration:underline}
.rb-reg-main{padding:36px 40px 28px;min-width:0}
.rb-reg-h h2{margin:0;font-size:1.7rem;font-weight:800;letter-spacing:-.02em}
.rb-reg-h p{margin:4px 0 18px;color:var(--muted)}
/* WHMCS's own "Sign Up" bar is replaced by the heading above */
.rb-reg #containerNewUserSignup > .sub-heading{display:none}
/* Google: centred, then "or" before the form */
.rb-reg .providerPreLinking{margin:0 0 6px}
.rb-reg .social-signin-btns{display:flex;flex-direction:column;align-items:center;gap:10px}
.rb-reg .social-signin-btns::after{content:"or sign up with email";display:flex;align-items:center;gap:12px;width:100%;margin-top:14px;color:var(--muted);font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:linear-gradient(var(--line),var(--line)) left center/calc(50% - 110px) 1px no-repeat,linear-gradient(var(--line),var(--line)) right center/calc(50% - 110px) 1px no-repeat;justify-content:center}
.rb-reg .providerLinkingFeedback .alert{margin:10px 0 0;border-radius:10px}
/* sections: no boxes, a step number and a divider */
.rb-reg form{counter-reset:rbstep}
.rb-reg .card{margin:0!important;border:0;border-top:1px solid var(--line);border-radius:0;background:none;box-shadow:none}
.rb-reg #containerNewUserSignup .card:first-of-type{border-top:0}
.rb-reg .card-body{padding:20px 0 8px!important}
.rb-reg .card-title{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-family:var(--f-ui);font-size:1.02rem;font-weight:800;letter-spacing:0}
.rb-reg .card-title::before{counter-increment:rbstep;content:counter(rbstep);display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:color-mix(in srgb,var(--field) 12%,var(--surface));color:var(--field);font-size:.8rem;font-weight:800}
.rb-reg .card-body > p{color:var(--muted);font-size:.9rem;margin:0 0 10px}
.rb-reg .row{margin-left:-6px;margin-right:-6px}
.rb-reg .row > [class*="col-"]{padding-left:6px;padding-right:6px}
.rb-reg .form-group{margin-bottom:12px}
.rb-reg .field,.rb-reg .form-control,.rb-reg select.field{width:100%;height:46px;padding:0 12px 0 40px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font:inherit;font-size:.94rem;box-shadow:none}
.rb-reg textarea.form-control,.rb-reg textarea.field{height:auto;min-height:90px;padding:10px 12px}
.rb-reg .field:focus,.rb-reg .form-control:focus{border-color:var(--field);box-shadow:0 0 0 3px color-mix(in srgb,var(--field) 16%,transparent);outline:none}
.rb-reg .prepend-icon{position:relative}
.rb-reg .prepend-icon .field-icon{position:absolute;left:0;top:0;z-index:2;display:flex;align-items:center;justify-content:center;width:40px;height:46px;margin:0;color:var(--muted);font-size:.85rem;pointer-events:none}
.rb-reg .intl-tel-input{width:100%}
.rb-reg .intl-tel-input .field{padding-left:52px}
.rb-reg .rb-sel{width:100%}
.rb-reg .prepend-icon .rb-sel-btn{padding-left:40px}
/* password tools */
.rb-reg .generate-password{height:40px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--ink);font-weight:700;font-size:.86rem}
.rb-reg .generate-password:hover{border-color:var(--field);color:var(--field)}
.rb-reg .password-strength-meter .progress{height:6px;margin-top:8px;border-radius:99px;background:var(--surface-2)}
.rb-reg #passwordStrengthTextLabel{margin:6px 0 0;text-align:left!important;font-size:.8rem}
/* mailing list switch, captcha, terms, submit */
.rb-reg .bootstrap-switch{border-radius:99px}
.rb-reg #default-captcha-domainchecker{align-items:center;margin:8px 0 0;padding:14px;border:1px dashed var(--line);border-radius:12px;text-align:left}
.rb-reg #default-captcha-domainchecker p{flex:0 0 100%;max-width:100%;margin:0 0 10px;color:var(--muted);font-size:.86rem}
.rb-reg #default-captcha-domainchecker .captchaimage img{border-radius:8px;max-width:100%}
.rb-reg #inputCaptcha{height:46px;padding:0 12px;border-radius:10px;letter-spacing:.2em;font-family:var(--f-mono)}
.rb-reg .text-center.row.justify-content-center > [class*="col-"]{flex:0 0 100%;max-width:100%}
.rb-reg input[type=submit].btn-primary,.rb-reg button[type=submit].btn-primary{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:14px;border:0;border-radius:12px;background:var(--accent);color:var(--accent-ink);font-weight:800;font-size:1rem;box-shadow:0 10px 22px -12px rgba(255,170,40,.9)}
.rb-reg input[type=submit].btn-primary:hover{background:var(--accent-hover)}
.rb-reg .rb-reg-safe{justify-content:center;margin-top:14px}
.rb-reg .alert{border-radius:10px}
@media (min-width:901px){.rb-reg-brand{position:sticky;top:0;align-self:start;min-height:100%}}
@media (max-width:900px){.rb-reg{grid-template-columns:1fr;margin-bottom:64px}.rb-reg-brand{padding:24px 22px}.rb-reg-brand .rbl-mc{width:84px;height:84px}.rb-reg-brand h1{font-size:1.6rem}.rb-reg-brand .rbl-points{display:none}.rb-reg-main{padding:24px 20px}}
/* Google sign-in result message on the sign-in card */
.rbl-feedback:empty{display:none}
.rbl-feedback{margin:0 0 16px;padding:12px 14px;border-radius:10px;font-size:.9rem;line-height:1.5}
.rbl-feedback.alert-warning{border:1px solid rgba(255,191,47,.45);background:rgba(255,191,47,.12);color:#ffe7a8}
.rbl-feedback.alert-info{border:1px solid rgba(169,192,255,.4);background:rgba(169,192,255,.12);color:#dbe5ff}
.rbl-feedback.alert-success{border:1px solid rgba(95,214,160,.45);background:rgba(95,214,160,.12);color:#c9f5df}
.rbl-feedback.alert-danger{border:1px solid rgba(255,143,135,.45);background:rgba(255,143,135,.12);color:#ffd2ce}
.rbl-feedback img{vertical-align:-3px;margin-right:4px}
.rbl-fb-more{margin:8px 0 0;color:inherit;opacity:.95}
.rbl-fb-more a{color:#fff;font-weight:700;text-decoration:underline}
/* "Signing you in with Google" while google-signin.php works */
.rb-gbusy{position:fixed;inset:0;z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:rgba(7,13,31,.62);backdrop-filter:blur(4px);color:#fff;font-weight:700;font-size:1rem}
.rb-gbusy span{width:38px;height:38px;border-radius:50%;border:3px solid rgba(255,255,255,.25);border-top-color:#ffbf2f;animation:rbSpin .8s linear infinite}
@keyframes rbSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.rb-gbusy span{animation-duration:2.4s}}

/* Checkout payment choices: one card per method with what it accepts */
.rb-checkout #order-standard_cart #paymentGatewaysContainer .text-center{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))!important;gap:10px!important}
.rb-checkout #order-standard_cart #paymentGatewaysContainer label.rb-gw{align-items:flex-start!important;gap:12px!important;min-height:0!important;padding:14px 14px 12px!important;border-radius:12px!important;transition:border-color .15s,box-shadow .15s,background .15s}
.rb-checkout #order-standard_cart #paymentGatewaysContainer label.rb-gw:hover{border-color:color-mix(in srgb,var(--field) 45%,var(--line))}
.rb-checkout #order-standard_cart label.rb-gw > div,.rb-checkout #order-standard_cart label.rb-gw > input{flex:none;margin-top:2px!important}
.rb-gw-t{display:grid;gap:3px;min-width:0;text-align:left}
.rb-gw-t b{font-size:.98rem;font-weight:800;color:var(--ink)}
.rb-gw-t small{color:var(--muted);font-size:.78rem;font-weight:500;line-height:1.35}
.rb-gw-ic{margin-top:6px;line-height:0}
.rb-gw-ic .pm-row{gap:4px;flex-wrap:wrap}
.rb-gw-ic .pm{filter:none}
.rb-gw-ic .pm svg{height:17px;width:auto}
.rb-gw-note{display:none;align-items:flex-start;gap:8px;margin:10px 0 0;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--field) 6%,var(--surface));color:var(--muted);font-size:.84rem;line-height:1.45}
.rb-gw-note .ph{flex:none;margin-top:2px;color:var(--field)}
#frmCheckout:has(.rb-gw-crypto input:checked) .rb-gw-note-crypto{display:flex}

/* PayPal box: centred and narrower, so PayPal draws smaller buttons; the instructions as a quiet line */
#frmCheckout:has(input[name=paymentmethod][value^=paypal]:checked) .cc-input-container{text-align:center}
#frmCheckout:has(input[name=paymentmethod][value^=paypal]:checked) .cc-input-container > ul,
#frmCheckout:has(input[name=paymentmethod][value^=paypal]:checked) .cc-input-container .existing-cc-grid{max-width:360px;margin-left:auto;margin-right:auto;text-align:left}
#frmCheckout:has(input[name=paymentmethod][value^=paypal]:checked) .cc-input-container > ul label.radio-inline{min-height:42px;font-size:.88rem}
.rb-checkout #paypal_ppcpv_input_container{max-width:360px;margin:12px auto 0;text-align:center}
.rb-checkout #paypal_ppcpv_input_container .payment-instructions,.rb-checkout #paypal_ppcpv_input_container .approval-instructions{max-width:360px;margin:0 auto 10px;color:var(--muted);font-size:.84rem;line-height:1.45}
.rb-checkout #paypal_ppcpv_input_container_button{max-width:300px;margin:0 auto}
.rb-checkout #paypal_ppcpv_input_container_payer .payer-label{display:inline-flex;align-items:center;gap:8px;margin:0 auto 10px;padding:6px 12px;border:1px solid var(--line);border-radius:999px;background:var(--surface);font-size:.86rem}
.rb-checkout #paypal_ppcpv_input_container_payer .logo img{height:18px;width:auto}

/* Sign in: error and notice messages on the dark card; a failed sign-in also outlines the fields in red */
.rbl-msg:empty{display:none}
.rbl-msg .alert{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;padding:12px 14px;border-radius:10px;font-size:.92rem;line-height:1.45}
.rbl-msg .alert::before{font-family:"Phosphor";font-size:1.15rem;line-height:1.2}
.rbl-msg .alert-danger{border:1px solid rgba(255,143,135,.5);background:rgba(255,143,135,.14);color:#ffd2ce}
.rbl-msg .alert-danger::before{content:"\e4e2";color:#ff8f87}
.rbl-msg .alert-success{border:1px solid rgba(95,214,160,.45);background:rgba(95,214,160,.12);color:#c9f5df}
.rbl-msg .alert-warning,.rbl-msg .alert-info{border:1px solid rgba(169,192,255,.4);background:rgba(169,192,255,.12);color:#dbe5ff}
.rbl-card:has(.rbl-msg .alert-danger) .rbl-in input{border-color:#ff8f87!important;box-shadow:0 0 0 3px rgba(255,143,135,.18)}
.rbl-card:has(.rbl-msg .alert-danger) .rbl-in > .ph{color:#ff8f87}
.rbl-msg .alert-danger{animation:rblShake .4s ease 1}
@keyframes rblShake{20%,60%{transform:translateX(-5px)}40%,80%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.rbl-msg .alert-danger{animation:none}}

/* Register: white title on the blue panel (a WHMCS heading colour was winning) */
.rb-reg-brand h1,.rbl-brand h1{color:#fff!important;letter-spacing:-.03em}
.rb-reg-brand > p{color:#e3eaff!important}
/* Sign up header: eyebrow, title, line, and two reassurances on the right */
.rb-reg-h{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:18px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.rb-reg-eyebrow{display:inline-flex;align-items:center;gap:6px;margin-bottom:6px;padding:3px 10px;border-radius:999px;background:color-mix(in srgb,var(--field) 10%,var(--surface));color:var(--field);font-size:.74rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.rb-reg-h h2{font-size:1.9rem!important;letter-spacing:-.03em}
.rb-reg-h p{margin:4px 0 0!important}
.rb-reg-perks{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.rb-reg-perks li{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:.84rem;font-weight:600}
.rb-reg-perks .ph{color:var(--ok);font-size:1rem}
/* Upcoming offer: a holographic glass card in the brand blues. A rotating light ring frames it, a faint grid and a
   scan line move across, the mascot peeks over the top, and the countdown sits in glass tiles. */
@property --rbOfferA{syntax:"<angle>";inherits:false;initial-value:0deg}
.rb-offer{position:relative;margin-top:34px;padding:1.5px;border-radius:20px;isolation:isolate;
  background:conic-gradient(from var(--rbOfferA),#8fb0ff,#5ee7ff,#ffffff,#ffd36e,#8fb0ff 60%,#3463ea,#8fb0ff);animation:rbOfferSpin 6s linear infinite;
  box-shadow:0 24px 50px -22px rgba(4,12,48,.9),0 0 30px -8px rgba(94,231,255,.35)}
@keyframes rbOfferSpin{to{--rbOfferA:360deg}}
.rb-offer-in{position:relative;overflow:hidden;padding:18px 18px 16px;border-radius:19px;color:#fff;
  background:radial-gradient(120% 80% at 100% 0%,rgba(94,231,255,.22),transparent 55%),radial-gradient(90% 70% at 0% 100%,rgba(255,191,47,.16),transparent 60%),linear-gradient(160deg,rgba(18,40,130,.92),rgba(10,24,86,.94));
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.rb-offer-in::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(143,176,255,.10) 1px,transparent 1px),linear-gradient(90deg,rgba(143,176,255,.10) 1px,transparent 1px);background-size:18px 18px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%)}
.rb-offer-in::after{content:"";position:absolute;left:0;right:0;top:-40%;height:40%;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(94,231,255,.16),transparent);animation:rbOfferScan 5s ease-in-out infinite}
@keyframes rbOfferScan{0%,25%{transform:translateY(0)}100%{transform:translateY(360%)}}
.rb-offer-in > *{position:relative;z-index:1}
.rb-offer-mc{position:absolute;right:22px;top:-44px;z-index:2;width:92px;height:auto;filter:drop-shadow(0 8px 12px rgba(0,0,0,.35))}
.rb-offer-top{display:flex;align-items:center;justify-content:space-between;gap:8px}
.rb-offer-tag{display:inline-flex;align-items:center;gap:7px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(143,176,255,.35);color:#dbe5ff;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.rb-offer-dot{width:7px;height:7px;border-radius:50%;background:#5ee7ff;box-shadow:0 0 10px #5ee7ff}
.rb-offer.is-live .rb-offer-tag{background:rgba(255,77,77,.18);border-color:rgba(255,120,120,.6);color:#fff}
.rb-offer.is-live .rb-offer-dot{background:#ff5a5a;box-shadow:0 0 10px #ff5a5a;animation:rbLiveDot 1.2s ease-in-out infinite}
@keyframes rbLiveDot{50%{opacity:.35}}
.rb-offer-code{font-family:var(--f-mono);font-size:.68rem;letter-spacing:.2em;color:#8fb0ff;opacity:.85}
.rb-offer-name{margin:12px 0 4px!important;color:#fff!important;font-family:var(--f-display);font-size:1.12rem;font-weight:800;letter-spacing:-.01em}
.rb-offer-pct{display:flex;align-items:center;gap:6px;margin:0;line-height:.82}
.rb-offer-pct b{font-family:var(--f-display);font-size:4.4rem;font-weight:800;letter-spacing:-.06em;
  background:linear-gradient(180deg,#ffffff 10%,#bfe9ff 45%,#5ee7ff 70%,#ffd36e 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 18px rgba(94,231,255,.35))}
.rb-offer-pct-r{display:grid;gap:2px}
.rb-offer-pct-r i{font-style:normal;font-family:var(--f-display);font-weight:800;line-height:.9}
.rb-offer-pct-r i:first-child{font-size:2rem;color:#ffd36e}
.rb-offer-pct-r i:last-child{font-size:1.25rem;letter-spacing:.06em;color:#fff}
.rb-offer-line{margin:8px 0 0!important;color:#b9c9f5!important;font-size:.8rem;line-height:1.4}
.rb-offer-cd{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:14px 0 12px}
.rb-offer-cd span{display:grid;justify-items:center;gap:2px;padding:8px 0 6px;border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border:1px solid rgba(255,255,255,.16);box-shadow:inset 0 1px 0 rgba(255,255,255,.2);color:#9fb3e8;font-size:.62rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.rb-offer-cd b{font-family:var(--f-mono);font-size:1.3rem;font-weight:500;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 12px rgba(143,176,255,.6)}
.rb-offer-cd .is-s{border-color:rgba(94,231,255,.5);box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 0 16px -4px rgba(94,231,255,.6)}
.rb-offer-cd .is-s b{color:#bff3ff}
.rb-offer-note{display:flex;gap:8px;align-items:flex-start;margin:0!important;padding-top:10px;border-top:1px dashed rgba(143,176,255,.3);color:#c9d6ff!important;font-size:.8rem;line-height:1.45}
.rb-offer-note .ph{flex:none;margin-top:2px;color:#ffd36e}
@media (prefers-reduced-motion:reduce){.rb-offer,.rb-offer-in::after,.rb-offer.is-live .rb-offer-dot{animation:none}}
@media (max-width:900px){.rb-offer{margin-top:40px}.rb-offer-pct b{font-size:3.6rem}}

/* ================= Phones: checkout ================= */
@media (max-width:760px){
  .rb-co{gap:14px!important;padding-bottom:40px!important}
  .rb-co-head{padding:16px 18px!important;margin:6px 0 14px!important}
  .rb-co-head h1{font-size:1.6rem!important;margin:8px 0 4px!important}
  .rb-co-head p{font-size:.88rem}
  .rb-co-steps li{height:26px;font-size:.72rem;padding:0 9px 0 4px}
  .rb-co-steps li span,.rb-co-steps li .ph{width:18px;height:18px;font-size:.64rem}
  .rb-co .summary .win-body{padding:14px!important}
  .rb-co .summary .rb-item-h b{font-size:.86rem!important;line-height:1.3}
  .rb-checkout #order-standard_cart,.rb-checkout #order-standard_cart *{max-width:100%}
  .rb-checkout #order-standard_cart .row{margin-left:0!important;margin-right:0!important}
  .rb-checkout #order-standard_cart [class*="col-"]{padding-left:0!important;padding-right:0!important;width:100%;flex:0 0 100%}
  .rb-checkout #order-standard_cart p,.rb-checkout #order-standard_cart .text-center,.rb-checkout #order-standard_cart small{white-space:normal!important;overflow-wrap:anywhere}
  .rb-checkout #order-standard_cart .already-registered{flex-direction:column;align-items:stretch;text-align:left}
  .rb-checkout #order-standard_cart .already-registered .btn{width:100%;justify-content:center}
  .rb-checkout #frmCheckout{padding:4px 14px 16px!important}
  .rb-checkout .social-signin-btns{display:flex;flex-direction:column;align-items:stretch;gap:8px}
  .rb-checkout .social-signin-btns>*{width:100%!important;justify-content:center}
  .rb-checkout #order-standard_cart .prepend-icon .field-icon{left:12px}
}