/*!
 * PhotonSpark client theme (child of Twenty-One; styles Standard Cart pages) — PhotonSpark theme 1.1.5
 * GENERATED by theme/build.py. Edit theme/src/ and rebuild; do not edit this file.
 * Parent colour remap: 395 rules / 549 declarations.
 *   twenty-one/css/theme.css sha256:f15f903eeb8d35eb
 *   twenty-one/css/all.css sha256:b3b8e30ae7350838
 *   orderforms/standard_cart/css/all.css sha256:636e1d9f7daf2536
 */

/* ---- src/tokens.css ---- */
/* ==========================================================================
   PhotonSpark design tokens
   Mirrors photonspark.com: dark (default), light and contrast palettes are
   selected by <html data-theme="…">, shared with the main site through the
   ps_theme_v1 cookie. Button fills are darkened from the website gradient so
   white labels keep at least 4.5:1 contrast.
   ========================================================================== */

@font-face {
    font-family: "Sora";
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url("../fonts/sora/sora-latin-ext.woff2") format("woff2");
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Sora";
    font-style: normal;
    font-weight: 100 800;
    font-display: swap;
    src: url("../fonts/sora/sora-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* Metric-matched fallback used by photonspark.com, limits layout shift. */
@font-face {
    font-family: "Sora Fallback";
    src: local("Arial");
    ascent-override: 85.29%;
    descent-override: 25.5%;
    line-gap-override: 0%;
    size-adjust: 113.73%;
}

:root,
html[data-theme="dark"] {
    color-scheme: dark;

    --ps-bg: #0b1220;
    --ps-bg-rgb: 11, 18, 32;
    --ps-surface: #111c32;
    --ps-surface-rgb: 17, 28, 50;
    --ps-surface-2: #152240;
    --ps-surface-3: #1b2b4f;
    --ps-hero-mid: #0d1a3a;
    --ps-elevated: #13203a;

    --ps-text: #eaf2ff;
    --ps-text-rgb: 234, 242, 255;
    --ps-text-2: rgba(234, 242, 255, 0.8);
    --ps-muted: rgba(234, 242, 255, 0.64);
    --ps-subtle: rgba(234, 242, 255, 0.56);

    --ps-border: rgba(234, 242, 255, 0.1);
    --ps-border-soft: rgba(234, 242, 255, 0.06);
    --ps-border-strong: rgba(234, 242, 255, 0.18);
    --ps-input-bg: #0d1628;
    --ps-input-border: rgba(234, 242, 255, 0.16);

    --ps-primary: #6ea8fe;
    --ps-primary-rgb: 110, 168, 254;
    --ps-secondary: #3b6fd8;
    --ps-secondary-rgb: 59, 111, 216;
    --ps-accent: #9ad8ff;
    --ps-accent-rgb: 154, 216, 255;
    --ps-link: #6ea8fe;
    --ps-link-hover: #9ad8ff;
    --ps-on-accent: #ffffff;

    --ps-btn-from: #3b6fd8;
    --ps-btn-to: #2d5bc4;
    --ps-btn-hover-from: #4479e2;
    --ps-btn-hover-to: #3364cc;
    --ps-solid-bg: #ffffff;
    --ps-solid-fg: #0b1220;
    --ps-grad-fill: #0b1220;

    --ps-success: #34d399;
    --ps-success-rgb: 52, 211, 153;
    --ps-success-text: #6ee7b7;
    --ps-warning: #fbbf24;
    --ps-warning-rgb: 251, 191, 36;
    --ps-warning-text: #fcd34d;
    --ps-danger: #ff6b6b;
    --ps-danger-rgb: 255, 107, 107;
    --ps-danger-text: #ffb4b4;
    --ps-danger-solid: #dc2626;
    --ps-info: #9ad8ff;
    --ps-info-rgb: 154, 216, 255;
    --ps-info-text: #9ad8ff;
    --ps-neutral-rgb: 234, 242, 255;

    --ps-ring: rgba(110, 168, 254, 0.45);
    --ps-shadow-rgb: 0, 0, 0;
    --ps-shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.22);
    --ps-shadow-lg: 0 24px 48px rgba(0, 0, 0, 0.45);
    --ps-hero-bg: linear-gradient(135deg, #0b1220, #111c32, #0d1a3a, #111c32, #0b1220);
    --ps-watermark-opacity: 0.06;
}

html[data-theme="light"] {
    color-scheme: light;

    --ps-bg: #f4f7fc;
    --ps-bg-rgb: 244, 247, 252;
    --ps-surface: #ffffff;
    --ps-surface-rgb: 255, 255, 255;
    --ps-surface-2: #eef3fb;
    --ps-surface-3: #dce7f7;
    --ps-hero-mid: #dbe6f7;
    --ps-elevated: #ffffff;

    --ps-text: #0b1220;
    --ps-text-rgb: 11, 18, 32;
    --ps-text-2: rgba(11, 18, 32, 0.82);
    --ps-muted: rgba(11, 18, 32, 0.7);
    --ps-subtle: rgba(11, 18, 32, 0.62);

    --ps-border: rgba(11, 18, 32, 0.12);
    --ps-border-soft: rgba(11, 18, 32, 0.07);
    --ps-border-strong: rgba(11, 18, 32, 0.22);
    --ps-input-bg: #ffffff;
    --ps-input-border: rgba(11, 18, 32, 0.2);

    --ps-primary: #2563c9;
    --ps-primary-rgb: 37, 99, 201;
    --ps-secondary: #1d4ed8;
    --ps-secondary-rgb: 29, 78, 216;
    --ps-accent: #0e7490;
    --ps-accent-rgb: 14, 116, 144;
    --ps-link: #2563c9;
    --ps-link-hover: #1d4ed8;
    --ps-on-accent: #ffffff;

    --ps-btn-from: #2563c9;
    --ps-btn-to: #1d4ed8;
    --ps-btn-hover-from: #1f58b8;
    --ps-btn-hover-to: #1a45c2;
    --ps-solid-bg: #0b1220;
    --ps-solid-fg: #ffffff;
    --ps-grad-fill: #ffffff;

    --ps-success: #047857;
    --ps-success-rgb: 4, 120, 87;
    --ps-success-text: #036149;
    --ps-warning: #b45309;
    --ps-warning-rgb: 180, 83, 9;
    --ps-warning-text: #92400e;
    --ps-danger: #b91c1c;
    --ps-danger-rgb: 185, 28, 28;
    --ps-danger-text: #991b1b;
    --ps-danger-solid: #b91c1c;
    --ps-info: #0e7490;
    --ps-info-rgb: 14, 116, 144;
    --ps-info-text: #0b5f76;
    --ps-neutral-rgb: 11, 18, 32;

    --ps-ring: rgba(37, 99, 201, 0.38);
    --ps-shadow-rgb: 15, 23, 42;
    --ps-shadow: 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.07);
    --ps-shadow-lg: 0 24px 48px rgba(15, 23, 42, 0.14);
    --ps-hero-bg: linear-gradient(135deg, #eef3fc, #e4ecf9, #dbe6f7, #e4ecf9, #eef3fc);
    --ps-watermark-opacity: 0.08;
}

html[data-theme="contrast"] {
    color-scheme: dark;

    --ps-bg: #000000;
    --ps-bg-rgb: 0, 0, 0;
    --ps-surface: #161616;
    --ps-surface-rgb: 22, 22, 22;
    --ps-surface-2: #242424;
    --ps-surface-3: #333333;
    --ps-hero-mid: #000000;
    --ps-elevated: #161616;

    --ps-text: #ffffff;
    --ps-text-rgb: 255, 255, 255;
    --ps-text-2: #ffffff;
    --ps-muted: #ffffff;
    --ps-subtle: #e6e6e6;

    --ps-border: #ffffff;
    --ps-border-soft: rgba(255, 255, 255, 0.6);
    --ps-border-strong: #ffffff;
    --ps-input-bg: #000000;
    --ps-input-border: #ffffff;

    --ps-primary: #7cc4ff;
    --ps-primary-rgb: 124, 196, 255;
    --ps-secondary: #4493f8;
    --ps-secondary-rgb: 68, 147, 248;
    --ps-accent: #ffd23f;
    --ps-accent-rgb: 255, 210, 63;
    --ps-link: #7cc4ff;
    --ps-link-hover: #ffd23f;
    --ps-on-accent: #000000;

    --ps-btn-from: #7cc4ff;
    --ps-btn-to: #7cc4ff;
    --ps-btn-hover-from: #ffd23f;
    --ps-btn-hover-to: #ffd23f;
    --ps-solid-bg: #ffffff;
    --ps-solid-fg: #000000;
    --ps-grad-fill: #000000;

    --ps-success: #3ddc84;
    --ps-success-rgb: 61, 220, 132;
    --ps-success-text: #3ddc84;
    --ps-warning: #ffd23f;
    --ps-warning-rgb: 255, 210, 63;
    --ps-warning-text: #ffd23f;
    --ps-danger: #ff8a8a;
    --ps-danger-rgb: 255, 138, 138;
    --ps-danger-text: #ffffff;
    --ps-danger-solid: #ff8a8a;
    --ps-info: #7cc4ff;
    --ps-info-rgb: 124, 196, 255;
    --ps-info-text: #7cc4ff;
    --ps-neutral-rgb: 255, 255, 255;

    --ps-ring: #ffff00;
    --ps-shadow-rgb: 0, 0, 0;
    --ps-shadow: none;
    --ps-shadow-lg: none;
    --ps-hero-bg: #000000;
    --ps-watermark-opacity: 0.12;
}

:root {
    --ps-font: "Sora", "Sora Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --ps-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    --ps-radius-xs: 6px;
    --ps-radius-sm: 8px;
    --ps-radius: 12px;
    --ps-radius-md: 16px;
    --ps-radius-lg: 20px;
    --ps-ease: cubic-bezier(0.4, 0, 0.2, 1);
    --ps-header-h: 68px;

    /* Controls (1.1): three sizes with squared corners. Anything clickable uses
       these; round pills are kept for non-clickable status labels and counters. */
    --ps-ctl-sm: 36px;
    --ps-ctl: 44px;
    --ps-ctl-lg: 52px;
    --ps-ctl-r-sm: 8px;
    --ps-ctl-r: 10px;
    --ps-ctl-r-lg: 12px;
    --ps-card-r: 16px;
}

/* ---- generated: Twenty-One colour remap ---- */
body{color:var(--ps-text);background-color:var(--ps-surface)}
a{color:var(--ps-link)}
a:hover{color:var(--ps-link-hover)}
caption{color:var(--ps-muted)}
hr{border-top:1px solid var(--ps-border)}
.blockquote-footer{color:var(--ps-muted)}
.img-thumbnail{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.figure-caption{color:var(--ps-muted)}
pre{color:var(--ps-text)}
.table{color:var(--ps-text)}
.table th, .table td{border-top:1px solid var(--ps-border)}
.table thead th{border-bottom:2px solid var(--ps-border)}
.table tbody + tbody{border-top:2px solid var(--ps-border)}
.table-bordered{border:1px solid var(--ps-border)}
.table-bordered th, .table-bordered td{border:1px solid var(--ps-border)}
.table-striped tbody tr:nth-of-type(odd){background-color:rgba(var(--ps-neutral-rgb),.06)}
.table-hover tbody tr:hover{color:var(--ps-text);background-color:rgba(var(--ps-neutral-rgb),.06)}
.table-active, .table-active > th, .table-active > td{background-color:rgba(var(--ps-neutral-rgb),.06)}
.table-hover .table-active:hover{background-color:rgba(var(--ps-neutral-rgb),.06)}
.table-hover .table-active:hover > td, .table-hover .table-active:hover > th{background-color:rgba(var(--ps-neutral-rgb),.06)}
.table .thead-light th{color:var(--ps-text-2);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.form-control{color:var(--ps-text-2);background-color:var(--ps-surface);border:1px solid var(--ps-border-strong)}
.form-control:focus{color:var(--ps-text-2);background-color:var(--ps-surface);border-color:var(--ps-primary);box-shadow:0 0 0 0.2rem var(--ps-ring)}
.form-control::-moz-placeholder{color:var(--ps-muted)}
.form-control::placeholder{color:var(--ps-muted)}
.form-control:disabled, .form-control[readonly]{background-color:var(--ps-surface-2)}
select.form-control:focus::-ms-value{color:var(--ps-text-2);background-color:var(--ps-surface)}
.form-control-plaintext{color:var(--ps-text)}
.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label{color:var(--ps-muted)}
.was-validated .custom-select:valid, .custom-select.is-valid{background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%2328a745' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e") var(--ps-surface) no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem)}
.was-validated .custom-select:invalid, .custom-select.is-invalid{background:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e") var(--ps-surface) no-repeat center right 1.75rem/calc(0.75em + 0.375rem) calc(0.75em + 0.375rem)}
.btn{color:var(--ps-text)}
.btn:hover{color:var(--ps-text)}
.btn:focus, .btn.focus{box-shadow:0 0 0 0.2rem var(--ps-ring)}
.btn-light{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.btn-light:hover{color:var(--ps-text);background-color:var(--ps-surface-3);border-color:var(--ps-border)}
.btn-light:focus, .btn-light.focus{color:var(--ps-text);background-color:var(--ps-surface-3);border-color:var(--ps-border)}
.btn-light.disabled, .btn-light:disabled{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.btn-light:not(:disabled):not(.disabled):active, .btn-light:not(:disabled):not(.disabled).active, .show > .btn-light.dropdown-toggle{color:var(--ps-text);background-color:var(--ps-surface-3);border-color:var(--ps-border)}
.btn-outline-primary{color:var(--ps-link);border-color:var(--ps-primary)}
.btn-outline-primary:hover{background-color:var(--ps-secondary);border-color:var(--ps-primary)}
.btn-outline-primary:focus, .btn-outline-primary.focus{box-shadow:0 0 0 0.2rem var(--ps-ring)}
.btn-outline-primary.disabled, .btn-outline-primary:disabled{color:var(--ps-link)}
.btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle{background-color:var(--ps-secondary);border-color:var(--ps-primary)}
.btn-outline-primary:not(:disabled):not(.disabled):active:focus, .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-outline-primary.dropdown-toggle:focus{box-shadow:0 0 0 0.2rem var(--ps-ring)}
.btn-outline-secondary{color:var(--ps-muted)}
.btn-outline-secondary.disabled, .btn-outline-secondary:disabled{color:var(--ps-muted)}
.btn-outline-light{border-color:var(--ps-border)}
.btn-outline-light:hover{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.btn-outline-light:not(:disabled):not(.disabled):active, .btn-outline-light:not(:disabled):not(.disabled).active, .show > .btn-outline-light.dropdown-toggle{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.btn-link{color:var(--ps-link)}
.btn-link:hover{color:var(--ps-link-hover)}
.btn-link:disabled, .btn-link.disabled{color:var(--ps-muted)}
.dropdown-menu{color:var(--ps-text);background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.dropdown-divider{border-top:1px solid var(--ps-border)}
.dropdown-item{color:var(--ps-text)}
.dropdown-item:hover, .dropdown-item:focus{background-color:var(--ps-surface-2)}
.dropdown-item.active, .dropdown-item:active{background-color:var(--ps-secondary)}
.dropdown-item.disabled, .dropdown-item:disabled{color:var(--ps-muted)}
.dropdown-header{color:var(--ps-muted)}
.dropdown-item-text{color:var(--ps-text)}
.input-group-text{color:var(--ps-text-2);background-color:var(--ps-surface-2);border:1px solid var(--ps-border-strong)}
.custom-control-input:checked ~ .custom-control-label::before{border-color:var(--ps-primary);background-color:var(--ps-secondary)}
.custom-control-input:focus ~ .custom-control-label::before{box-shadow:0 0 0 0.2rem var(--ps-ring)}
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before{border-color:var(--ps-primary)}
.custom-control-input:not(:disabled):active ~ .custom-control-label::before{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-control-input[disabled] ~ .custom-control-label, .custom-control-input:disabled ~ .custom-control-label{color:var(--ps-muted)}
.custom-control-input[disabled] ~ .custom-control-label::before, .custom-control-input:disabled ~ .custom-control-label::before{background-color:var(--ps-surface-2)}
.custom-control-label::before{background-color:var(--ps-surface);border:var(--ps-border-strong) solid 1px}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before{border-color:var(--ps-primary);background-color:var(--ps-secondary)}
.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-switch .custom-control-input:checked ~ .custom-control-label::after{background-color:var(--ps-surface)}
.custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-select{color:var(--ps-text-2);background:var(--ps-surface) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;border:1px solid var(--ps-border-strong)}
.custom-select:focus{border-color:var(--ps-primary);box-shadow:0 0 0 0.2rem var(--ps-ring)}
.custom-select:focus::-ms-value{color:var(--ps-text-2);background-color:var(--ps-surface)}
.custom-select:disabled{color:var(--ps-muted);background-color:var(--ps-surface-2)}
.custom-file-input:focus ~ .custom-file-label{border-color:var(--ps-primary);box-shadow:0 0 0 0.2rem var(--ps-ring)}
.custom-file-input[disabled] ~ .custom-file-label, .custom-file-input:disabled ~ .custom-file-label{background-color:var(--ps-surface-2)}
.custom-file-label{color:var(--ps-text-2);background-color:var(--ps-surface);border:1px solid var(--ps-border-strong)}
.custom-file-label::after{color:var(--ps-text-2);background-color:var(--ps-surface-2)}
.custom-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff, 0 0 0 0.2rem var(--ps-ring)}
.custom-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff, 0 0 0 0.2rem var(--ps-ring)}
.custom-range:focus::-ms-thumb{box-shadow:0 0 0 1px #fff, 0 0 0 0.2rem var(--ps-ring)}
.custom-range::-webkit-slider-thumb{background-color:var(--ps-secondary)}
.custom-range::-webkit-slider-thumb:active{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-range::-webkit-slider-runnable-track{background-color:var(--ps-surface-3)}
.custom-range::-moz-range-thumb{background-color:var(--ps-secondary)}
.custom-range::-moz-range-thumb:active{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-range::-moz-range-track{background-color:var(--ps-surface-3)}
.custom-range::-ms-thumb{background-color:var(--ps-secondary)}
.custom-range::-ms-thumb:active{background-color:rgba(var(--ps-primary-rgb),.45)}
.custom-range::-ms-fill-lower{background-color:var(--ps-surface-3)}
.custom-range::-ms-fill-upper{background-color:var(--ps-surface-3)}
.nav-link.disabled{color:var(--ps-muted)}
.nav-tabs{border-bottom:1px solid var(--ps-border)}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus{border-color:var(--ps-border) var(--ps-border) var(--ps-border)}
.nav-tabs .nav-link.disabled{color:var(--ps-muted)}
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link{color:var(--ps-text-2);background-color:var(--ps-surface);border-color:var(--ps-border) var(--ps-border) var(--ps-surface)}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link{background-color:var(--ps-secondary)}
.navbar-light .navbar-brand{color:var(--ps-text)}
.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus{color:var(--ps-text)}
.navbar-light .navbar-nav .nav-link{color:var(--ps-muted)}
.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{color:var(--ps-text)}
.navbar-light .navbar-nav .nav-link.disabled{color:var(--ps-subtle)}
.navbar-light .navbar-nav .show > .nav-link, .navbar-light .navbar-nav .active > .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .nav-link.active{color:var(--ps-text)}
.navbar-light .navbar-toggler{color:var(--ps-muted);border-color:var(--ps-border)}
.navbar-light .navbar-text{color:var(--ps-muted)}
.navbar-light .navbar-text a{color:var(--ps-text)}
.navbar-light .navbar-text a:hover, .navbar-light .navbar-text a:focus{color:var(--ps-text)}
.card, .mc-promo-manage, .mc-promo-login{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.card-header{background-color:rgba(var(--ps-neutral-rgb),.06);border-bottom:1px solid var(--ps-border)}
.card-footer{background-color:rgba(var(--ps-neutral-rgb),.06);border-top:1px solid var(--ps-border)}
.breadcrumb{background-color:var(--ps-surface-2)}
.breadcrumb-item + .breadcrumb-item::before{color:var(--ps-muted)}
.breadcrumb-item.active{color:var(--ps-muted)}
.page-link{color:var(--ps-link);background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.page-link:hover{color:var(--ps-link-hover);background-color:var(--ps-surface-2);border-color:var(--ps-border)}
.page-link:focus{box-shadow:0 0 0 0.2rem var(--ps-ring)}
.page-item.active .page-link{background-color:var(--ps-secondary);border-color:var(--ps-primary)}
.page-item.disabled .page-link{color:var(--ps-muted);background-color:var(--ps-surface);border-color:var(--ps-border)}
.jumbotron{background-color:var(--ps-surface-2)}
.progress{background-color:var(--ps-surface-2)}
.progress-bar{background-color:var(--ps-secondary)}
.list-group-item-action{color:var(--ps-text-2)}
.list-group-item-action:hover, .list-group-item-action:focus{color:var(--ps-text-2);background-color:var(--ps-surface-2)}
.list-group-item-action:active{color:var(--ps-text);background-color:var(--ps-surface-2)}
.list-group-item{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.list-group-item.disabled, .list-group-item:disabled{color:var(--ps-muted);background-color:var(--ps-surface)}
.list-group-item.active{background-color:var(--ps-secondary);border-color:var(--ps-primary)}
.list-group-item-dark{color:var(--ps-text)}
.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus{color:var(--ps-text)}
.close{color:var(--ps-text)}
.close:hover{color:var(--ps-text)}
.toast{border:1px solid var(--ps-border)}
.toast-header{color:var(--ps-muted);border-bottom:1px solid var(--ps-border)}
.modal-content{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.modal-header{border-bottom:1px solid var(--ps-border)}
.modal-footer{border-top:1px solid var(--ps-border)}
.popover{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.bs-popover-top > .arrow::after, .bs-popover-auto[x-placement^=top] > .arrow::after{border-top-color:var(--ps-surface)}
.bs-popover-right > .arrow::after, .bs-popover-auto[x-placement^=right] > .arrow::after{border-right-color:var(--ps-surface)}
.bs-popover-bottom > .arrow::after, .bs-popover-auto[x-placement^=bottom] > .arrow::after{border-bottom-color:var(--ps-surface)}
.bs-popover-bottom .popover-header::before, .bs-popover-auto[x-placement^=bottom] .popover-header::before{border-bottom:1px solid var(--ps-border)}
.bs-popover-left > .arrow::after, .bs-popover-auto[x-placement^=left] > .arrow::after{border-left-color:var(--ps-surface)}
.popover-header{background-color:var(--ps-surface-2);border-bottom:1px solid var(--ps-border)}
.popover-body{color:var(--ps-text)}
.carousel-indicators li{background-color:var(--ps-surface)}
.bg-light{background-color:var(--ps-surface-2) !important}
a.bg-light:hover, a.bg-light:focus, button.bg-light:hover, button.bg-light:focus{background-color:var(--ps-surface-3) !important}
.bg-white{background-color:var(--ps-surface) !important}
.border{border:1px solid var(--ps-border) !important}
.border-top{border-top:1px solid var(--ps-border) !important}
.border-right{border-right:1px solid var(--ps-border) !important}
.border-bottom{border-bottom:1px solid var(--ps-border) !important}
.border-left{border-left:1px solid var(--ps-border) !important}
.border-primary{border-color:var(--ps-primary) !important}
.border-light{border-color:var(--ps-border) !important}
.border-white{border-color:var(--ps-surface) !important}
.text-secondary{color:var(--ps-muted) !important}
.text-dark{color:var(--ps-text) !important}
.text-body{color:var(--ps-text) !important}
.text-muted{color:var(--ps-muted) !important}
.text-black-50{color:var(--ps-muted) !important}
@media print{
pre, blockquote{border:1px solid var(--ps-border-strong)}
.table td, .table th{background-color:var(--ps-surface) !important}
.table-bordered th, .table-bordered td{border:1px solid var(--ps-border) !important}
}
.select-account{border-top:1px solid var(--ps-border)}
.select-account a{border-bottom:1px solid var(--ps-border)}
.select-account a:hover{background-color:var(--ps-surface-2)}
.continue-container{background-color:var(--ps-surface-2);border:1px solid var(--ps-border)}
.invite-box{background-color:var(--ps-surface-2);border:1px solid var(--ps-border)}
a.admin-inline-edit{color:var(--ps-muted)}
a.admin-inline-edit:hover{color:var(--ps-text)}
.primary-bg-color{background-color:var(--ps-surface-2)}
.input-group .btn-reveal-pw:hover, .input-group .btn-reveal-pw:active{background-color:var(--ps-surface);color:var(--ps-link);border-color:var(--ps-border)}
.modal .modal-header{background-color:var(--ps-surface-2)}
.modal-localisation .item-selector .item{border:1px solid var(--ps-border)}
.modal-localisation .item-selector .item:hover{background-color:var(--ps-surface-2);color:var(--ps-text)}
.modal-localisation .item-selector .item.active{background-color:var(--ps-surface-3);border-color:var(--ps-border-strong);color:var(--ps-text)}
.btn-default{color:var(--ps-text);background-color:var(--ps-surface);border-color:var(--ps-border)}
.btn-default:focus, .btn-default.focus{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border-strong)}
.btn-default:hover{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border-strong)}
.btn-default:active, .btn-default.active, .open > .dropdown-toggle.btn-default{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border-strong)}
.btn-default:active:hover, .btn-default.active:hover, .open > .dropdown-toggle.btn-default:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .dropdown-toggle.btn-default:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .dropdown-toggle.btn-default.focus{color:var(--ps-text);background-color:var(--ps-surface-3);border-color:var(--ps-border-strong)}
.btn-default.disabled{border-color:var(--ps-border)}
.btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled.focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default.focus{background-color:var(--ps-surface) !important;border-color:var(--ps-border) !important}
.responsive-tabs-sm .nav-item a:hover{background-color:var(--ps-surface-2)}
@media (max-width: 767.98px){
.responsive-tabs-sm{border-left:1px solid var(--ps-border);background:var(--ps-surface);border-top:1px solid var(--ps-border);border-right:1px solid var(--ps-border)}
.responsive-tabs-sm .nav-item{border-bottom:1px solid var(--ps-border) !important}
.responsive-tabs-sm .nav-item a.active{background-color:var(--ps-surface) !important}
.responsive-tabs-sm-connector .channel{background:var(--ps-surface);border-right:1px solid var(--ps-border)}
.responsive-tabs-sm-connector .bottom-border{border-bottom:1px solid var(--ps-border)}
.responsive-tabs-sm-connector.store .channel{border-left:1px solid var(--ps-border)}
}
.sidebar .list-group-item{border-color:var(--ps-border)}
.sidebar .list-group-item .badge{background-color:var(--ps-surface);color:var(--ps-muted)}
.sidebar .list-group-item > i.far.fa-circle{color:var(--ps-muted)}
.client-home-cards .card-header{background-color:var(--ps-surface)}
.client-home-cards .card-header .btn:hover{color:var(--ps-text)}
.client-home-cards .list-group{border-top:1px solid var(--ps-border) !important;border-bottom:1px solid var(--ps-border) !important}
.client-home-cards .list-group .list-group-item{border-bottom:1px solid var(--ps-border)}
.client-home-cards small{color:var(--ps-muted)}
.tiles .tile{background-color:var(--ps-surface-2);border-right:1px solid var(--ps-border)}
.tiles .tile .title{color:var(--ps-muted)}
.tiles .tile i{color:var(--ps-subtle)}
.tiles .tile:hover{background-color:var(--ps-surface-2)}
.tiles .tile:hover i{color:var(--ps-muted)}
@media (max-width: 1199.98px){
.tiles div:nth-child(1) > .tile, .tiles div:nth-child(2) > .tile{border-bottom:1px solid var(--ps-border)}
}
div[menuitemname="Active Products/Services"] .btn-view-more.disabled{color:var(--ps-muted)}
.twofa-setup .activation-msg{border:1px dashed var(--ps-border)}
.twofa-setup .backup-code{background-color:var(--ps-surface-2);color:var(--ps-text)}
.twofa-module{border:1px solid var(--ps-border)}
.popover-user-notifications{border-color:var(--ps-border)}
.popover-user-notifications ul li{border-bottom:1px solid var(--ps-border)}
.popover-user-notifications ul li a{color:var(--ps-text-2)}
.popover-user-notifications ul li a:hover{background-color:var(--ps-surface-2)}
.verification-banner{background-color:var(--ps-surface-2);border-bottom:1px solid var(--ps-border);color:var(--ps-text)}
.verification-banner .fas, .verification-banner .fal, .verification-banner .far{color:var(--ps-muted)}
.md-editor{border:1px solid var(--ps-border)}
.md-editor > .btn-toolbar{background-color:var(--ps-surface) !important}
.md-editor > textarea.markdown-editor, .md-editor > .md-preview{border-top:1px solid var(--ps-border) !important;border-bottom:1px solid var(--ps-border) !important;background-color:var(--ps-surface) !important}
div.md-editor.active{border:1px solid var(--ps-border)}
.md-preview h1, .markdown-content h1{color:var(--ps-text)}
.md-preview h2, .markdown-content h2{color:var(--ps-text)}
.md-preview h3, .markdown-content h3{color:var(--ps-text)}
.md-preview h4, .markdown-content h4{color:var(--ps-text)}
.md-preview blockquote, .markdown-content blockquote{border-left:5px solid var(--ps-border)}
.md-preview table, .markdown-content table{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.md-preview table > thead > tr > th, .markdown-content table > thead > tr > th{background-color:var(--ps-surface-2);border:1px solid var(--ps-border)}
.md-preview table > tbody > tr > td, .markdown-content table > tbody > tr > td{border:1px solid var(--ps-border)}
.store-order-container .store-domain-tabs li a{background-color:var(--ps-surface-2);border-bottom:1px solid var(--ps-border)}
.store-order-container .store-domain-tabs li.active a{background-color:var(--ps-surface)}
.store-order-container .store-domain-tab-content{border:1px solid var(--ps-border)}
.store-order-container .domain-validation{color:var(--ps-muted)}
.promo-container{border:1px solid var(--ps-border);background-color:var(--ps-surface)}
.promo-banner{background-color:var(--ps-surface)}
.promo-banner.ox a{color:var(--ps-muted)}
.client-home-cards div[menuitemname=ThreesixtymonitoringLogin] .threesixtymonitoring-metrics-row > div:not(:last-child){border-right:1px solid var(--ps-border)}
.client-home-cards div[menuitemname=ThreesixtymonitoringLogin] .threesixtymonitoring-title{color:var(--ps-muted)}
div.tweet span{color:var(--ps-subtle)}
.upgrade .product-to-be-upgraded{background-color:var(--ps-surface-2)}
.upgrade .products .product{background-color:var(--ps-surface)}
.upgrade .products .product ul{border-left:1px solid var(--ps-border);border-right:1px solid var(--ps-border)}
.upgrade .products .product .footer{border:1px solid var(--ps-border)}
.upgrade .products .product ul li{color:var(--ps-muted);border-bottom:1px solid var(--ps-border)}
.upgrade .products .product ul li span{color:var(--ps-text)}
.announcements .announcement article{background-color:var(--ps-surface-2);border-left:4px solid var(--ps-border)}
.kb-category a:hover{background-color:var(--ps-surface-2)}
.kb-article-item:hover{background-color:var(--ps-surface-2)}
.kb-article-item small{color:var(--ps-muted)}
.ticket-reply .rating span.star:before, .ticket-reply .rating-done span.star:before{color:var(--ps-muted)}
.view-ticket .card-body, .view-ticket .mc-promo-manage .content, .mc-promo-manage .view-ticket .content, .view-ticket .mc-promo-login .content, .mc-promo-login .view-ticket .content{border-bottom:1px solid var(--ps-border)}
.view-ticket .posted-by{color:var(--ps-muted);background-color:var(--ps-surface-2)}
.view-ticket .attachments{border-top:1px dashed var(--ps-border)}
.view-ticket .attachment-list li span{border:1px solid var(--ps-border)}
.view-ticket .attachment-list li figure{background-color:var(--ps-surface-2)}
.ticketfeedbackstaffcont{background-color:var(--ps-surface-2)}
#registration label{color:var(--ps-muted)}
#registration .sub-heading{border-top:1px solid var(--ps-border)}
#registration .sub-heading span{color:var(--ps-link);background-color:var(--ps-surface)}
#registration .field, #registration .form-control{border:1px solid var(--ps-border);color:var(--ps-text);background:var(--ps-surface)}
#registration .form-control:focus{border-color:var(--ps-border)}
#registration .field-icon i{color:var(--ps-subtle)}
#registration .field[disabled], #registration .field[readonly], #registration .form-control[disabled], #registration .form-control[readonly]{background-color:var(--ps-surface-2)}
#registration .field-help-text{color:var(--ps-muted)}
div.credit-card{background-color:var(--ps-surface-2);border:1px solid var(--ps-border)}
div.credit-card div.card-number{background-color:var(--ps-surface-3)}
.auth3d-area{border:1px solid var(--ps-surface)}
.submit-3d{border:1px solid var(--ps-surface)}
.invoice-summary-table td.total-row{background-color:var(--ps-surface-2)}
div.credit-card .logo-discover{color:var(--ps-text)}
tr.masspay-total td{background-color:var(--ps-surface-2)}
div.product-details div.product-icon{background-color:var(--ps-surface-2)}
div.product-details-tab-container{border:1px solid var(--ps-border);background-color:var(--ps-surface)}
.featured-tld{background-color:var(--ps-surface)}
.featured-tld .price{background-color:var(--ps-surface-2);color:var(--ps-text-2)}
.domain-pricing .tld-row{border-bottom:1px solid var(--ps-border)}
.domain-pricing .tld-row.highlighted{background:var(--ps-surface-2)}
.domain-pricing .tld-pricing-header .col-xs-2, .domain-pricing .tld-pricing-header .col-sm-2, .domain-pricing .tld-pricing-header .col-xs-4, .domain-pricing .tld-pricing-header .col-sm-4{border-bottom:6px solid var(--ps-border-strong);background-color:var(--ps-surface-2)}
.domain-pricing .tld-pricing-header div:nth-child(odd){border-color:var(--ps-primary);background-color:var(--ps-surface-2)}
@media (min-width: 768px){
.domain-pricing .two-row-center{border-right:2px solid var(--ps-border-strong)}
}
.dataTables_wrapper table.table-list{border:1px solid var(--ps-border)}
.dataTables_wrapper table.table-list thead th.sorting_asc, .dataTables_wrapper table.table-list thead th.sorting_desc{background-color:var(--ps-surface-2)}
.dataTables_wrapper .dataTables_filter label .form-control{background:url("../../../assets/img/search.png") var(--ps-surface) no-repeat 8px 5px}
.pagination > li > a, .pagination > li > span{color:var(--ps-text)}
table.table-list thead th{background-color:var(--ps-surface);border-bottom:1px solid var(--ps-border);color:var(--ps-text)}
.table-list > tbody > tr > td a.border-left{border-left:1px solid var(--ps-border)}
.table-list > tbody > tr > td{background-color:var(--ps-surface)}
.table-list > tbody > tr:hover > td{background-color:var(--ps-surface-2)}
table.table-solid-bottom-border-light-gray{border-bottom:1px solid var(--ps-border)}
table.ox-table-accounts tbody.account-entry > tr:hover{background-color:rgba(var(--ps-neutral-rgb),.06)}
.intl-tel-input .country-list{background-color:var(--ps-surface);border:1px solid var(--ps-border)}
.intl-tel-input .country-list .divider{border-bottom:1px solid var(--ps-border)}
.intl-tel-input .country-list .country .dial-code{color:var(--ps-muted)}
.intl-tel-input .country-list .country.highlight{background-color:rgba(var(--ps-neutral-rgb),.06)}
.intl-tel-input.allow-dropdown .flag-container:hover .selected-flag{background-color:rgba(var(--ps-neutral-rgb),.06)}
.intl-tel-input.separate-dial-code .selected-flag{background-color:rgba(var(--ps-neutral-rgb),.06)}
.bootstrap-switch{border-color:var(--ps-border) var(--ps-border) rgba(0, 0, 0, 0.25)}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary{color:var(--ps-text);background-color:var(--ps-surface);border-color:var(--ps-border)}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary:hover, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:hover{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border-strong)}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary.disabled, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary:disabled, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary.disabled, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:disabled{background-color:var(--ps-surface);border-color:var(--ps-border)}
.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary:active, .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary.active, .show > .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-secondary.dropdown-toggle, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary:active, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary.active, .show > .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-secondary.dropdown-toggle{color:var(--ps-text);background-color:var(--ps-surface-2);border-color:var(--ps-border-strong)}
.md-editor{border:1px solid var(--ps-border)}
.md-editor .md-footer,.md-editor>.md-header{background:var(--ps-surface-2)}
.md-editor>.md-preview{background:var(--ps-surface);border-top:1px dashed var(--ps-border);border-bottom:1px dashed var(--ps-border)}
.md-editor>textarea{border-top:1px dashed var(--ps-border);border-bottom:1px dashed var(--ps-border);background:var(--ps-surface-2)}
.md-editor>textarea:focus{background:var(--ps-surface)}
.md-editor .md-controls .md-control:hover{color:var(--ps-text)}
.md-editor.md-fullscreen-mode{background:var(--ps-surface) !important}
.md-editor.md-fullscreen-mode .md-input,.md-editor.md-fullscreen-mode .md-preview{color:var(--ps-muted);background:var(--ps-surface) !important}
.md-editor.md-fullscreen-mode .md-preview{color:var(--ps-text)}
.md-editor.md-fullscreen-mode .md-input:focus,.md-editor.md-fullscreen-mode .md-input:hover{color:var(--ps-text);background:var(--ps-surface) !important}
.md-editor.md-fullscreen-mode .btn{color:var(--ps-subtle)}
.md-editor.md-fullscreen-mode .btn.active,.md-editor.md-fullscreen-mode .btn:active,.md-editor.md-fullscreen-mode .btn:focus,.md-editor.md-fullscreen-mode .btn:hover{color:var(--ps-text)}
.md-editor.md-fullscreen-mode .md-fullscreen-controls a{color:var(--ps-subtle)}
.md-editor.md-fullscreen-mode .md-fullscreen-controls a:hover{color:var(--ps-text)}
table.dataTable td.dt-control:before{border:0.15em solid var(--ps-surface)}
table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before{border:0.15em solid var(--ps-surface)}
table.dataTable.dtr-column > tbody > tr > td.dtr-control:before, table.dataTable.dtr-column > tbody > tr > th.dtr-control:before, table.dataTable.dtr-column > tbody > tr > td.control:before, table.dataTable.dtr-column > tbody > tr > th.control:before{border:0.15em solid var(--ps-surface)}
table.dataTable > tbody > tr.child ul.dtr-details > li{border-bottom:1px solid var(--ps-border)}
div.dtr-modal div.dtr-modal-close{border:1px solid var(--ps-border);background-color:var(--ps-surface-2)}
div.dtr-modal div.dtr-modal-close:hover{background-color:var(--ps-surface-2)}

/* ---- generated: Standard Cart colour remap (scoped to body.ps-site) ---- */
.ps-site #order-standard_cart label,.ps-site #order-standard_cart p.domain-renewal-desc,.ps-site .service-renewals .div-renewal-period-label{color:var(--ps-muted)}
.ps-site #order-standard_cart .sub-heading{border-top:1px solid var(--ps-border)}
.ps-site #order-standard_cart .sub-heading span,.ps-site #order-standard_cart .sub-heading-borderless span{color:var(--ps-link)}
.ps-site #order-standard_cart .domain-checker-advanced .multiselect{color:var(--ps-text)}
.ps-site #order-standard_cart .domain-checker-advanced label{color:var(--ps-text)}
.ps-site #order-standard_cart .domain-checker-advanced input[type="checkbox"]{background:var(--ps-surface)}
.ps-site #order-standard_cart .products .product{background:var(--ps-surface);border:1px solid var(--ps-border)}
.ps-site #order-standard_cart .products .product header{background:var(--ps-surface-2)}
.ps-site #order-standard_cart .products .product header span{color:var(--ps-text)}
.ps-site #order-standard_cart .products .product header .qty{color:var(--ps-muted)}
.ps-site #order-standard_cart .panel-addon .panel-body label{color:var(--ps-text)}
.ps-site #order-standard_cart .panel-addon .panel-price{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .panel-addon-selected{border-color:var(--ps-border-strong)}
.ps-site #order-standard_cart .domain-selection-options .option{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .domain-selection-options .option-selected{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .transfer-not-eligible{color:var(--ps-muted);background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .product-info{background-color:var(--ps-surface-2);border-top:1px solid var(--ps-border);border-bottom:1px solid var(--ps-border)}
.ps-site #order-standard_cart .summary-container{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .order-summary .summary-totals{border-top:1px solid var(--ps-border);border-bottom:1px solid var(--ps-border)}
.ps-site #order-standard_cart .apply-credit-container{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .cc-input-container{background-color:var(--ps-surface-2);border:1px solid var(--ps-border)}
.ps-site #order-standard_cart .cc-input-container .existing-cc-grid{color:var(--ps-muted)}
.ps-site #order-standard_cart .field,.ps-site #order-standard_cart .form-control{border:1px solid var(--ps-border);color:var(--ps-text);background-color:var(--ps-surface)}
.ps-site #order-standard_cart .form-control:focus{border-color:var(--ps-border)}
.ps-site #order-standard_cart .field-icon i{color:var(--ps-subtle)}
.ps-site #order-standard_cart .field[disabled],.ps-site #order-standard_cart .field[readonly],.ps-site #order-standard_cart .form-control[disabled],.ps-site #order-standard_cart .form-control[readonly]{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .field-help-text{color:var(--ps-muted)}
.ps-site #order-standard_cart .view-cart-items .item{background-color:var(--ps-surface)}
.ps-site #order-standard_cart .view-cart-items .item:nth-child(even){background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .view-cart-items .item-domain{color:var(--ps-link)}
.ps-site #order-standard_cart .btn-remove-from-cart{color:var(--ps-text)}
.ps-site #order-standard_cart .order-summary .subtotal{border-bottom:1px solid var(--ps-border)}
.ps-site #order-standard_cart .order-summary .bordered-totals{border-bottom:1px solid var(--ps-border)}
.ps-site #order-standard_cart .order-summary .recurring-charges{color:var(--ps-muted)}
.ps-site #order-standard_cart .order-summary .btn-continue-shopping{color:var(--ps-text)}
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected="true"],.ps-site #order-standard_cart .view-cart-tabs .nav-tabs a[aria-expanded="true"]{border-color:var(--ps-border) var(--ps-border) var(--ps-border);background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .view-cart-tabs .tab-content{background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .view-cart-promotion-code{background-color:var(--ps-surface);border:1px dashed var(--ps-border)}
.ps-site #order-standard_cart .view-cart-gateway-checkout{background-color:var(--ps-surface-2)}
.ps-site div.domainresults div:not(.btn-group){background-color:var(--ps-surface-3);color:var(--ps-muted)}
.ps-site div.domainresults div:not(.btn-group) span{color:var(--ps-muted)}
.ps-site .domain-checker-container .input-group-box{background-color:var(--ps-surface)}
.ps-site .domain-pricing .tld-row{border-bottom:1px solid var(--ps-border)}
.ps-site .domain-pricing .tld-row.highlighted{background:var(--ps-surface-2)}
.ps-site .domain-pricing .tld-pricing-header .col-xs-2,.ps-site .domain-pricing .tld-pricing-header .col-sm-2,.ps-site .domain-pricing .tld-pricing-header .col-xs-4,.ps-site .domain-pricing .tld-pricing-header .col-sm-4{border-bottom:6px solid var(--ps-border-strong);background-color:var(--ps-surface-2)}
.ps-site .domain-pricing .tld-pricing-header div:nth-child(odd){border-color:var(--ps-primary);background-color:var(--ps-surface-2)}
.ps-site .domain-pricing .two-row-center{border-right:2px solid var(--ps-border-strong)}
.ps-site .domain-searching{color:var(--ps-subtle)}
.ps-site .spotlight-tlds{background-color:var(--ps-surface-2)}
.ps-site .spotlight-tld{background-color:var(--ps-surface);border:1px solid var(--ps-border);color:var(--ps-text-2)}
.ps-site .spotlight-tld .unavailable,.ps-site .spotlight-tld .invalid{background-color:var(--ps-surface-2);border-color:var(--ps-border);color:var(--ps-subtle)}
.ps-site .suggested-domains .domain-lookup-suggestions-message,.ps-site .suggested-domains .domain-lookup-suggestions-loader{background-color:var(--ps-surface-2)}
.ps-site .domain-promo-box{background-color:var(--ps-surface-2);border:1px solid var(--ps-border);color:var(--ps-text)}
.ps-site .domain-promo-box .small{color:var(--ps-muted)}
.ps-site .form-control.domain-renewals-filter,.ps-site .form-control.service-renewals-filter{background:url(../../../../assets/img/search.png) var(--ps-surface) no-repeat 8px 5px !important}
.ps-site .domain-renewals,.ps-site .service-renewals{border-top:1px solid var(--ps-border)}
.ps-site .domain-renewals,.ps-site .service-renewals,.ps-site .addon-renewals .service-renewal{background-color:var(--ps-surface-2)}
.ps-site .domain-renewals .domain-renewal,.ps-site .service-renewals .service-renewal{border-bottom:1px solid var(--ps-border)}
.ps-site .domain-renewals .domain-renewal:nth-child(even),.ps-site .service-renewals .service-renewal:nth-child(even),.ps-site .addon-renewals .service-renewal:nth-child(even){background-color:var(--ps-surface-2)}
.ps-site .service-renewals .div-renewal-ineligible{color:var(--ps-muted)}
.ps-site .addon-renewals > div{border:1px solid var(--ps-border)}
.ps-site #order-standard_cart .addon-promo-container{border:1px solid var(--ps-border)}
.ps-site #order-standard_cart .mc-promo{background-color:var(--ps-surface);border:1px dashed var(--ps-border)}
.ps-site #order-standard_cart .mc-promo .body{border-top:10px solid var(--ps-border);background-color:var(--ps-surface-2)}
.ps-site #order-standard_cart .mc-promo.sitelockvpn .expander,.ps-site #order-standard_cart .mc-promo.sitelockvpn .price{color:var(--ps-text-2)}
.ps-site #order-standard_cart .default-captcha{background-color:var(--ps-surface-2);color:var(--ps-muted)}
.ps-site #order-standard_cart .account-select-container{border-right:1px solid var(--ps-border)}
.ps-site #order-standard_cart .account-select-container div.account{background:var(--ps-surface-2);border:1px solid var(--ps-border)}
.ps-site #order-standard_cart .account-select-container div.account.active{background:var(--ps-surface)}
.ps-site .product-recommendations .product-recommendation{background-color:var(--ps-surface);border:1px dashed var(--ps-border)}
.ps-site .product-recommendations .product-recommendation .body{border-top:10px solid var(--ps-border);background-color:var(--ps-surface-2)}

/* ---- src/system/00-base.css ---- */
/* ==========================================================================
   Base: typography, page background, links, focus, selection, motion
   ========================================================================== */

html {
    font-size: 15px;
    -webkit-text-size-adjust: 100%;
    background: var(--ps-bg);
}

body.ps-site {
    font-family: var(--ps-font);
    font-size: 1rem;
    line-height: 1.6;
    background: var(--ps-bg);
    color: var(--ps-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-feature-settings: "ss01" on;
    /* Twenty-One fixes html/body at height:100%; the body must grow with its
       content or the sticky header stops after the first screen. */
    height: auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

body.ps-site #main-body {
    flex: 1 0 auto;
    background: transparent;
    padding: 32px 0 56px;
    outline: none;
}

body.ps-site.ps-tpl-homepage #main-body {
    padding: 0;
}

.ps-site h1, .ps-site h2, .ps-site h3, .ps-site h4, .ps-site h5, .ps-site h6,
.ps-site .h1, .ps-site .h2, .ps-site .h3, .ps-site .h4, .ps-site .h5, .ps-site .h6 {
    font-family: var(--ps-font);
    color: var(--ps-text);
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.2;
}

.ps-site h1, .ps-site .h1 { font-size: 2rem; letter-spacing: -0.03em; }
.ps-site h2, .ps-site .h2 { font-size: 1.6rem; }
.ps-site h3, .ps-site .h3 { font-size: 1.3rem; }
.ps-site h4, .ps-site .h4 { font-size: 1.12rem; }
.ps-site h5, .ps-site .h5 { font-size: 1rem; }
.ps-site h6, .ps-site .h6 { font-size: 0.9rem; }

.ps-site p { color: inherit; }

.ps-site a {
    color: var(--ps-link);
    text-decoration: none;
    text-underline-offset: 3px;
    transition: color 0.15s var(--ps-ease), background-color 0.15s var(--ps-ease), border-color 0.15s var(--ps-ease);
}

.ps-site a:hover,
.ps-site a:focus {
    color: var(--ps-link-hover);
}

.ps-site .primary-content a:not(.btn):not(.list-group-item):not(.dropdown-item):not(.nav-link):not(.page-link):not(.ps-card-link):hover {
    text-decoration: underline;
    text-decoration-color: rgba(var(--ps-primary-rgb), 0.45);
}

/* Links inside running text are underlined, not identified by colour alone. */
.ps-site #main-body p a:not(.btn),
.ps-site #main-body .markdown-content a,
.ps-site #main-body .ticket-reply .message a,
.ps-site #main-body .kb-article-content a,
.ps-site #main-body .announcement-content a,
.ps-site #main-body td a:not(.btn):not(.label) {
    text-decoration: underline;
    text-decoration-color: rgba(var(--ps-primary-rgb), 0.55);
    text-underline-offset: 3px;
}

.ps-site small, .ps-site .small { font-size: 0.85em; }
.ps-site .text-muted { color: var(--ps-muted) !important; }
.ps-site .text-dark { color: var(--ps-text) !important; }
.ps-site .text-body { color: var(--ps-text) !important; }
.ps-site .text-black-50 { color: var(--ps-subtle) !important; }
.ps-site .text-primary { color: var(--ps-link) !important; }
.ps-site .text-success { color: var(--ps-success-text) !important; }
.ps-site .text-danger { color: var(--ps-danger-text) !important; }
.ps-site .text-warning { color: var(--ps-warning-text) !important; }
.ps-site .text-info { color: var(--ps-info-text) !important; }
.ps-site .text-white { color: #ffffff !important; }
.ps-site .bg-white, .ps-site .bg-light { background-color: var(--ps-surface) !important; }
.ps-site .border, .ps-site .border-top, .ps-site .border-bottom, .ps-site .border-left, .ps-site .border-right { border-color: var(--ps-border) !important; }

.ps-site hr {
    border: 0;
    border-top: 1px solid var(--ps-border);
}

.ps-site code {
    color: var(--ps-accent);
    background: rgba(var(--ps-primary-rgb), 0.08);
    padding: 0.1em 0.35em;
    border-radius: var(--ps-radius-xs);
    font-family: var(--ps-mono);
    font-size: 0.88em;
}

.ps-site pre {
    color: var(--ps-text);
    background: var(--ps-input-bg);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    padding: 14px 16px;
    font-family: var(--ps-mono);
}

.ps-site pre code { background: none; padding: 0; color: inherit; }

.ps-site kbd {
    background: var(--ps-surface-3);
    color: var(--ps-text);
    border: 1px solid var(--ps-border);
}

.ps-site blockquote {
    border-left: 3px solid rgba(var(--ps-primary-rgb), 0.5);
    padding-left: 14px;
    color: var(--ps-text-2);
}

.ps-site ::selection {
    background: rgba(var(--ps-primary-rgb), 0.35);
    color: var(--ps-text);
}

/* Focus: always visible for keyboard users. */
.ps-site :focus { outline: none; }
.ps-site :focus-visible {
    outline: 2px solid var(--ps-primary);
    outline-offset: 2px;
    border-radius: 6px;
}
html[data-theme="contrast"] .ps-site :focus-visible { outline-color: #ffff00; outline-width: 3px; }
.ps-site .form-control:focus-visible,
.ps-site .custom-select:focus-visible { outline: none; }

.ps-skip-link {
    position: absolute;
    left: 16px;
    top: -60px;
    z-index: 2000;
    padding: 10px 16px;
    border-radius: var(--ps-radius-sm);
    background: var(--ps-solid-bg);
    color: var(--ps-solid-fg) !important;
    font-weight: 600;
    box-shadow: var(--ps-shadow);
    transition: top 0.15s var(--ps-ease);
}
.ps-skip-link:focus { top: 12px; }

.ps-site img { max-width: 100%; }

.ps-site .container {
    padding-left: 16px;
    padding-right: 16px;
}

@media (min-width: 1200px) {
    .ps-site .container { max-width: 1200px; }
}

/* Shared small helpers */
.ps-eyebrow {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--ps-primary);
    margin: 0 0 10px;
}

.ps-pill {
    display: inline-flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.12);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.24);
    border-radius: 999px;
    padding: 2px 10px;
    white-space: nowrap;
}

.ps-check {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: rgba(var(--ps-primary-rgb), 0.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236ea8fe' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 9px 9px no-repeat;
}
html[data-theme="light"] .ps-check {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563c9' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}

@media (prefers-reduced-motion: reduce) {
    .ps-site *, .ps-site *::before, .ps-site *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* ---- src/system/10-header.css ---- */
/* ==========================================================================
   Header: utility bar, brand, navigation, toolbar, breadcrumb
   Twenty-One's autoCollapse('#nav', 30) moves items into "More" whenever
   #nav is 30px or taller, so desktop nav items stay 28px high.
   The utility bar is a sibling above <header>, so only the navigation bar
   sticks to the top of the viewport.
   ========================================================================== */

html { scroll-padding-top: calc(var(--ps-header-h) + 12px); }

.ps-site header.ps-header {
    background: transparent;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 1020;
}

/* ---- Utility bar ---- */
.ps-site .ps-utility {
    background: var(--ps-bg);
    color: var(--ps-muted);
    border-bottom: 1px solid var(--ps-border-soft);
    font-size: 12px;
    line-height: 1;
    margin: 0;
    padding: 0;
}

.ps-utility-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    min-height: 30px;
}

.ps-utility-account {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: auto;
    min-width: 0;
}

.ps-utility-links {
    display: flex;
    gap: 14px;
    flex-shrink: 0;
}

.ps-site .ps-utility-links a {
    color: var(--ps-muted);
    font-size: 12px;
}

.ps-site .ps-utility-links a:hover { color: var(--ps-text); }

/* Top-bar controls: one small size (32 px desktop, 40 px phone) with 8 px corners */
.ps-site .ps-utility .btn,
.ps-site .ps-utility .ps-utility-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1;
    color: var(--ps-muted);
    background: transparent;
    border: 0;
    padding: 0 10px;
    border-radius: var(--ps-ctl-r-sm);
}
.ps-site.ps-logged-in .ps-utility-row,
.ps-site .ps-utility-row:has(.btn-return-to-admin) { min-height: 40px; }

.ps-site .ps-utility .btn:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.08); }

.ps-alert-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--ps-btn-from);
    color: #fff;
    font-weight: 700;
    font-size: 11px;
    margin: 0 2px;
}

.ps-site .ps-utility .active-client { line-height: 1; flex-wrap: nowrap; width: auto; min-width: 0; }
.ps-site .ps-utility .active-client .input-group-text {
    padding: 0 4px 0 8px;
    font-size: 12px;
    color: var(--ps-subtle);
    background: transparent;
    border: 0;
    height: auto;
}
.ps-site .ps-utility .active-client .btn-group { align-items: center; min-width: 0; }
.ps-site .ps-utility .active-client .btn.btn-active-client {
    color: var(--ps-text-2);
    min-width: 0;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ps-site .ps-utility .active-client .btn.btn-active-client span {
    border-bottom: 1px dashed var(--ps-border-strong);
}
/* "Return to admin" lives in the top bar; Twenty-One pins it to the page edge
   with !important rules, so each of those is reset here. */
.ps-site .ps-utility .btn-return-to-admin {
    position: static !important;
    top: auto !important;
    right: auto !important;
    padding: 0 12px !important;
    font-size: 12.5px !important;
    font-weight: 600;
    color: var(--ps-warning-text) !important;
    background-color: rgba(var(--ps-warning-rgb), 0.12) !important;
    border: 1px solid rgba(var(--ps-warning-rgb), 0.3) !important;
    border-radius: var(--ps-ctl-r-sm) !important;
    writing-mode: horizontal-tb !important;
    transform: none !important;
}
.ps-site .ps-utility .btn-return-to-admin:hover {
    color: var(--ps-warning-text) !important;
    background-color: rgba(var(--ps-warning-rgb), 0.2) !important;
}

/* ---- Main bar ---- */
.ps-site header.ps-header .ps-navbar {
    background: rgba(var(--ps-bg-rgb), 0.95);
    -webkit-backdrop-filter: blur(20px) saturate(1.4);
    backdrop-filter: blur(20px) saturate(1.4);
    border-bottom: 1px solid var(--ps-border-soft);
    padding: 0;
}

.ps-site header.ps-header .ps-navbar > .container {
    min-height: var(--ps-header-h);
    flex-wrap: wrap;
    align-items: center;
}

.ps-site .ps-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 0;
    margin-right: 20px;
    color: var(--ps-text);
    text-decoration: none;
    white-space: nowrap;
}

.ps-site .ps-brand:hover,
.ps-site .ps-brand:focus { color: var(--ps-text); text-decoration: none; }

.ps-brand-mark { width: 32px; height: 32px; flex-shrink: 0; }
.ps-brand-name { font-weight: 700; font-size: 17px; letter-spacing: -0.5px; color: var(--ps-text); }
.ps-brand-tag {
    font-size: 12px;
    font-weight: 500;
    color: var(--ps-muted);
    padding-left: 10px;
    margin-left: 2px;
    border-left: 1px solid var(--ps-border);
    letter-spacing: 0;
}
.ps-brand-sm .ps-brand-mark { width: 26px; height: 26px; }
.ps-brand-sm .ps-brand-name { font-size: 16px; letter-spacing: -0.4px; }

/* Toolbar: search, theme, cart, menu */
.ps-site header.ps-header .ps-toolbar {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    margin: 0 0 0 auto;
    padding: 0;
    order: 2;
}

.ps-site header.ps-header .ps-toolbar .nav-item { margin: 0; display: flex; align-items: center; }

.ps-site header.ps-header .ps-toolbar .nav-link,
.ps-site header.ps-header .ps-icon-btn {
    position: relative;
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--ps-ctl);
    height: var(--ps-ctl);
    min-height: var(--ps-ctl);
    margin: 0;
    vertical-align: middle;
    padding: 0;
    border-radius: var(--ps-ctl-r);
    border: 1px solid var(--ps-border);
    background: transparent;
    color: var(--ps-text-2);
    font-size: 15px;
    line-height: 1;
    box-shadow: none;
}

.ps-site header.ps-header .ps-toolbar .nav-link:hover,
.ps-site header.ps-header .ps-toolbar .nav-link:focus-visible,
.ps-site header.ps-header .ps-toolbar .show > .nav-link {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.1);
    border-color: rgba(var(--ps-primary-rgb), 0.3);
}

.ps-site header.ps-header .ps-toolbar .nav-link .badge {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 18px;
    opacity: 1;
    background: var(--ps-btn-from);
    color: #fff;
    border: 2px solid var(--ps-bg);
    box-sizing: content-box;
}

.ps-site .ps-icon { flex-shrink: 0; vertical-align: middle; }
.ps-site .ps-utility .ps-icon { margin-right: 2px; }

.ps-theme-toggle .ps-icon-moon { display: none; }
html[data-theme="light"] .ps-theme-toggle .ps-icon-sun { display: none; }
html[data-theme="light"] .ps-theme-toggle .ps-icon-moon { display: inline; }

/* Collapsible navigation. DOM order is brand, menu button, navigation,
   toolbar so keyboard order matches the desktop layout; flex order places
   toolbar and menu button on the brand row on smaller screens. */
.ps-site header.ps-header .ps-navbar .navbar-collapse {
    order: 4;
    flex-basis: 100%;
}

.ps-site header.ps-header .ps-navbar .ps-menu-toggle {
    order: 3;
    margin-left: 6px;
}

.ps-site header.ps-header .ps-navbar .navbar-nav > li > a,
.ps-site header.ps-header .ps-navbar .navbar-nav > li > .nav-link {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--ps-text-2);
    font-size: 14px;
    font-weight: 500;
    letter-spacing: -0.1px;
    line-height: 20px;
    border-radius: var(--ps-radius-sm);
    white-space: nowrap;
}

.ps-site header.ps-header .ps-navbar .navbar-nav > li > a:hover,
.ps-site header.ps-header .ps-navbar .navbar-nav > li > a:focus-visible,
.ps-site header.ps-header .ps-navbar .navbar-nav > li.show > a {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.08);
    text-decoration: none;
}

.ps-site header.ps-header .ps-navbar .navbar-nav > li.active > a {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.12);
}

.ps-site header.ps-header .ps-navbar .navbar-nav .badge {
    background: rgba(var(--ps-primary-rgb), 0.16);
    color: var(--ps-primary);
    border-radius: 999px;
    font-weight: 600;
}

.ps-site header.ps-header .ps-navbar .dropdown-toggle::after {
    border: 0;
    width: 8px;
    height: 8px;
    margin-left: 2px;
    vertical-align: middle;
    background: currentColor;
    opacity: 0.7;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Dropdown menus (desktop and mobile) */
.ps-site header.ps-header .dropdown-menu {
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
    padding: 6px;
    min-width: 220px;
}

.ps-site header.ps-header .dropdown-menu li.dropdown-item {
    padding: 0;
    background: transparent;
}

.ps-site header.ps-header .dropdown-menu a.dropdown-item,
.ps-site header.ps-header .dropdown-menu .dropdown-item > a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px !important;
    border-radius: var(--ps-radius-sm);
    color: var(--ps-text-2);
    font-size: 14px;
    line-height: 1.35;
    white-space: normal;
}

.ps-site header.ps-header .dropdown-menu a.dropdown-item:hover,
.ps-site header.ps-header .dropdown-menu a.dropdown-item:focus,
.ps-site header.ps-header .dropdown-menu .dropdown-item.active > a {
    background: rgba(var(--ps-primary-rgb), 0.1);
    color: var(--ps-text);
    text-decoration: none;
}

.ps-site header.ps-header .dropdown-divider { border-top-color: var(--ps-border); margin: 6px 4px; }

/* Desktop layout: brand | navigation | toolbar (one row; overflow goes to "More") */
@media (min-width: 1200px) {
    .ps-site header.ps-header .ps-navbar > .container { flex-wrap: nowrap; }
    .ps-site header.ps-header .ps-brand { margin-right: 16px; }

    .ps-site header.ps-header .ps-navbar .navbar-collapse {
        order: 1;
        flex: 1 1 auto;
        align-items: center;
        min-width: 0;
    }

    .ps-site header.ps-header .ps-toolbar { order: 2; margin-left: 10px; flex: 0 0 auto; }

    .ps-site header.ps-header #nav {
        flex-wrap: wrap;
        align-items: center;
        min-width: 0;
    }

    /* Plain navigation links stay 28px (autoCollapse threshold is 30px). */
    .ps-site header.ps-header #nav > li > a {
        height: 28px;
        padding: 4px 10px !important;
    }

    .ps-site header.ps-header .ps-nav-secondary {
        margin-left: 10px;
        align-items: center;
        flex: 0 0 auto;
    }

    /* Outlined controls (account menu, theme, cart) share one 44 px box. */
    .ps-site header.ps-header .ps-nav-secondary > li > a {
        box-sizing: border-box;
        height: var(--ps-ctl) !important;
        padding: 0 16px !important;
        border: 1px solid var(--ps-border);
        border-radius: var(--ps-ctl-r);
        line-height: 1;
    }
}

/* Mobile/tablet menu panel */
@media (max-width: 1199.98px) {
    .ps-site header.ps-header .ps-navbar .navbar-collapse {
        margin: 0 -16px;
        padding: 0 16px;
    }

    .ps-site header.ps-header .ps-navbar .navbar-collapse.show,
    .ps-site header.ps-header .ps-navbar .navbar-collapse.collapsing {
        border-top: 1px solid var(--ps-border-soft);
        max-height: calc(100vh - var(--ps-header-h));
        max-height: calc(100dvh - var(--ps-header-h));
        overflow-y: auto;
        overscroll-behavior: contain;
    }

    .ps-site header.ps-header .ps-navbar .navbar-collapse.show { padding-top: 12px; padding-bottom: 16px; }

    .ps-site header.ps-header .ps-navbar .navbar-nav .dropdown-menu a.dropdown-item,
    .ps-site header.ps-header .ps-navbar .navbar-nav .dropdown-menu .dropdown-item > a {
        min-height: 44px;
    }

    .ps-site header.ps-header .ps-navbar .navbar-nav > li > a {
        padding: 11px 12px !important;
        font-size: 15px;
    }

    .ps-site header.ps-header .ps-nav-secondary {
        border-top: 1px solid var(--ps-border-soft);
        margin-top: 8px;
        padding-top: 8px;
    }

    .ps-site header.ps-header .ps-navbar .dropdown-menu {
        box-shadow: none;
        background: var(--ps-surface);
        margin: 0 0 6px 12px;
    }
}

@media (min-width: 1200px) and (max-width: 1399.98px) {
    .ps-site header.ps-header .ps-brand-tag { display: none !important; }
}

@media (min-width: 1400px) {
    .ps-site .container { max-width: 1280px; }
}

/* Phones: the consumer links move to the footer only; the utility bar is
   shown to signed-in clients (notifications, account, switch, admin return)
   with 40px controls. */
@media (max-width: 767.98px) {
    .ps-site:not(.ps-logged-in) .ps-utility:not(:has(.btn-return-to-admin)) { display: none; }
    .ps-site .ps-utility-links { display: none; }
    .ps-site .ps-utility-row { min-height: 48px; }
    .ps-site .ps-utility .btn,
    .ps-site .ps-utility .ps-utility-btn {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        min-height: 40px;
        min-width: 40px;
        justify-content: center;
        padding: 0 10px;
        font-size: 13px;
    }
    .ps-site .ps-utility .ps-icon { margin-right: 0; }
}

@media (max-width: 575.98px) {
    .ps-site .ps-brand { margin-right: 8px; }
    .ps-site header.ps-header .ps-toolbar { gap: 4px; }
    .ps-utility-links { gap: 10px; }
    .ps-site .ps-utility .active-client .btn.btn-active-client { max-width: 150px; }
}

/* Small phones (iPhone SE 1st gen, 320px): brand, theme, cart and menu stay on
   one row with 40px controls; below 320px (folded phones) only the logo mark
   shows and the name stays available to screen readers. */
@media (max-width: 359.98px) {
    .ps-site header.ps-header .ps-toolbar,
    .ps-site header.ps-header .ps-menu-toggle { --ps-ctl: 40px; }
    .ps-site header.ps-header .ps-navbar .ps-menu-toggle { margin-left: 4px; }
    .ps-site header.ps-header .ps-brand { gap: 8px; margin-right: 6px; }
    .ps-site header.ps-header .ps-brand-mark { width: 28px; height: 28px; }
}
@media (max-width: 319.98px) {
    .ps-site header.ps-header .ps-brand-name {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

/* Notifications popover */
.ps-site .popover.popover-user-notifications {
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
}
.ps-site .popover-user-notifications ul li { border-bottom-color: var(--ps-border-soft); }
.ps-site .popover-user-notifications ul li a { color: var(--ps-text-2); }
.ps-site .popover-user-notifications ul li a:hover { background: rgba(var(--ps-primary-rgb), 0.08); color: var(--ps-text); }
.ps-site .popover-user-notifications ul li.none { color: var(--ps-muted); }

/* Breadcrumb */
.ps-site .master-breadcrumb {
    background: transparent;
    border-bottom: 1px solid var(--ps-border-soft);
}

.ps-site .master-breadcrumb .breadcrumb {
    background: transparent;
    margin: 0;
    padding: 12px 0;
    font-size: 13px;
    color: var(--ps-muted);
}

.ps-site .master-breadcrumb .breadcrumb-item a { color: var(--ps-muted); }
.ps-site .master-breadcrumb .breadcrumb-item a:hover { color: var(--ps-text); }
.ps-site .master-breadcrumb .breadcrumb-item.active { color: var(--ps-text-2); }
.ps-site .master-breadcrumb .breadcrumb-item + .breadcrumb-item::before { color: var(--ps-subtle); content: "/"; }

/* Phones: one "back to parent" link instead of the full trail */
.ps-site .ps-crumb-back { display: none; }

@media (max-width: 767.98px) {
    .ps-site .master-breadcrumb .breadcrumb { display: none; }
    .ps-site .master-breadcrumb .ps-crumb-back {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        max-width: 100%;
        padding: 0 12px 0 0;
        color: var(--ps-text-2);
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
    }
    .ps-site .master-breadcrumb .ps-crumb-back span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .ps-site .master-breadcrumb .ps-crumb-back:hover,
    .ps-site .master-breadcrumb .ps-crumb-back:focus-visible { color: var(--ps-text); }
    .ps-site .master-breadcrumb:not(:has(.ps-crumb-back)) { display: none; }
}

/* Network issue banner */
.ps-site .network-issue-alert {
    background: rgba(var(--ps-warning-rgb), 0.12);
    color: var(--ps-warning-text);
    border-bottom: 1px solid rgba(var(--ps-warning-rgb), 0.3);
}
.ps-site .network-issue-alert a { color: inherit; text-decoration: underline; }

/* ---- src/system/20-footer.css ---- */
/* ==========================================================================
   Footer
   ========================================================================== */

.ps-site footer.ps-footer {
    background: var(--ps-bg);
    border-top: 1px solid var(--ps-border);
    color: var(--ps-muted);
    padding: 56px 0 32px;
    margin: 0;
    font-size: 14px;
}

.ps-footer-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.5fr) repeat(3, minmax(0, 1fr));
    gap: 40px;
}

.ps-footer-tagline {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.55;
    letter-spacing: -0.2px;
    color: var(--ps-muted);
    max-width: 320px;
    margin: 16px 0 18px;
}

.ps-footer-legal {
    font-size: 12px;
    line-height: 1.6;
    color: var(--ps-subtle);
    margin: 0;
}

.ps-site .ps-footer-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--ps-subtle);
    margin: 4px 0 18px;
    list-style: none;
    cursor: default;
}

