/*
 * SpeechTherapy.com WHMCS child theme
 * Parent: Nexus
 *
 * Brand direction:
 * - airy white space
 * - aqua / turquoise gradients
 * - deep indigo-blue headings
 * - large rounded surfaces
 * - friendly, professional, non-hosting-company presentation
 */

:root {
    --st-aqua-50: #eefcfd;
    --st-aqua-100: #d8f8fb;
    --st-aqua-200: #b3f0f5;
    --st-aqua-300: #78e4ed;
    --st-aqua-400: #32d4e2;
    --st-aqua-500: #10bfd2;
    --st-aqua-600: #079cb2;
    --st-blue-500: #4055a8;
    --st-blue-600: #334692;
    --st-blue-700: #293974;
    --st-ink: #24324a;
    --st-muted: #667085;
    --st-line: #dbe5ea;
    --st-page: #fbfdfe;
    --st-white: #ffffff;

    --primary-50: var(--st-aqua-50);
    --primary-100: var(--st-aqua-100);
    --primary-200: var(--st-aqua-200);
    --primary-300: var(--st-aqua-300);
    --primary-400: var(--st-aqua-400);
    --primary-500: var(--st-aqua-500);
    --primary-600: var(--st-aqua-600);
    --primary-700: #087f92;
    --primary: var(--st-aqua-600);
    --primary-lifted: var(--st-aqua-500);
    --primary-accented: #077b8c;
    --text: var(--st-ink);
    --text-accented: var(--st-blue-600);
    --border: var(--st-line);
    --bg: var(--st-white);
    --bg-muted: var(--st-page);
    --rounding-sm: .45rem;
    --rounding-md: .85rem;
    --rounding-lg: 1.35rem;
}

html {
    scroll-behavior: smooth;
}

body.st-body,
body {
    background: var(--st-page);
    color: var(--st-ink);
    font-family: "Segoe UI", "Helvetica Neue", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;
}

a {
    color: var(--st-blue-600);
}

a:hover {
    color: var(--st-aqua-600);
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6,
.header-lined h1 {
    color: var(--st-blue-600);
    font-weight: 500;
    letter-spacing: -.025em;
}

h1 {
    line-height: 1.08;
}

/* ---------- Header ---------- */

.st-header {
    background: #fff;
    border: 0;
    box-shadow: 0 6px 26px rgba(37, 60, 91, .06);
}

.st-brandbar {
    position: relative;
    background:
        radial-gradient(circle at 75% 0%, rgba(50, 212, 226, .24), transparent 34%),
        linear-gradient(100deg, #ffffff 0%, #f1fcfd 48%, #c9f6f8 100%);
}

.st-brandbar::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 1px;
    background: rgba(51, 70, 146, .08);
}

.st-brandbar .navbar {
    min-height: 82px;
}

.st-brand .logo-img {
    max-height: 52px;
    width: auto;
}

.st-header-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.st-help-link {
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    border: 1px solid rgba(51, 70, 146, .16);
    border-radius: 999px;
    background: rgba(255,255,255,.72);
    color: var(--st-blue-600);
    font-weight: 600;
    transition: .2s ease;
}

.st-help-link:hover {
    background: #fff;
    transform: translateY(-1px);
    box-shadow: 0 8px 20px rgba(34, 60, 92, .08);
}

.st-header .cart-btn,
.st-header .toolbar .nav-link {
    color: var(--st-blue-600) !important;
    border-radius: 999px;
}

.st-header .cart-btn:hover,
.st-header .toolbar .nav-link:hover {
    background: rgba(16, 191, 210, .10);
}

.st-header .badge-dark {
    background: var(--st-blue-600);
}

.st-mainnav {
    background: rgba(255,255,255,.96);
    border: 0;
}

.st-mainnav .navbar-nav > li > a,
.st-mainnav .navbar-nav > .nav-item > .nav-link {
    color: #526075 !important;
    font-weight: 500;
    padding: 15px 14px !important;
    position: relative;
}

.st-mainnav .navbar-nav > li > a:hover,
.st-mainnav .navbar-nav > .nav-item > .nav-link:hover {
    color: var(--st-blue-600) !important;
}

.st-mainnav .navbar-nav > li.active > a::after,
.st-mainnav .navbar-nav > .nav-item.active > .nav-link::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 6px;
    height: 2px;
    border-radius: 2px;
    background: var(--st-aqua-500);
}

.st-account-topbar {
    background: var(--st-blue-700);
}

.st-account-topbar,
.st-account-topbar a,
.st-account-topbar .btn,
.st-account-topbar .input-group-text {
    color: #fff;
}

.st-breadcrumb {
    background: #fff;
    border: 0;
    box-shadow: inset 0 -1px 0 rgba(36,50,74,.06);
}

.st-breadcrumb .breadcrumb {
    padding-top: 11px;
    padding-bottom: 11px;
    font-size: 13px;
    color: var(--st-muted);
}

/* ---------- Main content ---------- */

#main-body {
    min-height: 52vh;
    padding-top: 34px;
    padding-bottom: 70px;
}

.card,
.panel,
.modal-content {
    border: 1px solid var(--st-line);
    border-radius: 18px;
    box-shadow: 0 12px 35px rgba(42, 65, 93, .06);
}

.btn {
    border-radius: 999px;
    font-weight: 600;
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.btn:hover {
    transform: translateY(-1px);
}

.btn-primary,
.btn-success,
#order-standard_cart .btn-success,
#order-standard_cart .btn-primary {
    color: #fff !important;
    border-color: transparent !important;
    background: linear-gradient(135deg, var(--st-aqua-500), #16b7d3) !important;
    box-shadow: 0 8px 20px rgba(16, 191, 210, .20);
}

.btn-primary:hover,
.btn-success:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart .btn-primary:hover {
    background: linear-gradient(135deg, #0fb2c4, #159fc0) !important;
    box-shadow: 0 10px 24px rgba(16, 191, 210, .28);
}

.btn-outline-primary {
    color: var(--st-blue-600);
    border-color: rgba(51,70,146,.28);
    background: #fff;
}

.btn-outline-primary:hover {
    color: var(--st-blue-600);
    border-color: var(--st-aqua-400);
    background: var(--st-aqua-50);
}

.form-control,
.custom-select,
.input-group-text,
#order-standard_cart .form-control {
    min-height: 46px;
    border-radius: 10px;
    border-color: #d7e2e8;
}

.form-control:focus,
.custom-select:focus,
#order-standard_cart .form-control:focus {
    border-color: var(--st-aqua-400);
    box-shadow: 0 0 0 .2rem rgba(16,191,210,.12);
}

/* ---------- Branded Portal Home ---------- */

/*
 * WHMCS/Nexus places normal page content inside Bootstrap's fixed-width .container.
 * The marketing funnel deliberately breaks out of that container to the viewport edge,
 * while the inner content remains centered and responsive.
 */
.st-portal-hero {
    position: relative;
    left: 50%;
    width: 100vw;
    max-width: none;
    margin: -34px 0 44px -50vw;
    overflow: hidden;
    background:
        radial-gradient(circle at 88% 20%, rgba(255,255,255,.46), transparent 22%),
        radial-gradient(circle at 10% 88%, rgba(255,255,255,.28), transparent 24%),
        linear-gradient(118deg, #e5fafc 0%, #8be8ee 44%, #10bfd2 100%);
}

.st-portal-hero::before,
.st-portal-hero::after {
    content: "";
    position: absolute;
    pointer-events: none;
    background: rgba(255,255,255,.14);
}

.st-portal-hero::before {
    width: 430px;
    height: 300px;
    right: -120px;
    top: -100px;
    border-radius: 46% 54% 62% 38% / 38% 48% 52% 62%;
    transform: rotate(-12deg);
}

.st-portal-hero::after {
    width: 360px;
    height: 220px;
    left: -120px;
    bottom: -110px;
    border-radius: 58% 42% 37% 63% / 55% 39% 61% 45%;
    transform: rotate(9deg);
}

.st-hero-inner {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, .92fr);
    gap: clamp(34px, 5vw, 76px);
    align-items: center;
    width: min(1320px, calc(100% - 64px));
    min-height: 490px;
    margin: 0 auto;
    padding: 46px 0 50px;
}

.st-hero-copy-block {
    min-width: 0;
}