/* <summary> is a plain heading on larger screens (columns stay open). */
.ps-site .ps-footer-heading::-webkit-details-marker { display: none; }
.ps-site .ps-footer-heading::marker { content: ""; }
.ps-site .ps-footer-chevron { display: none; transition: transform 0.2s var(--ps-ease); }

.ps-site .ps-footer-col ul { margin: 0; }
.ps-site .ps-footer-col li + li { margin-top: 11px; }

.ps-site .ps-footer-col a {
    color: var(--ps-muted);
    font-size: 14px;
}

.ps-site .ps-footer-col a:hover,
.ps-site .ps-footer-col a:focus-visible { color: var(--ps-text); }

/* Consumer-protection links (ANPC SAL, EU redress): always visible */
.ps-footer-consumer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin-top: 36px;
    font-size: 13px;
}
.ps-footer-consumer-label { color: var(--ps-subtle); margin-right: 4px; }
.ps-site .ps-footer-consumer a {
    display: inline-flex;
    align-items: center;
    min-height: var(--ps-ctl-sm);
    padding: 0 14px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r-sm);
    color: var(--ps-text-2);
    font-weight: 500;
    text-decoration: none;
}
.ps-site .ps-footer-consumer a:hover,
.ps-site .ps-footer-consumer a:focus-visible {
    color: var(--ps-text);
    border-color: rgba(var(--ps-primary-rgb), 0.35);
    background: rgba(var(--ps-primary-rgb), 0.08);
}

.ps-footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 24px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--ps-border-soft);
}

.ps-site footer.ps-footer .copyright {
    font-size: 13px;
    color: var(--ps-subtle);
}

.ps-footer-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.ps-site footer.ps-footer .list-inline-item { margin: 0; }

.ps-site footer.ps-footer .btn,
.ps-site footer.ps-footer .ps-locale-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: var(--ps-ctl-sm);
    font-size: 13px;
    color: var(--ps-text-2);
    background: transparent;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r-sm);
    padding: 0 12px;
}

.ps-site footer.ps-footer .btn:hover { color: var(--ps-text); border-color: rgba(var(--ps-primary-rgb), 0.35); background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site footer.ps-footer .btn-icon { width: 34px; height: 34px; padding: 0; justify-content: center; }
.ps-site footer.ps-footer .ps-locale-btn .ps-icon { color: var(--ps-muted); }

@media (max-width: 991.98px) {
    .ps-footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ps-footer-brand { grid-column: 1 / -1; }
}

/* Phones: link columns become an accordion with 48px rows */
@media (max-width: 575.98px) {
    .ps-site footer.ps-footer { padding: 40px 0 28px; }
    .ps-footer-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
    .ps-footer-brand { margin-bottom: 20px; }
    .ps-footer-nav { border-top: 1px solid var(--ps-border-soft); }
    .ps-footer-nav:last-child { border-bottom: 1px solid var(--ps-border-soft); }
    .ps-site .ps-footer-heading {
        min-height: 52px;
        margin: 0;
        cursor: pointer;
        font-size: 13px;
        color: var(--ps-text-2);
    }
    .ps-site .ps-footer-chevron { display: inline-block; color: var(--ps-muted); }
    .ps-site .ps-footer-col[open] .ps-footer-chevron { transform: rotate(180deg); }
    .ps-site .ps-footer-col ul { padding: 0 0 12px; }
    .ps-site .ps-footer-col li + li { margin-top: 0; }
    .ps-site .ps-footer-col a {
        display: flex;
        align-items: center;
        min-height: 44px;
        font-size: 15px;
    }
    .ps-footer-consumer { margin-top: 24px; }
    .ps-footer-consumer-label { flex-basis: 100%; }
    .ps-site .ps-footer-consumer a { min-height: 44px; font-size: 14px; }
    .ps-footer-bottom { flex-direction: column-reverse; align-items: flex-start; gap: 16px; }
    .ps-site footer.ps-footer .ps-locale-btn { min-height: 44px; padding: 0 16px; font-size: 14px; }
}

/* Language / currency modal */
.ps-site .modal-localisation .modal-content {
    background: var(--ps-elevated);
    color: var(--ps-text);
    border: 1px solid var(--ps-border);
}
.ps-site .modal-localisation .modal-body { padding: 16px 28px 8px; }
.ps-site .modal-localisation .h5 { color: var(--ps-text); font-weight: 600; }
.ps-site .modal-localisation .close { color: var(--ps-text); opacity: 0.7; text-shadow: none; }
.ps-site .modal-localisation .item-selector .item {
    display: block;
    margin-bottom: 8px;
    padding: 9px 12px;
    color: var(--ps-text-2);
    background: transparent;
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-sm);
    text-decoration: none;
}
.ps-site .modal-localisation .item-selector .item:hover { background: rgba(var(--ps-primary-rgb), 0.08); color: var(--ps-text); }
.ps-site .modal-localisation .item-selector .item.active {
    background: rgba(var(--ps-primary-rgb), 0.16);
    border-color: rgba(var(--ps-primary-rgb), 0.45);
    color: var(--ps-text);
    font-weight: 600;
}
.ps-site .modal-localisation .modal-footer { border-top-color: var(--ps-border); }

/* Phones: scrollable list, Apply always reachable, 44px choices */
@media (max-width: 575.98px) {
    .ps-site .modal-localisation .modal-dialog {
        margin: 12px;
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
    }
    .ps-site .modal-localisation .modal-content {
        max-height: calc(100vh - 24px);
        max-height: calc(100dvh - 24px);
        overflow: hidden;
    }
    .ps-site .modal-localisation .modal-body {
        padding: 8px 16px 4px;
        overflow-y: auto;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }
    .ps-site .modal-localisation .h5 { padding-top: 12px !important; padding-bottom: 10px !important; font-size: 16px; }
    .ps-site .modal-localisation .item-selector { margin-left: -4px; margin-right: -4px; }
    .ps-site .modal-localisation .item-selector > [class*="col-"] { padding-left: 4px; padding-right: 4px; }
    .ps-site .modal-localisation .item-selector .item {
        display: flex;
        align-items: center;
        min-height: 44px;
        padding: 6px 12px;
        font-size: 14px;
    }
    .ps-site .modal-localisation .close {
        position: sticky;
        top: 0;
        float: right;
        width: 44px;
        height: 44px;
        margin: 0 -8px 0 0;
        z-index: 2;
    }
    .ps-site .modal-localisation .modal-footer {
        flex-shrink: 0;
        padding: 12px 16px;
        background: var(--ps-elevated);
    }
    .ps-site .modal-localisation .modal-footer .btn { width: 100%; }
}

/* ---- src/system/30-components.css ---- */
/* ==========================================================================
   Components: buttons, cards, alerts, badges, status labels, lists,
   dropdowns, modals, tabs, pagination, popovers, progress
   ========================================================================== */

/* ---- Buttons (1.1) ----
   Three sizes: small 36 px (8 px corners), standard 44 px (10 px), large 52 px
   (12 px). Five roles: primary (blue fill, one per view), secondary (soft blue),
   outline (neutral), ghost (.btn-link) and danger (red outline; solid red only
   inside confirmation dialogs). Buttons are flex boxes so text and icons centre
   at any height; long labels may wrap because heights are minimums. */
.ps-site .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: var(--ps-ctl);
    padding: 6px 18px;
    font-family: var(--ps-font);
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: -0.1px;
    border-radius: var(--ps-ctl-r);
    vertical-align: middle;
    transition: background 0.15s var(--ps-ease), box-shadow 0.2s var(--ps-ease), border-color 0.15s var(--ps-ease), color 0.15s var(--ps-ease), transform 0.1s var(--ps-ease);
}
.ps-site .btn-block { display: flex; width: 100%; }
/* WHMCS hides buttons with .w-hidden (display:none, not !important); the flex
   display above must not override it. Inline display from jQuery .show() still wins. */
.ps-site .btn.w-hidden { display: none; }
.ps-site .btn .ps-icon { flex: 0 0 auto; }

.ps-site .btn:focus,
.ps-site .btn.focus { box-shadow: 0 0 0 3px var(--ps-ring); }
.ps-site .btn:active { transform: translateY(1px); }
.ps-site .btn-lg, .ps-site .btn-group-lg > .btn {
    min-height: var(--ps-ctl-lg);
    padding: 8px 26px;
    font-size: 15.5px;
    border-radius: var(--ps-ctl-r-lg);
}
.ps-site .btn-sm, .ps-site .btn-group-sm > .btn,
.ps-site .btn-xs, .ps-site .btn-group-xs > .btn {
    min-height: var(--ps-ctl-sm);
    padding: 4px 13px;
    font-size: 13px;
    border-radius: var(--ps-ctl-r-sm);
}

.ps-site .btn-primary,
.ps-site .btn-success,
.ps-site .btn-order-now,
.ps-site .btn-checkout {
    color: var(--ps-on-accent);
    background: linear-gradient(135deg, var(--ps-btn-from) 0%, var(--ps-btn-to) 100%);
    border: 1px solid transparent;
    box-shadow: 0 6px 18px rgba(var(--ps-secondary-rgb), 0.28);
}

.ps-site .btn-primary:hover,
.ps-site .btn-success:hover,
.ps-site .btn-order-now:hover,
.ps-site .btn-checkout:hover,
.ps-site .btn-primary:focus,
.ps-site .btn-success:focus {
    color: var(--ps-on-accent);
    background: linear-gradient(135deg, var(--ps-btn-hover-from) 0%, var(--ps-btn-hover-to) 100%);
    border-color: transparent;
    box-shadow: 0 8px 26px rgba(var(--ps-secondary-rgb), 0.4);
}

.ps-site .btn-primary:focus-visible,
.ps-site .btn-success:focus-visible { box-shadow: 0 0 0 3px var(--ps-ring), 0 8px 26px rgba(var(--ps-secondary-rgb), 0.4); }

.ps-site .btn-primary:not(:disabled):not(.disabled):active,
.ps-site .btn-primary:not(:disabled):not(.disabled).active,
.ps-site .btn-success:not(:disabled):not(.disabled):active,
.ps-site .btn-success:not(:disabled):not(.disabled).active,
.ps-site .show > .btn-primary.dropdown-toggle,
.ps-site .show > .btn-success.dropdown-toggle {
    color: var(--ps-on-accent);
    background: var(--ps-btn-to);
    border-color: transparent;
}

.ps-site .btn-primary.disabled, .ps-site .btn-primary:disabled,
.ps-site .btn-success.disabled, .ps-site .btn-success:disabled {
    color: var(--ps-on-accent);
    background: linear-gradient(135deg, var(--ps-btn-from) 0%, var(--ps-btn-to) 100%);
    opacity: 0.5;
    box-shadow: none;
}

/* Neutral buttons */
.ps-site .btn-default,
.ps-site .btn-secondary,
.ps-site .btn-light,
.ps-site .btn-outline-secondary,
.ps-site .btn-outline-light,
.ps-site .btn-outline-dark,
.ps-site .btn-dark {
    color: var(--ps-text);
    background: rgba(var(--ps-neutral-rgb), 0.04);
    border: 1px solid var(--ps-border-strong);
    box-shadow: none;
}

.ps-site .btn-default:hover, .ps-site .btn-default:focus,
.ps-site .btn-secondary:hover, .ps-site .btn-secondary:focus,
.ps-site .btn-light:hover, .ps-site .btn-light:focus,
.ps-site .btn-outline-secondary:hover, .ps-site .btn-outline-light:hover,
.ps-site .btn-outline-dark:hover, .ps-site .btn-dark:hover,
.ps-site .btn-default:not(:disabled):not(.disabled):active,
.ps-site .btn-default.active,
.ps-site .btn-secondary:not(:disabled):not(.disabled):active,
.ps-site .btn-secondary:not(:disabled):not(.disabled).active,
.ps-site .show > .btn-default.dropdown-toggle,
.ps-site .show > .btn-secondary.dropdown-toggle,
.ps-site .open > .dropdown-toggle.btn-default {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.1);
    border-color: rgba(var(--ps-primary-rgb), 0.35);
}

.ps-site .btn-default.disabled, .ps-site .btn-default:disabled,
.ps-site .btn-default.disabled:hover, .ps-site .btn-default[disabled]:hover,
.ps-site .btn-secondary.disabled, .ps-site .btn-secondary:disabled {
    background: rgba(var(--ps-neutral-rgb), 0.03) !important;
    border-color: var(--ps-border) !important;
    color: var(--ps-subtle);
    opacity: 0.8;
}

/* Soft brand buttons (website plan-card CTA) */
.ps-site .ps-btn-soft,
.ps-site .btn-outline-primary,
.ps-site .btn-info,
.ps-site .btn-outline-info {
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22);
    box-shadow: none;
}