.st-eyebrow {
    display: inline-block;
    margin-bottom: 13px;
    color: var(--st-blue-600);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.st-portal-hero h1 {
    max-width: 760px;
    margin: 0 0 14px;
    color: var(--st-blue-600);
    font-size: clamp(37px, 4.25vw, 58px);
    font-weight: 600;
    line-height: 1.03;
    letter-spacing: -.045em;
}

.st-hero-copy {
    max-width: 710px;
    margin-bottom: 17px;
    color: #435a69;
    font-size: clamp(15px, 1.25vw, 18px);
    line-height: 1.65;
}

.st-pricing-line {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 5px 7px;
    margin: 0 0 15px;
    color: var(--st-blue-600);
}

.st-price-main {
    font-size: 39px;
    font-weight: 750;
    letter-spacing: -.04em;
}

.st-price-cycle {
    font-size: 17px;
    font-weight: 650;
}

.st-price-note {
    flex-basis: 100%;
    color: #506779;
    font-size: 13px;
}

.st-hero-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px 22px;
    max-width: 720px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

.st-hero-features li {
    position: relative;
    padding-left: 25px;
    color: #405666;
    font-size: 14px;
}

.st-hero-features li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: -1px;
    display: grid;
    width: 18px;
    height: 18px;
    place-items: center;
    border-radius: 50%;
    background: rgba(255,255,255,.72);
    color: var(--st-aqua-600);
    font-size: 12px;
    font-weight: 900;
}

.st-hero-actions {
    display: flex;
    gap: 11px;
    flex-wrap: wrap;
}

.st-primary-cta,
.st-secondary-cta {
    min-height: 50px;
    padding: 13px 24px;
}

.st-secondary-cta {
    color: var(--st-blue-600) !important;
    border-color: rgba(51,70,146,.11) !important;
    background: rgba(255,255,255,.86) !important;
    box-shadow: 0 9px 23px rgba(50,80,105,.09);
}

.st-secondary-cta:hover {
    background: #fff !important;
}

.st-hero-note {
    max-width: 680px;
    margin: 12px 0 0;
    color: #506779;
    font-size: 12.5px;
}

.st-hero-visual {
    min-width: 0;
}

.st-email-identity-card {
    position: relative;
    width: min(100%, 545px);
    margin-left: auto;
    padding: clamp(45px, 5vw, 68px) clamp(24px, 3.5vw, 40px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.85);
    border-radius: 82px 46px 82px 46px;
    background: rgba(255,255,255,.91);
    box-shadow: 0 24px 58px rgba(38,77,104,.16);
    text-align: center;
    backdrop-filter: blur(7px);
}

.st-email-identity-card::after {
    content: "";
    position: absolute;
    width: 150px;
    height: 90px;
    right: -58px;
    bottom: -34px;
    border-radius: 60%;
    background: rgba(16,191,210,.08);
    transform: rotate(-18deg);
}

.st-email-mark {
    position: relative;
    z-index: 1;
    color: var(--st-blue-600);
    font-size: clamp(25px, 3vw, 43px);
    font-weight: 750;
    line-height: 1.05;
    letter-spacing: -.045em;
    white-space: nowrap;
}

.st-email-mark span {
    color: var(--st-aqua-600);
}

.st-email-subtitle {
    position: relative;
    z-index: 1;
    margin-top: 8px;
    color: #667085;
    font-size: clamp(13px, 1.25vw, 17px);
    letter-spacing: .08em;
}

.st-email-roles {
    position: relative;
    z-index: 1;
    margin-top: 15px;
    color: #8693a2;
    font-size: clamp(7px, .7vw, 9px);
    font-weight: 800;
    letter-spacing: .15em;
}

.st-portal-quicklinks {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    max-width: 1120px;
    margin: 0 auto 10px;
    padding: 22px 28px;
    border: 1px solid var(--st-line);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 10px 28px rgba(42,65,93,.045);
}

.st-quicklink-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.st-quicklink-copy strong {
    color: var(--st-blue-600);
    font-size: 16px;
}

.st-quicklink-copy span {
    color: var(--st-muted);
    font-size: 13px;
}

.st-quicklink-actions {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
}

.st-text-link {
    color: var(--st-blue-600);
    font-size: 13px;
    font-weight: 750;
}

.st-text-link i {
    margin-left: 4px;
    font-size: 11px;
}

/* ---------- Login ---------- */

.st-login-shell {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(430px, 1.1fr);
    gap: 50px;
    align-items: center;
    max-width: 1040px;
    margin: 28px auto 18px;
}

.st-login-intro {
    padding: 28px;
}

.st-login-intro h1 {
    font-size: 44px;
}

.st-login-intro p {
    color: var(--st-muted);
    font-size: 17px;
}

.st-inline-link {
    display: inline-block;
    margin-top: 10px;
    font-weight: 700;
}

.st-login-card {
    overflow: hidden;
    border-radius: 26px;
}

.st-login-card .card-footer {
    border-top-color: var(--st-line);
    background: var(--st-aqua-50);
}

.st-remember {
    margin: 0 20px 10px 20px;
}

/* ---------- Standard Cart / Checkout ---------- */

#order-standard_cart {
    color: var(--st-ink);
}

#order-standard_cart > .row {
    display: block;
}

#order-standard_cart .cart-sidebar {
    display: none !important;
}

#order-standard_cart .cart-body {
    width: 100% !important;
    max-width: 1100px;
    margin: 0 auto;
    float: none !important;
}

#order-standard_cart .header-lined {
    padding: 10px 0 22px;
    text-align: center;
}

#order-standard_cart .header-lined h1 {
    color: var(--st-blue-600);
    font-size: clamp(31px, 4vw, 44px) !important;
    font-weight: 500;
}

#order-standard_cart .header-lined p {
    max-width: 760px;
    margin: 6px auto 0;
    color: var(--st-muted);
}

#order-standard_cart .products > .row {
    justify-content: center;
}

#order-standard_cart .products .col-md-6 {
    flex: 0 0 100%;
    max-width: 760px;
}

#order-standard_cart .product {
    overflow: hidden;
    margin: 12px auto 28px;
    border: 1px solid var(--st-line);
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 18px 48px rgba(42,65,93,.08);
}

#order-standard_cart .product header {
    padding: 25px 30px;
    border: 0;
    background: linear-gradient(120deg, var(--st-aqua-50), #fff);
    color: var(--st-blue-600);
    font-size: 25px;
    font-weight: 600;
}

#order-standard_cart .product-desc {
    padding: 28px 30px 12px;
    font-size: 15px;
}

#order-standard_cart .product-desc ul {
    margin-top: 18px;
    padding-left: 0;
    list-style: none;
}

#order-standard_cart .product-desc li {
    position: relative;
    margin: 9px 0;
    padding-left: 25px;
}

#order-standard_cart .product-desc li::before {
    content: "✓";
    position: absolute;
    left: 0;
    top: 0;
    color: var(--st-aqua-600);
    font-weight: 800;
}

#order-standard_cart .product footer {
    padding: 22px 30px 30px;
    border: 0;
    background: #fff;
}

#order-standard_cart .st-plan-price {
    display: flex;
    align-items: baseline;
    gap: 5px;
    color: var(--st-blue-600);
}

#order-standard_cart .st-plan-price .st-price-big {
    font-size: 42px;
    font-weight: 700;
    letter-spacing: -.04em;
}

#order-standard_cart .st-plan-price .st-price-cycle {
    font-size: 17px;
    font-weight: 600;
}

#order-standard_cart .st-price-equivalent {
    margin-top: 2px;
    color: var(--st-muted);
    font-size: 13px;
}

#order-standard_cart .st-price-secondary {
    margin: 9px 0 16px;
    color: #768396;
    font-size: 12px;
}

#order-standard_cart .btn-order-now {
    min-width: 180px;
    padding: 12px 22px;
    font-size: 16px;
}

#order-standard_cart .secondary-cart-body {
    padding-right: 24px;
}

#order-standard_cart .product-info,
#order-standard_cart .field-container,
#order-standard_cart .sub-heading + .field-container {
    border-radius: 18px;
}

#order-standard_cart .sub-heading {
    margin-top: 26px;
    border: 0;
    text-align: left;
}

#order-standard_cart .sub-heading span,
#order-standard_cart .primary-bg-color {
    background: transparent !important;
    color: var(--st-blue-600) !important;
    font-size: 19px;
    font-weight: 600;
}

#order-standard_cart .secondary-cart-sidebar .order-summary,
#order-standard_cart #orderSummary .order-summary,
#order-standard_cart #orderSummary {
    border: 1px solid var(--st-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 14px 38px rgba(42,65,93,.07);
}

#order-standard_cart .order-summary h2 {
    border-radius: 22px 22px 0 0;
    background: linear-gradient(120deg, var(--st-aqua-50), #fff);
    color: var(--st-blue-600);
}

#order-standard_cart .total-due-today .amt {
    color: var(--st-blue-600);
}