.ps-site .ps-btn-soft:hover, .ps-site .ps-btn-soft:focus,
.ps-site .btn-outline-primary:hover, .ps-site .btn-outline-primary:focus,
.ps-site .btn-info:hover, .ps-site .btn-info:focus,
.ps-site .btn-outline-info:hover, .ps-site .btn-outline-info:focus,
.ps-site .btn-outline-primary:not(:disabled):not(.disabled):active,
.ps-site .btn-outline-primary:not(:disabled):not(.disabled).active,
.ps-site .btn-info:not(:disabled):not(.disabled):active {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.16);
    border-color: rgba(var(--ps-primary-rgb), 0.4);
}

/* WHMCS uses btn-warning for ordinary promotions ("Explore packages now"),
   so it takes the secondary look; amber stays reserved for warnings. */
.ps-site .btn-warning,
.ps-site .btn-outline-warning {
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22);
    box-shadow: none;
}
.ps-site .btn-warning:hover, .ps-site .btn-outline-warning:hover,
.ps-site .btn-warning:focus, .ps-site .btn-outline-warning:focus {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.16);
    border-color: rgba(var(--ps-primary-rgb), 0.4);
}

/* Danger: a red outline on pages; solid red only inside confirmation dialogs */
.ps-site .btn-danger {
    color: var(--ps-danger-text);
    background: transparent;
    border: 1px solid rgba(var(--ps-danger-rgb), 0.5);
    box-shadow: none;
}
.ps-site .btn-danger:hover, .ps-site .btn-danger:focus,
.ps-site .btn-danger:not(:disabled):not(.disabled):active {
    color: var(--ps-danger-text);
    background: rgba(var(--ps-danger-rgb), 0.12);
    border-color: rgba(var(--ps-danger-rgb), 0.7);
}
.ps-site .modal .btn-danger,
.ps-site .modal .btn-danger:hover,
.ps-site .modal .btn-danger:focus {
    color: #ffffff;
    background: var(--ps-danger-solid);
    border-color: transparent;
}
html[data-theme="contrast"] .ps-site .modal .btn-danger { color: #000000; }
.ps-site .modal .btn-danger:hover { filter: brightness(1.1); }

.ps-site .btn-outline-danger {
    color: var(--ps-danger-text);
    background: rgba(var(--ps-danger-rgb), 0.08);
    border: 1px solid rgba(var(--ps-danger-rgb), 0.35);
}
.ps-site .btn-outline-danger:hover, .ps-site .btn-outline-danger:focus {
    color: var(--ps-danger-text);
    background: rgba(var(--ps-danger-rgb), 0.16);
    border-color: rgba(var(--ps-danger-rgb), 0.5);
}

.ps-site .btn-outline-success {
    color: var(--ps-success-text);
    background: rgba(var(--ps-success-rgb), 0.08);
    border: 1px solid rgba(var(--ps-success-rgb), 0.35);
}
.ps-site .btn-outline-success:hover, .ps-site .btn-outline-success:focus {
    color: var(--ps-success-text);
    background: rgba(var(--ps-success-rgb), 0.16);
}

/* Ghost: quiet actions (WHMCS .btn-link) */
.ps-site .btn-link {
    color: var(--ps-link);
    font-weight: 600;
    background: transparent;
    border: 1px solid transparent;
    box-shadow: none;
    text-decoration: none;
}
.ps-site .btn-link:hover, .ps-site .btn-link:focus {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.08);
    text-decoration: none;
}

/* Website hero secondary: gradient border */
.ps-site .ps-btn-outline-grad {
    color: var(--ps-text);
    border: 2px solid transparent;
    background-image: linear-gradient(var(--ps-grad-fill), var(--ps-grad-fill)), linear-gradient(135deg, var(--ps-secondary), var(--ps-primary), var(--ps-accent));
    background-origin: border-box;
    background-clip: padding-box, border-box;
}
.ps-site .ps-btn-outline-grad:hover,
.ps-site .ps-btn-outline-grad:focus {
    color: var(--ps-text);
    box-shadow: 0 0 24px rgba(var(--ps-primary-rgb), 0.25);
}

/* Social login buttons keep their brands but get our radius */
.ps-site .btn-social { border-radius: var(--ps-ctl-r); }

/* ---- Cards ---- */
.ps-site .card,
.ps-site .mc-promo-manage,
.ps-site .mc-promo-login {
    background: var(--ps-surface);
    color: var(--ps-text);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    box-shadow: none;
}

.ps-site .card > .list-group:first-child .list-group-item:first-child { border-top-left-radius: calc(var(--ps-radius-md) - 1px); border-top-right-radius: calc(var(--ps-radius-md) - 1px); }
.ps-site .card > .list-group:last-child .list-group-item:last-child { border-bottom-left-radius: calc(var(--ps-radius-md) - 1px); border-bottom-right-radius: calc(var(--ps-radius-md) - 1px); }

.ps-site .card-header {
    background: transparent;
    border-bottom: 1px solid var(--ps-border);
    color: var(--ps-text);
    padding: 14px 20px;
}
.ps-site .card-header:first-child { border-radius: calc(var(--ps-radius-md) - 1px) calc(var(--ps-radius-md) - 1px) 0 0; }

.ps-site .card-footer {
    background: rgba(var(--ps-neutral-rgb), 0.025);
    border-top: 1px solid var(--ps-border);
    color: var(--ps-muted);
}
.ps-site .card-footer:last-child { border-radius: 0 0 calc(var(--ps-radius-md) - 1px) calc(var(--ps-radius-md) - 1px); }

.ps-site .card-title,
.ps-site .primary-content .card-title { color: var(--ps-text); font-weight: 700; letter-spacing: -0.02em; }
.ps-site .card-subtitle, .ps-site .card-text { color: var(--ps-text-2); }

/* Coloured card accents map to the brand semantic palette */
.ps-site [class*="card-accent-"] { border-top-width: 2px; }
.ps-site .card-accent-blue, .ps-site .card-accent-midnight-blue, .ps-site .card-accent-wet-asphalt,
.ps-site .card-accent-asbestos, .ps-site .card-accent-silver, .ps-site .card-accent-purple,
.ps-site .card-accent-amethyst, .ps-site .card-accent-pink, .ps-site .card-accent-magenta,
.ps-site .card-accent-brand-xovinow-blue { border-top-color: var(--ps-primary); }
.ps-site .card-accent-green, .ps-site .card-accent-emerald, .ps-site .card-accent-turquoise,
.ps-site .card-accent-teal, .ps-site .card-accent-lime { border-top-color: var(--ps-success); }
.ps-site .card-accent-gold, .ps-site .card-accent-orange, .ps-site .card-accent-sun-flower,
.ps-site .card-accent-brand-cpanel-orange { border-top-color: var(--ps-warning); }
.ps-site .card-accent-red, .ps-site .card-accent-pomegranate { border-top-color: var(--ps-danger); }

.ps-site .bg-color-blue, .ps-site .bg-color-midnight-blue, .ps-site .bg-color-wet-asphalt,
.ps-site .bg-color-asbestos, .ps-site .bg-color-silver, .ps-site .bg-color-purple,
.ps-site .bg-color-amethyst, .ps-site .bg-color-pink, .ps-site .bg-color-magenta { background-color: var(--ps-secondary) !important; color: #fff; }
.ps-site .bg-color-green, .ps-site .bg-color-emerald, .ps-site .bg-color-turquoise,
.ps-site .bg-color-teal, .ps-site .bg-color-lime { background-color: #047857 !important; color: #fff; }
.ps-site .bg-color-gold, .ps-site .bg-color-orange, .ps-site .bg-color-sun-flower { background-color: #b45309 !important; color: #fff; }
.ps-site .bg-color-red, .ps-site .bg-color-pomegranate { background-color: #b91c1c !important; color: #fff; }

/* ---- Alerts ---- */
.ps-site .alert {
    border-radius: var(--ps-radius);
    border: 1px solid var(--ps-border);
    padding: 12px 16px;
    color: var(--ps-text);
    background: rgba(var(--ps-neutral-rgb), 0.04);
}
.ps-site .alert-success { background: rgba(var(--ps-success-rgb), 0.1); border-color: rgba(var(--ps-success-rgb), 0.32); color: var(--ps-success-text); }
.ps-site .alert-info,
.ps-site .alert-primary { background: rgba(var(--ps-info-rgb), 0.1); border-color: rgba(var(--ps-info-rgb), 0.3); color: var(--ps-info-text); }
.ps-site .alert-warning { background: rgba(var(--ps-warning-rgb), 0.1); border-color: rgba(var(--ps-warning-rgb), 0.32); color: var(--ps-warning-text); }
.ps-site .alert-danger,
.ps-site .alert-error { background: rgba(var(--ps-danger-rgb), 0.1); border-color: rgba(var(--ps-danger-rgb), 0.32); color: var(--ps-danger-text); }
.ps-site .alert-secondary,
.ps-site .alert-light,
.ps-site .alert-dark { background: rgba(var(--ps-neutral-rgb), 0.05); border-color: var(--ps-border); color: var(--ps-text-2); }
.ps-site .alert a:not(.btn),
.ps-site .alert .alert-link { color: inherit; font-weight: 600; text-decoration: underline; text-decoration-color: currentColor; }
.ps-site .alert hr { border-top-color: currentColor; opacity: 0.2; }
.ps-site .alert .close { color: inherit; text-shadow: none; opacity: 0.7; }
.ps-site .alert h1, .ps-site .alert h2, .ps-site .alert h3, .ps-site .alert h4, .ps-site .alert h5 { color: inherit; }

/* ---- Badges ---- */
.ps-site .badge {
    font-weight: 600;
    border-radius: 999px;
    padding: 0.32em 0.62em;
    letter-spacing: 0;
}
.ps-site .badge-primary, .ps-site .badge-info { color: var(--ps-primary); background: rgba(var(--ps-primary-rgb), 0.16); }
.ps-site .badge-success { color: var(--ps-success-text); background: rgba(var(--ps-success-rgb), 0.15); }
.ps-site .badge-warning { color: var(--ps-warning-text); background: rgba(var(--ps-warning-rgb), 0.15); }
.ps-site .badge-danger { color: var(--ps-danger-text); background: rgba(var(--ps-danger-rgb), 0.15); }
.ps-site .badge-secondary, .ps-site .badge-light, .ps-site .badge-dark, .ps-site .badge-default { color: var(--ps-text-2); background: rgba(var(--ps-neutral-rgb), 0.1); }

/* ---- Status labels: tinted pills, text keeps the status meaning ---- */
.ps-site .label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 0;
    padding: 0.3em 0.75em;
    font-size: 11.5px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.01em;
    border-radius: 999px;
    border: 1px solid rgba(var(--ps-neutral-rgb), 0.2);
    color: var(--ps-text-2);
    background: rgba(var(--ps-neutral-rgb), 0.08);
    white-space: nowrap;
    vertical-align: middle;
}

.ps-site .label.label-success, .ps-site .label.status-active, .ps-site .label.status-open, .ps-site .label.status-completed,
.ps-site .label.status-paid, .ps-site .label.status-accepted, .ps-site .label.requestor-type-owner,
.ps-site .div-service-status .label.status-active, .ps-site .div-service-status .label.status-completed {
    color: var(--ps-success-text);
    background: rgba(var(--ps-success-rgb), 0.12);
    border-color: rgba(var(--ps-success-rgb), 0.35);
}

.ps-site .label.label-warning, .ps-site .label.status-pending, .ps-site .label.status-pending-transfer,
.ps-site .label.status-suspended, .ps-site .label.status-customer-reply, .ps-site .label.status-pending-registration,
.ps-site .label.status-redemption, .ps-site .label.status-grace, .ps-site .label.status-refunded,
.ps-site .label.requestor-type-registereduser,
.ps-site .div-service-status .label.status-pending, .ps-site .div-service-status .label.status-suspended {
    color: var(--ps-warning-text);
    background: rgba(var(--ps-warning-rgb), 0.12);
    border-color: rgba(var(--ps-warning-rgb), 0.35);
}

.ps-site .label.label-danger, .ps-site .label.status-unpaid, .ps-site .label.status-fraud, .ps-site .label.status-inprogress,
.ps-site .label.status-collections, .ps-site .label.status-lost, .ps-site .label.status-dead, .ps-site .label.status-overdue,
.ps-site .div-service-status .label.status-fraud {
    color: var(--ps-danger-text);
    background: rgba(var(--ps-danger-rgb), 0.12);
    border-color: rgba(var(--ps-danger-rgb), 0.35);
}

.ps-site .label.label-info, .ps-site .label.label-primary, .ps-site .label.status-answered, .ps-site .label.status-onhold,
.ps-site .label.status-payment-pending, .ps-site .label.status-delivered, .ps-site .label.status-expired,
.ps-site .label.status-transferred-away, .ps-site .label.requestor-type-operator {
    color: var(--ps-info-text);
    background: rgba(var(--ps-info-rgb), 0.12);
    border-color: rgba(var(--ps-info-rgb), 0.35);
}

.ps-site .label.label-default, .ps-site .label.status-terminated, .ps-site .label.status-closed, .ps-site .label.status-cancelled,
.ps-site .label.requestor-type-authorizeduser, .ps-site .label.requestor-type-subaccount, .ps-site .label.requestor-type-guest,
.ps-site .div-service-status .label.status-terminated, .ps-site .div-service-status .label.status-cancelled {
    color: var(--ps-text-2);
    background: rgba(var(--ps-neutral-rgb), 0.08);
    border-color: rgba(var(--ps-neutral-rgb), 0.2);
}

/* Inline admin-configured ticket status colours stay as set; photonspark.js
   then picks dark or light text for contrast. */
.ps-site .label[style*="background"] { color: #fff; border-color: transparent; }
.ps-site .label.ps-on-light { color: #0b1220 !important; }
.ps-site .label.ps-on-dark { color: #ffffff !important; }

/* ---- List groups ---- */
.ps-site .list-group-item {
    background: transparent;
    border-color: var(--ps-border);
    color: var(--ps-text-2);
}
.ps-site a.list-group-item:hover,
.ps-site a.list-group-item:focus,
.ps-site .list-group-item-action:hover,
.ps-site .list-group-item-action:focus {
    background: rgba(var(--ps-primary-rgb), 0.07);
    color: var(--ps-text);
    text-decoration: none;
}
.ps-site .list-group-item.active,
.ps-site .list-group-item.active:hover,
.ps-site .list-group-item.active:focus {
    background: rgba(var(--ps-primary-rgb), 0.14);
    border-color: rgba(var(--ps-primary-rgb), 0.3);
    color: var(--ps-text);
}
.ps-site .list-group-item.disabled, .ps-site .list-group-item:disabled { color: var(--ps-subtle); background: transparent; }

/* ---- Dropdowns ---- */
.ps-site .dropdown-menu {
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
    color: var(--ps-text);
    padding: 6px;
}
.ps-site .dropdown-item {
    color: var(--ps-text-2);
    border-radius: var(--ps-radius-sm);
    padding: 7px 12px;
}
.ps-site .dropdown-item:hover,
.ps-site .dropdown-item:focus {
    background: rgba(var(--ps-primary-rgb), 0.1);
    color: var(--ps-text);
    text-decoration: none;
}
.ps-site .dropdown-item.active,
.ps-site .dropdown-item:active { background: rgba(var(--ps-primary-rgb), 0.18); color: var(--ps-text); }
.ps-site .dropdown-item.disabled, .ps-site .dropdown-item:disabled { color: var(--ps-subtle); }
.ps-site .dropdown-header { color: var(--ps-subtle); font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; }
.ps-site .dropdown-divider { border-top-color: var(--ps-border); }

/* ---- Modals ---- */
.ps-site .modal-content {
    background: var(--ps-elevated);
    color: var(--ps-text);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow-lg);
}
.ps-site .modal-header { border-bottom-color: var(--ps-border); padding: 16px 20px; }
.ps-site .modal-footer { border-top-color: var(--ps-border); }
.ps-site .modal-title { color: var(--ps-text); font-weight: 700; }
.ps-site .modal-backdrop.show { opacity: 0.72; }
.ps-site .close { color: var(--ps-text); text-shadow: none; opacity: 0.65; }
.ps-site .close:hover, .ps-site .close:focus { color: var(--ps-text); opacity: 1; }
.ps-site .modal .modal-header { background: transparent; }

/* ---- Tabs and pills ---- */
.ps-site .nav-tabs { border-bottom-color: var(--ps-border); }
.ps-site .nav-tabs .nav-link {
    color: var(--ps-muted);
    border: 1px solid transparent;
    border-radius: 10px 10px 0 0;
    font-weight: 500;
}
.ps-site .nav-tabs .nav-link:hover,
.ps-site .nav-tabs .nav-link:focus { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.06); border-color: transparent; }
.ps-site .nav-tabs .nav-link.active,
.ps-site .nav-tabs .nav-item.show .nav-link {
    color: var(--ps-text);
    background: var(--ps-surface);
    border-color: var(--ps-border) var(--ps-border) var(--ps-surface);
}
.ps-site .nav-pills .nav-link { color: var(--ps-text-2); border-radius: var(--ps-radius-sm); }
.ps-site .nav-pills .nav-link.active,
.ps-site .nav-pills .show > .nav-link { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.16); }
.ps-site .responsive-tabs-sm .nav-item a:hover { background: rgba(var(--ps-primary-rgb), 0.06); }

/* ---- Pagination ---- */
.ps-site .pagination { gap: 4px; }
.ps-site .page-link,
.ps-site .pagination > li > a,
.ps-site .pagination > li > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: var(--ps-ctl-sm);
    min-height: var(--ps-ctl-sm);
    padding: 0 12px;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    color: var(--ps-text-2);
    font-size: 13.5px;
    font-weight: 600;
    border-radius: var(--ps-ctl-r-sm) !important;
    margin-left: 0;
}
.ps-site .page-link:hover,
.ps-site .page-link:focus { background: rgba(var(--ps-primary-rgb), 0.08); color: var(--ps-text); border-color: var(--ps-border-strong); box-shadow: none; }
.ps-site .page-item.active .page-link,
.ps-site .pagination > .active > a,
.ps-site .pagination > .active > span,
.ps-site .pagination > .active > a:hover,
.ps-site .pagination > .active > span:hover {
    background: linear-gradient(135deg, var(--ps-btn-from), var(--ps-btn-to));
    border-color: transparent;
    color: var(--ps-on-accent);
}
.ps-site .page-item.disabled .page-link,
.ps-site .paginate_button.disabled .page-link {
    background: transparent;
    color: var(--ps-muted);
    border-color: var(--ps-border-soft);
    border-style: dashed;
    opacity: 1;
    cursor: default;
}

/* ---- Popovers and tooltips (appended to body) ---- */
.ps-site .popover {
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
    font-family: var(--ps-font);
}
.ps-site .popover-header { background: var(--ps-surface-2); border-bottom-color: var(--ps-border); color: var(--ps-text); }
.ps-site .popover-body { color: var(--ps-text-2); }
.ps-site .bs-popover-bottom > .arrow::before, .ps-site .bs-popover-auto[x-placement^="bottom"] > .arrow::before { border-bottom-color: var(--ps-border); }
.ps-site .bs-popover-bottom > .arrow::after, .ps-site .bs-popover-auto[x-placement^="bottom"] > .arrow::after { border-bottom-color: var(--ps-elevated); }
.ps-site .bs-popover-top > .arrow::before, .ps-site .bs-popover-auto[x-placement^="top"] > .arrow::before { border-top-color: var(--ps-border); }
.ps-site .bs-popover-top > .arrow::after, .ps-site .bs-popover-auto[x-placement^="top"] > .arrow::after { border-top-color: var(--ps-elevated); }
.ps-site .bs-popover-left > .arrow::after, .ps-site .bs-popover-auto[x-placement^="left"] > .arrow::after { border-left-color: var(--ps-elevated); }
.ps-site .bs-popover-right > .arrow::after, .ps-site .bs-popover-auto[x-placement^="right"] > .arrow::after { border-right-color: var(--ps-elevated); }

.ps-site .tooltip { font-family: var(--ps-font); }
.ps-site .tooltip-inner {
    background: var(--ps-solid-bg);
    color: var(--ps-solid-fg);
    border-radius: var(--ps-radius-sm);
    font-size: 12px;
    font-weight: 500;
    padding: 6px 10px;
}
.ps-site .bs-tooltip-top .arrow::before, .ps-site .bs-tooltip-auto[x-placement^="top"] .arrow::before { border-top-color: var(--ps-solid-bg); }
.ps-site .bs-tooltip-bottom .arrow::before, .ps-site .bs-tooltip-auto[x-placement^="bottom"] .arrow::before { border-bottom-color: var(--ps-solid-bg); }
.ps-site .bs-tooltip-left .arrow::before, .ps-site .bs-tooltip-auto[x-placement^="left"] .arrow::before { border-left-color: var(--ps-solid-bg); }
.ps-site .bs-tooltip-right .arrow::before, .ps-site .bs-tooltip-auto[x-placement^="right"] .arrow::before { border-right-color: var(--ps-solid-bg); }

/* ---- Progress ---- */
.ps-site .progress { background: var(--ps-surface-2); border-radius: 999px; }
.ps-site .progress-bar { background: linear-gradient(90deg, var(--ps-secondary), var(--ps-primary)); }
.ps-site .progress-bar.bg-success { background: var(--ps-success) !important; }
.ps-site .progress-bar.bg-warning { background: var(--ps-warning) !important; }
.ps-site .progress-bar.bg-danger { background: var(--ps-danger) !important; }
.ps-site .progress-bar.bg-info { background: var(--ps-info) !important; }

/* ---- Misc WHMCS widgets ---- */
.ps-site #fullpage-overlay { background: rgba(var(--ps-bg-rgb), 0.82); color: var(--ps-text); }
.ps-site .btn-return-to-admin .floating { background: var(--ps-elevated); color: var(--ps-text); border: 1px solid var(--ps-border); }
.ps-site .jumbotron { background: var(--ps-surface); border: 1px solid var(--ps-border); border-radius: var(--ps-radius-md); }
.ps-site .well, .ps-site .panel { background: var(--ps-surface); border-color: var(--ps-border); color: var(--ps-text); }
.ps-site .panel-heading, .ps-site .panel-footer { background: var(--ps-surface-2); border-color: var(--ps-border); color: var(--ps-text); }
.ps-site .img-thumbnail { background: var(--ps-surface); border-color: var(--ps-border); }
.ps-site .toast { background: var(--ps-elevated); border-color: var(--ps-border); color: var(--ps-text); }
.ps-site .toast-header { background: var(--ps-surface-2); color: var(--ps-text); border-bottom-color: var(--ps-border); }
.ps-site .carousel-caption { color: #fff; }

/* ---- src/system/40-forms-tables.css ---- */
/* ==========================================================================
   Forms, input groups, custom controls, plugins and tables
   ========================================================================== */

.ps-site label,
.ps-site .col-form-label,
.ps-site .control-label {
    color: var(--ps-text-2);
    font-weight: 500;
    font-size: 0.93rem;
}

.ps-site .form-control,
.ps-site .custom-select,
.ps-site .custom-file-label,
.ps-site select.form-control,
.ps-site textarea.form-control {
    background-color: var(--ps-input-bg);
    color: var(--ps-text);
    border: 1px solid var(--ps-input-border);
    border-radius: var(--ps-ctl-r);
    font-family: var(--ps-font);
    font-size: 0.95rem;
    box-shadow: none;
    transition: border-color 0.15s var(--ps-ease), box-shadow 0.15s var(--ps-ease), background-color 0.15s var(--ps-ease);
}

.ps-site input.form-control:not([type="file"]),
.ps-site select.form-control:not([multiple]):not([size]),
.ps-site .custom-select:not([multiple]):not([size]) {
    height: var(--ps-ctl);
    padding-top: 0.45rem;
    padding-bottom: 0.45rem;
}

.ps-site .form-control-sm, .ps-site .custom-select-sm,
.ps-site input.form-control.form-control-sm:not([type="file"]),
.ps-site select.form-control.form-control-sm:not([multiple]):not([size]),
.ps-site .input-group-sm > .form-control:not(textarea),
.ps-site .input-group-sm > .custom-select { height: var(--ps-ctl-sm); font-size: 0.87rem; border-radius: var(--ps-ctl-r-sm); }

.ps-site .form-control-lg, .ps-site .custom-select-lg,
.ps-site input.form-control.form-control-lg:not([type="file"]),
.ps-site .input-group-lg > .form-control:not(textarea) { height: var(--ps-ctl-lg); font-size: 1.05rem; border-radius: var(--ps-ctl-r-lg); }

.ps-site .form-control::placeholder { color: var(--ps-subtle); opacity: 1; }

.ps-site .form-control:focus,
.ps-site .custom-select:focus,
.ps-site .custom-file-input:focus ~ .custom-file-label {
    background-color: var(--ps-input-bg);
    color: var(--ps-text);
    border-color: var(--ps-primary);
    box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22);
}

.ps-site .form-control:disabled,
.ps-site .form-control[readonly],
.ps-site .custom-select:disabled {
    background-color: var(--ps-surface-2);
    color: var(--ps-muted);
    opacity: 1;
}

.ps-site select.form-control option,
.ps-site .custom-select option { background: var(--ps-elevated); color: var(--ps-text); }

.ps-site .custom-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa6bd' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 14px 14px;
    padding-right: 36px;
}
html[data-theme="light"] .ps-site .custom-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23586275' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
}

.ps-site .form-text,
.ps-site .help-block,
.ps-site .field-help-text,
.ps-site small.text-muted { color: var(--ps-muted) !important; }

.ps-site .form-group { margin-bottom: 1.1rem; }

/* Validation */
.ps-site .form-control.is-invalid,
.ps-site .was-validated .form-control:invalid,
.ps-site .has-error .form-control { border-color: rgba(var(--ps-danger-rgb), 0.8); }
.ps-site .form-control.is-invalid:focus,
.ps-site .has-error .form-control:focus { box-shadow: 0 0 0 3px rgba(var(--ps-danger-rgb), 0.22); }
.ps-site .form-control.is-valid,
.ps-site .was-validated .form-control:valid { border-color: rgba(var(--ps-success-rgb), 0.7); }
.ps-site .invalid-feedback,
.ps-site .has-error .help-block,
.ps-site .has-error .control-label { color: var(--ps-danger-text) !important; }
.ps-site .valid-feedback { color: var(--ps-success-text); }
.ps-site .form-control.is-warning { border-color: rgba(var(--ps-warning-rgb), 0.8); }

/* Input groups */
.ps-site .input-group-text {
    background: var(--ps-surface-2);
    color: var(--ps-muted);
    border: 1px solid var(--ps-input-border);
    border-radius: 10px;
    font-size: 0.95rem;
}
.ps-site .input-group > .input-group-prepend > .btn,
.ps-site .input-group > .input-group-append > .btn { box-shadow: none; }
.ps-site .input-group .btn-reveal-pw { background: var(--ps-surface-2); border-color: var(--ps-input-border); color: var(--ps-muted); }
.ps-site .input-group .btn-reveal-pw:hover { color: var(--ps-text); border-color: var(--ps-input-border); background: var(--ps-surface-3); }

/* Checkboxes, radios, switches */
.ps-site input[type="checkbox"],
.ps-site input[type="radio"] { accent-color: var(--ps-secondary); }