#order-standard_cart #checkout.btn-checkout {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    align-items: center;
    justify-content: center;
    gap: 9px;
    min-width: 220px;
    margin-top: 14px;
    padding: 13px 24px;
    color: #fff !important;
    background: linear-gradient(135deg, var(--st-aqua-500), #16b7d3) !important;
    border: 0 !important;
    border-radius: 999px !important;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(16,191,210,.24);
}

#order-standard_cart #continueShopping {
    color: var(--st-muted);
    font-size: 13px;
}

#order-standard_cart .already-registered .btn-info {
    background: var(--st-blue-600);
    border-color: var(--st-blue-600);
    color: #fff;
}

#order-standard_cart .checkout-security-msg {
    margin-top: 26px;
    border-radius: 14px;
}

#order-standard_cart .alert-warning.info-text-sm {
    border: 1px solid #d9edf0;
    background: var(--st-aqua-50);
    color: #536879;
}

/* Make order/checkout content feel less like a hosting portal */
#order-standard_cart .view-cart-items-header {
    border-radius: 14px 14px 0 0;
    background: var(--st-aqua-50);
    color: var(--st-blue-600);
}

#order-standard_cart .view-cart-items {
    border-color: var(--st-line);
    border-radius: 0 0 14px 14px;
}

#order-standard_cart .view-cart-items .item-title {
    color: var(--st-blue-600);
    font-weight: 600;
}

/* ---------- Sidebar / account pages ---------- */

.sidebar .panel,
.sidebar .card {
    overflow: hidden;
    border-radius: 16px;
}

.sidebar .panel-heading,
.sidebar .card-header {
    border-bottom: 1px solid var(--st-line);
    background: var(--st-aqua-50);
    color: var(--st-blue-600);
}

/* ---------- Footer ---------- */

.st-footer {
    margin-top: 0;
    padding: 54px 0 22px;
    background:
        radial-gradient(circle at 85% -20%, rgba(50,212,226,.20), transparent 36%),
        linear-gradient(135deg, #253774, #1e2e61 72%);
    color: rgba(255,255,255,.78);
}

.st-footer a {
    color: rgba(255,255,255,.82);
}

.st-footer a:hover {
    color: #fff;
}

.st-footer-logo img {
    max-width: 210px;
    max-height: 62px;
    filter: brightness(0) invert(1);
    opacity: .96;
}

.st-footer-brand p {
    max-width: 440px;
    margin-top: 18px;
    color: rgba(255,255,255,.70);
}

.st-footer-column h6,
.st-footer-connect h6 {
    margin-bottom: 15px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.st-footer-column a {
    display: block;
    margin: 8px 0;
    font-size: 14px;
}

.st-social-list {
    margin: 0;
}

.st-footer-bottom {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: 38px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,.14);
    color: rgba(255,255,255,.58);
    font-size: 12px;
}

/* ---------- Responsive ---------- */

@media (max-width: 1199.98px) {
    .st-hero-inner {
        grid-template-columns: minmax(0, 1fr) minmax(330px, .78fr);
        width: min(1180px, calc(100% - 48px));
        gap: 34px;
        min-height: 525px;
        padding: 52px 0 60px;
    }

    .st-email-mark {
        font-size: clamp(24px, 2.7vw, 36px);
    }
}

@media (max-width: 991.98px) {
    .st-hero-inner {
        grid-template-columns: 1fr;
        width: min(760px, calc(100% - 42px));
        min-height: auto;
        padding: 48px 0 54px;
    }

    .st-hero-copy-block {
        text-align: center;
    }

    .st-portal-hero h1,
    .st-hero-copy,
    .st-hero-note,
    .st-hero-features {
        margin-left: auto;
        margin-right: auto;
    }

    .st-pricing-line,
    .st-hero-actions {
        justify-content: center;
    }

    .st-hero-features {
        max-width: 620px;
        text-align: left;
    }

    .st-email-identity-card {
        width: min(100%, 610px);
        margin: 0 auto;
        padding: 56px 28px;
    }

    .st-email-mark {
        font-size: clamp(28px, 5vw, 42px);
    }

    .st-impact-strip,
    .st-support-strip,
    .st-portal-quicklinks {
        align-items: flex-start;
        flex-direction: column;
    }

    .st-login-shell {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .st-login-intro {
        padding: 12px 4px;
    }

    .st-login-intro h1 {
        font-size: 36px;
    }

    #order-standard_cart .secondary-cart-body {
        padding-right: 0;
    }
}

@media (max-width: 767.98px) {
    .st-brandbar .navbar {
        min-height: 68px;
    }

    .st-brand .logo-img {
        max-height: 43px;
        max-width: 205px;
    }

    #main-body {
        padding-top: 20px;
    }

    .st-portal-hero {
        margin-top: -20px;
        margin-bottom: 28px;
    }

    .st-hero-inner {
        width: min(100% - 30px, 620px);
        padding: 36px 0 42px;
    }

    .st-portal-hero h1 {
        font-size: clamp(35px, 10.5vw, 48px);
    }

    .st-hero-copy {
        font-size: 15px;
    }

    .st-hero-features {
        grid-template-columns: 1fr;
        width: min(100%, 440px);
    }

    .st-hero-actions {
        flex-direction: column;
        width: min(100%, 360px);
        margin-left: auto;
        margin-right: auto;
    }

    .st-hero-actions .btn {
        width: 100%;
    }

    .st-email-identity-card {
        padding: 46px 18px;
        border-radius: 54px 30px 54px 30px;
    }

    .st-email-mark {
        font-size: clamp(23px, 7vw, 35px);
    }

    .st-email-subtitle {
        font-size: 13px;
    }

    .st-email-roles {
        font-size: 7px;
        letter-spacing: .09em;
    }

    .st-portal-quicklinks {
        margin-left: 0;
        margin-right: 0;
        padding: 20px;
    }

    .st-quicklink-actions {
        gap: 12px 18px;
    }

    .st-footer {
        padding-top: 42px;
    }

    .st-footer-column,
    .st-footer-connect {
        margin-top: 28px;
    }

    .st-footer-bottom {
        flex-direction: column;
        gap: 6px;
    }

    #order-standard_cart .product header,
    #order-standard_cart .product-desc,
    #order-standard_cart .product footer {
        padding-left: 22px;
        padding-right: 22px;
    }

    #order-standard_cart .st-plan-price .st-price-big {
        font-size: 36px;
    }
}

@media (max-width: 420px) {
    .st-email-mark {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    .st-price-main {
        font-size: 34px;
    }
}



@media (min-width: 992px) and (max-height: 820px) {
    .st-brandbar .navbar {
        min-height: 70px;
    }

    .st-brand .logo-img {
        max-height: 46px;
    }

    .st-mainnav .navbar-nav > li > a,
    .st-mainnav .navbar-nav > .nav-item > .nav-link {
        padding-top: 11px !important;
        padding-bottom: 11px !important;
    }

    .st-portal-hero {
        margin-top: -34px;
        margin-bottom: 30px;
    }

    .st-hero-inner {
        min-height: 455px;
        padding-top: 34px;
        padding-bottom: 38px;
    }

    .st-portal-hero h1 {
        font-size: clamp(36px, 4vw, 54px);
    }

    .st-hero-copy {
        margin-bottom: 13px;
        line-height: 1.5;
    }

    .st-price-main {
        font-size: 35px;
    }

    .st-hero-actions {
        margin-top: 2px;
    }

    .st-hero-features {
        margin-top: 14px;
        gap: 6px 18px;
    }

    .st-hero-note {
        margin-top: 8px;
    }

    .st-email-identity-card {
        padding-top: 45px;
        padding-bottom: 45px;
    }
}


/* ---------- Compact one-row account header ---------- */

.st-single-header {
    min-height: 78px;
}

.st-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: nowrap;
}

.st-account-menu,
.st-cart-menu {
    flex-direction: row;
    align-items: center;
    margin: 0;
}

.st-account-menu > li > a,
.st-account-menu > .nav-item > .nav-link {
    display: inline-flex;
    align-items: center;
    min-height: 42px;
    padding: 10px 14px !important;
    border-radius: 999px;
    color: var(--st-blue-600) !important;
    font-weight: 600;
    white-space: nowrap;
}

.st-account-menu > li > a:hover,
.st-account-menu > .nav-item > .nav-link:hover {
    background: rgba(16,191,210,.10);
}

.st-account-menu .dropdown-menu {
    right: 0;
    left: auto;
    margin-top: 8px;
    border: 1px solid var(--st-line);
    border-radius: 14px;
    box-shadow: 0 14px 34px rgba(42,65,93,.12);
}

.st-cart-menu .cart-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    min-height: 42px;
    padding: 10px !important;
    border: 1px solid rgba(51,70,146,.12);
    background: rgba(255,255,255,.72);
}

.st-cart-menu .cart-btn:hover {
    background: #fff;
    box-shadow: 0 8px 20px rgba(34,60,92,.08);
}

/* No second navigation row in this account/purchase environment. */
.st-mainnav {
    display: none !important;
}

/* Because the second nav row is gone, let the homepage hero sit closer to the header. */
.st-portal-hero {
    margin-top: -34px;
}

@media (max-width: 767.98px) {
    .st-single-header {
        min-height: 66px;
    }

    .st-header-actions {
        gap: 6px;
    }

    .st-help-link {
        padding: 8px 11px;
        font-size: 13px;
    }

    .st-account-menu > li > a,
    .st-account-menu > .nav-item > .nav-link {
        min-height: 38px;
        padding: 8px 10px !important;
        font-size: 13px;
    }

    .st-cart-menu .cart-btn {
        min-width: 38px;
        min-height: 38px;
        padding: 8px !important;
    }
}

@media (max-width: 575.98px) {
    .st-help-link span {
        display: none;
    }

    .st-help-link {
        width: 38px;
        height: 38px;
        justify-content: center;
        padding: 0;
        border-radius: 50%;
    }

    .st-account-menu > li > a,
    .st-account-menu > .nav-item > .nav-link {
        max-width: 112px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .st-brand .logo-img {
        max-width: 165px;
        max-height: 40px;
    }
}


/* ---------- v5 header height + true overlay account dropdown ---------- */

.st-header,
.st-brandbar,
.st-single-header,
.st-header-actions,
.st-account-menu {
    overflow: visible !important;
}

.st-header {
    position: relative;
    z-index: 1100;
}

.st-brandbar {
    position: relative;
    z-index: 1100;
}

.st-single-header {
    min-height: 92px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
}

.st-brand {
    display: flex !important;
    align-items: center !important;
    flex-shrink: 0;
    margin: 0 !important;
    padding: 6px 0 !important;
    line-height: 1 !important;
    overflow: visible !important;
}

.st-brand .logo-img {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 225px !important;
    max-height: 58px !important;
    object-fit: contain;
    object-position: left center;
}

.st-header-actions {
    position: relative;
}

.st-account-menu {
    position: relative !important;
}

.st-account-menu > .nav-item,
.st-account-menu > li,
.st-account-menu > .dropdown,
.st-account-menu li.dropdown {
    position: relative !important;
}

/*
 * Bootstrap normally makes navbar dropdown menus "position: static"
 * until they live inside a navbar-expand-* wrapper. Our compact header
 * intentionally does not use that second navbar row, so we explicitly
 * restore a real overlay dropdown here.
 */
.st-account-menu .dropdown-menu {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    right: 0 !important;
    left: auto !important;
    float: none !important;
    width: auto !important;
    min-width: 190px !important;
    margin: 0 !important;
    padding: 8px !important;
    z-index: 2200 !important;
    border: 1px solid var(--st-line) !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 18px 44px rgba(36, 50, 74, .18) !important;
    transform: none !important;
}

.st-account-menu .dropdown-menu.show {
    display: block !important;
}

.st-account-menu .dropdown-item {
    padding: 9px 12px !important;
    border-radius: 9px;
    color: var(--st-ink) !important;
    white-space: nowrap;
}

.st-account-menu .dropdown-item:hover,
.st-account-menu .dropdown-item:focus {
    background: var(--st-aqua-50) !important;
    color: var(--st-blue-600) !important;
}

/* Keep the body/hero beneath the open account dropdown. */
#main-body,
.st-portal-hero {
    position: relative;
    z-index: 1;
}

@media (min-width: 992px) and (max-height: 820px) {
    .st-single-header {
        min-height: 82px !important;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
    }

    .st-brand .logo-img {
        max-height: 54px !important;
    }
}

@media (max-width: 767.98px) {
    .st-single-header {
        min-height: 76px !important;
        padding-top: 9px !important;
        padding-bottom: 9px !important;
    }

    .st-brand .logo-img {
        max-width: 190px !important;
        max-height: 50px !important;
    }

    .st-account-menu .dropdown-menu {
        right: 0 !important;
        min-width: 175px !important;
    }
}

@media (max-width: 575.98px) {
    .st-brand .logo-img {
        max-width: 155px !important;
        max-height: 44px !important;
    }
}


/* ---------- v7 compact email configuration step ---------- */

#order-standard_cart .header-lined {
    margin-bottom: 10px;
}

#order-standard_cart .header-lined h1 {
    margin-bottom: 0;
    color: var(--st-blue-600);
    font-weight: 650;
    letter-spacing: -.025em;
}

#order-standard_cart .st-order-section {
    margin: 0 0 18px;
    padding: 0 0 18px;
    border-bottom: 1px solid rgba(51, 70, 146, .11);
}

#order-standard_cart .st-email-step {
    padding-top: 2px;
}

#order-standard_cart .st-billing-step {
    margin-top: 2px;
}

#order-standard_cart .st-billing-step h2 {
    margin: 0 0 3px;
    color: var(--st-blue-600);
    font-size: 21px;
    font-weight: 700;
    letter-spacing: -.02em;
}

#order-standard_cart .st-section-help {
    margin: 0 0 9px;
    color: var(--st-muted);
    font-size: 13px;
}

#order-standard_cart .st-email-field-slot .form-group,
#order-standard_cart .st-billing-slot .form-group {
    margin-bottom: 0;
}

#order-standard_cart .st-email-field-slot label,
#order-standard_cart .st-billing-slot label {
    display: block;
    margin-bottom: 6px;
    color: var(--st-ink);
    font-size: 13px;
    font-weight: 700;
}

#order-standard_cart .st-email-address-entry {
    display: flex;
    align-items: stretch;
    width: 100%;
    max-width: 610px;
    overflow: hidden;
    border: 2px solid rgba(16,191,210,.36);
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(33,100,118,.06);
}

#order-standard_cart .st-email-address-entry input.form-control,
#order-standard_cart .st-email-address-entry input {
    flex: 1 1 auto;
    min-width: 0;
    height: 50px !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    font-size: 17px;
    font-weight: 600;
}

#order-standard_cart .st-email-address-entry input:focus {
    box-shadow: inset 0 0 0 2px rgba(16,191,210,.18) !important;
}

#order-standard_cart .st-email-domain {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    padding: 0 15px;
    border-left: 1px solid rgba(16,191,210,.20);
    background: var(--st-aqua-50);
    color: var(--st-blue-600);
    font-size: 15px;
    font-weight: 750;
    white-space: nowrap;
}

#order-standard_cart .st-billing-slot #inputBillingcycle {
    width: min(100%, 500px);
    height: 46px;
    border: 1px solid rgba(51,70,146,.18);
    border-radius: 11px;
    background-color: #fff;
    color: var(--st-ink);
    font-weight: 600;
}

#order-standard_cart #productConfigurableOptions .form-group[style*="display: none"] {
    margin: 0 !important;
    padding: 0 !important;
}

#order-standard_cart #orderSummary .order-summary {
    border-color: rgba(51,70,146,.11);
    border-radius: 18px 18px 0 0;
    box-shadow: 0 12px 30px rgba(42,65,93,.05);
}

#order-standard_cart #btnCompleteProductConfig {
    width: 100%;
    min-height: 48px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--st-aqua-600), #20c9d8);
    font-weight: 750;
    box-shadow: 0 10px 24px rgba(16,191,210,.20);
}

@media (max-width: 767.98px) {
    #order-standard_cart .st-order-section {
        margin-bottom: 15px;
        padding-bottom: 15px;
    }

    #order-standard_cart .st-email-address-entry {
        display: block;
        border-radius: 12px;
    }

    #order-standard_cart .st-email-domain {
        justify-content: flex-start;
        min-height: 38px;
        padding: 0 13px;
        border-top: 1px solid rgba(16,191,210,.20);
        border-left: 0;
        font-size: 13px;
    }
}


/* ---------- v8 WHMCS modal stacking fix ---------- */

/*
 * The compact header intentionally sits above normal page content at z-index 1100.
 * Earlier we also gave #main-body z-index: 1. That created a stacking context.
 * WHMCS renders its cart confirmation modal inside the main body, while Bootstrap
 * appends the modal backdrop to <body>. The result was the backdrop sitting above
 * the modal itself, making the visible modal impossible to click.
 *
 * Remove that stacking context and explicitly place all Bootstrap/WHMCS modals
 * above the header and their backdrops.
 */
#main-body {
    z-index: auto !important;
}

.modal-backdrop {
    z-index: 2990 !important;
}

.modal {
    z-index: 3000 !important;
}