/* Native checkboxes get the brand look (plugin-wrapped/hidden inputs are unaffected). */
.ps-site input[type="checkbox"]:not(.custom-control-input):not(.ps-switch-input):not([name="rememberme"]):not([name="filter"]):not([name^="email_preferences"]) {
    -webkit-appearance: none;
    appearance: none;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 0 8px 0 0;
    vertical-align: -4px;
    border: 1.5px solid var(--ps-border-strong);
    border-radius: 5px;
    background: var(--ps-input-bg) center / 12px 12px no-repeat;
    cursor: pointer;
    transition: background-color 0.12s var(--ps-ease), border-color 0.12s var(--ps-ease);
}
.ps-site input[type="checkbox"]:not(.custom-control-input):not(.ps-switch-input):not([name="rememberme"]):not([name="filter"]):not([name^="email_preferences"]):checked {
    background-color: var(--ps-btn-from);
    border-color: var(--ps-btn-from);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
}
.ps-site input[type="checkbox"]:not(.custom-control-input):disabled { opacity: 0.55; cursor: not-allowed; }
.ps-site input[type="checkbox"]:not(.custom-control-input):focus-visible { outline: 2px solid var(--ps-primary); outline-offset: 2px; }
.ps-site label > input.form-check-input[type="checkbox"] { position: static; margin-left: 0; }

/* Native radios get the brand look too (plugin-wrapped/hidden inputs are unaffected). */
.ps-site input[type="radio"]:not(.custom-control-input) {
    -webkit-appearance: none;
    appearance: none;
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    margin: 0 8px 0 0;
    vertical-align: -4px;
    border: 1.5px solid var(--ps-border-strong);
    border-radius: 50%;
    background: var(--ps-input-bg);
    cursor: pointer;
    transition: border-color 0.12s var(--ps-ease), box-shadow 0.12s var(--ps-ease);
}
.ps-site input[type="radio"]:not(.custom-control-input):checked {
    border-color: var(--ps-btn-from);
    background: var(--ps-btn-from);
    box-shadow: inset 0 0 0 3.5px var(--ps-input-bg);
}
.ps-site input[type="radio"]:not(.custom-control-input):disabled { opacity: 0.55; cursor: not-allowed; }
.ps-site input[type="radio"]:not(.custom-control-input):focus-visible { outline: 2px solid var(--ps-primary); outline-offset: 2px; }
.ps-site label > input.form-check-input[type="radio"] { position: static; margin-left: 0; }

/* Checkboxes shown as squared switches: "Remember me", the cart's safe-search
   filter and the email preferences. The knob is a background image because
   checkboxes cannot hold pseudo-elements; its colour follows the theme. The
   background declarations are !important because Standard Cart resets the
   background shorthand on its own checkboxes with an ID selector. */
.ps-site :is(input[type="checkbox"][name="rememberme"], input[type="checkbox"][name="filter"], input[type="checkbox"][name^="email_preferences"]):not(.ps-switch-input) {
    -webkit-appearance: none;
    appearance: none;
    position: relative;
    flex: 0 0 auto;
    width: 40px;
    height: 24px;
    margin: 0 10px 0 0;
    vertical-align: -7px;
    border: 1px solid var(--ps-border-strong);
    border-radius: 7px;
    background-color: var(--ps-surface-3) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Crect width='18' height='18' rx='5' fill='%23eaf2ff' fill-opacity='0.8'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: 18px 18px !important;
    background-position: 2px center !important;
    cursor: pointer;
    transition: background-color 0.15s var(--ps-ease), border-color 0.15s var(--ps-ease), background-position 0.15s var(--ps-ease);
}
html[data-theme="light"] .ps-site :is(input[type="checkbox"][name="rememberme"], input[type="checkbox"][name="filter"], input[type="checkbox"][name^="email_preferences"]):not(.ps-switch-input) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Crect width='18' height='18' rx='5' fill='%230b1220' fill-opacity='0.62'/%3E%3C/svg%3E") !important;
}
html[data-theme="contrast"] .ps-site :is(input[type="checkbox"][name="rememberme"], input[type="checkbox"][name="filter"], input[type="checkbox"][name^="email_preferences"]):not(.ps-switch-input) {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Crect width='18' height='18' rx='5' fill='%23ffffff' fill-opacity='1'/%3E%3C/svg%3E") !important;
}
.ps-site :is(input[type="checkbox"][name="rememberme"], input[type="checkbox"][name="filter"], input[type="checkbox"][name^="email_preferences"]):not(.ps-switch-input):checked {
    background-color: var(--ps-btn-from) !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18'%3E%3Crect width='18' height='18' rx='5' fill='%23ffffff' fill-opacity='1'/%3E%3C/svg%3E") !important;
    background-position: 18px center !important;
    border-color: transparent;
}
.ps-site :is(input[type="checkbox"][name="rememberme"], input[type="checkbox"][name="filter"], input[type="checkbox"][name^="email_preferences"]):not(.ps-switch-input):focus-visible { outline: 2px solid var(--ps-primary); outline-offset: 2px; }
.ps-site label:has(> input[name="rememberme"]) {
    display: inline-flex;
    align-items: center;
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--ps-text-2);
    cursor: pointer;
    user-select: none;
}

.ps-site .custom-control-label::before {
    background-color: var(--ps-input-bg);
    border: 1px solid var(--ps-border-strong);
}
.ps-site .custom-control-input:focus ~ .custom-control-label::before { box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.25); border-color: var(--ps-primary); }
.ps-site .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--ps-secondary);
    border-color: var(--ps-secondary);
}
.ps-site .custom-switch .custom-control-label::after { background-color: var(--ps-muted); }
.ps-site .custom-switch .custom-control-input:checked ~ .custom-control-label::after { background-color: #fff; }

.ps-site .bootstrap-switch { border-color: var(--ps-input-border); border-radius: 999px; background: var(--ps-input-bg); }
.ps-site .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary,
.ps-site .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary,
.ps-site .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-success,
.ps-site .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-success { background: var(--ps-secondary); color: #fff; }
.ps-site .bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-default,
.ps-site .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-default { background: var(--ps-surface-3); color: var(--ps-text-2); }
.ps-site .bootstrap-switch .bootstrap-switch-label { background: var(--ps-surface); color: var(--ps-text); }
.ps-site .bootstrap-switch.bootstrap-switch-focused { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22); }

/* Phone number field (intl-tel-input) */
.ps-site .intl-tel-input .country-list {
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-sm);
    box-shadow: var(--ps-shadow-lg);
    color: var(--ps-text);
}
.ps-site .intl-tel-input .country-list .country.highlight { background: rgba(var(--ps-primary-rgb), 0.12); }
.ps-site .intl-tel-input .country-list .divider { border-bottom-color: var(--ps-border); }
.ps-site .intl-tel-input .country-list .dial-code { color: var(--ps-muted); }
.ps-site .intl-tel-input .selected-flag:hover,
.ps-site .intl-tel-input .selected-flag:focus { background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site .intl-tel-input .selected-dial-code { color: var(--ps-text-2); }

/* Multiselect (domain search filters) */
.ps-site .multiselect-container { background: var(--ps-elevated); }
.ps-site .multiselect-container > li > a > label,
.ps-site .multiselect-container .multiselect-option { color: var(--ps-text-2); }
.ps-site .multiselect-container > li.active > a,
.ps-site .multiselect-container .multiselect-option.active { background: rgba(var(--ps-primary-rgb), 0.14); color: var(--ps-text); }

/* Markdown editor (tickets) */
.ps-site .md-editor {
    background: var(--ps-input-bg);
    border: 1px solid var(--ps-input-border);
    border-radius: 10px;
    overflow: hidden;
}
.ps-site .md-editor > .btn-toolbar { background: var(--ps-surface-2); border-bottom: 1px solid var(--ps-border); }
.ps-site .md-editor > textarea,
.ps-site .md-editor > .md-preview { background: var(--ps-input-bg); color: var(--ps-text); border-top-color: var(--ps-border); border-bottom-color: var(--ps-border); }
.ps-site .md-editor.active { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22); }
.ps-site .md-editor .btn-toolbar .btn { background: transparent; border-color: transparent; color: var(--ps-muted); }
.ps-site .md-editor .btn-toolbar .btn:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.1); }
.ps-site .markdown-editor-status { color: var(--ps-muted); background: var(--ps-surface-2); }
.ps-site .md-preview blockquote, .ps-site .markdown-content blockquote { border-left-color: rgba(var(--ps-primary-rgb), 0.5); color: var(--ps-text-2); }
.ps-site .md-preview pre, .ps-site .markdown-content pre { background: var(--ps-input-bg); color: var(--ps-text); border: 1px solid var(--ps-border); }

/* Captcha (image challenge). .captchaimage is the image column, style the image only. */
.ps-site .captchaimage { background: transparent; border: 0; box-shadow: none; }
.ps-site .captchaimage img,
.ps-site #inputCaptchaImage,
.ps-site .default-captcha img {
    border-radius: 8px;
    border: 1px solid var(--ps-border-strong);
    background: #ffffff;
    max-width: 100%;
    vertical-align: middle;
}
.ps-site #default-captcha-domainchecker p,
.ps-site .default-captcha p { color: var(--ps-muted); font-size: 13px; }
.ps-site #default-captcha-domainchecker #inputCaptcha,
.ps-site #inputCaptcha { width: 130px; max-width: 100%; height: var(--ps-ctl); border-radius: var(--ps-ctl-r); letter-spacing: 0.12em; }

/* ---- Tables ---- */
.ps-site .table {
    color: var(--ps-text-2);
    background: transparent;
}
.ps-site .table th,
.ps-site .table td { border-top-color: var(--ps-border); vertical-align: middle; }
.ps-site .table thead th {
    border-bottom: 1px solid var(--ps-border);
    color: var(--ps-muted);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}
.ps-site .table tbody + tbody { border-top-color: var(--ps-border); }
.ps-site .table-bordered,
.ps-site .table-bordered th,
.ps-site .table-bordered td { border-color: var(--ps-border); }
.ps-site .table-striped tbody tr:nth-of-type(odd) { background: rgba(var(--ps-neutral-rgb), 0.025); }
.ps-site .table-hover tbody tr:hover { background: rgba(var(--ps-primary-rgb), 0.06); color: var(--ps-text); }
.ps-site .table .thead-light th { background: var(--ps-surface-2); color: var(--ps-muted); border-color: var(--ps-border); }
.ps-site .table-active, .ps-site .table-active > td, .ps-site .table-active > th { background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site .table-success, .ps-site .table-success > td { background: rgba(var(--ps-success-rgb), 0.1); }
.ps-site .table-warning, .ps-site .table-warning > td { background: rgba(var(--ps-warning-rgb), 0.1); }
.ps-site .table-danger, .ps-site .table-danger > td { background: rgba(var(--ps-danger-rgb), 0.1); }
.ps-site .table-info, .ps-site .table-info > td { background: rgba(var(--ps-info-rgb), 0.1); }

/* WHMCS list tables (DataTables) */
.ps-site .dataTables_wrapper table.table-list {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}
.ps-site table.table-list thead th {
    background: var(--ps-surface-2);
    color: var(--ps-muted);
    border-bottom: 1px solid var(--ps-border);
    font-weight: 600;
    font-size: 12px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding: 11px 10px;
}
.ps-site .dataTables_wrapper table.table-list thead th { border-bottom: 1px solid var(--ps-border); }
.ps-site .dataTables_wrapper table.table-list thead th.sorting_asc,
.ps-site .dataTables_wrapper table.table-list thead th.sorting_desc { background: var(--ps-surface-3); color: var(--ps-text); }
.ps-site table.table-list tbody td {
    border-top: 1px solid var(--ps-border-soft);
    color: var(--ps-text-2);
    padding: 12px 10px;
}
.ps-site table.table-list tbody tr:hover td { background: rgba(var(--ps-primary-rgb), 0.05); color: var(--ps-text); }
.ps-site table.table-list tbody td.dataTables_empty { color: var(--ps-muted); padding: 28px 10px; }
/* DataTables toolbar: "Showing…" + search above the table, rows-per-page +
   pagination below. The wrappers are flex rows; nothing is clipped. */
.ps-site .dataTables_wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
}
.ps-site .dataTables_wrapper > .listtable {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px 16px;
    flex: 1 1 100%;
    min-width: 0;
}
.ps-site .dataTables_wrapper > .listtable > table { flex: 1 1 100%; }
.ps-site .dataTables_wrapper .dataTables_info {
    order: 1;
    padding: 0;
    color: var(--ps-muted);
    font-size: 13px;
}
.ps-site .dataTables_wrapper .dataTables_filter {
    order: 2;
    float: none;
    width: min(320px, 100%);
    margin: 0 0 0 auto;
}
.ps-site .dataTables_wrapper .dataTables_filter label { display: block; width: 100%; margin: 0; padding: 0; font-size: 0; }
.ps-site .dataTables_wrapper .dataTables_filter label .form-control {
    box-sizing: border-box;
    width: 100%;
    height: var(--ps-ctl);
    margin: 0 !important;
    padding: 7px 12px 7px 40px !important;
    font-size: 14px;
    background: var(--ps-input-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239aa6bd' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E") no-repeat 14px center / 16px 16px;
}
.ps-site .dataTables_wrapper > .listtable > table.table-list,
.ps-site .dataTables_wrapper table.table-list { order: 3; margin: 0 !important; }
.ps-site .dataTables_wrapper > .dataTables_length { order: 4; margin-right: auto; color: var(--ps-muted); font-size: 13px; }
.ps-site .dataTables_wrapper > .dataTables_paginate { order: 5; float: none; margin: 0; }
.ps-site .dataTables_wrapper .dataTables_paginate .pagination { margin: 0; }
.ps-site .dataTables_wrapper .dataTables_length label { display: inline-flex; align-items: center; gap: 10px; margin: 0; font-weight: 500; color: var(--ps-muted); }
.ps-site .dataTables_wrapper .dataTables_length select { width: auto; display: inline-block; }
.ps-site .table-container { border-radius: 0; overflow: visible; }
.ps-site .table-container.overflow-auto { overflow-x: auto !important; overflow-y: visible !important; padding: 2px; }

/* Rows-per-page as a segmented control (photonspark.js replaces the native select). */
.ps-site .ps-seg {
    display: inline-flex;
    padding: 3px;
    gap: 2px;
    background: rgba(var(--ps-neutral-rgb), 0.04);
    border: 1px solid var(--ps-border);
    border-radius: 10px;
}
.ps-site .ps-seg button {
    min-width: 40px;
    height: 30px;
    padding: 0 10px;
    font-family: var(--ps-font);
    font-size: 13px;
    font-weight: 600;
    color: var(--ps-muted);
    background: transparent;
    border: 0;
    border-radius: 7px;
    cursor: pointer;
    transition: background 0.12s var(--ps-ease), color 0.12s var(--ps-ease);
}
.ps-site .ps-seg button:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site .ps-seg button[aria-pressed="true"] {
    color: var(--ps-on-accent);
    background: linear-gradient(135deg, var(--ps-btn-from), var(--ps-btn-to));
    box-shadow: 0 2px 8px rgba(var(--ps-secondary-rgb), 0.3);
}
.ps-site .ps-seg button:focus-visible { outline: 2px solid var(--ps-primary); outline-offset: 1px; }

@media (max-width: 575.98px) {
    .ps-site .dataTables_wrapper .dataTables_filter { width: 100%; margin: 0; }
    .ps-site .dataTables_wrapper > .dataTables_length,
    .ps-site .dataTables_wrapper > .dataTables_paginate { flex: 1 1 100%; display: flex; justify-content: center; }
}

/* ---- src/system/45-captcha.css ---- */
/* ==========================================================================
   CAPTCHA (built-in image challenge): includes/captcha.tpl and the cart's
   own domain-search block. The 100x24 image is shown at 2x in a white frame.
   ========================================================================== */
.ps-site .ps-captcha-wrap { margin: 18px 0 6px; }
.ps-site .ps-captcha,
.ps-site #default-captcha-domainchecker.ps-captcha {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 14px 16px;
    text-align: left;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    max-width: 100%;
}
.ps-site .ps-captcha-label {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ps-muted);
}
.ps-site .ps-captcha-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ps-site .ps-captcha-image {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--ps-ctl);
    padding: 0 8px;
    background: #ffffff;
    border: 1px solid var(--ps-border-strong);
    border-radius: 10px;
    overflow: hidden;
}
.ps-site .ps-captcha-image img,
.ps-site .ps-captcha #inputCaptchaImage {
    width: 150px;
    height: 36px;
    max-width: none;
    border: 0;
    border-radius: 0;
    image-rendering: auto;
}
.ps-site .ps-captcha-refresh {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 0;
    color: var(--ps-text-2);
    background: transparent;
    border: 1px solid var(--ps-border-strong);
    border-radius: 10px;
}
.ps-site .ps-captcha-refresh:hover,
.ps-site .ps-captcha-refresh:focus-visible { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.1); border-color: rgba(var(--ps-primary-rgb), 0.4); }
.ps-site .ps-captcha-refresh.is-spinning .ps-icon { animation: psSpin 0.6s linear; }
@keyframes psSpin { to { transform: rotate(360deg); } }
.ps-site .ps-captcha #inputCaptcha,
.ps-site .ps-captcha-input {
    width: 150px !important;
    height: var(--ps-ctl) !important;
    margin: 0 !important;
    float: none !important;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-align: center;
    text-transform: uppercase;
    border-radius: 10px;
}
.ps-site .ps-captcha #inputCaptcha::placeholder { letter-spacing: 0.04em; text-transform: none; font-weight: 400; font-size: 15px; }
.ps-site .ps-captcha-help { margin: 0; font-size: 12.5px; color: var(--ps-muted); max-width: 420px; }

/* Homepage domain search: sits under the search box, left aligned */
.ps-site .home-domain-search .ps-captcha-wrap,
.ps-site .primary-content form .home-domain-search .ps-captcha-wrap { display: block; margin-top: 16px; text-align: left; }
.ps-site .home-domain-search .domainchecker-homepage-captcha { display: block; max-width: 100%; }
.ps-site .home-domain-search #default-captcha-domainchecker { margin-bottom: 0; }

/* Forms (contact, registration, tickets, password reset): centred under the form */
.ps-site .primary-content form .ps-captcha-wrap { display: flex; justify-content: center; }

@media (max-width: 575.98px) {
    .ps-site .ps-captcha,
    .ps-site #default-captcha-domainchecker.ps-captcha { display: flex; width: 100%; box-sizing: border-box; }
    .ps-site .primary-content form .ps-captcha-wrap { display: block; }
    .ps-site .ps-captcha-row { flex-wrap: nowrap; width: 100%; }
    .ps-site .ps-captcha #inputCaptcha, .ps-site .ps-captcha-input { flex: 1 1 auto; width: auto !important; min-width: 0; }
    .ps-site .ps-captcha-image img, .ps-site .ps-captcha #inputCaptchaImage { width: 125px; height: 30px; }
}

/* Very narrow phones: the code field moves under the image */
@media (max-width: 379.98px) {
    .ps-site .ps-captcha-row { flex-wrap: wrap; }
    .ps-site .ps-captcha #inputCaptcha, .ps-site .ps-captcha-input { flex: 1 1 100%; }
}

/* Standard Cart domain search keeps its own markup (.default-captcha): same look */
.ps-site #order-standard_cart .captcha-container .default-captcha {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin: 16px 0 0;
    padding: 14px 16px;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    text-align: left;
}
.ps-site #order-standard_cart .captcha-container .default-captcha p { margin: 0; font-size: 13px; color: var(--ps-muted); }
.ps-site #order-standard_cart .captcha-container .default-captcha > div { display: flex; align-items: center; gap: 8px; }
.ps-site #order-standard_cart .captcha-container #inputCaptchaImage {
    width: 150px;
    height: 36px;
    box-sizing: content-box;
    padding: 3px 8px;
    background: #ffffff;
    border: 1px solid var(--ps-border-strong);
    border-radius: 10px;
}
.ps-site #order-standard_cart .captcha-container #inputCaptcha {
    width: 150px;
    max-width: none;
    height: var(--ps-ctl);
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-align: center;
    text-transform: uppercase;
}
.ps-site #order-standard_cart .captcha-container { text-align: left; }

/* hCaptcha / reCAPTCHA notice badge (WHMCS shows it on pages with a protected form;
   its script reveals the popup on hover or tap). Smaller, squared, in the theme's
   colours instead of a 60 px logo over the page. */
.ps-site .captcha-overlay-badge {
    right: 16px;
    bottom: 16px;
    padding: 8px;
    line-height: 0;
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    box-shadow: var(--ps-shadow);
    opacity: 0.85;
    transition: opacity 0.15s var(--ps-ease);
}
.ps-site .captcha-overlay-badge:hover,
.ps-site .captcha-overlay-badge:focus-visible { opacity: 1; }
.ps-site .captcha-overlay-badge img { width: 26px; height: 26px; }

/* The badge stays for 5 seconds after it appears, then fades out (owner's request,
   1.1.4); hCaptcha's notice stays under each protected form (.ps-captcha-note). An open
   popup (.is-open, photonspark.js) or mouse hover pause the countdown. With reduced
   motion the badge simply disappears after the same delay. */
.ps-site .captcha-overlay-badge { animation: psBadgeAway 0.4s var(--ps-ease) 5s forwards; }
.ps-site .captcha-overlay-badge.is-open { animation-play-state: paused; }
/* Only real hover pauses it: touch browsers keep :hover on a tapped element. */
@media (hover: hover) {
    .ps-site .captcha-overlay-badge:hover { animation-play-state: paused; }
}
@keyframes psBadgeAway {
    to { opacity: 0; visibility: hidden; }
}
.ps-site .captcha-overlay-popup {
    right: 16px;
    bottom: 72px;
    width: min(300px, calc(100vw - 32px));
    padding: 12px 14px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ps-text-2);
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
}
.ps-site .captcha-overlay-popup a { color: var(--ps-link); text-decoration: underline; }

/* hCaptcha notice under protected forms (includes/ps-captcha-note.tpl) */
.ps-site .ps-captcha-note {
    margin: 12px 0 16px;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ps-muted);
}
.ps-site .ps-captcha-note a {
    color: var(--ps-text-2);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.ps-site .ps-captcha-note a:hover { color: var(--ps-text); }
.ps-site .primary-content form .ps-captcha-note { text-align: center; }
.ps-site form .ps-domain-box .ps-captcha-note {
    margin: 0;
    padding: 8px 14px;
    border-top: 1px solid var(--ps-border-soft);
    text-align: left;
}
.ps-site .ps-domain-box:not(.is-advanced) .ps-captcha-note { order: 4; flex: 1 1 100%; }
.ps-site #order-standard_cart .ps-captcha-note { margin-bottom: 4px; text-align: center; }

/* A visible (non-invisible) reCAPTCHA/hCaptcha widget inside the homepage search box */
.ps-site .ps-domain-box .recaptcha-container { margin: 0 !important; padding: 10px 12px; border-top: 1px solid var(--ps-border-soft); }

/* ---- src/system/50-home.css ---- */
/* ==========================================================================
   Homepage: hero, plan cards, card links, domain search band
   ========================================================================== */

.ps-hero {
    position: relative;
    overflow: hidden;
    color: var(--ps-text);
    background: var(--ps-hero-bg);
    background-size: 400% 400%;
    animation: psHeroGrad 16s ease infinite;
    border-bottom: 1px solid var(--ps-border-soft);
}

@keyframes psHeroGrad {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.ps-hero-inner {
    position: relative;
    z-index: 1;
    padding-top: clamp(56px, 9vw, 112px);
    padding-bottom: clamp(48px, 7vw, 88px);
}

.ps-hero-mark {
    position: absolute;
    top: 50%;
    right: clamp(-120px, -4vw, 24px);
    width: clamp(240px, 32vw, 460px);
    transform: translateY(-50%);
    opacity: var(--ps-watermark-opacity);
    pointer-events: none;
    z-index: 0;
    filter: drop-shadow(0 0 40px rgba(var(--ps-primary-rgb), 0.2));
}

.ps-site .ps-hero-title {
    font-size: clamp(30px, 4.6vw, 52px);
    font-weight: 700;
    letter-spacing: -1.5px;
    line-height: 1.08;
    margin: 0 0 18px;
    max-width: 680px;
}

.ps-hero-lead {
    font-size: clamp(15px, 1.4vw, 17.5px);
    line-height: 1.65;
    color: var(--ps-muted);
    max-width: 560px;
    margin: 0 0 30px;
}

.ps-cta-row { display: flex; flex-wrap: wrap; gap: 10px; }
.ps-site .ps-cta-row .btn { padding: 8px 28px; }

.ps-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 40px;
    margin: 44px 0 0;
    padding: 22px 0 0;
    border-top: 1px solid var(--ps-border-soft);
    max-width: 640px;
}
.ps-hero-stats li { display: flex; flex-direction: column; gap: 2px; }
.ps-hero-stats strong { font-size: 20px; font-weight: 800; letter-spacing: -0.5px; color: var(--ps-text); }
.ps-hero-stats span { font-size: 13px; color: var(--ps-muted); }

/* Bands */
.ps-band { padding: clamp(48px, 7vw, 88px) 0; }
.ps-band + .ps-band { border-top: 1px solid var(--ps-border-soft); }
.ps-band-alt { background: linear-gradient(180deg, rgba(var(--ps-surface-rgb), 0.55), rgba(var(--ps-surface-rgb), 0.15)); }

.ps-site .ps-section-title {
    font-size: clamp(24px, 3.4vw, 36px);
    font-weight: 700;
    letter-spacing: -1px;
    line-height: 1.12;
    margin: 0 0 36px;
}

.ps-eyebrow-spaced { margin-top: clamp(40px, 6vw, 72px); }

/* Product groups and plan cards */
.ps-group + .ps-group { margin-top: 44px; }

.ps-group-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 16px;
    margin-bottom: 18px;
}

.ps-site .ps-group-title { font-size: 18px; font-weight: 700; margin: 0; letter-spacing: -0.3px; }
.ps-group-tagline { margin: 0; color: var(--ps-muted); font-size: 14px; }
.ps-site .ps-group-link { margin-left: auto; align-self: center; }

.ps-plan-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 20px;
    margin: 0;
}

.ps-plan {
    position: relative;
    min-width: 0;
    display: flex;
    flex-direction: column;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-card-r);
    overflow: hidden;
    transition: border-color 0.2s var(--ps-ease), transform 0.2s var(--ps-ease), box-shadow 0.2s var(--ps-ease);
}

.ps-plan:hover { border-color: rgba(var(--ps-primary-rgb), 0.3); box-shadow: var(--ps-shadow); }

.ps-plan-featured { border-color: rgba(var(--ps-primary-rgb), 0.35); }
.ps-plan-featured::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, var(--ps-primary), var(--ps-accent), var(--ps-primary));
}

.ps-plan-body { display: flex; flex-direction: column; flex: 1; padding: 28px 24px 24px; }
.ps-plan-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 18px; }

.ps-site .ps-plan-name {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--ps-muted);
    margin: 0;
}
.ps-plan-featured .ps-plan-name { color: var(--ps-primary); }

.ps-plan-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.ps-price { font-size: clamp(34px, 3.2vw, 44px); font-weight: 800; letter-spacing: -2px; line-height: 1; color: var(--ps-text); overflow-wrap: anywhere; }
.ps-cycle { font-size: 13px; color: var(--ps-muted); }
.ps-plan-desc { font-size: 13.5px; line-height: 1.6; color: var(--ps-muted); margin: 0 0 22px; flex: 1; }
.ps-site .ps-plan .btn-block { margin-top: auto; }

.ps-plan-features {
    margin: 0 24px;
    padding: 16px 0 22px;
    border-top: 1px solid var(--ps-border-soft);
}
.ps-plan-features li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 0;
    font-size: 13.5px;
    color: var(--ps-text-2);
    border-bottom: 1px solid var(--ps-border-soft);
}
.ps-plan-features li:last-child { border-bottom: 0; }
.ps-plan-features strong { color: var(--ps-text); font-weight: 700; }
.ps-plan-features-text { margin: 0 24px 22px; padding-top: 16px; border-top: 1px solid var(--ps-border-soft); font-size: 13.5px; color: var(--ps-muted); }

/* Card links (domains, help, account) */
.ps-link-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 16px;
}
.ps-link-grid-4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.ps-link-grid-5 { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); }

.ps-site .ps-card-link {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 20px 48px 20px 22px;
    background: rgba(var(--ps-primary-rgb), 0.04);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-card-r);
    color: var(--ps-text);
    text-decoration: none;
    transition: background 0.25s var(--ps-ease), border-color 0.25s var(--ps-ease), transform 0.2s var(--ps-ease);
}

.ps-site .ps-card-link:hover,
.ps-site .ps-card-link:focus-visible {
    background: rgba(var(--ps-primary-rgb), 0.09);
    border-color: rgba(var(--ps-primary-rgb), 0.3);
    color: var(--ps-text);
    text-decoration: none;
    transform: translateY(-1px);
}

.ps-card-icon { width: 24px; height: 24px; color: var(--ps-primary); margin-bottom: 6px; }

/* Whole cards are links: a chevron in the corner says so */
.ps-site .ps-card-link::after {
    content: "";
    position: absolute;
    top: 20px;
    right: 18px;
    width: 18px;
    height: 18px;
    background: currentColor;
    color: var(--ps-muted);
    opacity: 0.8;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='13 6 19 12 13 18'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3Cpolyline points='13 6 19 12 13 18'/%3E%3C/svg%3E") center / contain no-repeat;
    transition: transform 0.2s var(--ps-ease), opacity 0.2s var(--ps-ease);
}
.ps-site .ps-card-link:hover::after,
.ps-site .ps-card-link:focus-visible::after { transform: translateX(3px); opacity: 1; }
.ps-card-link-title { font-weight: 600; font-size: 15px; letter-spacing: -0.2px; }
.ps-card-link-text { font-size: 13px; color: var(--ps-muted); line-height: 1.5; }
.ps-group-empty { max-width: 420px; }

/* Domain search band: see 52-domain-search.css */
.ps-site .ps-domain-band { padding: clamp(40px, 6vw, 72px) 0; }

@media (max-width: 575.98px) {
    .ps-hero-inner { padding-top: 40px; padding-bottom: 36px; }
    .ps-site .ps-hero-title { font-size: 30px; letter-spacing: -1px; }
    .ps-hero-lead { margin-bottom: 24px; }
    .ps-hero-stats {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 12px;
        margin-top: 28px;
        padding-top: 18px;
    }
    .ps-hero-stats strong { font-size: 18px; }
    .ps-hero-stats span { font-size: 12px; line-height: 1.35; }
    .ps-site .ps-group-link { margin-left: 0; width: 100%; }
    .ps-site .ps-cta-row .btn { width: 100%; }
    .ps-plan-body { padding: 24px 20px 20px; }
    .ps-plan-features { margin: 0 20px; }
    .ps-band { padding: 40px 0; }
    .ps-site .ps-section-title { margin-bottom: 20px; }

    /* Shortcut cards: two per row, compact */
    .ps-link-grid,
    .ps-link-grid-4,
    .ps-link-grid-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ps-link-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }
    .ps-site .ps-card-link { padding: 14px 34px 14px 14px; gap: 4px; min-height: 96px; }
    .ps-site .ps-card-link::after { top: 14px; right: 12px; width: 16px; height: 16px; }
    .ps-card-icon { width: 22px; height: 22px; margin-bottom: 4px; }
    .ps-card-link-title { font-size: 14px; line-height: 1.3; }
    .ps-card-link-text { font-size: 12.5px; }
    .ps-site .ps-eyebrow { font-size: 12px; }
}

/* ---- src/system/52-domain-search.css ---- */
/* ==========================================================================
   Domain search (homepage include + Standard Cart domain page)
   1.1: heading with a "View all pricing" button; one box holding the search
   text, the security check and a toolbar in which every control (filters,
   safe-search switch, Transfer, Search) is a 44 px rounded square.
   ========================================================================== */

.ps-site .ps-domain-search { background: transparent !important; }
.ps-site .ps-domain-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas: "title pricing" "box box" "tlds tlds";
    align-items: center;
    gap: 18px 16px;
}
.ps-site .ps-domain-title {
    grid-area: title;
    font-size: clamp(22px, 3vw, 30px);
    font-weight: 700;
    letter-spacing: -0.8px;
    margin: 0;
    text-align: left;
}
.ps-site .ps-domain-pricing { grid-area: pricing; justify-self: end; }
.ps-site .ps-domain-layout > .ps-domain-box { grid-area: box; }
.ps-site .ps-domain-layout > .ps-tld-list { grid-area: tlds; margin: 0; }

.ps-site .ps-domain-box {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-card-r);
    box-shadow: var(--ps-shadow);
    padding: 0;
    overflow: hidden;
    transition: border-color 0.15s var(--ps-ease), box-shadow 0.15s var(--ps-ease);
}
.ps-site .ps-domain-box:focus-within {
    border-color: rgba(var(--ps-primary-rgb), 0.55);
    box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.18), var(--ps-shadow);
}

.ps-site .ps-domain-input {
    display: block;
    width: 100%;
    min-height: 56px;
    margin: 0;
    padding: 16px 18px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--ps-text);
    font-family: var(--ps-font);
    font-size: 16px;
    line-height: 1.55;
    resize: none;
    outline: none;
    box-shadow: none;
}
.ps-site textarea.ps-domain-input { height: 92px; }
.ps-site .ps-domain-input::placeholder { color: var(--ps-subtle); opacity: 1; }

/* Security check: one row inside the box */
.ps-site .ps-domain-box .ps-captcha-wrap { margin: 0; padding: 0; border-top: 1px solid var(--ps-border-soft); }
.ps-site .ps-domain-box .domainchecker-homepage-captcha { display: block; }
.ps-site .ps-domain-box #default-captcha-domainchecker.ps-captcha {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    width: 100%;
    margin: 0;
    padding: 10px 12px;
    background: transparent;
    border: 0;
    border-radius: 0;
}
.ps-site .ps-domain-box .ps-captcha-label { margin: 0 4px 0 2px; }
.ps-site .ps-domain-box .ps-captcha-help { flex: 1 1 200px; margin: 0; }

.ps-site .ps-domain-bar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--ps-border-soft);
}
.ps-site .ps-domain-box:not(.is-advanced) { display: flex; flex-wrap: wrap; align-items: center; }
.ps-site .ps-domain-box:not(.is-advanced) .ps-domain-input { flex: 1 1 260px; width: auto; }
.ps-site .ps-domain-box:not(.is-advanced) .ps-domain-bar { border-top: 0; }
.ps-site .ps-domain-box:not(.is-advanced) .ps-captcha-wrap { order: 3; flex: 1 1 100%; }

.ps-site .ps-domain-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.ps-site .ps-domain-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.ps-site .ps-domain-actions .btn { min-height: var(--ps-ctl); padding: 0 20px; }
.ps-site .ps-domain-actions .btn-primary { min-width: 120px; }

/* Filter chips (bootstrap-multiselect buttons) */
.ps-site .ps-domain-filters .btn-group { position: relative; }
.ps-site .ps-chip,
.ps-site .ps-domain-filters .multiselect.dropdown-toggle,
.ps-site #order-standard_cart .domain-checker-advanced .multiselect.dropdown-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: var(--ps-ctl);
    min-height: var(--ps-ctl);
    padding: 0 12px 0 14px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ps-text-2);
    background: rgba(var(--ps-neutral-rgb), 0.04);
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r) !important;
    box-shadow: none;
    margin: 0;
}
.ps-site .ps-chip-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 999px;
    background: rgba(var(--ps-primary-rgb), 0.18);
    color: var(--ps-primary);
    font-size: 11.5px;
    font-weight: 700;
}
.ps-site .ps-chip:hover,
.ps-site .ps-chip:focus-visible,
.ps-site .show > .ps-chip,
.ps-site .ps-domain-filters .multiselect.dropdown-toggle:hover,
.ps-site #order-standard_cart .domain-checker-advanced .multiselect.dropdown-toggle:hover {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.1);
    border-color: rgba(var(--ps-primary-rgb), 0.35);
}
.ps-site .ps-chip .caret,
.ps-site .multiselect.dropdown-toggle .caret {
    display: inline-block;
    width: 9px;
    height: 9px;
    border: 0;
    margin: 0;
    background: currentColor;
    opacity: 0.7;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ps-site .multiselect.dropdown-toggle::after { display: none; }

/* Filter dropdown menus */
.ps-site .multiselect-container.dropdown-menu {
    min-width: 220px;
    margin-top: 6px;
    padding: 6px;
    background: var(--ps-elevated);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    box-shadow: var(--ps-shadow-lg);
    z-index: 1060;
}
.ps-site .multiselect-container > li { padding: 0; }
.ps-site .multiselect-container > li > a {
    display: block;
    padding: 0;
    border-radius: var(--ps-radius-sm);
    color: var(--ps-text-2);
    text-decoration: none;
}
.ps-site .multiselect-container > li > a > label,
.ps-site .multiselect-container > li > a > label.checkbox,
.ps-site .multiselect-container > li > a > label.radio {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding: 8px 10px !important;
    font-size: 14px;
    font-weight: 500;
    color: inherit;
    cursor: pointer;
}
.ps-site .multiselect-container > li > a > label > input { margin: 0 !important; position: static; }
.ps-site .multiselect-container > li > a:hover,
.ps-site .multiselect-container > li > a:focus,
.ps-site .multiselect-container > li.active > a { background: rgba(var(--ps-primary-rgb), 0.1); color: var(--ps-text); }
.ps-site .multiselect-container > li.disabled > a,
.ps-site .multiselect-container > li > a > label > input:disabled + * { opacity: 0.7; }
.ps-site .multiselect-container .multiselect-item.filter { padding: 2px 2px 6px; }
.ps-site .multiselect-container .multiselect-item.filter .input-group { margin: 0; flex-wrap: nowrap; }
.ps-site .multiselect-container .multiselect-item.filter .input-group-addon,
.ps-site .multiselect-container .multiselect-item.filter .input-group-prepend { display: none; }
.ps-site .multiselect-container .multiselect-search { height: 36px !important; border-radius: 8px !important; font-size: 13.5px; }

/* Safe-search switch: a 44 px control box with a squared switch */
.ps-site .ps-switch {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: var(--ps-ctl);
    margin: 0;
    padding: 0 14px 0 12px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-neutral-rgb), 0.04);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ps-text-2);
    cursor: pointer;
    user-select: none;
}
.ps-site .ps-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ps-site .ps-switch-track {
    position: relative;
    flex: 0 0 auto;
    width: 40px;
    height: 24px;
    border-radius: 7px;
    background: var(--ps-surface-3);
    border: 1px solid var(--ps-border-strong);
    transition: background 0.15s var(--ps-ease), border-color 0.15s var(--ps-ease);
}
.ps-site .ps-switch-track::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 5px;
    background: var(--ps-text-2);
    transition: transform 0.18s var(--ps-ease), background 0.15s var(--ps-ease);
}
.ps-site .ps-switch input:checked + .ps-switch-track { background: var(--ps-btn-from); border-color: transparent; }
.ps-site .ps-switch input:checked + .ps-switch-track::after { transform: translateX(16px); background: #ffffff; }
.ps-site .ps-switch input:focus-visible + .ps-switch-track { outline: 2px solid var(--ps-primary); outline-offset: 2px; }
.ps-site .ps-switch:hover { color: var(--ps-text); border-color: rgba(var(--ps-primary-rgb), 0.35); }

.ps-site .ps-tld-list { display: flex; flex-wrap: wrap; gap: 10px 24px; margin: 0; padding: 0; list-style: none; color: var(--ps-muted); }
.ps-site .ps-tld-list img { height: 22px; margin-right: 6px; }

/* "Filters" button: phones only (filters stay visible on larger screens) */
.ps-site .ps-filters-toggle { display: none; }

/* ---- Phones (1.1.1): one compact box ----
   search text (2 lines) · security check in one row · [Filters] [Transfer] [Search].
   Filters open inside the box above the buttons; "View all pricing" is a small
   button under the box. */
@media (max-width: 767.98px) {
    .ps-site .ps-domain-layout {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas: "title" "box" "pricing" "tlds";
        gap: 12px;
    }
    .ps-site .ps-domain-title { font-size: 24px; letter-spacing: -0.6px; }
    .ps-site .ps-domain-pricing { justify-self: start; min-height: var(--ps-ctl-sm); padding: 0 14px; font-size: 13.5px; }
    .ps-site textarea.ps-domain-input { height: 76px; padding: 14px 16px 10px; }

    .ps-site .ps-domain-box #default-captcha-domainchecker.ps-captcha { flex-wrap: nowrap; padding: 10px 12px; }
    .ps-site .ps-domain-box .ps-captcha-label,
    .ps-site .ps-domain-box .ps-captcha-help {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        padding: 0;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
        border: 0;
    }
    .ps-site .ps-domain-box .ps-captcha-row { flex: 1 1 auto; flex-wrap: nowrap; min-width: 0; width: auto; gap: 8px; }
    .ps-site .ps-domain-box .ps-captcha-image { flex: 0 0 auto; padding: 0 6px; }
    .ps-site .ps-domain-box .ps-captcha-image img,
    .ps-site .ps-domain-box .ps-captcha #inputCaptchaImage { width: 104px; height: 26px; }
    .ps-site .ps-domain-box .ps-captcha #inputCaptcha,
    .ps-site .ps-domain-box .ps-captcha-input { flex: 1 1 auto; width: auto !important; min-width: 0; letter-spacing: 0.12em; }

    .ps-site .ps-domain-bar { padding: 10px 12px; gap: 8px; }
    .ps-site .ps-filters-toggle {
        display: inline-flex;
        flex: 0 0 auto;
        gap: 8px;
        padding: 0 14px;
        color: var(--ps-text-2);
        background: rgba(var(--ps-neutral-rgb), 0.04);
        border: 1px solid var(--ps-border-strong);
    }
    .ps-site .ps-filters-toggle[aria-expanded="true"] {
        color: var(--ps-text);
        background: rgba(var(--ps-primary-rgb), 0.1);
        border-color: rgba(var(--ps-primary-rgb), 0.5);
    }
    .ps-site .ps-domain-bar > .ps-filters-toggle { order: 1; }
    .ps-site .ps-domain-box:not(.is-filters-open) .ps-domain-filters { display: none; }
    .ps-site .ps-domain-box.is-filters-open .ps-domain-filters {
        order: 0;
        flex: 1 1 100%;
        padding-bottom: 10px;
        border-bottom: 1px solid var(--ps-border-soft);
    }
    .ps-site .ps-domain-actions { order: 2; flex: 1 1 0; min-width: 0; width: auto; margin-left: 0; }
    .ps-site .ps-domain-actions .btn { flex: 1 1 0; min-width: 0; padding: 0 12px; }
    .ps-site .ps-domain-actions .btn-primary { min-width: 0; }
    .ps-site .ps-domain-box:not(.is-advanced) { flex-direction: column; align-items: stretch; }
}

/* Narrow phones: the Filters button shows its icon only; the hint needs three lines */
@media (max-width: 379.98px) {
    .ps-site textarea.ps-domain-input,
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box > textarea { height: 100px; }
    .ps-site .ps-filters-toggle { padding: 0 12px; }
    .ps-site .ps-filters-toggle-label {
        position: absolute;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        white-space: nowrap;
    }
}

/* Standard Cart domain pages (register / transfer): same box and toolbar,
   CSS-only because their markup is not overridden. The decorative padding
   and centred columns are removed at every width. */
.ps-site #order-standard_cart .domain-checker-bg { padding: 0 !important; }
.ps-site #order-standard_cart .domain-checker-bg > form > .row { margin: 0; }
.ps-site #order-standard_cart .domain-checker-bg > form > .row > [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
    margin-left: 0;
    padding: 0;
}
.ps-site #order-standard_cart .domain-checker-container { overflow: hidden; border-radius: var(--ps-card-r); }
.ps-site #order-standard_cart .domain-checker-container.domain-checker-advanced .input-group-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 0 12px 10px;
    margin: 0;
}
.ps-site #order-standard_cart .domain-checker-advanced .input-group-box > textarea {
    order: 0;
    flex: 1 1 100%;
    width: calc(100% + 24px) !important;
    max-width: none;
    height: 92px;
    margin: 0 -12px 2px;
    padding: 16px 18px;
    border: 0 !important;
    border-bottom: 1px solid var(--ps-border-soft) !important;
    border-radius: 0;
    background: transparent;
    font-size: 16px;
    box-shadow: none !important;
}
.ps-site #order-standard_cart .domain-checker-advanced .input-group-box > .btn-group { order: 1; }
.ps-site #order-standard_cart .domain-checker-advanced .input-group-box > label {
    order: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: var(--ps-ctl);
    margin: 0;
    padding: 0 14px 0 12px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-neutral-rgb), 0.04);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ps-text-2);
    cursor: pointer;
}
.ps-site .domain-checker-container.domain-checker-advanced #btnCheckAvailability {
    order: 3;
    position: static;
    margin-left: auto;
    height: var(--ps-ctl);
    min-height: var(--ps-ctl);
    min-width: 120px;
    padding: 0 20px;
    font-size: 14.5px;
    line-height: 1.25;
    border-radius: var(--ps-ctl-r) !important;
}
.ps-site #order-standard_cart .domain-checker-advanced .multiselect.dropdown-toggle { margin: 0; }
.ps-site #order-standard_cart #captchaContainer { padding: 10px 12px; border-top: 1px solid var(--ps-border-soft); }
.ps-site #order-standard_cart #captchaContainer .default-captcha { margin: 0; padding: 0; border: 0; background: transparent; }
.ps-site #order-standard_cart #captchaContainer .default-captcha > div { flex-wrap: wrap; }

@media (max-width: 767.98px) {
    /* Same phone layout on the cart's domain pages: [Filters] [Search] */
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box:not(.is-filters-open) > .btn-group,
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box:not(.is-filters-open) > label { display: none; }
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box > .ps-filters-toggle { order: 3; }
    /* line break after the open filters, so [Filters] [Search] stay together */
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box.is-filters-open::after {
        content: "";
        order: 2;
        flex: 0 0 100%;
        height: 0;
    }
    .ps-site .domain-checker-container.domain-checker-advanced #btnCheckAvailability { order: 4; flex: 1 1 0; margin-left: 0; }
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box > textarea { height: 76px; padding: 14px 16px 10px; }
    .ps-site #order-standard_cart #captchaContainer .default-captcha > div { flex-wrap: nowrap; }
    .ps-site #order-standard_cart #captchaContainer #inputCaptchaImage { width: 104px; height: 26px; padding: 8px 6px; }
    .ps-site #order-standard_cart #captchaContainer #inputCaptcha { flex: 1 1 auto; width: auto; min-width: 0; }
}

@media (max-width: 379.98px) {
    .ps-site #order-standard_cart .domain-checker-advanced .input-group-box > textarea { height: 100px; }
}

/* ---- src/system/60-clientarea.css ---- */
/* ==========================================================================
   Client area: sidebar, dashboard tiles and panels, services, tickets,
   knowledgebase/announcements, authentication cards
   ========================================================================== */

/* Page titles */
.ps-site .primary-content > h1:first-child,
.ps-site .primary-content .header-lined h1,
.ps-site .header-lined h1 {
    font-size: clamp(24px, 3vw, 30px);
    letter-spacing: -0.8px;
}
.ps-site .header-lined { border-bottom-color: var(--ps-border); }
.ps-site .header-lined .breadcrumb { background: transparent; }

/* ---- Sidebar ---- */
.ps-site .sidebar .card,
.ps-site .sidebar .card-sidebar { overflow: hidden; margin-bottom: 16px; }
.ps-site .sidebar .card-header { padding: 12px 16px; }
.ps-site .sidebar .card-title,
.ps-site .sidebar .card-sidebar .panel-title {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--ps-muted);
}
.ps-site .sidebar .card-title i { color: var(--ps-primary); }
.ps-site .sidebar .card-sidebar .card-minimise { color: var(--ps-subtle); }
.ps-site .sidebar .card-body { color: var(--ps-text-2); }
.ps-site .sidebar .list-group-item {
    padding: 9px 16px;
    border-color: var(--ps-border-soft);
    color: var(--ps-text-2);
    font-size: 14px;
    background: transparent;
}
.ps-site .sidebar .list-group-item:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.06); }
.ps-site .sidebar .list-group-item.active,
.ps-site .sidebar .list-group-item.active:hover,
.ps-site .sidebar .list-group-item.active:focus {
    background: rgba(var(--ps-primary-rgb), 0.12);
    border-color: var(--ps-border-soft);
    color: var(--ps-text);
    box-shadow: inset 3px 0 0 var(--ps-primary);
}
.ps-site .sidebar .list-group-item .badge {
    background: rgba(var(--ps-primary-rgb), 0.14);
    color: var(--ps-primary);
    width: auto;
    min-width: 26px;
    padding: 4px 7px;
    border-radius: 999px;
}
.ps-site .sidebar .list-group-item > i.far.fa-circle,
.ps-site .sidebar .sidebar-menu-item-icon { color: var(--ps-subtle); }
.ps-site .sidebar .list-group-item.active .sidebar-menu-item-icon,
.ps-site .sidebar .list-group-item.active > i { color: var(--ps-primary); }
.ps-site .sidebar .card-footer { background: transparent; }
.ps-site .sidebar .card-footer .btn { width: 100%; }

/* ---- Dashboard tiles ---- */
.ps-site .tiles {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    overflow: hidden;
    margin-bottom: 20px;
}
.ps-site .tiles .row { margin: 0; }
.ps-site .tiles .row > div { padding: 0; }
.ps-site .tiles .tile {
    background: transparent;
    border-right: 1px solid var(--ps-border-soft);
    color: var(--ps-text);
    padding: 18px 22px 16px;
}
.ps-site .tiles .tile:hover { background: rgba(var(--ps-primary-rgb), 0.06); text-decoration: none; }
.ps-site .tiles .tile i { color: rgba(var(--ps-primary-rgb), 0.22); font-size: 46px; top: 16px; }
.ps-site .tiles .tile:hover i { color: rgba(var(--ps-primary-rgb), 0.38); font-size: 52px; }
.ps-site .tiles .tile .stat { color: var(--ps-text); font-weight: 800; letter-spacing: -1.5px; font-size: 38px; margin-top: 18px; }
.ps-site .tiles .tile .title { color: var(--ps-muted); font-size: 12px; font-weight: 600; letter-spacing: 0.08em; }
.ps-site .tiles .tile .highlight { background: linear-gradient(90deg, var(--ps-secondary), var(--ps-primary), var(--ps-accent)) !important; height: 2px; opacity: 0.85; }
@media (max-width: 1199.98px) {
    .ps-site .tiles .row > div:nth-child(1) > .tile,
    .ps-site .tiles .row > div:nth-child(2) > .tile { border-bottom: 1px solid var(--ps-border-soft); }
}

/* ---- Dashboard panels ---- */
.ps-site .client-home-cards .card { margin-bottom: 20px; }
.ps-site .client-home-cards .card-header {
    background: transparent;
    font-weight: 700;
    border-bottom: 1px solid var(--ps-border);
}
.ps-site .client-home-cards .card-title { font-size: 15px; margin: 0; display: flex; align-items: center; gap: 10px; }
.ps-site .client-home-cards .card-title i { color: var(--ps-primary); }
/* Panel header actions: small secondary buttons (WHMCS adds bg-color-* classes) */
.ps-site .client-home-cards .card-header .btn {
    color: var(--ps-primary) !important;
    background: rgba(var(--ps-primary-rgb), 0.08) !important;
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22) !important;
}
.ps-site .client-home-cards .card-header .btn:hover { color: var(--ps-text) !important; background: rgba(var(--ps-primary-rgb), 0.16) !important; }
.ps-site .client-home-cards .card-body p { color: var(--ps-text-2); }
.ps-site .client-home-cards .list-group .list-group-item { color: var(--ps-text-2); border-color: var(--ps-border-soft); }
.ps-site .client-home-cards .card-footer { background: transparent; }
.ps-site .client-home-cards small, .ps-site .client-home-cards .text-muted { color: var(--ps-muted) !important; }
.ps-site div[menuitemname="Active Products/Services"] .btn-view-more { color: var(--ps-link); font-size: 13px; }

/* Services list rows */
.ps-site .div-service-item { border-color: var(--ps-border-soft); }
.ps-site .div-service-name > span { color: var(--ps-text); }
.ps-site .div-service-name .text-domain { color: var(--ps-muted); }
.ps-site .div-service-buttons .btn { border-radius: 8px; }

/* Product details */
.ps-site .product-details .product-icon,
.ps-site .product-status {
    background: var(--ps-surface-2);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    color: var(--ps-text);
}
.ps-site .product-status-active { border-color: rgba(var(--ps-success-rgb), 0.4); }
.ps-site .product-status-suspended, .ps-site .product-status-pending { border-color: rgba(var(--ps-warning-rgb), 0.4); }
.ps-site .product-status-terminated, .ps-site .product-status-cancelled { border-color: var(--ps-border-strong); }
.ps-site .product-status-text { color: var(--ps-text); }

/* ---- Tickets ---- */
.ps-site .ticket-reply,
.ps-site .ticket-reply .posted-by,
.ps-site .ticket-reply .message { color: var(--ps-text-2); }
.ps-site .ticket-reply {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    overflow: hidden;
    margin-bottom: 16px;
}
.ps-site .ticket-reply.staff { border-color: rgba(var(--ps-primary-rgb), 0.35); }
.ps-site .ticket-reply .posted-by { background: var(--ps-surface-2); border-bottom: 1px solid var(--ps-border); }
.ps-site .ticket-reply.staff .posted-by { background: rgba(var(--ps-primary-rgb), 0.1); }
.ps-site .ticket-reply .attachments { border-top: 1px solid var(--ps-border); background: rgba(var(--ps-neutral-rgb), 0.02); }
.ps-site .ticket-subject { color: var(--ps-text); }
.ps-site .view-ticket .posted-by-name { color: var(--ps-text); font-weight: 600; }

/* ---- Knowledgebase / announcements / downloads ---- */
.ps-site .kb-article-title,
.ps-site .announcement-title { color: var(--ps-text); }
.ps-site .kb-search .form-control,
.ps-site .kb-search { border-radius: 12px; }
.ps-site .announcements .announcement article { border-left-color: rgba(var(--ps-primary-rgb), 0.45); }
.ps-site .announcements .announcement .article-items { color: var(--ps-muted); }
.ps-site .kbarticles a, .ps-site .kbcategories a { color: var(--ps-text); }

/* ---- Authentication cards (login, register, password reset, 2FA) ---- */
.ps-site .ps-tpl-login .primary-content .card,
.ps-site.ps-tpl-login .primary-content .card,
.ps-site.ps-tpl-password-reset-container .primary-content .card,
.ps-site.ps-tpl-two-factor-challenge .primary-content .card,
.ps-site.ps-tpl-clientregister .primary-content .card {
    box-shadow: var(--ps-shadow);
}
.ps-site.ps-tpl-login .primary-content .card-body h6,
.ps-site.ps-tpl-login .primary-content .card-body .h3 { color: var(--ps-text); }

.ps-site .social-signin-btns,
.ps-site .providerLinkingFeedback { color: var(--ps-muted); }

/* ---- Two-factor setup ---- */
.ps-site .twofa-setup .backup-code { background: var(--ps-surface-2); color: var(--ps-text); border: 1px dashed var(--ps-border-strong); border-radius: 10px; }
.ps-site .twofa-module { border-color: var(--ps-border); border-radius: var(--ps-radius); background: var(--ps-surface); }
.ps-site .twofa-module.active { border-color: rgba(var(--ps-primary-rgb), 0.5); background: rgba(var(--ps-primary-rgb), 0.06); }