/* Make sure the dialog and controls remain interactive above the backdrop. */
.modal.show .modal-dialog,
.modal.in .modal-dialog {
    position: relative;
    z-index: 3001 !important;
    pointer-events: auto !important;
}

.modal-content {
    position: relative;
    z-index: 3002 !important;
}

/* During a modal, prevent any header dropdown from appearing above it. */
body.modal-open .st-header,
body.modal-open .st-brandbar,
body.modal-open .st-account-menu .dropdown-menu {
    z-index: 1000 !important;
}


/* ---------- v9 configure page: stable two-column layout ---------- */

#order-standard_cart #frmConfigureProduct > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(285px, 330px);
    column-gap: 34px;
    align-items: start;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#order-standard_cart #frmConfigureProduct > .row > .secondary-cart-body,
#order-standard_cart #frmConfigureProduct > .row > .secondary-cart-sidebar {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#order-standard_cart #frmConfigureProduct > .row > .secondary-cart-body {
    grid-column: 1;
}

#order-standard_cart #frmConfigureProduct > .row > .secondary-cart-sidebar {
    grid-column: 2;
    margin: 0 !important;
}

#order-standard_cart #scrollingPanelContainer {
    width: 100% !important;
}

#order-standard_cart #orderSummary {
    width: 100% !important;
    margin: 0 !important;
}

#order-standard_cart .st-email-step {
    margin-top: 0;
}

/* Keep the key decisions tight enough to stay above the fold on laptop screens. */
#order-standard_cart .st-order-section {
    margin-bottom: 14px;
    padding-bottom: 14px;
}

#order-standard_cart .st-section-help {
    margin-bottom: 7px;
}

#order-standard_cart .st-billing-step h2 {
    margin-top: 0;
}

/* The generic help bar is useful but should not create a large visual interruption. */
#order-standard_cart .secondary-cart-body > .alert-warning.info-text-sm {
    margin-top: 12px;
    margin-bottom: 0;
}

@media (max-width: 991.98px) {
    #order-standard_cart #frmConfigureProduct > .row {
        grid-template-columns: 1fr;
        row-gap: 22px;
    }

    #order-standard_cart #frmConfigureProduct > .row > .secondary-cart-body,
    #order-standard_cart #frmConfigureProduct > .row > .secondary-cart-sidebar {
        grid-column: 1;
    }
}


/* ---------- v10 review order screen ---------- */

#order-standard_cart.st-review-page .header-lined {
    margin-bottom: 4px;
}

#order-standard_cart.st-review-page .header-lined h1 {
    color: var(--st-blue-600);
    font-weight: 650;
    letter-spacing: -.025em;
}

#order-standard_cart.st-review-page .st-review-intro {
    margin: 0 0 20px;
    color: var(--st-muted);
    font-size: 14px;
}

/* Keep the order and its summary on one row on laptop/desktop widths. */
#order-standard_cart.st-review-page .cart-body > .row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(285px, 320px);
    column-gap: 34px;
    align-items: start;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

#order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-body,
#order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-sidebar {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
    float: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-body {
    grid-column: 1;
}

#order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-sidebar {
    grid-column: 2;
    margin: 0 !important;
}

#order-standard_cart.st-review-page .view-cart-items {
    margin-top: 0;
    border: 1px solid rgba(51, 70, 146, .11);
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 26px rgba(42,65,93,.045);
}

#order-standard_cart.st-review-page .view-cart-items .item {
    margin: 0 !important;
    padding: 20px 18px !important;
    border: 0 !important;
    background: #fff !important;
}

#order-standard_cart.st-review-page .view-cart-items .item + .item {
    border-top: 1px solid rgba(51,70,146,.10) !important;
}

#order-standard_cart.st-review-page .view-cart-items .item-title {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--st-blue-600);
    font-size: 19px;
    font-weight: 750;
}

#order-standard_cart.st-review-page .view-cart-items .item-title .btn-link {
    padding: 2px 4px;
    color: var(--st-muted);
    font-size: 12px;
    font-weight: 600;
}

#order-standard_cart.st-review-page .st-review-email {
    margin-top: 7px;
    color: var(--st-ink);
    font-size: 16px;
    font-weight: 700;
}

#order-standard_cart.st-review-page .item-price {
    color: var(--st-blue-600);
    font-weight: 750;
}

#order-standard_cart.st-review-page .item-price .cycle {
    display: block;
    margin-top: 3px;
    color: var(--st-muted);
    font-size: 12px;
    font-weight: 600;
}

#order-standard_cart.st-review-page .empty-cart {
    margin: 8px 2px 0;
    text-align: right;
}

#order-standard_cart.st-review-page .empty-cart .btn-link {
    color: var(--st-muted);
    font-size: 12px;
}

#order-standard_cart.st-review-page .st-promo-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 14px 0 0;
    padding: 8px 0;
    border: 0;
    background: transparent;
    color: var(--st-blue-600);
    font-size: 13px;
    font-weight: 700;
    cursor: pointer;
}

#order-standard_cart.st-review-page .st-promo-toggle:hover {
    text-decoration: underline;
}

#order-standard_cart.st-review-page .view-cart-tabs {
    margin-top: 8px;
    padding: 14px;
    border: 1px solid rgba(51,70,146,.11);
    border-radius: 13px;
    background: #fbfdff;
}

#order-standard_cart.st-review-page .view-cart-tabs .nav-tabs {
    display: none;
}

#order-standard_cart.st-review-page .view-cart-tabs .tab-content {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
}

#order-standard_cart.st-review-page #inputPromotionCode {
    height: 44px;
    border-radius: 10px;
}

#order-standard_cart.st-review-page #orderSummary {
    width: 100% !important;
    margin: 0 !important;
}

#order-standard_cart.st-review-page #orderSummary .order-summary {
    border: 1px solid rgba(51,70,146,.11);
    border-radius: 18px 18px 0 0;
    box-shadow: 0 12px 30px rgba(42,65,93,.055);
}

#order-standard_cart.st-review-page #checkout {
    width: 100%;
    min-height: 48px;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--st-aqua-600), #20c9d8);
    font-weight: 750;
    box-shadow: 0 10px 24px rgba(16,191,210,.20);
}

@media (max-width: 991.98px) {
    #order-standard_cart.st-review-page .cart-body > .row {
        grid-template-columns: 1fr;
        row-gap: 22px;
    }

    #order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-body,
    #order-standard_cart.st-review-page .cart-body > .row > .secondary-cart-sidebar {
        grid-column: 1;
    }
}

/* ---------- v14.1 Professional Plus review-page upgrade ---------- */
#order-standard_cart.st-review-page .st-plus-offer {
    box-sizing: border-box;
    width: 100%;
    clear: both;
    margin-top: 20px;
    padding: 22px 24px;
    border: 1px solid rgba(16, 191, 210, .34);
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(16, 191, 210, .07), rgba(37, 84, 166, .035));
    text-align: left;
}

#order-standard_cart.st-review-page .st-plus-kicker {
    margin-bottom: 5px;
    color: var(--st-aqua-600);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .09em;
}

#order-standard_cart.st-review-page .st-plus-heading {
    margin-bottom: 16px;
    color: var(--st-blue-600);
    font-size: 18px;
    line-height: 1.3;
    font-weight: 750;
}

#order-standard_cart.st-review-page .st-plus-benefits {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 24px;
    margin-bottom: 20px;
}

#order-standard_cart.st-review-page .st-plus-benefit {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 8px;
    align-items: start;
    min-width: 0;
}

#order-standard_cart.st-review-page .st-plus-check {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin-top: 1px;
    border-radius: 50%;
    background: var(--st-aqua-600);
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

#order-standard_cart.st-review-page .st-plus-benefit strong,
#order-standard_cart.st-review-page .st-plus-benefit span {
    display: block;
}

#order-standard_cart.st-review-page .st-plus-benefit strong {
    margin-bottom: 2px;
    color: var(--st-blue-600);
    font-size: 13px;
    line-height: 1.35;
    font-weight: 750;
}

#order-standard_cart.st-review-page .st-plus-benefit div > span {
    color: var(--st-muted);
    font-size: 12px;
    line-height: 1.45;
}

#order-standard_cart.st-review-page .st-plus-action {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-top: 17px;
    border-top: 1px solid rgba(37, 84, 166, .12);
}

#order-standard_cart.st-review-page .st-plus-price {
    flex: 0 0 auto;
    min-width: 74px;
}

#order-standard_cart.st-review-page .st-plus-price strong {
    display: block;
    color: var(--st-blue-600);
    font-size: 22px;
    line-height: 1;
    font-weight: 800;
}

#order-standard_cart.st-review-page .st-plus-price span {
    display: block;
    margin-top: 4px;
    color: var(--st-muted);
    font-size: 11px;
}

#order-standard_cart.st-review-page .st-plus-upgrade-btn {
    flex: 1 1 auto;
    min-height: 44px;
    padding: 11px 18px;
    border: 1px solid var(--st-aqua-600);
    border-radius: 999px;
    background: var(--st-aqua-600);
    color: #fff !important;
    font-size: 14px;
    line-height: 1.25;
    font-weight: 750;
    box-shadow: 0 4px 12px rgba(16, 191, 210, .18);
}

#order-standard_cart.st-review-page .st-plus-upgrade-btn:hover,
#order-standard_cart.st-review-page .st-plus-upgrade-btn:focus {
    filter: brightness(.94);
    color: #fff !important;
}

#order-standard_cart.st-review-page .st-plus-upgrade-btn:disabled {
    opacity: .65;
    cursor: wait;
}

#order-standard_cart.st-review-page .st-plan-switch-message {
    margin: 0 0 16px;
}

@media (max-width: 767.98px) {
    #order-standard_cart.st-review-page .st-plus-offer {
        padding: 18px;
    }

    #order-standard_cart.st-review-page .st-plus-benefits {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    #order-standard_cart.st-review-page .st-plus-action {
        align-items: stretch;
        flex-direction: column;
        gap: 12px;
    }

    #order-standard_cart.st-review-page .st-plus-price {
        min-width: 0;
    }

    #order-standard_cart.st-review-page .st-plus-upgrade-btn {
        width: 100%;
    }
}


/* v14.4: annual-only billing presentation on Configure Product */
#order-standard_cart .st-billing-price {
    margin: 1px 0 0;
    color: var(--st-ink);
    font-size: 18px;
    font-weight: 750;
    line-height: 1.35;
}


/* v14.8 — checkout clarity and explicit marketing choice */
#order-standard_cart input.form-control,
#order-standard_cart select.form-control,
#order-standard_cart textarea.form-control,
#order-standard_cart .field.form-control {
    background: #fff;
    border: 1px solid #9aa9b2;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .06);
}

#order-standard_cart input.form-control:focus,
#order-standard_cart select.form-control:focus,
#order-standard_cart textarea.form-control:focus,
#order-standard_cart .field.form-control:focus {
    border-color: #1ca7b9;
    box-shadow: 0 0 0 2px rgba(28, 167, 185, .16);
    outline: 0;
}

#order-standard_cart .st-marketing-choice {
    margin: 28px 0;
    padding: 22px 24px;
    border: 1px solid rgba(28, 167, 185, .35);
    border-radius: 12px;
    background: rgba(28, 167, 185, .045);
}

#order-standard_cart .st-marketing-choice h4 {
    margin: 0 0 7px;
}

#order-standard_cart .st-marketing-choice > p {
    margin: 0 0 16px;
}

#order-standard_cart .st-marketing-options {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

#order-standard_cart .st-marketing-option {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 210px;
    margin: 0;
    padding: 12px 16px;
    border: 1px solid #b8c5cb;
    border-radius: 9px;
    background: #fff;
    cursor: pointer;
}

#order-standard_cart .st-marketing-option input {
    margin: 0;
}

#order-standard_cart .st-native-marketing-optin {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

@media (max-width: 767px) {
    #order-standard_cart .st-marketing-options {
        display: block;
    }

    #order-standard_cart .st-marketing-option {
        width: 100%;
        margin-bottom: 9px;
    }
}

/* ---------- v14.9 customer email experience ---------- */

.st-login-webmail {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 4px 14px;
    align-items: center;
    margin-top: 18px;
    padding: 18px 20px;
    border: 1px solid rgba(51, 70, 146, .18);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 9px 26px rgba(42, 65, 93, .045);
}

.st-login-webmail-icon,
.st-service-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 15px;
    background: var(--st-aqua-50);
    color: var(--st-aqua-600);
    font-size: 20px;
}

.st-login-webmail-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.st-login-webmail-copy strong {
    color: var(--st-blue-600);
    font-size: 15px;
}

.st-login-webmail-copy span {
    color: var(--st-muted);
    font-size: 12px;
    line-height: 1.45;
}

.st-login-webmail-link {
    grid-column: 2;
    justify-self: start;
    margin-top: 6px;
    color: var(--st-blue-600);
    font-size: 13px;
    font-weight: 750;
}

.st-customer-dashboard {
    max-width: 1180px;
    margin: 6px auto 10px;
}

.st-dashboard-header {
    margin-bottom: 28px;
}

.st-dashboard-header h1 {
    margin: 5px 0 8px;
    font-size: clamp(32px, 4vw, 46px);
}

.st-dashboard-header p,
.st-dashboard-section-heading p,
.st-dashboard-side-card p,
.st-dashboard-empty p {
    color: var(--st-muted);
}

.st-dashboard-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 330px);
    gap: 24px;
    align-items: start;
}

.st-dashboard-section,
.st-dashboard-side-card {
    border: 1px solid var(--st-line);
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 12px 34px rgba(42, 65, 93, .055);
}

.st-dashboard-section {
    padding: 26px;
}

.st-dashboard-section-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.st-dashboard-section-heading h2,
.st-dashboard-side-card h2 {
    margin: 0 0 5px;
    font-size: 21px;
}

.st-dashboard-section-heading p,
.st-dashboard-side-card p {
    margin: 0;
    font-size: 13px;
}

.st-service-list {
    display: grid;
    gap: 16px;
}

.st-service-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    padding: 21px;
    border: 1px solid rgba(51, 70, 146, .14);
    border-radius: 18px;
    background: linear-gradient(120deg, rgba(238, 252, 253, .75), #fff 42%);
}

.st-service-identity {
    display: flex;
    gap: 14px;
    align-items: center;
    min-width: 0;
}

.st-service-identity > div {
    min-width: 0;
}

.st-service-identity h3 {
    overflow-wrap: anywhere;
    margin: 0 0 4px;
    color: var(--st-blue-600);
    font-size: clamp(18px, 2.2vw, 24px);
    font-weight: 750;
    letter-spacing: -.025em;
}

.st-service-identity p {
    margin: 0;
    color: var(--st-muted);
    font-size: 13px;
}

.st-service-status {
    font-weight: 750;
}

.st-status-active {
    color: #16794b;
}

.st-status-suspended {
    color: #9b5d00;
}

.st-status-pending {
    color: var(--st-blue-600);
}

.st-service-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 9px;
    flex-wrap: wrap;
}

.st-service-actions .btn,
.st-dashboard-section-heading .btn {
    padding: 9px 16px;
    font-size: 13px;
    white-space: nowrap;
}

.st-service-meta {
    grid-column: 1 / -1;
    display: flex;
    gap: 8px 18px;
    flex-wrap: wrap;
    padding-top: 14px;
    border-top: 1px solid rgba(51, 70, 146, .10);
    color: var(--st-muted);
    font-size: 12px;
}

.st-service-meta i {
    width: 14px;
    color: var(--st-aqua-600);
}

.st-dashboard-side {
    display: grid;
    gap: 16px;
}

.st-dashboard-side-card {
    padding: 21px;
}

.st-dashboard-side-card h2 i {
    margin-right: 5px;
    color: var(--st-aqua-600);
}

.st-dashboard-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid rgba(51, 70, 146, .10);
    font-size: 13px;
    font-weight: 750;
}

.st-renewal-card ul {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
}

.st-renewal-card li + li {
    border-top: 1px solid rgba(51, 70, 146, .10);
}

.st-renewal-card li a {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 10px 0;
}

.st-renewal-card li strong {
    overflow-wrap: anywhere;
    color: var(--st-ink);
    font-size: 13px;
}

.st-renewal-card li span {
    color: var(--st-muted);
    font-size: 12px;
}

.st-dashboard-alert {
    margin-bottom: 0;
}

.st-dashboard-empty {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 21px;
    border: 1px dashed rgba(51, 70, 146, .25);
    border-radius: 18px;
    background: #fbfdfe;
}

.st-dashboard-empty h3,
.st-dashboard-empty p {
    margin: 0;
}

.st-dashboard-empty h3 {
    color: var(--st-blue-600);
    font-size: 16px;
}

.st-dashboard-empty-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.st-dashboard-addon-output,
.st-dashboard-notices {
    max-width: 1180px;
    margin: 24px auto 10px;
}

.st-dashboard-notices {
    padding-top: 22px;
    border-top: 1px solid var(--st-line);
}

.st-dashboard-notices-heading {
    margin-bottom: 15px;
}