/* ---- Verification banners ---- */
.ps-site .verification-banner {
    background: rgba(var(--ps-warning-rgb), 0.08);
    border-bottom: 1px solid rgba(var(--ps-warning-rgb), 0.25);
    color: var(--ps-text);
    font-weight: 400;
}
.ps-site .verification-banner .fas,
.ps-site .verification-banner .fal,
.ps-site .verification-banner .far { color: var(--ps-warning-text); }
.ps-site .verification-banner .btn.close { color: var(--ps-muted); }
.ps-site .verification-banner .btn.close:hover { color: var(--ps-text); }
.ps-site .verification-banner.email-verification .btn.btn-action,
.ps-site .verification-banner.email-verification .btn.btn-action:hover,
.ps-site .verification-banner.user-validation .btn.btn-action {
    background: linear-gradient(135deg, var(--ps-btn-from), var(--ps-btn-to));
    border-color: transparent;
    color: var(--ps-on-accent);
}

/* ---- Promotions / MarketConnect blocks ---- */
.ps-site .promo-container,
.ps-site .promo-banner,
.ps-site .mc-promo-manage,
.ps-site .mc-promo-login { background: var(--ps-surface); border-color: var(--ps-border); color: var(--ps-text); }

/* ---- Error pages ---- */
.ps-site .error-container,
.ps-site .error-page { color: var(--ps-text); }
.ps-site .error-container .back-to-home { color: var(--ps-link); }

/* ---- Credit card and payment method forms ---- */
.ps-site .cc-number-field,
.ps-site .paymethod-info { color: var(--ps-text-2); }
.ps-site #frmPayment .card,
.ps-site .masspay .card { background: var(--ps-surface); }

/* ---- Registration and other prepend-icon forms (Twenty-One #registration) ---- */
.ps-site #registration .field,
.ps-site #registration .form-control {
    color: var(--ps-text);
    background: var(--ps-input-bg);
    border: 1px solid var(--ps-input-border);
    border-radius: 10px;
    font-size: 0.95rem;
}
.ps-site #registration input.field:not([type="checkbox"]):not([type="radio"]),
.ps-site #registration input.form-control:not([type="checkbox"]):not([type="radio"]),
.ps-site #registration select.field,
.ps-site #registration select.form-control { height: var(--ps-ctl); }
.ps-site #registration .form-control:focus,
.ps-site #registration .field:focus { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22); }
.ps-site #registration .prepend-icon .field-icon { height: var(--ps-ctl); line-height: var(--ps-ctl); }
.ps-site #registration .prepend-icon .field { padding-left: 40px; }
.ps-site #registration .field-icon i { color: var(--ps-subtle); }
.ps-site #registration label { color: var(--ps-text-2); font-weight: 500; font-size: 13px; }
.ps-site #registration .field[disabled], .ps-site #registration .field[readonly] { background: var(--ps-surface-2); color: var(--ps-muted); }
.ps-site #registration .field-help-text { color: var(--ps-muted); }
.ps-site #registration .sub-heading { height: auto; border-top: 0; text-align: left; margin: 28px 0 14px; }
.ps-site #registration .sub-heading span {
    position: static;
    padding: 0;
    background: transparent;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ps-primary);
}

/* Horizontal forms stack their labels on phones */
@media (max-width: 575.98px) {
    .ps-site .col-form-label.text-right,
    .ps-site label.text-right { text-align: left !important; }
}

/* ---- src/system/70-mobile.css ---- */
/* ==========================================================================
   Phones and small tablets: input zoom, touch targets, compact layouts for
   inherited WHMCS pages. Findings: docs/MOBILE_AUDIT_2026-09-28.md.
   ========================================================================== */

/* Readable minimum for small print on every screen size */
.ps-site small,
.ps-site .small { font-size: max(12px, 0.85em); }

/* Dashboard panels: the parent puts the action button first inside the
   title (float-right); in a flex title it belongs at the end. */
.ps-site .client-home-cards .card-title { flex-wrap: wrap; row-gap: 8px; }
.ps-site .client-home-cards .card-title > .float-right {
    order: 3;
    float: none !important;
    margin-left: auto;
    flex: 0 0 auto;
}
.ps-site .client-home-cards .card-header .btn { white-space: nowrap; }

/* Bootstrap Switch (marketing opt-ins, SSO, card storage): a 44 x 24 squared
   switch matching the theme's own switches. The plugin keeps animating the
   container's margin-left; widths are fixed here and override its inline
   sizes. The Yes/No text stays in the DOM for assistive technology. */
.ps-site .bootstrap-switch {
    position: relative;
    display: inline-block;
    width: 44px !important;
    min-width: 0 !important;
    height: 24px;
    padding: 0;
    overflow: hidden;
    vertical-align: middle;
    border: 1px solid var(--ps-border-strong);
    border-radius: 7px;
    background: var(--ps-surface-3);
    cursor: pointer;
    transition: background-color 0.15s var(--ps-ease), border-color 0.15s var(--ps-ease);
}
.ps-site .bootstrap-switch.bootstrap-switch-on {
    background: var(--ps-btn-from);
    border-color: transparent;
}
.ps-site .bootstrap-switch .bootstrap-switch-container {
    display: flex;
    width: 62px !important;
    height: 22px;
    margin-left: -20px !important;
}
.ps-site .bootstrap-switch.bootstrap-switch-on .bootstrap-switch-container { margin-left: 0 !important; }
.ps-site .bootstrap-switch.bootstrap-switch-animate .bootstrap-switch-container { transition: margin-left 0.15s var(--ps-ease); }
.ps-site .bootstrap-switch .bootstrap-switch-handle-on,
.ps-site .bootstrap-switch .bootstrap-switch-handle-off,
.ps-site .bootstrap-switch .bootstrap-switch-label {
    display: block;
    flex: 0 0 auto;
    height: 22px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    font-size: 0 !important;
    line-height: 22px;
    color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
}
.ps-site .bootstrap-switch .bootstrap-switch-handle-on,
.ps-site .bootstrap-switch .bootstrap-switch-handle-off { width: 20px !important; }
.ps-site .bootstrap-switch .bootstrap-switch-label { position: relative; width: 22px !important; }
.ps-site .bootstrap-switch .bootstrap-switch-label::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 5px;
    background: var(--ps-text-2);
}
.ps-site .bootstrap-switch.bootstrap-switch-on .bootstrap-switch-label::before { background: #ffffff; }
.ps-site .bootstrap-switch.bootstrap-switch-focused {
    outline: 2px solid var(--ps-primary);
    outline-offset: 2px;
    box-shadow: none;
}
.ps-site .bootstrap-switch.bootstrap-switch-disabled,
.ps-site .bootstrap-switch.bootstrap-switch-readonly { opacity: 0.55; cursor: not-allowed; }

/* Wide tables become labelled cards on phones (photonspark.js adds
   .ps-stack and data-label when a table is wider than its container). */
@media (max-width: 767.98px) {
    .ps-site table.ps-stack {
        display: block !important;
        width: 100% !important;
        border: 0 !important;
        background: transparent !important;
        border-radius: 0 !important;
        overflow: visible !important;
    }
    .ps-site table.ps-stack thead { display: none; }
    .ps-site table.ps-stack tbody,
    .ps-site table.ps-stack tfoot { display: block; }
    .ps-site table.ps-stack tr {
        display: block;
        margin: 0 0 10px;
        padding: 4px 14px;
        background: var(--ps-surface);
        border: 1px solid var(--ps-border);
        border-radius: var(--ps-radius);
    }
    .ps-site table.ps-stack tr:hover td { background: transparent !important; }
    .ps-site table.ps-stack td,
    .ps-site table.ps-stack th {
        display: flex;
        align-items: baseline;
        justify-content: space-between;
        gap: 12px;
        width: auto !important;
        padding: 9px 0 !important;
        border: 0 !important;
        border-top: 1px solid var(--ps-border-soft) !important;
        text-align: right !important;
        background: transparent !important;
    }
    .ps-site table.ps-stack tr > :first-child {
        border-top: 0 !important;
        color: var(--ps-text);
        font-weight: 600;
    }
    .ps-site table.ps-stack td[data-label]::before {
        content: attr(data-label);
        flex: 0 1 45%;
        color: var(--ps-muted);
        font-size: 13px;
        font-weight: 500;
        text-align: left;
    }
    .ps-site table.ps-stack td:not([data-label]),
    .ps-site table.ps-stack td[colspan] {
        display: block;
        text-align: left !important;
    }
    .ps-site table.ps-stack td[colspan]::before { content: none; }
    .ps-site table.ps-stack td > .border-left { border-left: 0 !important; padding-left: 0 !important; }
    .ps-site .table-container.overflow-auto:has(> table.ps-stack) { overflow: visible !important; padding: 0; }
}

@media (max-width: 767.98px) {
    :root { --ps-ctl-sm: 40px; }

    /* iOS Safari zooms into any field whose text is under 16px. */
    .ps-site input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="range"]):not([type="color"]),
    .ps-site select,
    .ps-site textarea { font-size: 16px !important; }

    /* Touch targets: standard controls are already 44 px everywhere; the small
       size grows from 36 to 40 px on phones. */
    .ps-site .ps-brand { min-height: 44px; }
    .ps-site .pagination { flex-wrap: wrap; }
    .ps-site .ps-seg button { min-width: 44px; height: 38px; font-size: 14px; }
    .ps-site .sidebar .list-group-item,
    .ps-site .sidebar-secondary .list-group-item {
        min-height: 44px;
        padding-top: 11px;
        padding-bottom: 11px;
    }
    /* Small inline links next to form fields keep their layout but get a taller hit area */
    .ps-site .primary-content form a.small,
    .ps-site .login-form .card-body a.small {
        display: inline-block;
        padding: 12px 0;
        margin: -12px 0;
    }
    .ps-site input[type="checkbox"]:not(.custom-control-input):not(.ps-switch-input):not([name="rememberme"]):not([name="filter"]):not([name^="email_preferences"]),
    .ps-site input[type="radio"]:not(.custom-control-input) {
        width: 24px;
        height: 24px;
        vertical-align: -7px;
    }
    .ps-site input[type="checkbox"]:not(.custom-control-input):not(.ps-switch-input):not([name="rememberme"]):not([name="filter"]):not([name^="email_preferences"]) { background-size: 14px 14px; }

    /* Small text */
    .ps-site .markdown-editor-status,
    .ps-site .markdown-editor-status .small-font,
    .ps-site .markdown-save { font-size: 12px !important; }
    .ps-site .label,
    .ps-site .ps-pill { font-size: 12px; }

    /* Dashboard panel headers */
    .ps-site .client-home-cards .card-header { padding: 14px 16px; }

    /* Ticket form: stacked attachment rows and full-width actions */
    .ps-site .attachment-group { flex-wrap: wrap; row-gap: 8px; }
    .ps-site .attachment-group > .custom-file { flex: 1 1 100%; width: 100%; }
    .ps-site .attachment-group > .input-group-append { flex: 1 1 100%; margin-left: 0; }
    .ps-site .attachment-group > .input-group-append > .btn { width: 100%; border-radius: var(--ps-ctl-r) !important; }
    .ps-site .attachment-group .custom-file-label { border-radius: var(--ps-ctl-r) !important; }
    .ps-site p.text-center:has(> #openTicketSubmit),
    .ps-site #frmReply .form-group.text-center {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .ps-site #openTicketSubmit,
    .ps-site #openTicketSubmit ~ .btn,
    .ps-site #frmReply .form-group.text-center .btn {
        width: 100%;
        margin: 0 !important;
    }
}

/* ---- src/system/75-actions.css ---- */
/* ==========================================================================
   1.1 action and page rules: dashboard, sidebars, login/register, forms,
   tickets, lists, filters, empty states. Sizes and corners come from the
   --ps-ctl* tokens (tokens.css); roles from the button rules (30-components).
   ========================================================================== */

/* ---- Dashboard ---- */
.ps-site .tiles { border-radius: var(--ps-card-r); }
.ps-site .tiles .tile { position: relative; }
.ps-site .tiles .tile .ps-tile-icon {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 40px;
    height: 40px;
    color: rgba(var(--ps-primary-rgb), 0.35);
    stroke-width: 1.6;
    transition: color 0.2s var(--ps-ease), transform 0.2s var(--ps-ease);
}
.ps-site .tiles .tile:hover .ps-tile-icon { color: rgba(var(--ps-primary-rgb), 0.6); transform: translateY(-1px); }

.ps-site .client-home-cards .card { border-radius: var(--ps-card-r); border-top-width: 1px; }
.ps-site .client-home-cards .card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px 12px;
    flex-wrap: wrap;
    padding: 12px 14px 12px 18px;
}
.ps-site .client-home-cards .card-header .card-title { flex: 1 1 auto; min-width: 0; font-size: 15px; }
.ps-site .client-home-cards .card-title .ps-card-title-icon,
.ps-site .client-home-cards .card-title > i { color: var(--ps-primary); flex: 0 0 auto; }
.ps-site .client-home-cards .card-title .badge { margin-left: 2px; }
.ps-site .client-home-cards .ps-card-action { flex: 0 0 auto; white-space: nowrap; }
.ps-site .client-home-cards .card-footer {
    display: flex;
    justify-content: flex-end;
    padding: 10px 14px;
    border-top: 1px solid var(--ps-border-soft);
}
.ps-site .client-home-cards .card-footer:empty { display: none; }

/* "View More..." (WHMCS footer link) as a small outline button */
.ps-site .btn-view-more,
.ps-site div[menuitemname="Active Products/Services"] .btn-view-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--ps-ctl-sm);
    padding: 0 13px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r-sm);
    color: var(--ps-text-2);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.ps-site .btn-view-more:hover,
.ps-site .btn-view-more:focus-visible {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border-color: rgba(var(--ps-primary-rgb), 0.35);
    text-decoration: none;
}
.ps-site .btn-view-more.disabled { display: none; }

/* Empty states */
.ps-site .ps-empty {
    display: grid;
    justify-items: start;
    gap: 8px;
    padding: 4px 0;
}
.ps-site .ps-empty-icon {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-primary-rgb), 0.12);
    color: var(--ps-primary);
}
.ps-site .ps-empty-title { margin: 4px 0 0; font-size: 16px; font-weight: 700; color: var(--ps-text); }
.ps-site .ps-empty-text { margin: 0 0 6px; color: var(--ps-muted); font-size: 14px; max-width: 52ch; }
.ps-site .ps-empty-actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* Empty tables get one next step (photonspark.js) */
.ps-site td.dataTables_empty .ps-empty-cta { display: flex; justify-content: center; margin-top: 12px; }

/* ---- Sidebars: actions are secondary, never the page's main button ---- */
.ps-site .sidebar .card-footer .btn:not(.btn-danger),
.ps-site .sidebar-secondary .card-footer .btn:not(.btn-danger) {
    color: var(--ps-text-2);
    background: transparent;
    border: 1px solid var(--ps-border-strong);
    box-shadow: none;
}
.ps-site .sidebar .card-footer .btn:not(.btn-danger):hover,
.ps-site .sidebar-secondary .card-footer .btn:not(.btn-danger):hover {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border-color: rgba(var(--ps-primary-rgb), 0.35);
}
/* The ticket page already has Reply / Close at the top */
.ps-site.ps-tpl-viewticket .sidebar [menuitemname="Ticket Information"] .card-footer { display: none; }

/* Status filters: a small coloured square instead of an empty circle icon
   (Twenty-One wraps the icon: .list-group-item > .sidebar-menu-item-wrapper > i) */
.ps-site .sidebar .list-group-item i.fa-circle {
    display: inline-block;
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-right: 8px;
    border-radius: 3px;
    background: var(--ps-subtle);
    font-size: 0;
    line-height: 0;
    vertical-align: 1px;
}
.ps-site .sidebar .list-group-item i.fa-circle::before { content: none; }
.ps-site .sidebar :is([menuitemname="Active"], [menuitemname="Paid"], [menuitemname="Open"], [menuitemname="Completed"], [menuitemname="Accepted"], [menuitemname="Delivered"]) i.fa-circle { background: var(--ps-success); }
.ps-site .sidebar :is([menuitemname="Pending"], [menuitemname="Suspended"], [menuitemname="Customer-Reply"], [menuitemname="In Progress"], [menuitemname="Pending Transfer"], [menuitemname="Grace"], [menuitemname="Redemption"], [menuitemname="Draft"]) i.fa-circle { background: var(--ps-warning); }
.ps-site .sidebar :is([menuitemname="Unpaid"], [menuitemname="Overdue"], [menuitemname="Fraud"], [menuitemname="Expired"], [menuitemname="Collections"]) i.fa-circle { background: var(--ps-danger); }
.ps-site .sidebar :is([menuitemname="Answered"], [menuitemname="On Hold"]) i.fa-circle { background: var(--ps-primary); }

/* Register page: the sidebar "Login" row becomes a button */
.ps-site .sidebar [menuitemname="Already Registered"] .list-group-item[menuitemname="Login"] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: var(--ps-ctl);
    margin: 10px 12px 4px;
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22);
    border-radius: var(--ps-ctl-r) !important;
    background: rgba(var(--ps-primary-rgb), 0.08);
    color: var(--ps-primary);
    font-weight: 600;
}
.ps-site .sidebar [menuitemname="Already Registered"] .list-group-item[menuitemname="Login"]:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.16); }

/* ---- Login ---- */
.ps-site.ps-tpl-login .login-form .card-body { display: flex; flex-direction: column; }
.ps-site.ps-tpl-login .login-form .card-body > .float-left { float: none; order: 2; width: 100%; }
.ps-site.ps-tpl-login .login-form .card-body > .text-right { order: 1; text-align: left !important; margin: 2px 0 16px; }
.ps-site.ps-tpl-login #login { width: 100%; }
.ps-site.ps-tpl-login .login-form .card-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding-top: 18px;
    padding-bottom: 20px;
}
.ps-site.ps-tpl-login .login-form .card-footer small { font-size: 13px; color: var(--ps-muted); }
.ps-site.ps-tpl-login .login-form .card-footer a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: var(--ps-ctl);
    margin: 0;
    padding: 0 16px;
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-primary-rgb), 0.08);
    color: var(--ps-primary);
    font-size: 14.5px !important;
    font-weight: 600 !important;
    text-decoration: none;
}
.ps-site.ps-tpl-login .login-form .card-footer a:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.16); }

/* Visible field names on forms that only had placeholders (photonspark.js) */
.ps-site .ps-field-label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 500;
    color: var(--ps-text-2);
}

/* ---- Form actions: primary on the right on larger screens ---- */
@media (min-width: 768px) {
    .ps-site .primary-content form .form-group.text-center:has(> [type="submit"].btn-primary) {
        display: flex;
        flex-direction: row-reverse;
        justify-content: flex-start;
        gap: 8px;
    }
    .ps-site .primary-content form .form-group.text-center:has(> [type="submit"].btn-primary) > .btn { margin: 0; }
}

/* ---- Tickets ---- */
.ps-site #ticketReply {
    color: var(--ps-on-accent);
    background: linear-gradient(135deg, var(--ps-btn-from) 0%, var(--ps-btn-to) 100%);
    border-color: transparent;
    box-shadow: 0 6px 18px rgba(var(--ps-secondary-rgb), 0.28);
}
.ps-site #ticketReply:hover { background: linear-gradient(135deg, var(--ps-btn-hover-from) 0%, var(--ps-btn-hover-to) 100%); color: var(--ps-on-accent); }
.ps-site .card-header .float-right > .btn + .btn { margin-left: 6px; }

/* Markdown editor toolbar: separate small squares */
.ps-site .md-editor > .btn-toolbar { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; }
.ps-site .md-editor > .btn-toolbar > .btn-group { display: flex; gap: 2px; margin: 0; }
.ps-site .md-editor .btn-toolbar .btn {
    min-width: var(--ps-ctl-sm);
    min-height: var(--ps-ctl-sm);
    padding: 0 10px;
    border-radius: var(--ps-ctl-r-sm) !important;
    margin: 0 !important;
}

/* Attachments: "Add more" is a secondary action */
.ps-site #btnTicketAttachmentsAdd {
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border-color: rgba(var(--ps-primary-rgb), 0.22);
}

/* User management: row actions side by side */
.ps-site .btn-manage-permission,
.ps-site .btn-remove-user { margin: 2px 0; }
@media (min-width: 768px) {
    .ps-site td:has(> .btn-remove-user) { white-space: nowrap; }
}

/* ---- Domain category filters ("Popular (4)") as small toggle buttons ---- */
.ps-site .tld-filters { display: flex; flex-wrap: wrap; gap: 6px; }
.ps-site .tld-filters a.badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: var(--ps-ctl-sm);
    margin: 0;
    padding: 0 12px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r-sm);
    background: transparent;
    color: var(--ps-text-2);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.ps-site .tld-filters a.badge:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site .tld-filters a.badge.badge-success,
.ps-site .tld-filters a.badge.active {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.14);
    border-color: rgba(var(--ps-primary-rgb), 0.55);
}

/* ---- Rows-per-page control matches the small size ---- */
.ps-site .ps-seg { border-radius: var(--ps-ctl-r); }
.ps-site .ps-seg button { border-radius: 7px; }

/* Twenty-One gives dashboard card bodies no padding and pads each <p> instead */
.ps-site .client-home-cards .card-body .ps-empty { padding: 18px; }
.ps-site .client-home-cards .card-body .ps-empty p { padding: 0; }
.ps-site .client-home-cards .card-body .ps-empty .ps-empty-title { margin: 4px 0 0; }
.ps-site .client-home-cards .card-body .ps-empty .ps-empty-text { margin: 0 0 6px; }

/* ---- src/system/80-consent.css ---- */
/* ==========================================================================
   Cookie notice (includes/ps-consent.tpl, photonspark.js)
   Bottom bar in the photonspark.com style: translucent surface, blur and the
   brand hairline. While it is open, <html> carries .ps-consent-open and
   --ps-consent-h (the bar's measured height), so the page can scroll clear of
   it, focused fields are not hidden behind it and the hCaptcha badge sits
   above it. It stays under the sticky header (1020), so the phone menu covers
   it, and under Bootstrap modals.
   ========================================================================== */

.ps-consent {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1015;
    max-height: 80vh;
    max-height: 80dvh;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    color: var(--ps-text-2);
    background:
        linear-gradient(90deg, transparent, rgba(var(--ps-secondary-rgb), 0.55), rgba(var(--ps-primary-rgb), 0.55), rgba(var(--ps-secondary-rgb), 0.55), transparent) top / 100% 1px no-repeat,
        rgba(var(--ps-surface-rgb), 0.95);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: 0 -10px 30px rgba(var(--ps-shadow-rgb), 0.16);
    animation: psConsentIn 0.3s var(--ps-ease);
}
.ps-consent[hidden] { display: none; }
.ps-consent:focus { outline: none; }
html[data-theme="contrast"] .ps-consent {
    background: var(--ps-surface);
    border-top: 1px solid var(--ps-border-strong);
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

@keyframes psConsentIn {
    from { opacity: 0; transform: translateY(16px); }
    to { opacity: 1; transform: none; }
}

.ps-consent-inner {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px 20px;
    padding-top: 14px;
    padding-bottom: 14px;
}
.ps-consent-inner:has(.ps-consent-details[open]) { align-items: flex-start; }

.ps-consent-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.1);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.2);
    border-radius: var(--ps-ctl-r);
}

.ps-consent-copy { flex: 1 1 auto; min-width: 0; }
.ps-consent-text {
    margin: 0;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--ps-text-2);
}
.ps-consent-title {
    margin-right: 2px;
    font-weight: 600;
    color: var(--ps-text);
}
.ps-site .ps-consent-policy {
    color: var(--ps-link);
    text-decoration: underline;
    text-underline-offset: 2px;
    white-space: nowrap;
}
.ps-site .ps-consent-policy:hover { color: var(--ps-link-hover); }

.ps-consent-details { margin-top: 2px; }
.ps-site .ps-consent-more {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 30px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ps-text-2);
    list-style: none;
    cursor: pointer;
    border-radius: var(--ps-radius-xs);
}
.ps-site .ps-consent-more::-webkit-details-marker { display: none; }
.ps-site .ps-consent-more::marker { content: ""; }
.ps-site .ps-consent-more:hover { color: var(--ps-text); }
.ps-consent-chevron { color: var(--ps-muted); transition: transform 0.2s var(--ps-ease); }
.ps-consent-details[open] .ps-consent-chevron { transform: rotate(180deg); }

.ps-consent-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 10px;
    margin: 6px 0 4px;
}
.ps-consent-list > div {
    padding: 10px 12px;
    background: rgba(var(--ps-bg-rgb), 0.4);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-ctl-r);
}
.ps-consent-list dt {
    margin: 0 0 2px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ps-text);
}
.ps-consent-list dd {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--ps-muted);
}

.ps-consent-now {
    margin: 2px 0 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--ps-text-2);
}

/* Equal-weight choices: same style, same size. */
.ps-consent-actions {
    flex: 0 0 auto;
    display: flex;
    gap: 10px;
}
.ps-site .ps-consent-btn {
    min-width: 112px;
    min-height: 40px;
    font-weight: 600;
}

.ps-site .ps-consent-close {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    color: var(--ps-muted);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--ps-ctl-r-sm);
    cursor: pointer;
}
.ps-site .ps-consent-close[hidden] { display: none; }
.ps-site .ps-consent-close:hover,
.ps-site .ps-consent-close:focus-visible {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border-color: var(--ps-border-strong);
}

/* Keep the page, focused fields and the hCaptcha badge clear of the bar. */
html.ps-consent-open { scroll-padding-bottom: calc(var(--ps-consent-h, 0px) + 12px); }
html.ps-consent-open body.ps-site { padding-bottom: var(--ps-consent-h, 0px); }
html.ps-consent-open .ps-site .captcha-overlay-badge { bottom: calc(var(--ps-consent-h, 0px) + 16px); }
html.ps-consent-open .ps-site .captcha-overlay-popup { bottom: calc(var(--ps-consent-h, 0px) + 72px); }
/* When the bar covers more than 40% of the screen (details open), the badge would end up
   over the header, so it waits until the bar closes. */
html.ps-consent-tall .ps-site .captcha-overlay-badge,
html.ps-consent-tall .ps-site .captcha-overlay-popup { visibility: hidden; }

/* Footer "Cookie settings" reopens the bar; it looks like the links around it. */
.ps-site .ps-footer-linkbtn {
    margin: 0;
    padding: 0;
    font: inherit;
    font-size: 14px;
    line-height: inherit;
    color: var(--ps-muted);
    text-align: left;
    background: none;
    border: 0;
    border-radius: 0;
    cursor: pointer;
}
.ps-site .ps-footer-linkbtn:hover,
.ps-site .ps-footer-linkbtn:focus-visible { color: var(--ps-text); }

@media (max-width: 767.98px) {
    .ps-consent-inner {
        flex-wrap: wrap;
        gap: 8px;
        padding-top: 12px;
        padding-bottom: 12px;
    }
    .ps-consent-icon { display: none; }
    .ps-consent-copy { flex-basis: 100%; }
    .ps-consent-text { font-size: 13px; }
    .ps-consent.has-close .ps-consent-copy { padding-right: 36px; }
    .ps-consent-list { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .ps-consent-list > div { padding: 8px 10px; }
    .ps-consent-actions {
        flex-basis: 100%;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .ps-site .ps-consent-btn { width: 100%; min-width: 0; min-height: 44px; }
    .ps-site .ps-consent-close {
        position: absolute;
        top: 6px;
        right: 4px;
    }
}

@media (max-width: 575.98px) {
    .ps-site .ps-footer-linkbtn {
        display: flex;
        align-items: center;
        width: 100%;
        min-height: 44px;
        font-size: 15px;
    }
}

@media print {
    .ps-consent { display: none !important; }
    html.ps-consent-open body.ps-site { padding-bottom: 0; }
}

/* ---- src/cart/10-cart.css ---- */
/* ==========================================================================
   Standard Cart pages (cart.php) under the PhotonSpark theme.
   Everything is scoped to .ps-site so it only applies with this system theme,
   whether the order form is standard_cart or photonspark_cart.
   ========================================================================== */

.ps-site #order-standard_cart { color: var(--ps-text); font-family: var(--ps-font); }

.ps-site #order-standard_cart .header-lined { border-bottom: 0; margin-bottom: 20px; padding-bottom: 0; }
.ps-site #order-standard_cart .header-lined h1 {
    font-size: clamp(26px, 3.2vw, 34px);
    font-weight: 700;
    letter-spacing: -1px;
    color: var(--ps-text);
    margin: 0 0 6px;
}
.ps-site #order-standard_cart .header-lined p { color: var(--ps-muted); font-size: 15px; }
.ps-site #order-standard_cart .font-size-36 { font-size: clamp(26px, 3.2vw, 34px) !important; }

/* Section sub-headings become website-style eyebrows */
.ps-site #order-standard_cart .sub-heading,
.ps-site #order-standard_cart .sub-heading-borderless {
    height: auto;
    border-top: 0;
    text-align: left;
    margin: 28px 0 14px;
}
.ps-site #order-standard_cart .sub-heading span,
.ps-site #order-standard_cart .sub-heading-borderless span {
    position: static;
    display: inline-block;
    padding: 0;
    top: 0;
    background: transparent !important;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--ps-primary);
}