.st-dashboard-notices-heading h2 {
    margin: 0 0 4px;
    color: var(--st-blue-600);
    font-size: 20px;
}

.st-dashboard-notices-heading p {
    margin: 0;
    color: var(--st-muted);
    font-size: 13px;
}

@media (max-width: 991.98px) {
    .st-dashboard-layout {
        grid-template-columns: 1fr;
    }

    .st-dashboard-side {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .st-dashboard-side .st-renewal-card {
        grid-column: 1 / -1;
    }
}

@media (max-width: 767.98px) {
    .st-login-webmail {
        grid-template-columns: auto minmax(0, 1fr);
        padding: 16px;
    }

    .st-dashboard-section {
        padding: 18px;
    }

    .st-dashboard-section-heading,
    .st-service-card,
    .st-dashboard-empty {
        display: flex;
        flex-direction: column;
        align-items: stretch;
    }

    .st-dashboard-section-heading .btn,
    .st-service-actions .btn,
    .st-dashboard-empty .btn,
    .st-dashboard-empty-actions {
        width: 100%;
        text-align: center;
    }

    .st-dashboard-empty-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .st-service-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .st-service-meta {
        display: grid;
        grid-template-columns: 1fr;
    }

    .st-dashboard-side {
        grid-template-columns: 1fr;
    }

    .st-dashboard-side .st-renewal-card {
        grid-column: auto;
    }
}

/* v14.9: mailbox-first My Products & Services list */

#tableServicesList .st-email-service-row td {
    vertical-align: middle;
}

.st-service-list-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 11px;
    background: var(--st-aqua-50);
    color: var(--st-aqua-600);
    font-size: 15px;
}

.st-service-list-mailbox {
    overflow-wrap: anywhere;
    color: var(--st-blue-600);
    font-size: 15px;
}

.st-service-list-plan {
    color: var(--st-muted);
    font-size: 12px;
}

/* ---------- v14.14 client-area navigation refinement ---------- */

/* Native Nexus Active Products/Services child rows */

div[menuitemname="Active Products/Services"] .list-group-item.st-dashboard-email-child {
    padding: 0;
}

.st-dashboard-email-row {
    display: grid;
    grid-template-columns: minmax(190px, 1.5fr) minmax(110px, .8fr) auto auto;
    gap: 10px 14px;
    align-items: center;
    width: 100%;
    min-width: 0;
    padding: 14px 16px;
}

.st-dashboard-email-identity,
.st-dashboard-email-mailbox,
.st-dashboard-email-plan {
    display: block;
    min-width: 0;
}

.st-dashboard-email-mailbox {
    overflow-wrap: anywhere;
    color: var(--st-blue-600);
    font-size: 14px;
    line-height: 1.3;
}

.st-dashboard-email-plan,
.st-dashboard-email-label,
.st-dashboard-email-renewal-empty {
    color: var(--st-muted);
    font-size: 11px;
}

.st-dashboard-email-plan {
    overflow-wrap: anywhere;
    margin-top: 2px;
    line-height: 1.3;
}

.st-dashboard-email-renewal,
.st-dashboard-email-status,
.st-dashboard-email-manage {
    white-space: nowrap;
    font-size: 12px;
}

.st-dashboard-email-status {
    font-weight: 750;
}

.st-dashboard-email-manage {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 6px 11px;
    border: 1px solid rgba(51, 70, 146, .20);
    border-radius: 8px;
    background: #fff;
    color: var(--st-blue-600);
    font-weight: 750;
}

.st-dashboard-email-child:hover .st-dashboard-email-manage,
.st-dashboard-email-child:focus .st-dashboard-email-manage {
    border-color: var(--st-aqua-600);
    color: var(--st-aqua-600);
}

/* Keep the native account-details action and WHMCS payment navigation clearly
   separated without introducing a dashboard payment form. */

div[menuitemname="Client Details"] .st-client-details-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

div[menuitemname="Client Details"] .st-client-details-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100%;
    min-height: 38px;
    margin: 0 !important;
    padding: 4px 8px !important;
    border-radius: var(--rounding-md) !important;
    font-weight: 600;
    white-space: normal;
}

div[menuitemname="Client Details"] .st-client-details-actions a[data-speechtherapy-payment-methods] {
    color: var(--st-blue-600) !important;
    border: 1px solid rgba(51, 70, 146, .32) !important;
    background: #fff !important;
    box-shadow: 0 5px 14px rgba(42, 65, 93, .08);
    text-decoration: none;
}

div[menuitemname="Client Details"] .st-client-details-actions a[data-speechtherapy-payment-methods]:hover,
div[menuitemname="Client Details"] .st-client-details-actions a[data-speechtherapy-payment-methods]:focus {
    color: var(--st-blue-600) !important;
    border-color: var(--st-aqua-400) !important;
    background: var(--st-aqua-50) !important;
    box-shadow: 0 7px 18px rgba(16, 191, 210, .14);
}

/* One Product Details owner per concern: module mailbox, theme billing */

.st-email-details-shell {
    overflow: hidden;
    margin-bottom: 20px;
    border: 1px solid rgba(51, 70, 146, .14);
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 9px 25px rgba(42, 65, 93, .05);
}

.st-email-module-primary,
.st-email-module-primary .stpm3-clientarea {
    min-width: 0;
    text-align: left !important;
}

.st-email-module-primary .stpm3-feedback {
    padding: 16px 24px 0;
}

.st-email-module-primary .stpm3-feedback .alert {
    margin-bottom: 0;
    text-align: left;
}

.stpm3-mailbox-summary {
    padding: 22px 26px 17px;
    background:
        radial-gradient(circle at 98% 0%, rgba(50, 212, 226, .14), transparent 30%),
        linear-gradient(135deg, var(--st-aqua-50), #fff 58%);
}

.stpm3-mailbox-heading,
.st-email-fallback-summary {
    display: flex;
    gap: 18px;
    align-items: center;
    justify-content: space-between;
    min-width: 0;
}

.stpm3-mailbox-identity,
.st-email-fallback-summary > div {
    min-width: 0;
}

.stpm3-mailbox-identity h1,
.st-email-fallback-summary h1 {
    overflow-wrap: anywhere;
    margin: 0 0 5px;
    color: var(--st-blue-600);
    font-size: clamp(23px, 3vw, 34px);
    font-weight: 750;
    letter-spacing: -.03em;
    line-height: 1.15;
}

.stpm3-mailbox-meta,
.st-email-fallback-summary p {
    display: flex;
    gap: 6px;
    align-items: center;
    flex-wrap: wrap;
    margin: 0;
    color: var(--st-muted);
    font-size: 13px;
}

.stpm3-status,
.st-service-status {
    font-weight: 750;
}

.stpm3-status-active,
.st-status-active {
    color: #16794b;
}

.stpm3-status-suspended,
.st-status-suspended {
    color: #9b5d00;
}

.stpm3-status-terminated,
.stpm3-status-failed,
.stpm3-status-reconciliation_required,
.st-status-terminated,
.st-status-failed {
    color: #ad2831;
}

.stpm3-webmail-action,
.st-email-fallback-summary > .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}

.stpm3-status-message {
    margin: 12px 0 0;
    color: var(--st-muted);
    font-size: 12px;
    line-height: 1.45;
}

.stpm3-clientarea:not(.stpm3-state-active) .stpm3-status-message {
    padding: 10px 12px;
    border: 1px solid #efd69a;
    border-radius: 9px;
    background: #fff8e7;
    color: #72520c;
    font-size: 13px;
}

.stpm3-password-section {
    padding: 17px 26px 19px;
    border-top: 1px solid var(--st-line);
}

.stpm3-password-section h2 {
    margin: 0 0 11px;
    color: var(--st-blue-600);
    font-size: 18px;
}

.stpm3-password-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
    gap: 10px 12px;
    align-items: end;
}

.stpm3-password-field {
    min-width: 0;
    margin: 0;
}

.stpm3-password-field label {
    margin-bottom: 5px;
    color: var(--st-ink);
    font-size: 12px;
    font-weight: 650;
}

.stpm3-password-field .form-control,
.stpm3-password-submit {
    min-height: 42px;
}

.stpm3-password-submit {
    padding-right: 16px;
    padding-left: 16px;
    white-space: nowrap;
}

.stpm3-password-help {
    margin-top: 9px;
    color: var(--st-muted);
    font-size: 11px;
    line-height: 1.45;
}

.stpm3-password-help p {
    margin: 3px 0;
}

.stpm3-security-alert {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    text-align: left;
}

.stpm3-security-alert strong,
.stpm3-security-alert span {
    display: block;
}

.stpm3-security-alert span {
    margin-top: 2px;
}

.stpm3-security-alert .btn {
    flex: 0 0 auto;
    white-space: nowrap;
}

.stpm3-password-unavailable {
    margin: 0 24px 18px;
    text-align: left;
}

.stpm3-secondary-output:not(:empty) {
    padding: 0 24px 18px;
}

.stpm3-secondary-output > .card:last-child {
    margin-bottom: 0 !important;
}

.st-email-fallback-summary {
    padding: 22px 26px;
    background: linear-gradient(135deg, var(--st-aqua-50), #fff 58%);
}

.st-email-subscription-strip {
    padding: 13px 24px 15px;
    border-top: 1px solid var(--st-line);
    background: #fbfdfe;
}

.st-email-subscription-items {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 8px 0;
    margin: 0;
}

.st-email-subscription-items > div {
    min-width: 0;
    padding: 2px 14px;
    border-left: 1px solid rgba(51, 70, 146, .12);
}

.st-email-subscription-items > div:first-child {
    padding-left: 0;
    border-left: 0;
}

.st-email-subscription-items dt,
.st-email-subscription-items dd {
    display: inline;
}

.st-email-subscription-items dt {
    margin-right: 5px;
    color: var(--st-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.st-email-subscription-items dd {
    overflow-wrap: anywhere;
    margin: 0;
    color: var(--st-ink);
    font-size: 12px;
}

.st-email-subscription-items dd strong {
    color: var(--st-blue-600);
    font-size: 14px;
}

.st-email-subscription-items dd span {
    color: var(--st-muted);
    font-size: 11px;
}

.st-email-subscription-actions {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 11px;
}

.st-email-subscription-actions .btn {
    min-height: 36px;
    padding: 7px 13px;
    white-space: normal;
}

.st-email-suspension-reason {
    margin: 10px 0 0;
    color: #72520c;
    font-size: 12px;
}

@media (max-width: 991.98px) {
    .st-dashboard-email-row {
        grid-template-columns: minmax(180px, 1.5fr) minmax(105px, .8fr) auto auto;
    }

    .st-email-subscription-items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .st-email-subscription-items > div:nth-child(3) {
        padding-left: 0;
        border-left: 0;
    }
}

@media (max-width: 767.98px) {
    .stpm3-password-form {
        grid-template-columns: 1fr;
    }

    .stpm3-password-submit {
        justify-self: start;
    }
}

@media (max-width: 575.98px) {
    .st-dashboard-email-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 12px;
        padding: 13px 14px;
    }

    .st-dashboard-email-identity {
        flex: 1 0 100%;
    }

    .st-dashboard-email-renewal {
        margin-right: auto;
        padding-right: 8px;
        white-space: normal;
    }

    .stpm3-mailbox-heading,
    .st-email-fallback-summary {
        display: block;
    }

    .stpm3-mailbox-identity,
    .st-email-fallback-summary > div {
        width: 100%;
    }

    .stpm3-mailbox-summary,
    .stpm3-password-section,
    .st-email-fallback-summary {
        padding-right: 17px;
        padding-left: 17px;
    }

    .stpm3-webmail-action,
    .st-email-fallback-summary > .btn {
        width: 100%;
        margin-top: 13px;
        white-space: normal;
    }

    .stpm3-security-alert {
        align-items: stretch;
        flex-direction: column;
    }

    .stpm3-security-alert .btn,
    .stpm3-password-submit {
        width: 100%;
    }

    .stpm3-password-submit {
        justify-self: stretch;
    }

    .stpm3-password-unavailable {
        margin-right: 17px;
        margin-left: 17px;
    }

    .stpm3-secondary-output:not(:empty) {
        padding-right: 17px;
        padding-left: 17px;
    }

    .st-email-subscription-strip {
        padding-right: 16px;
        padding-left: 16px;
    }

    .st-email-subscription-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .st-email-subscription-actions .btn {
        width: 100%;
    }
}

@media (max-width: 359.98px) {
    .st-email-subscription-items {
        grid-template-columns: 1fr;
    }

    .st-email-subscription-items > div,
    .st-email-subscription-items > div:nth-child(3) {
        padding-right: 0;
        padding-left: 0;
        border-left: 0;
    }
}

/* ---------- v14.19 checkout password handoff ---------- */

#order-standard_cart .st-checkout-password-note {
    margin: 10px 0 18px;
    padding: 12px 14px;
    border: 1px solid rgba(51, 70, 146, .13);
    border-radius: 12px;
    background: #f7fbfd;
    color: #536879;
    font-size: 14px;
    line-height: 1.55;
}

#order-standard_cart .st-checkout-password-note strong {
    color: var(--st-blue-600);
}

#order-standard_cart .st-order-complete-marker {
    display: none;
}

#order-standard_cart .st-order-handoff {
    margin: 28px 0 24px;
    padding: 26px;
    border: 1px solid rgba(16, 191, 210, .35);
    border-radius: 18px;
    background: linear-gradient(135deg, rgba(16, 191, 210, .09), rgba(37, 84, 166, .045));
    box-shadow: 0 14px 34px rgba(42, 65, 93, .08);
    text-align: left;
}

#order-standard_cart .st-order-handoff h2 {
    margin: 0 0 10px;
    color: var(--st-blue-600);
    font-size: 25px;
    line-height: 1.25;
}

#order-standard_cart .st-order-handoff > p {
    max-width: 720px;
    margin: 0 0 20px;
    color: #42596c;
    font-size: 16px;
    line-height: 1.6;
}

#order-standard_cart .st-order-handoff-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

#order-standard_cart .st-order-handoff-primary,
#order-standard_cart .st-order-handoff-primary:visited {
    display: inline-flex;
    min-height: 48px;
    align-items: center;
    justify-content: center;
    padding: 12px 22px;
    border: 2px solid var(--st-aqua-600) !important;
    border-radius: 999px;
    background: var(--st-aqua-600) !important;
    color: #fff !important;
    font-weight: 700;
    line-height: 1.35;
    text-align: center;
    text-decoration: none !important;
    box-shadow: 0 10px 24px rgba(16, 191, 210, .22);
}

#order-standard_cart .st-order-handoff-primary:hover,
#order-standard_cart .st-order-handoff-primary:focus,
#order-standard_cart .st-order-handoff-primary:active {
    border-color: var(--st-blue-600) !important;
    background: var(--st-blue-600) !important;
    color: #fff !important;
    text-decoration: none !important;
}

#order-standard_cart .st-order-handoff-primary > span {
    display: block;
    width: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
}

#order-standard_cart .st-order-handoff-primary:focus-visible,
#order-standard_cart .st-order-handoff-secondary:focus-visible,
#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"]:focus-visible {
    outline: 3px solid rgba(37, 84, 166, .34);
    outline-offset: 3px;
}

#order-standard_cart .st-order-handoff-secondary,
#order-standard_cart .st-order-handoff-secondary:visited {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border: 2px solid var(--st-blue-600);
    border-radius: 999px;
    background: #fff;
    color: var(--st-blue-600) !important;
    font-weight: 700;
    text-decoration: none !important;
}

#order-standard_cart .st-order-handoff-secondary:hover,
#order-standard_cart .st-order-handoff-secondary:focus,
#order-standard_cart .st-order-handoff-secondary:active {
    background: var(--st-blue-600);
    color: #fff !important;
    text-decoration: none !important;
}

#order-standard_cart .st-order-handoff-fallback {
    margin: 0 0 16px;
    line-height: 1.55;
}

/* The inherited template's Continue button remains the unpaid-order action. */
#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"],
#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"]:visited {
    border: 2px solid var(--st-blue-600) !important;
    background: #fff !important;
    color: var(--st-blue-600) !important;
    font-weight: 700;
}

#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"]:hover,
#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"]:focus,
#order-standard_cart .st-order-complete-marker ~ .text-center > a[href*="clientarea.php"]:active {
    border-color: var(--st-blue-600) !important;
    background: var(--st-blue-600) !important;
    color: #fff !important;
}

/* Paid handoff cards provide their own Dashboard action, so remove the duplicate. */
#order-standard_cart .st-order-handoff ~ .text-center > a[href*="clientarea.php"] {
    display: none !important;
}

@media (max-width: 575.98px) {
    #order-standard_cart .st-order-handoff {
        padding: 21px 18px;
    }

    #order-standard_cart .st-order-handoff h2 {
        font-size: 22px;
    }

    #order-standard_cart .st-order-handoff-actions,
    #order-standard_cart .st-order-handoff-primary,
    #order-standard_cart .st-order-handoff-secondary {
        width: 100%;
    }

    #order-standard_cart .st-order-handoff-primary,
    #order-standard_cart .st-order-handoff-secondary {
        white-space: normal;
    }
}