/* Category sidebar */
.ps-site #order-standard_cart .cart-sidebar .card,
.ps-site #order-standard_cart .sidebar-collapsed .card { border-radius: var(--ps-radius-md); overflow: hidden; }
.ps-site #order-standard_cart .cart-sidebar .list-group-item { color: var(--ps-text-2); border-color: var(--ps-border-soft); background: transparent; }
.ps-site #order-standard_cart .cart-sidebar .list-group-item:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.06); }
.ps-site #order-standard_cart .cart-sidebar .list-group-item.active {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.12);
    box-shadow: inset 3px 0 0 var(--ps-primary);
    border-color: var(--ps-border-soft);
}
.ps-site #order-standard_cart .cart-sidebar h3,
.ps-site #order-standard_cart .sidebar-collapsed h3 { color: var(--ps-muted); font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; font-weight: 700; }

/* Parent products.tpl cards (when products.tpl is not overridden) */
.ps-site #order-standard_cart .products .product {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-lg);
    padding: 0 0 16px;
    overflow: hidden;
}
.ps-site #order-standard_cart .products .product header { background: transparent; border-bottom: 1px solid var(--ps-border-soft); padding: 18px 20px; margin: 0; }
.ps-site #order-standard_cart .products .product header span { color: var(--ps-text); font-weight: 700; }
.ps-site #order-standard_cart .products .product header .qty { color: var(--ps-muted); }
.ps-site #order-standard_cart .products .product div.product-desc { color: var(--ps-text-2); font-size: 0.9em; }
.ps-site #order-standard_cart .products .product .price { color: var(--ps-text); font-weight: 800; letter-spacing: -1px; }

/* Form fields inside the cart */
.ps-site #order-standard_cart .field,
.ps-site #order-standard_cart .form-control {
    color: var(--ps-text);
    background-color: var(--ps-input-bg);
    border: 1px solid var(--ps-input-border);
    border-radius: 10px;
}
.ps-site #order-standard_cart .field:focus,
.ps-site #order-standard_cart .form-control:focus { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22); }
.ps-site #order-standard_cart input.field:not([type="checkbox"]):not([type="radio"]) { height: var(--ps-ctl); }
.ps-site #order-standard_cart .prepend-icon .field-icon { height: var(--ps-ctl); line-height: var(--ps-ctl); color: var(--ps-subtle); }
.ps-site #order-standard_cart .prepend-icon .field-icon i { color: var(--ps-subtle); }
.ps-site #order-standard_cart .prepend-icon .field { padding-left: 40px; }
.ps-site #order-standard_cart .field[disabled],
.ps-site #order-standard_cart .field[readonly],
.ps-site #order-standard_cart .form-control[disabled],
.ps-site #order-standard_cart .form-control[readonly] { background-color: var(--ps-surface-2); color: var(--ps-muted); }
.ps-site #order-standard_cart .field-help-text { color: var(--ps-muted); }
.ps-site #order-standard_cart label { color: var(--ps-text-2); }

/* Configure product */
.ps-site #order-standard_cart .product-info {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    padding: 18px 20px;
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .product-info .product-title { color: var(--ps-text); font-weight: 700; font-size: 1.25em; }
.ps-site #order-standard_cart .panel-addon,
.ps-site #order-standard_cart .card-addon {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    overflow: hidden;
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .panel-addon .panel-body label,
.ps-site #order-standard_cart .card-addon .card-body label { color: var(--ps-text); }
.ps-site #order-standard_cart .panel-addon .panel-price,
.ps-site #order-standard_cart .card-addon .panel-price { background: var(--ps-surface-2); color: var(--ps-text); }
.ps-site #order-standard_cart .panel-addon .panel-add,
.ps-site #order-standard_cart .card-addon .panel-add {
    background: rgba(var(--ps-primary-rgb), 0.12);
    color: var(--ps-primary);
    border-radius: 0;
    font-weight: 600;
}
.ps-site #order-standard_cart .panel-addon-selected,
.ps-site #order-standard_cart .card-addon.panel-addon-selected { border-color: rgba(var(--ps-primary-rgb), 0.55); box-shadow: 0 0 0 1px rgba(var(--ps-primary-rgb), 0.35); }
.ps-site #order-standard_cart .panel-addon-selected .panel-add {
    background: linear-gradient(135deg, var(--ps-btn-from), var(--ps-btn-to));
    color: var(--ps-on-accent);
}

/* Order summary */
.ps-site #order-standard_cart .order-summary {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    overflow: hidden;
    box-shadow: var(--ps-shadow);
}
.ps-site #order-standard_cart .order-summary h2 {
    background: linear-gradient(135deg, rgba(var(--ps-secondary-rgb), 0.95), rgba(var(--ps-primary-rgb), 0.75));
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    padding: 14px 16px;
    text-align: left;
}
html[data-theme="contrast"] .ps-site #order-standard_cart .order-summary h2 { background: #ffffff; color: #000000; }
.ps-site #order-standard_cart .summary-container {
    background: transparent;
    color: var(--ps-text-2);
    font-size: 0.9em;
    padding: 16px;
}
.ps-site #order-standard_cart .order-summary .product-name { color: var(--ps-text); }
.ps-site #order-standard_cart .order-summary .product-group { color: var(--ps-muted); }
.ps-site #order-standard_cart .order-summary .summary-totals,
.ps-site #order-standard_cart .order-summary .subtotal { border-color: var(--ps-border); }
.ps-site #order-standard_cart .order-summary .total-due-today .amt {
    color: var(--ps-text);
    font-weight: 800;
    letter-spacing: -1.2px;
}
.ps-site #order-standard_cart .order-summary .total-due-today span:not(.amt) { color: var(--ps-muted); }
.ps-site #order-standard_cart .order-summary .loader { color: var(--ps-muted); }
.ps-site #order-standard_cart .order-summary .btn-checkout,
.ps-site #order-standard_cart .order-summary .btn { width: 100%; }

/* View cart */
.ps-site #order-standard_cart .view-cart-items-header {
    background: var(--ps-surface-2);
    color: var(--ps-muted);
    border: 1px solid var(--ps-border);
    border-bottom: 0;
    border-radius: var(--ps-radius) var(--ps-radius) 0 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 11px 16px;
}
.ps-site #order-standard_cart .view-cart-items {
    border: 1px solid var(--ps-border);
    border-radius: 0 0 var(--ps-radius) var(--ps-radius);
    overflow: hidden;
    background: var(--ps-surface);
}
.ps-site #order-standard_cart .view-cart-items .item { background: transparent; color: var(--ps-text-2); border-top: 1px solid var(--ps-border-soft); padding: 14px 16px; }
.ps-site #order-standard_cart .view-cart-items .item:nth-child(even) { background: rgba(var(--ps-neutral-rgb), 0.025); }
.ps-site #order-standard_cart .view-cart-items .item-title { color: var(--ps-text); font-weight: 600; }
.ps-site #order-standard_cart .view-cart-items .item-group,
.ps-site #order-standard_cart .view-cart-items .item-domain { color: var(--ps-muted); }
.ps-site #order-standard_cart .view-cart-items .item-price span:first-child { color: var(--ps-text); font-weight: 700; }
.ps-site #order-standard_cart .view-cart-items .btn-remove-from-cart { color: var(--ps-danger-text); }
.ps-site #order-standard_cart .empty-cart { display: flex; justify-content: flex-end; margin-top: 8px; }
.ps-site #order-standard_cart .empty-cart .btn {
    color: var(--ps-text-2);
    background: transparent;
    border: 1px solid transparent;
    border-radius: var(--ps-ctl-r-sm);
}
.ps-site #order-standard_cart .empty-cart .btn:hover,
.ps-site #order-standard_cart .empty-cart .btn:focus-visible {
    color: var(--ps-danger-text);
    background: rgba(var(--ps-danger-rgb), 0.1);
}
.ps-site #order-standard_cart .view-cart-empty { color: var(--ps-muted); padding: 32px 16px; text-align: center; }
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs a,
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected="true"] {
    background: var(--ps-surface);
    border-color: var(--ps-border) var(--ps-border) var(--ps-surface);
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs a[aria-selected="false"] { background: transparent; border-color: transparent; color: var(--ps-muted); }
.ps-site #order-standard_cart .view-cart-tabs .tab-content {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: 0 var(--ps-radius) var(--ps-radius) var(--ps-radius);
    color: var(--ps-text-2);
}

/* Checkout */
.ps-site #order-standard_cart .account-select-container { border-right-color: var(--ps-border); }
.ps-site #order-standard_cart .account-select-container div.account {
    background: var(--ps-surface-2);
    border-color: var(--ps-border);
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .account-select-container div.account.active { background: var(--ps-surface); color: var(--ps-text); box-shadow: inset 3px 0 0 var(--ps-primary); }
.ps-site #order-standard_cart .account-select-container div.account label { color: inherit; }
.ps-site #order-standard_cart .cc-input-container,
.ps-site #order-standard_cart #creditCardInputFields,
.ps-site #order-standard_cart .existing-cc-grid {
    background: var(--ps-surface);
    border-color: var(--ps-border);
    color: var(--ps-text-2);
    border-radius: var(--ps-radius);
}
.ps-site #order-standard_cart #paymentGatewaysContainer label,
.ps-site #order-standard_cart .payment-methods label { color: var(--ps-text); }
.ps-site #order-standard_cart .marketing-email-optin,
.ps-site #order-standard_cart .checkout-security-msg {
    background: rgba(var(--ps-primary-rgb), 0.05);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .checkout-security-msg i { color: var(--ps-success); }
.ps-site #order-standard_cart .marketing-email-optin { padding: 16px 18px; margin: 18px 0; }
.ps-site #order-standard_cart .marketing-email-optin h2,
.ps-site #order-standard_cart .marketing-email-optin h4 { font-size: 16px; margin: 0 0 6px; }
.ps-site #order-standard_cart .marketing-email-optin p { margin: 0 0 10px; color: var(--ps-muted); font-size: 13.5px; }
.ps-site #order-standard_cart .already-registered { background: transparent; color: var(--ps-muted); }
.ps-site #order-standard_cart #btnCompleteOrder { width: 100%; }

/* Domains in the cart */
.ps-site .domain-checker-container {
    background: var(--ps-surface) !important;
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    box-shadow: var(--ps-shadow);
}
.ps-site .domain-checker-bg { background: transparent !important; }
.ps-site .domain-checker-container .input-group-box { background: transparent; }
.ps-site .domain-checker-result-headline { color: var(--ps-text); }
.ps-site .domain-checker-available { color: var(--ps-success-text); }
.ps-site .domain-checker-unavailable { color: var(--ps-danger-text); }
.ps-site .domain-checker-invalid { color: var(--ps-warning-text); }
.ps-site #DomainSearchResults .primary-domain-header,
.ps-site .suggested-domains .card-header,
.ps-site .suggested-domains .panel-heading { border-bottom-color: rgba(var(--ps-success-rgb), 0.5); color: var(--ps-text); }
.ps-site .suggested-domains .btn:not(.domain-contact-support),
.ps-site .spotlight-tld .btn:not(.domain-contact-support) {
    background: rgba(var(--ps-primary-rgb), 0.1);
    border-color: rgba(var(--ps-primary-rgb), 0.3);
    color: var(--ps-primary);
}
.ps-site .spotlight-tld {
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    color: var(--ps-text);
}
.ps-site .domain-renewals .domain-renewal:nth-child(even),
.ps-site .service-renewals .service-renewal:nth-child(even),
.ps-site .addon-renewals .addon-renewal:nth-child(even) { background: rgba(var(--ps-neutral-rgb), 0.025); }
.ps-site #order-standard_cart .transfer-eligible { background: rgba(var(--ps-success-rgb), 0.1); border-color: rgba(var(--ps-success-rgb), 0.3); color: var(--ps-success-text); }
.ps-site .domain-pricing .tld-row.highlighted { background: rgba(var(--ps-primary-rgb), 0.08); }
.ps-site .domain-pricing .tld-pricing-header div:nth-child(odd) { border-color: var(--ps-primary); }

/* Product recommendations and MarketConnect promos */
.ps-site .product-recommendations,
.ps-site #order-standard_cart .mc-promo { border-color: var(--ps-border); background: var(--ps-surface); color: var(--ps-text-2); border-radius: var(--ps-radius); }
.ps-site .product-recommendations .product-recommendation .body,
.ps-site #order-standard_cart .mc-promo .body { border-top-color: var(--ps-border); }
.ps-site #recommendationsModal .modal-content { background: var(--ps-elevated); }

/* Captcha block on checkout */
.ps-site #order-standard_cart .default-captcha { border-color: var(--ps-border); background: var(--ps-surface); border-radius: var(--ps-radius); color: var(--ps-text-2); }

/* Completed order */
.ps-site #order-standard_cart .order-confirmation {
    background: rgba(var(--ps-success-rgb), 0.08);
    border: 1px solid rgba(var(--ps-success-rgb), 0.3);
    border-radius: var(--ps-radius);
    color: var(--ps-text);
}

/* Stripe Elements (iframes) use Stripe's default dark text, which the
   ionCube-encoded WHMCS gateway does not let us restyle. Keep the card
   fields light in dark/contrast modes so typed digits stay readable. */
html:not([data-theme="light"]) .ps-site .StripeElement {
    background: #eef3fb !important;
    border-color: rgba(var(--ps-primary-rgb), 0.45) !important;
    color: #0b1220;
}
.ps-site .StripeElement { border-radius: var(--ps-ctl-r); min-height: var(--ps-ctl); padding: 11px 14px; }
.ps-site .StripeElement--focus { border-color: var(--ps-primary) !important; box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.25); }
.ps-site .StripeElement--invalid { border-color: rgba(var(--ps-danger-rgb), 0.8) !important; }

/* ---- src/cart/20-plans.css ---- */
/* ==========================================================================
   PhotonSpark order form (photonspark_cart/products.tpl): plan cards
   ========================================================================== */

.ps-site #order-standard_cart .ps-plan-grid-cart {
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    margin-top: 8px;
}

.ps-site #order-standard_cart .ps-plan-name { font-size: 12px; margin: 0; line-height: 1.4; }
.ps-site #order-standard_cart .ps-plan-price { flex-direction: row; }
.ps-site #order-standard_cart .ps-price-note {
    flex-basis: 100%;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ps-subtle);
}
.ps-site #order-standard_cart .ps-setup-fee { flex-basis: 100%; color: var(--ps-muted); font-size: 12px; }
.ps-site #order-standard_cart .ps-plan-stock { color: var(--ps-muted); font-size: 12px; margin: -8px 0 12px; }
.ps-site #order-standard_cart .ps-plan .btn-order-now { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
.ps-site #order-standard_cart .ps-plan-desc { color: var(--ps-muted); }
.ps-site #order-standard_cart .ps-plan-features li { font-size: 13px; }

/* ---- src/cart/30-mobile.css ---- */
/* ==========================================================================
   Order form on phones, plus brand styling for Standard Cart promo boxes
   ========================================================================== */

/* "Categories"/"Actions" pickers only help while browsing the store; on the
   cart, checkout and configuration steps they push the order off-screen. */
.ps-site.ps-tpl-viewcart #order-standard_cart .sidebar-collapsed,
.ps-site.ps-tpl-checkout #order-standard_cart .sidebar-collapsed,
.ps-site.ps-tpl-configureproduct #order-standard_cart .sidebar-collapsed,
.ps-site.ps-tpl-configureproductdomain #order-standard_cart .sidebar-collapsed,
.ps-site.ps-tpl-configuredomains #order-standard_cart .sidebar-collapsed,
.ps-site.ps-tpl-complete #order-standard_cart .sidebar-collapsed { display: none !important; }

/* Promo boxes under the domain search ("Add web hosting", "Transfer your domain") */
.ps-site #order-standard_cart .domain-promo-box {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    margin: 16px 0 0;
    padding: 22px;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius-md);
    color: var(--ps-text-2);
}
.ps-site #order-standard_cart .domain-promo-box .clearfix { width: 100%; }
.ps-site #order-standard_cart .domain-promo-box i {
    float: none;
    display: block;
    margin: 0 0 10px;
    font-size: 26px;
    color: var(--ps-primary);
}
.ps-site #order-standard_cart .domain-promo-box h3 {
    margin: 0 0 4px;
    font-size: 18px !important;
    font-weight: 700;
    letter-spacing: -0.2px;
    white-space: normal;
    color: var(--ps-text);
}
.ps-site #order-standard_cart .domain-promo-box p { margin: 0 0 8px; font-size: 14px; color: var(--ps-muted); }
.ps-site #order-standard_cart .domain-promo-box p.text-warning,
.ps-site #order-standard_cart .domain-promo-box p.text-primary { color: var(--ps-text-2) !important; font-weight: 600; }
.ps-site #order-standard_cart .domain-promo-box .small { margin: 8px 0 0; font-size: 12px; color: var(--ps-subtle); }
.ps-site #order-standard_cart .domain-promo-box .btn-warning {
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.1);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.3);
    box-shadow: none;
}
.ps-site #order-standard_cart .domain-promo-box .btn-warning:hover,
.ps-site #order-standard_cart .domain-promo-box .btn-warning:focus {
    color: var(--ps-text);
    background: rgba(var(--ps-primary-rgb), 0.18);
    border-color: rgba(var(--ps-primary-rgb), 0.45);
}

@media (max-width: 767.98px) {
    /* Domain search pages: the search comes first on phones; categories stay in the
       main menu and on store pages. */
    .ps-site.ps-tpl-domainregister #order-standard_cart .sidebar-collapsed,
    .ps-site.ps-tpl-domaintransfer #order-standard_cart .sidebar-collapsed { display: none !important; }

    /* Cart summary and checkout small print */
    .ps-site #order-standard_cart .view-cart-tabs .nav-link,
    .ps-site #order-standard_cart .view-cart-tabs .nav-tabs a { font-size: 14px; min-height: 44px; display: flex; align-items: center; }

}

/* ---- src/cart/40-flow.css ---- */
/* ==========================================================================
   Cart and checkout actions (1.1): every action is a button with a clear
   role, the summary matches the other cards, payment choices are rows.
   ========================================================================== */

/* Cart items: Edit (small outline), remove (small square), Empty cart (quiet) */
.ps-site #order-standard_cart .view-cart-items .item-title .btn-link {
    margin-left: 8px;
    padding: 0 10px;
    color: var(--ps-text-2);
    border: 1px solid var(--ps-border-strong);
    font-size: 12.5px;
    vertical-align: middle;
}
.ps-site #order-standard_cart .view-cart-items .item-title .btn-link:hover { color: var(--ps-text); }
.ps-site #order-standard_cart .btn-remove-from-cart {
    min-width: var(--ps-ctl-sm);
    padding: 0 10px;
    color: var(--ps-danger-text);
    background: transparent;
    border: 1px solid rgba(var(--ps-danger-rgb), 0.35);
}
.ps-site #order-standard_cart .btn-remove-from-cart:hover,
.ps-site #order-standard_cart .btn-remove-from-cart:focus-visible { color: var(--ps-danger-text); background: rgba(var(--ps-danger-rgb), 0.12); }

/* Promo code: one row; the tab bar is hidden while it holds a single tab */
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs:not(:has(> li + li)) { display: none; }
.ps-site #order-standard_cart .view-cart-tabs .nav-tabs:not(:has(> li + li)) + .tab-content { border-radius: var(--ps-card-r); }
.ps-site #order-standard_cart .view-cart-tabs .tab-content { padding: 14px; }
.ps-site #order-standard_cart #applyPromo form { display: flex; gap: 8px; align-items: flex-start; }
.ps-site #order-standard_cart #applyPromo form .form-group { flex: 1 1 auto; min-width: 0; margin: 0; }
.ps-site #order-standard_cart #applyPromo form .btn { width: auto; flex: 0 0 auto; }

/* Order summary: same card language as the rest of the portal */
.ps-site #order-standard_cart .order-summary { border-radius: var(--ps-card-r); box-shadow: none; }
.ps-site #order-standard_cart .order-summary h2,
html[data-theme="contrast"] .ps-site #order-standard_cart .order-summary h2 {
    background: transparent;
    color: var(--ps-muted);
    font-size: 12px;
    letter-spacing: 0.08em;
    padding: 16px 16px 0;
    margin: 0;
}
.ps-site #order-standard_cart .order-summary .text-right { display: flex; flex-direction: column; gap: 10px; }
.ps-site #order-standard_cart .order-summary .text-right br { display: none; }
.ps-site #order-standard_cart #continueShopping {
    min-height: var(--ps-ctl);
    color: var(--ps-text-2);
    border: 1px solid var(--ps-border-strong);
    font-size: 14.5px;
}
.ps-site #order-standard_cart #continueShopping:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.08); }

/* Checkout: payment methods as selectable rows */
.ps-site #order-standard_cart #paymentGatewaysContainer > p { margin-bottom: 8px; font-size: 13px; }
.ps-site #order-standard_cart #paymentGatewaysContainer > .text-center { display: grid; gap: 8px; text-align: left; }
.ps-site #order-standard_cart #paymentGatewaysContainer label.radio-inline,
.ps-site #order-standard_cart #creditCardInputFields > ul label.radio-inline {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    margin: 0;
    padding: 0 16px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-neutral-rgb), 0.03);
    color: var(--ps-text);
    font-weight: 600;
    cursor: pointer;
}
.ps-site #order-standard_cart #creditCardInputFields > ul label.radio-inline { min-height: var(--ps-ctl); font-weight: 500; }
.ps-site #order-standard_cart #paymentGatewaysContainer label.radio-inline:has(input:checked),
.ps-site #order-standard_cart #creditCardInputFields > ul label.radio-inline:has(input:checked) {
    border-color: rgba(var(--ps-primary-rgb), 0.7);
    background: rgba(var(--ps-primary-rgb), 0.08);
}
.ps-site #order-standard_cart #creditCardInputFields > ul { list-style: none; margin: 0 0 14px; padding: 0; }

/* Card fields (Stripe) use the full width of the form */
.ps-site #order-standard_cart .stripe-cards-inputs {
    flex: 0 0 100%;
    max-width: 100%;
    margin-left: 0 !important;
    padding: 0;
}
.ps-site #order-standard_cart .stripe-cards-inputs > .row > .col-md-6 { flex: 0 0 100%; max-width: 100%; margin-bottom: 12px; }
.ps-site #order-standard_cart .stripe-cards-inputs > .row > .col-md-3 { flex: 0 0 50%; max-width: 50%; }
.ps-site #order-standard_cart .stripe-cards-inputs label { display: block; margin: 0 0 6px; text-align: left; font-size: 13px; color: var(--ps-text-2); }
.ps-site #order-standard_cart #inputDescriptionContainer { flex: 0 0 100%; max-width: 100%; margin-left: 0; }

/* Domain step for a product: options as selectable rows */
.ps-site #order-standard_cart .domain-selection-options .option {
    margin: 0 0 10px;
    padding: 12px 16px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-neutral-rgb), 0.03);
}
.ps-site #order-standard_cart .domain-selection-options .option:has(.checked),
.ps-site #order-standard_cart .domain-selection-options .option:has(input:checked) {
    border-color: rgba(var(--ps-primary-rgb), 0.7);
    background: rgba(var(--ps-primary-rgb), 0.06);
}
.ps-site #order-standard_cart .domain-selection-options .option > label {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 32px;
    margin: 0;
    font-weight: 600;
    color: var(--ps-text);
    cursor: pointer;
}
.ps-site #order-standard_cart .domain-selection-options .domain-input-group { margin-top: 12px; }
.ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row { margin: 0; gap: 8px; flex-wrap: nowrap; align-items: flex-start; }
.ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row + .row { margin-top: 8px; }
.ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row > .col-sm-8 { flex: 1 1 0; min-width: 0; max-width: none; margin-left: 0; padding: 0; }
.ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row > .col-sm-2 { flex: 0 0 auto; width: auto; max-width: none; padding: 0; }
.ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row > .col-sm-2 > .btn-block { width: auto; min-width: 110px; }
.ps-site #order-standard_cart .domain-selection-options .domain-checker-advanced .domains-row { margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ps-site #order-standard_cart .domain-selection-options .domain-checker-advanced textarea {
    width: 100% !important;
    height: 92px;
    padding: 12px 14px;
    border: 1px solid var(--ps-input-border);
    border-radius: var(--ps-ctl-r);
    background: var(--ps-input-bg);
    color: var(--ps-text);
    font-size: 16px;
    resize: vertical;
}
.ps-site #order-standard_cart .domain-selection-options .domain-checker-advanced textarea:focus { border-color: var(--ps-primary); box-shadow: 0 0 0 3px rgba(var(--ps-primary-rgb), 0.22); outline: none; }
.ps-site #order-standard_cart .domain-selection-options .domain-checker-advanced .domains-row > label {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: var(--ps-ctl);
    margin: 0;
    padding: 0 14px 0 12px;
    border: 1px solid var(--ps-border-strong);
    border-radius: var(--ps-ctl-r);
    background: rgba(var(--ps-neutral-rgb), 0.04);
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ps-text-2);
    cursor: pointer;
}
@media (max-width: 575.98px) {
    .ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row { flex-wrap: wrap; }
    .ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row > .col-sm-2 { flex: 1 1 100%; }
    .ps-site #order-standard_cart .domain-selection-options .domain-input-group > .row > .col-sm-2 > .btn-block { width: 100%; }
}

/* Promo boxes: secondary buttons, so "Search" stays the only filled button */
.ps-site #order-standard_cart .domain-promo-box .btn-primary {
    color: var(--ps-primary);
    background: rgba(var(--ps-primary-rgb), 0.08);
    border: 1px solid rgba(var(--ps-primary-rgb), 0.22);
    box-shadow: none;
}
.ps-site #order-standard_cart .domain-promo-box .btn-primary:hover { color: var(--ps-text); background: rgba(var(--ps-primary-rgb), 0.16); }

/* Price table header in the cart: plain labels instead of coloured bars */
.ps-site .domain-pricing .tld-pricing-header div,
.ps-site .domain-pricing .tld-pricing-header div:nth-child(odd) { border-color: var(--ps-border) !important; }

@media (max-width: 575.98px) {
    .ps-site #order-standard_cart .stripe-cards-inputs > .row > .col-md-3 { flex: 0 0 100%; max-width: 100%; margin-bottom: 12px; }
}

/* Empty product group (products.tpl) */
.ps-site .ps-store-empty {
    padding: 24px;
    margin-bottom: 20px;
    background: var(--ps-surface);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-card-r);
}

/* iCheck radios and checkboxes keep their size inside flex rows with long labels */
.ps-site label > [class*="iradio_"],
.ps-site label > [class*="icheckbox_"] { flex-shrink: 0; }