/*
 * Hostable Cart — Order Form Child Theme
 *
 * Overrides nexus_cart CSS variables to match the Hostable design system.
 * Uses the --vl-* variable namespace defined by the Nexus cart parent theme.
 *
 * This file contains ONLY variable overrides — no selectors or !important rules
 * are needed because the Nexus cart's component styling reads from these variables.
 */

:host, :root {
    /* ================================================================
       PRIMARY — Hostable blue
       ================================================================ */
    --vl-primary: #0263e0;
    --vl-primary-lifted: #3b82f6;
    --vl-primary-accented: #0150b5;

    /* ================================================================
       NEUTRAL — Tailwind slate palette (matches Hostable tokens)
       ================================================================ */
    --vl-neutral-50: #f8fafc;
    --vl-neutral-100: #f1f5f9;
    --vl-neutral-200: #e2e8f0;
    --vl-neutral-300: #cbd5e1;
    --vl-neutral-400: #94a3b8;
    --vl-neutral-500: #64748b;
    --vl-neutral-600: #475569;
    --vl-neutral-700: #334155;
    --vl-neutral-800: #1e293b;
    --vl-neutral-900: #0f172a;

    /* ================================================================
       SEMANTIC — status colours
       ================================================================ */
    --vl-success: #16a34a;
    --vl-info: #0ea5e9;
    --vl-warning: #f59e0b;
    --vl-error: #dc2626;

    /* ================================================================
       ROUNDING — match Hostable border-radius tokens
       ================================================================ */
    --vl-rounding-sm: 0.375rem;   /* 6px  */
    --vl-rounding-md: 0.5rem;     /* 8px  */
    --vl-rounding-lg: 0.75rem;    /* 12px */

    /* ================================================================
       TYPOGRAPHY — system font stack (matches Hostable)
       ================================================================ */
    --vl-font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
                      "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* ================================================================
   BUTTON OVERRIDES
   Match the Hostable primary button gradient and radius.
   ================================================================ */
.btn-primary,
[class*="vl-btn-primary"] {
    background: linear-gradient(135deg, #0263e0, #3b82f6);
    border: none;
    border-radius: 0.75rem;
    font-weight: 600;
    transition: all 0.2s ease;
}

.btn-primary:hover,
[class*="vl-btn-primary"]:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb);
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4);
}

/* ================================================================
   FORM CONTROLS
   Consistent rounding and focus ring matching the client area.
   ================================================================ */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="url"],
select,
textarea {
    border-radius: 0.5rem;
    border-color: #cbd5e1;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

input:focus,
select:focus,
textarea:focus {
    border-color: #0263e0;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15);
    outline: none;
}

/* ================================================================
   CARD ROUNDING
   Match Hostable's rounded card style.
   ================================================================ */
.card,
.panel,
[class*="vl-card"] {
    border-radius: 0.75rem;
    border-color: #e2e8f0;
}

/* ================================================================
   DARK SIDEBAR
   Mirrors the client area .hst-sidebar-wrap exactly — same gradient,
   inset glows (via box-shadow), padding, radius and colour palette.
   All rules use !important to beat standard_cart style.css load order.
   ================================================================ */

/* ── Container ────────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    border-radius: 1.25rem !important;
    padding: 1.5rem !important;
    box-sizing: border-box !important;
    /* Only wrap content height — .row is flex, so prevent stretch */
    align-self: flex-start !important;
    /* Radial glows — blue top-right, pink bottom-left (matches .hst-sidebar-wrap) */
    box-shadow:
        inset -150px -100px 200px -80px rgba(59,130,246,0.12),
        inset 120px 100px 180px -60px rgba(134,16,67,0.10) !important;
}

/*
 * Match client area layout — the client area sidebar (.hst-sidebar-wrap)
 * sits inside a Bootstrap column with gutter padding, so the dark box is
 * inset from the column edges. Replicate that here with calc() width
 * minus gap, and margin-right for the gutter between sidebar & content.
 */
/*
 * Alignment: The .row has -15px margins. The client area sidebar is inside
 * a Bootstrap column (which has 15px gutter padding), so the dark box is
 * inset. Replicate with margin-left: 15px to align with container/logo edge.
 */
@media (min-width: 1200px) {
    #order-standard_cart .cart-sidebar {
        width: calc(25% - 15px - 1.5rem) !important;
        margin-left: 15px !important;
        margin-right: 1.5rem !important;
    }
    #order-standard_cart .cart-body {
        width: 75% !important;
    }
}
@media (min-width: 992px) and (max-width: 1199px) {
    #order-standard_cart .cart-sidebar {
        width: calc(33.333% - 15px - 1.5rem) !important;
        margin-left: 15px !important;
        margin-right: 1.5rem !important;
    }
    #order-standard_cart .cart-body {
        width: 66.666% !important;
    }
}

/* ── Nuclear visibility — force ALL children visible + light text ── */
#order-standard_cart .cart-sidebar * {
    visibility: visible !important;
    color: #e2e8f0 !important;
}

#order-standard_cart .cart-sidebar .collapsable-card-body,
#order-standard_cart .cart-sidebar .card,
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card-sidebar,
#order-standard_cart .cart-sidebar .card-header,
#order-standard_cart .cart-sidebar .panel-heading,
#order-standard_cart .cart-sidebar .list-group,
#order-standard_cart .cart-sidebar .list-group-item,
#order-standard_cart .cart-sidebar .card-body,
#order-standard_cart .cart-sidebar .panel-body {
    display: block !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    max-height: none !important;
}

/* ── Panels — strip card chrome, go transparent ──────────────── */
#order-standard_cart .cart-sidebar .card,
#order-standard_cart .cart-sidebar .panel,
#order-standard_cart .cart-sidebar .card-sidebar {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
}

/* Divider between panels */
#order-standard_cart .cart-sidebar .card + .card,
#order-standard_cart .cart-sidebar .panel + .panel,
#order-standard_cart .cart-sidebar .card-sidebar + .card-sidebar {
    margin-top: 0.25rem !important;
    padding-top: 0.75rem !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
}

/* ── Section headers — uppercase slate ───────────────────────── */
#order-standard_cart .cart-sidebar .card-header,
#order-standard_cart .cart-sidebar .panel-heading {
    background: transparent !important;
    border: none !important;
    padding: 0.625rem 0.75rem !important;
}

#order-standard_cart .cart-sidebar .card-header h3,
#order-standard_cart .cart-sidebar .panel-heading h3,
#order-standard_cart .cart-sidebar .panel-title {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    margin: 0 !important;
}

#order-standard_cart .cart-sidebar .card-header i,
#order-standard_cart .cart-sidebar .panel-heading i {
    color: #94a3b8 !important;
}

/* Hide default collapse chevron */
#order-standard_cart .cart-sidebar .card-minimise,
#order-standard_cart .cart-sidebar .panel-minimise {
    display: none !important;
}

/* ── Body content ────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar .card-body,
#order-standard_cart .cart-sidebar .panel-body {
    padding: 0.5rem 0.75rem 0.75rem !important;
    font-size: 0.8125rem !important;
    color: #cbd5e1 !important;
    line-height: 1.5 !important;
}

/* ── List group ──────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar .list-group {
    background: transparent !important;
    border: none !important;
    margin: 0 !important;
    padding: 0.125rem 0 !important;
}

/* List items — match .hst-sb-item from client area */
#order-standard_cart .cart-sidebar .list-group-item {
    background: transparent !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.5625rem 0.75rem !important;
    margin: 0.0625rem 0 !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #e2e8f0 !important;
    transition: all 0.15s ease !important;
}

#order-standard_cart .cart-sidebar .list-group-item i {
    color: #64748b !important;
    transition: color 0.15s ease !important;
    margin-right: 0.5rem !important;
}

/* Hover */
#order-standard_cart .cart-sidebar .list-group-item:hover {
    background: rgba(255,255,255,0.06) !important;
    color: white !important;
    text-decoration: none !important;
}

#order-standard_cart .cart-sidebar .list-group-item:hover i {
    color: #60a5fa !important;
}

/* Active / current */
#order-standard_cart .cart-sidebar .list-group-item.active {
    background: rgba(59,130,246,0.15) !important;
    color: white !important;
    font-weight: 600 !important;
}

#order-standard_cart .cart-sidebar .list-group-item.active i {
    color: #60a5fa !important;
}

/* Disabled */
#order-standard_cart .cart-sidebar .list-group-item.disabled {
    opacity: 0.4 !important;
    pointer-events: none !important;
}

/* ── Badges ──────────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar .badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 1.25rem !important;
    height: 1.25rem !important;
    padding: 0 0.375rem !important;
    border-radius: 9999px !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    background: rgba(59,130,246,0.2) !important;
    color: #60a5fa !important;
}

/* ── Footer ──────────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar .card-footer,
#order-standard_cart .cart-sidebar .panel-footer {
    background: transparent !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
    padding: 0.75rem !important;
    margin-top: 0.25rem !important;
    font-size: 0.8125rem !important;
    color: #64748b !important;
}

/* ── Links ───────────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar a {
    color: #e2e8f0 !important;
    text-decoration: none !important;
}

#order-standard_cart .cart-sidebar a:hover {
    color: white !important;
}

#order-standard_cart .cart-sidebar .card-footer a,
#order-standard_cart .cart-sidebar .panel-footer a {
    color: #60a5fa !important;
}

#order-standard_cart .cart-sidebar .card-footer a:hover,
#order-standard_cart .cart-sidebar .panel-footer a:hover {
    color: #93bbfd !important;
    text-decoration: underline !important;
}

/* ── Buttons ─────────────────────────────────────────────────── */
#order-standard_cart .cart-sidebar .btn,
#order-standard_cart .cart-sidebar .btn-success,
#order-standard_cart .cart-sidebar .btn-primary {
    background-color: rgba(255,255,255,0.1) !important;
    background-image: none !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255,255,255,0.15) !important;
    border-radius: 0.5rem !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: all 0.15s ease !important;
}

#order-standard_cart .cart-sidebar .btn:hover,
#order-standard_cart .cart-sidebar .btn-success:hover,
#order-standard_cart .cart-sidebar .btn-primary:hover {
    background-color: rgba(255,255,255,0.18) !important;
    background-image: none !important;
    border-color: rgba(255,255,255,0.25) !important;
    color: white !important;
}

/* (sidebar-collapsed rules moved below cart-body panel section for specificity) */

/* ── Secondary cart sidebar (order summary) ──────────────────── */
#order-standard_cart .secondary-cart-sidebar .card,
#order-standard_cart .secondary-cart-sidebar .panel {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    border: none !important;
    border-radius: 1.25rem !important;
    overflow: hidden !important;
    color: #cbd5e1 !important;
    box-shadow:
        inset -150px -100px 200px -80px rgba(59,130,246,0.12),
        inset 120px 100px 180px -60px rgba(134,16,67,0.10) !important;
}

#order-standard_cart .secondary-cart-sidebar .card-header,
#order-standard_cart .secondary-cart-sidebar .panel-heading {
    background: transparent !important;
    border-bottom: 1px solid rgba(255,255,255,0.06) !important;
}

#order-standard_cart .secondary-cart-sidebar .card-header h3,
#order-standard_cart .secondary-cart-sidebar .panel-heading h3 {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    color: #94a3b8 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
}

#order-standard_cart .secondary-cart-sidebar *,
#order-standard_cart .secondary-cart-sidebar .card-body,
#order-standard_cart .secondary-cart-sidebar .panel-body {
    color: #cbd5e1 !important;
}

#order-standard_cart .secondary-cart-sidebar .card-footer,
#order-standard_cart .secondary-cart-sidebar .panel-footer {
    background: transparent !important;
    border-top: 1px solid rgba(255,255,255,0.06) !important;
}

/* ================================================================
   PRODUCT CARDS
   Replaces the default Bootstrap product grid with Tailwind-inspired
   pricing cards matching the Flask site (templates/hosting/web.html).
   ================================================================ */

/* ── Reset parent theme defaults on .product elements ──────────── */
#order-standard_cart .hst-card.product {
    float: none !important;
    width: auto !important;
    border-bottom: none !important;
    margin-bottom: 0 !important;
    clear: none !important;
}

/* ── Store page header ─────────────────────────────────────────── */
#order-standard_cart .hst-store-header {
    margin-bottom: 2rem !important;
    padding-bottom: 1.5rem !important;
    border-bottom: 2px solid #e2e8f0 !important;
}

#order-standard_cart .hst-store-header h1 {
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 0 0.5rem 0 !important;
    line-height: 1.2 !important;
    letter-spacing: -0.025em !important;
}

#order-standard_cart .hst-store-tagline {
    font-size: 1.0625rem !important;
    color: #64748b !important;
    margin: 0 !important;
    line-height: 1.6 !important;
    max-width: 600px !important;
}

/* ── Products grid ─────────────────────────────────────────────── */
#order-standard_cart .hst-products-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 1.5rem !important;
    padding: 0.5rem 0 !important;
    float: none !important;
}

/* Remove the default .row / .row-eq-height children */
#order-standard_cart .hst-products-grid > .row {
    display: contents !important;
}

/* ── Card — base ───────────────────────────────────────────────── */
#order-standard_cart .hst-card {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1.5rem !important;
    padding: 2rem 1.5rem !important;
    box-shadow:
        0 4px 6px -1px rgba(0, 0, 0, 0.07),
        0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.3s ease !important;
    overflow: visible !important;
}

#order-standard_cart .hst-card:hover {
    box-shadow:
        0 20px 25px -5px rgba(0, 0, 0, 0.08),
        0 8px 10px -6px rgba(0, 0, 0, 0.04) !important;
    transform: translateY(-2px) !important;
}

/* ── Card — featured variant ───────────────────────────────────── */
#order-standard_cart .hst-card-featured {
    background: linear-gradient(to bottom, #eff6ff, #f0f9ff) !important;
    border: 2px solid #c7d2fe !important;
    box-shadow:
        0 10px 15px -3px rgba(2, 99, 224, 0.12),
        0 4px 6px -4px rgba(2, 99, 224, 0.08) !important;
    z-index: 1 !important;
    padding-top: 2.5rem !important;
}

#order-standard_cart .hst-card-featured:hover {
    box-shadow: 0 25px 50px -12px rgba(2, 99, 224, 0.2) !important;
}

/* ── "Most Popular" badge ──────────────────────────────────────── */
#order-standard_cart .hst-badge-popular {
    position: absolute !important;
    top: -0.875rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0.375rem 1.25rem !important;
    border-radius: 9999px !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 6px -1px rgba(2, 99, 224, 0.3) !important;
    line-height: 1.4 !important;
}

/* ── Card header ───────────────────────────────────────────────── */
#order-standard_cart .hst-card-head,
#order-standard_cart .hst-card.product header,
#order-standard_cart .cart-body .product header,
#order-standard_cart .cart-body .hst-card header.hst-card-head,
body #order-standard_cart .cart-body .products .product header {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-bottom: 0.75rem !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
    width: 100% !important;
}

#order-standard_cart .hst-card-head h3,
#order-standard_cart .cart-body .product header h3,
#order-standard_cart .cart-body .product header span,
body #order-standard_cart .cart-body .products .product header h3,
body #order-standard_cart .cart-body .products .product header span,
h3[id$="-name"] {
    font-size: 1.5rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    margin: 0 !important;
    line-height: 1.3 !important;
    letter-spacing: -0.02em !important;
    text-align: center !important;
    width: 100% !important;
}

#order-standard_cart .hst-card-featured .hst-card-head h3,
#order-standard_cart .hst-card-featured header h3,
#order-standard_cart .hst-card-featured header span {
    color: #1e3a5f !important;
}

#order-standard_cart .hst-stock-pill {
    display: inline-block !important;
    margin-top: 0.5rem !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    color: #16a34a !important;
    background: #f0fdf4 !important;
    padding: 0.125rem 0.625rem !important;
    border-radius: 9999px !important;
}

/* ── Pricing block ─────────────────────────────────────────────── */
#order-standard_cart .hst-card-price {
    text-align: center !important;
    padding: 1rem 0 1.25rem !important;
    margin-bottom: 1rem !important;
    border-bottom: 1px solid #f1f5f9 !important;
}

#order-standard_cart .hst-price-from {
    font-size: 0.8125rem !important;
    color: #64748b !important;
    font-weight: 500 !important;
    margin-bottom: 0.25rem !important;
}

#order-standard_cart .hst-price-amount {
    font-size: 2.5rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    line-height: 1.1 !important;
    letter-spacing: -0.025em !important;
}

#order-standard_cart .hst-card-featured .hst-price-amount {
    font-size: 2.75rem !important;
    color: #0150b5 !important;
}

#order-standard_cart .hst-price-cycle {
    font-size: 0.875rem !important;
    color: #64748b !important;
    font-weight: 500 !important;
    margin-top: 0.25rem !important;
}

#order-standard_cart .hst-price-setup {
    font-size: 0.75rem !important;
    color: #94a3b8 !important;
    margin-top: 0.375rem !important;
}

/* ── Description / inline feature list ──────────────────────────── *
 * The card is text-align:center so the inline-block <p> centres
 * as a unit, while text-align:left inside keeps lines aligned.    */
#order-standard_cart .hst-card-desc {
    display: inline-block !important;
    font-size: 0.8125rem !important;
    color: #334155 !important;
    line-height: 2.1 !important;
    text-align: left !important;
    margin-bottom: 1.25rem !important;
    padding: 0 !important;
    /* Card is flex-column; this wrapper centres the inline-block */
    align-self: center !important;
    flex-grow: 1 !important;
}

/* Style the > chevron icons inside featuresdesc */
#order-standard_cart .hst-card-desc > .fa-angle-right,
#order-standard_cart .hst-card-desc > i.fa {
    color: #0263e0 !important;
    font-size: 0.6875rem !important;
    margin-right: 0.375rem !important;
    width: 0.75rem !important;
    text-align: center !important;
    display: inline-block !important;
}

#order-standard_cart .hst-card-featured .hst-card-desc > .fa-angle-right,
#order-standard_cart .hst-card-featured .hst-card-desc > i.fa {
    color: #0150b5 !important;
}

/* ── CTA button ────────────────────────────────────────────────── */
#order-standard_cart .hst-card-action {
    margin-top: auto !important;
    padding-top: 0.5rem !important;
}

#order-standard_cart .hst-btn-order {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    width: 100% !important;
    padding: 0.5rem 1.25rem !important;
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    border: none !important;
    border-radius: 0.75rem !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
}

#order-standard_cart .hst-btn-order:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
    text-decoration: none !important;
}

#order-standard_cart .hst-btn-order:active {
    transform: translateY(0) !important;
}

#order-standard_cart .hst-btn-order i {
    font-size: 0.875rem !important;
    color: #ffffff !important;
}

/* ── Responsive — product cards ─────────────────────────────────── */
@media (max-width: 767px) {
    #order-standard_cart .hst-products-grid {
        grid-template-columns: 1fr !important;
        gap: 1.25rem !important;
    }

    #order-standard_cart .hst-card {
        padding: 1.5rem 1.25rem !important;
    }

    #order-standard_cart .hst-card-featured {
        padding-top: 2rem !important;
    }

    #order-standard_cart .hst-price-amount {
        font-size: 2rem !important;
    }

    #order-standard_cart .hst-card-featured .hst-price-amount {
        font-size: 2.25rem !important;
    }

    #order-standard_cart .hst-card-desc {
        font-size: 0.75rem !important;
        line-height: 2 !important;
    }

    #order-standard_cart .hst-btn-order {
        padding: 0.625rem 1rem !important;
        font-size: 0.875rem !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    #order-standard_cart .hst-products-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.25rem !important;
    }
}

/* ================================================================
   DOMAIN PAGES — Shared styles
   Covers domainregister.tpl, configureproductdomain.tpl,
   domaintransfer.tpl, and configuredomains.tpl.
   Transforms the bland Bootstrap WHMCS domain pages into a
   Tailwind-inspired design matching the Flask site.
   ================================================================ */

/* ── Page headings ────────────────────────────────────────────── */
#order-standard_cart .cart-body .header-lined {
    border-bottom: 2px solid #e2e8f0 !important;
    padding-bottom: 1.25rem !important;
    margin-bottom: 2rem !important;
}

#order-standard_cart .cart-body h1 {
    font-size: 2rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.025em !important;
    line-height: 1.2 !important;
}

#order-standard_cart .cart-body h2 {
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    letter-spacing: -0.02em !important;
}

#order-standard_cart .cart-body .sub-heading {
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    color: #1e293b !important;
    padding: 0.875rem 1.25rem !important;
    border-radius: 0.75rem !important;
    margin-bottom: 1.5rem !important;
    margin-top: 1.5rem !important;
}

#order-standard_cart .cart-body .sub-heading .primary-bg-color {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    padding: 0.25rem 0.75rem !important;
    border-radius: 0.5rem !important;
    font-size: 1rem !important;
}

/* ================================================================
   DOMAIN SEARCH — .hst-domain-search
   Custom layout using hst-* classes to avoid standard_cart
   .input-group-box overrides (background-color:#fff, position:absolute
   on #btnCheckAvailability, etc.)
   ================================================================ */

/* Intro paragraph above the search box */
#order-standard_cart .cart-body > p:first-of-type {
    font-size: 1.0625rem !important;
    color: #64748b !important;
    margin-bottom: 1.25rem !important;
    line-height: 1.6 !important;
}

/* ── Container — white card on light page ──────────────────────── */
.hst-domain-search {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 1rem;
    padding: 1.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05), 0 2px 4px -2px rgba(0,0,0,0.03);
}

/* ── Fields wrapper — vertical stack ─────────────────────────── */
.hst-search-fields {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* Simple mode — input + button side by side */
.hst-search-simple .hst-search-row {
    display: flex;
    gap: 0.75rem;
}

.hst-search-simple .hst-search-input {
    flex: 1;
}

.hst-search-simple .hst-search-btn {
    width: auto;
    flex-shrink: 0;
}

/* ── Textarea / text input ───────────────────────────────────── */
.hst-search-input {
    background: #ffffff;
    color: #0f172a;
    border: 1px solid #cbd5e1;
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    font-size: 0.9375rem;
    line-height: 1.5;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
    font-family: inherit;
}

textarea.hst-search-input {
    min-height: 4.5rem;
    resize: vertical;
}

.hst-search-input::placeholder {
    color: #94a3b8;
}

.hst-search-input:focus {
    outline: none;
    border-color: #0263e0;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15);
}

/* ── Search button ───────────────────────────────────────────── */
.hst-search-btn {
    background: linear-gradient(135deg, #0263e0, #3B82F6);
    color: #ffffff;
    border: none;
    border-radius: 0.75rem;
    padding: 0.5rem 1.25rem;
    font-weight: 600;
    font-size: 0.8125rem;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    text-shadow: none;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3);
    flex-shrink: 0;
}

.hst-search-btn:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb);
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4);
    transform: translateY(-1px);
    color: #ffffff;
}

/* ── Options row — TLD select + max-length + safe search + btn ─ */
.hst-search-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    align-items: center;
}

.hst-select-wrap {
    flex: 1;
    min-width: 120px;
}

/* ── Multiselect plugin buttons (added via JS after init) ────── */
.hst-ms-wrap {
    width: 100% !important;
    display: flex !important;
}

.hst-ms-btn,
.hst-ms-btn.btn,
.hst-ms-btn.btn.btn-default,
button.hst-ms-btn {
    background: #f8fafc !important;
    background-image: none !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.5rem !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    padding: 0.5rem 0.875rem !important;
    width: 100% !important;
    text-align: left !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: all 0.15s ease !important;
}

.hst-ms-btn:hover,
.hst-ms-btn.btn:hover,
button.hst-ms-btn:hover {
    background: #f1f5f9 !important;
    background-image: none !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

.hst-ms-btn .caret {
    color: #94a3b8 !important;
}

/* Raw select fallback */
.hst-select-wrap select {
    background: #f8fafc;
    color: #334155;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    font-size: 0.8125rem;
    padding: 0.5rem 0.875rem;
    width: 100%;
}

/* Multiselect dropdown popover */
.hst-domain-search .multiselect-container {
    border-radius: 0.5rem !important;
    border: 1px solid #e2e8f0 !important;
    box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1) !important;
    background: #ffffff !important;
    margin-top: 0.25rem !important;
}

.hst-domain-search .multiselect-container * {
    color: #334155 !important;
}

.hst-domain-search .multiselect-container label {
    color: #334155 !important;
    font-size: 0.8125rem !important;
    font-weight: 400 !important;
    padding: 0.375rem 0.75rem !important;
}

/* ── Safe Search checkbox ────────────────────────────────────── */
.hst-checkbox-label {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    color: #475569;
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
    white-space: nowrap;
}

.hst-checkbox-label .no-icheck {
    accent-color: #0263e0;
    width: 0.9375rem;
    height: 0.9375rem;
}

.hst-checkbox-label span {
    color: #475569;
}

/* ── Captcha inside search container ─────────────────────────── */
.hst-captcha {
    margin-top: 0.75rem;
    padding-top: 0.75rem;
    border-top: 1px solid #f1f5f9;
}

.hst-captcha-label {
    color: #64748b;
    font-size: 0.8125rem;
    margin-bottom: 0.5rem;
}

.hst-captcha-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.hst-captcha-input {
    background: #ffffff;
    color: #0f172a;
    border: 1px solid #cbd5e1;
    border-radius: 0.5rem;
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
    width: 120px;
}

.hst-captcha-input:focus {
    outline: none;
    border-color: #0263e0;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15);
}

/* ── Legacy .domain-checker-container ────────────────────────── *
 * Keep these for configureproductdomain.tpl which still uses
 * the old class names.                                           */
#order-standard_cart .domain-checker-container {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    border-radius: 1.25rem !important;
    padding: 2rem !important;
    margin-bottom: 2rem !important;
    box-shadow:
        0 20px 25px -5px rgba(0, 0, 0, 0.1),
        0 8px 10px -6px rgba(0, 0, 0, 0.1),
        inset -150px -100px 200px -80px rgba(59,130,246,0.08),
        inset 120px 100px 180px -60px rgba(134,16,67,0.06) !important;
}

#order-standard_cart .domain-checker-container * {
    color: #e2e8f0 !important;
}

#order-standard_cart .domain-checker-bg {
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
}

#order-standard_cart .domain-checker-container input[type="text"],
#order-standard_cart .domain-checker-container #inputDomain {
    background: rgba(255,255,255,0.95) !important;
    color: #0f172a !important;
    border: 1px solid rgba(255,255,255,0.2) !important;
    border-radius: 0.75rem !important;
    padding: 0.875rem 1.25rem !important;
    font-size: 1.0625rem !important;
}

#order-standard_cart .domain-checker-container input[type="text"]::placeholder,
#order-standard_cart .domain-checker-container #inputDomain::placeholder {
    color: #94a3b8 !important;
}

#order-standard_cart .domain-checker-container input[type="text"]:focus,
#order-standard_cart .domain-checker-container #inputDomain:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.3) !important;
    background: #ffffff !important;
    color: #0f172a !important;
}

#order-standard_cart .domain-checker-container .input-group-append > .btn,
#order-standard_cart .domain-checker-container .input-group-btn > .btn {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.75rem !important;
    padding: 0.5rem 1.25rem !important;
    font-weight: 600 !important;
    font-size: 0.8125rem !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
}

#order-standard_cart .domain-checker-container .input-group-append > .btn:hover,
#order-standard_cart .domain-checker-container .input-group-btn > .btn:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4) !important;
}

#order-standard_cart .domain-checker-container .input-group {
    border-radius: 0.75rem !important;
    overflow: visible !important;
}

/* ================================================================
   DOMAIN SEARCH RESULTS
   Shown after a domain search — available, unavailable, invalid
   ================================================================ */
#order-standard_cart .domain-lookup-result,
#order-standard_cart #primaryLookupResult {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    padding: 1.5rem !important;
    margin-bottom: 1rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart .domain-lookup-result *,
#order-standard_cart #primaryLookupResult * {
    color: #334155 !important;
}

/* Ensure button text stays white inside result containers */
#order-standard_cart .domain-lookup-result .btn-add-to-cart,
#order-standard_cart .domain-lookup-result .btn-add-to-cart *,
#order-standard_cart #primaryLookupResult .btn-add-to-cart,
#order-standard_cart #primaryLookupResult .btn-add-to-cart *,
#order-standard_cart .domain-suggestion .btn-add-to-cart,
#order-standard_cart .domain-suggestion .btn-add-to-cart *,
#order-standard_cart #domainSuggestions .btn-add-to-cart,
#order-standard_cart #domainSuggestions .btn-add-to-cart * {
    color: #ffffff !important;
}

/* Available domain — green accent */
#order-standard_cart .domain-checker-available .domain-lookup-result,
#order-standard_cart .domain-available {
    border-left: 4px solid #16a34a !important;
    background: linear-gradient(to right, #f0fdf4, #ffffff) !important;
}

#order-standard_cart .domain-checker-available .domain-lookup-result h4,
#order-standard_cart .domain-available .domain-name,
#order-standard_cart .domain-checker-result-headline.domain-checker-available {
    color: #16a34a !important;
    font-weight: 700 !important;
}

/* Unavailable domain — red accent */
#order-standard_cart .domain-checker-unavailable .domain-lookup-result,
#order-standard_cart .domain-unavailable {
    border-left: 4px solid #dc2626 !important;
    background: linear-gradient(to right, #fef2f2, #ffffff) !important;
}

#order-standard_cart .domain-checker-unavailable .domain-lookup-result h4,
#order-standard_cart .domain-unavailable .domain-name,
#order-standard_cart .domain-checker-result-headline.domain-checker-unavailable {
    color: #dc2626 !important;
    font-weight: 700 !important;
}

/* Invalid domain — amber accent */
#order-standard_cart .domain-checker-invalid .domain-lookup-result,
#order-standard_cart .domain-invalid {
    border-left: 4px solid #f59e0b !important;
    background: linear-gradient(to right, #fffbeb, #ffffff) !important;
}

/* TLD unavailable */
#order-standard_cart .domain-tld-unavailable {
    border-left: 4px solid #94a3b8 !important;
    background: #f8fafc !important;
}

/* Result headline text */
#order-standard_cart .domain-checker-result-headline {
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.5rem !important;
}

/* Primary suggestion heading */
#order-standard_cart .primary-domain-header {
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 1.5rem 0 1rem !important;
}

/* ================================================================
   SPOTLIGHT TLDs — Featured extension cards
   ================================================================ */
#order-standard_cart #spotlightTlds,
#order-standard_cart .spotlight-tlds-clearfix {
    margin: 1.5rem 0 !important;
}

#order-standard_cart .spotlight-tlds-container {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1rem !important;
    justify-content: center !important;
}

/* Individual spotlight TLD card */
#order-standard_cart [class*="spotlight-tld-container"] {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    padding: 1.25rem 1rem !important;
    text-align: center !important;
    flex: 1 1 auto !important;
    min-width: 140px !important;
    max-width: 200px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
    float: none !important;
    width: auto !important;
}

#order-standard_cart [class*="spotlight-tld-container"]:hover {
    border-color: #93c5fd !important;
    box-shadow: 0 10px 15px -3px rgba(2, 99, 224, 0.1) !important;
    transform: translateY(-2px) !important;
}

/* TLD extension name */
#order-standard_cart .spotlight-tld {
    font-size: 1.25rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    display: block !important;
    margin-bottom: 0.375rem !important;
}

/* TLD price */
#order-standard_cart [class*="spotlight-tld-container"] .domain-price,
#order-standard_cart [class*="spotlight-tld-container"] span:not(.spotlight-tld):not([class*="sales-group"]) {
    font-size: 0.875rem !important;
    color: #64748b !important;
    font-weight: 500 !important;
}

/* Sales group badges (hot/new/sale) */
#order-standard_cart .sales-group-hot,
#order-standard_cart .spotlight-tld-hot {
    background: linear-gradient(135deg, #dc2626, #ef4444) !important;
    color: #ffffff !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0.125rem 0.5rem !important;
    border-radius: 9999px !important;
    display: inline-block !important;
}

#order-standard_cart .sales-group-new,
#order-standard_cart .spotlight-tld-new {
    background: linear-gradient(135deg, #16a34a, #22c55e) !important;
    color: #ffffff !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0.125rem 0.5rem !important;
    border-radius: 9999px !important;
    display: inline-block !important;
}

#order-standard_cart .sales-group-sale,
#order-standard_cart .spotlight-tld-sale {
    background: linear-gradient(135deg, #f59e0b, #fbbf24) !important;
    color: #78350f !important;
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0.125rem 0.5rem !important;
    border-radius: 9999px !important;
    display: inline-block !important;
}

/* Add-to-cart button inside spotlight TLDs */
#order-standard_cart [class*="spotlight-tld-container"] .btn-add-to-cart,
#order-standard_cart [class*="spotlight-tld-container"] .btn {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.75rem !important;
    padding: 0.5rem 1.25rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
    margin-top: 0.75rem !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart [class*="spotlight-tld-container"] .btn-add-to-cart:hover,
#order-standard_cart [class*="spotlight-tld-container"] .btn:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 10px rgba(2, 99, 224, 0.3) !important;
}

/* ================================================================
   SUGGESTED DOMAINS — suggestion list after search
   ================================================================ */
#order-standard_cart .suggested-domains {
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
    margin-bottom: 2rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

#order-standard_cart .suggested-domains .panel-heading,
#order-standard_cart .suggested-domains .card-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 1rem 1.25rem !important;
}

#order-standard_cart .suggested-domains .panel-heading h3,
#order-standard_cart .suggested-domains .card-header h3,
#order-standard_cart .suggested-domains .panel-title,
#order-standard_cart .suggested-domains .card-title {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    text-transform: none !important;
    letter-spacing: normal !important;
}

/* Strip card styling from #domainSuggestions — it's already inside .suggested-domains */
#order-standard_cart .suggested-domains #domainSuggestions,
#order-standard_cart .suggested-domains .domain-lookup-result {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
}

/* Individual suggestion item */
#order-standard_cart .domain-suggestion:not(.w-hidden),
#order-standard_cart #domainSuggestions .list-group-item:not(.w-hidden) {
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1px solid #f1f5f9 !important;
    border-radius: 0 !important;
    padding: 0.75rem 1.25rem !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    transition: background 0.15s ease !important;
    color: #334155 !important;
}

/* Domain name spans — stay inline, shrink if needed */
#order-standard_cart .domain-suggestion .domain,
#order-standard_cart .domain-suggestion .extension {
    display: inline !important;
    flex-shrink: 1 !important;
}

#order-standard_cart .domain-suggestion:last-child,
#order-standard_cart #domainSuggestions .list-group-item:last-child {
    border-bottom: none !important;
}

#order-standard_cart .domain-suggestion:hover,
#order-standard_cart #domainSuggestions .list-group-item:hover {
    background: #f8fafc !important;
}

/* Actions wrapper — price + button aligned center on same row */
#order-standard_cart .domain-suggestion .actions,
#order-standard_cart #domainSuggestions .list-group-item .actions {
    display: flex !important;
    align-items: center !important;
    gap: 1rem !important;
    flex-shrink: 0 !important;
    margin-left: auto !important;
}

#order-standard_cart .domain-suggestion .actions .price,
#order-standard_cart #domainSuggestions .list-group-item .actions .price {
    white-space: nowrap !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    color: #334155 !important;
}

#order-standard_cart .domain-suggestion .domain-name,
#order-standard_cart #domainSuggestions .list-group-item strong {
    font-weight: 700 !important;
    color: #0f172a !important;
    font-size: 0.9375rem !important;
}

/* All add-to-cart buttons — 12px radius matching Flask frontend */
#order-standard_cart .btn-add-to-cart {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.75rem !important;
    padding: 0.5rem 1.25rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}

#order-standard_cart .btn-add-to-cart:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
}

/* Added to cart state */
#order-standard_cart .btn-add-to-cart .added,
#order-standard_cart .btn-add-to-cart.added {
    background: linear-gradient(135deg, #16a34a, #22c55e) !important;
    box-shadow: 0 2px 8px rgba(22, 163, 74, 0.3) !important;
}

/* ================================================================
   DOMAIN PRICING TABLE — TLD rows on domainregister.tpl
   ================================================================ */
#order-standard_cart .tld-row {
    border: none !important;
    border-bottom: 1px solid #f1f5f9 !important;
    padding: 0.75rem 0 !important;
    transition: background 0.15s ease !important;
    border-radius: 0 !important;
    margin: 0 !important;
}

#order-standard_cart .tld-row:hover {
    background: #f8fafc !important;
}

#order-standard_cart .tld-row:last-child {
    border-bottom: none !important;
}

/* TLD name column */
#order-standard_cart .tld-row .tld-name,
#order-standard_cart .tld-row > div:first-child {
    font-weight: 700 !important;
    color: #0f172a !important;
    font-size: 0.9375rem !important;
}

/* Price columns */
#order-standard_cart .tld-row .tld-price,
#order-standard_cart .tld-row .domain-price {
    font-weight: 600 !important;
    color: #334155 !important;
    font-size: 0.875rem !important;
}

/* Sale group badges in pricing table */
#order-standard_cart .tld-sale-group {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
}

/* TLD pricing table wrapper */
#order-standard_cart .cart-body > .row.no-gutters:not(.tld-row) {
    background: #f8fafc !important;
    border-radius: 0.75rem 0.75rem 0 0 !important;
    font-weight: 700 !important;
    color: #64748b !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

/* ================================================================
   DOMAIN PROMO BOXES — e.g. "Shared Hosting" / "Transfer" cards
   ================================================================ */
#order-standard_cart .domain-promo-box,
#order-standard_cart .cart-body .panel:not(.panel-addon) {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    transition: all 0.25s ease !important;
    margin-bottom: 1.5rem !important;
}

#order-standard_cart .domain-promo-box:hover,
#order-standard_cart .cart-body .panel:not(.panel-addon):hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08) !important;
    transform: translateY(-1px) !important;
}

#order-standard_cart .cart-body .panel-heading:not(.panel-addon .panel-heading),
#order-standard_cart .cart-body .card-header:not(.panel-addon .card-header) {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 1rem 1.25rem !important;
}

#order-standard_cart .cart-body .panel-heading h3,
#order-standard_cart .cart-body .card-header h3,
#order-standard_cart .cart-body .panel-title:not(.panel-addon .panel-title),
#order-standard_cart .cart-body .card-title:not(.panel-addon .card-title) {
    font-size: 1.125rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    letter-spacing: -0.01em !important;
}

#order-standard_cart .cart-body .panel-body:not(.panel-addon .panel-body),
#order-standard_cart .cart-body .card-body:not(.panel-addon .card-body) {
    padding: 1.25rem !important;
    color: #475569 !important;
    font-size: 0.875rem !important;
    line-height: 1.6 !important;
}

#order-standard_cart .cart-body .panel-footer:not(.panel-addon .panel-footer),
#order-standard_cart .cart-body .card-footer:not(.panel-addon .card-footer) {
    background: #f8fafc !important;
    border-top: 1px solid #e2e8f0 !important;
    padding: 1rem 1.25rem !important;
}

/* ================================================================
   MOBILE COLLAPSED SIDEBAR — light, clean card style

   Specificity note: cart-body rules use :not(.panel-addon .X) which
   adds (0,2,0) from the compound selector argument, giving them
   specificity (1,4,0).  To beat that, we double the .sidebar-collapsed
   class → .sidebar-collapsed.sidebar-collapsed adds (0,2,0) instead
   of (0,1,0), pushing our rules to (1,5,0).
   ================================================================ */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1.25rem !important;
    padding: 1.25rem 1.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 1.25rem !important;
    position: relative !important;
    overflow: hidden !important;
    color: #1e293b !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.07),
                0 2px 4px -2px rgba(0, 0, 0, 0.05) !important;
}

/* Strip ALL card chrome inside collapsed sidebar */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel.panel-default,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card.panel-default,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-sidebar,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-body,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-body,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-header,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-heading,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-footer,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-footer,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .collapsable-card-body,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 0 !important;
    transform: none !important;
}

/* Ensure collapsed content is visible (no hidden panels) */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed * {
    visibility: visible !important;
    color: #334155 !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .collapsable-card-body,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-body,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-body {
    display: block !important;
    opacity: 1 !important;
    height: auto !important;
    overflow: visible !important;
    max-height: none !important;
    color: #334155 !important;
    padding: 0.375rem 0.75rem 0.75rem !important;
}

/* Section headers */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-header,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-heading {
    background: transparent !important;
    background-color: transparent !important;
    border-bottom: none !important;
    padding: 0.5rem 0.75rem !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-header h3,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-heading h3,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-title,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-title {
    font-size: 0.6875rem !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.06em !important;
    margin: 0 !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card-header i,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel-heading i {
    color: #64748b !important;
    font-size: 0.75rem !important;
}

/* Divider between panels */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card + .card,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel + .panel {
    margin-top: 0.25rem !important;
    padding-top: 0.75rem !important;
    border-top: 1px solid #e2e8f0 !important;
}

/* Select dropdowns — light style with standard border */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed select,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed select.form-control {
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.5rem !important;
    font-size: 0.875rem !important;
    padding: 0.5rem 0.75rem !important;
    color: #1e293b !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed select option {
    color: #1e293b !important;
    background: #ffffff !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed select:focus,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed select.form-control:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15) !important;
}

/* List-group items — links like "Register a Domain", "View Cart", etc. */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item a,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed a.list-group-item {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-radius: 0.5rem !important;
    padding: 0.5rem 0.75rem !important;
    margin: 0.0625rem 0 !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #334155 !important;
    text-decoration: none !important;
    transition: all 0.15s ease !important;
    box-shadow: none !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item:hover,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed a.list-group-item:hover {
    background: #f1f5f9 !important;
    color: #0f172a !important;
    text-decoration: none !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item.active,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed a.list-group-item.active {
    background: #eff6ff !important;
    color: #0263e0 !important;
    font-weight: 600 !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item i {
    color: #94a3b8 !important;
    margin-right: 0.5rem !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .list-group-item:hover i {
    color: #0263e0 !important;
}

/* Generic anchor tags inside collapsed sidebar */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed a {
    color: #334155 !important;
    text-decoration: none !important;
}

#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed a:hover {
    color: #0263e0 !important;
}

/* Collapsed sidebar hover — no lift effect */
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .panel:hover,
#order-standard_cart .cart-body .sidebar-collapsed.sidebar-collapsed .card:hover {
    box-shadow: none !important;
    transform: none !important;
}

/* ================================================================
   CONFIGURE PRODUCT DOMAIN — "Choose a Domain..." page
   Radio option blocks and domain inputs
   ================================================================ */
#order-standard_cart .domain-selection-options {
    margin: 1.5rem 0 !important;
}

#order-standard_cart .domain-selection-options .option {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 0.75rem !important;
    padding: 1.25rem !important;
    margin-bottom: 0.75rem !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

#order-standard_cart .domain-selection-options .option:hover {
    border-color: #93c5fd !important;
    background: #fafafe !important;
}

/* Selected option — two rules handle initial load vs post-interaction:
   1) Before any click, no .option-selected exists yet, so fall back to
      :has(input:checked) which matches the HTML-default checked radio.
   2) After interaction, WHMCS JS adds .option-selected to the active
      option. Once that class exists anywhere in the container, rule 1
      stops matching (via :not(:has(…))) and rule 2 takes over.           */
#order-standard_cart .domain-selection-options:not(:has(.option-selected)) .option:has(input:checked),
#order-standard_cart .domain-selection-options .option.option-selected {
    border-color: #0263e0 !important;
    background: linear-gradient(to right, #eff6ff, #ffffff) !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.1) !important;
}

/* Radio button styling */
#order-standard_cart .domain-selection-options input[type="radio"] {
    accent-color: #0263e0 !important;
    width: 1.125rem !important;
    height: 1.125rem !important;
    margin-right: 0.75rem !important;
}

/* Option label text */
#order-standard_cart .domain-selection-options label {
    font-weight: 600 !important;
    color: #1e293b !important;
    font-size: 0.9375rem !important;
    cursor: pointer !important;
}

/* Domain input group inside options */
#order-standard_cart .domain-input-group {
    margin-top: 0.75rem !important;
}

/* ── Textarea & inputs — white bg, clean borders ────────────── */
#order-standard_cart .domain-input-group textarea,
#order-standard_cart .domain-selection-options textarea {
    background: #ffffff !important;
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.625rem 1rem !important;
    font-size: 0.9375rem !important;
    color: #0f172a !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

#order-standard_cart .domain-input-group .form-control,
#order-standard_cart .domain-selection-options input[type="text"],
#order-standard_cart .domain-selection-options select {
    background: #ffffff !important;
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.625rem 1rem !important;
    font-size: 0.9375rem !important;
    color: #0f172a !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

#order-standard_cart .domain-input-group .form-control:focus,
#order-standard_cart .domain-input-group textarea:focus,
#order-standard_cart .domain-selection-options textarea:focus,
#order-standard_cart .domain-selection-options input[type="text"]:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15) !important;
    background: #ffffff !important;
}

/* Multiselect dropdown buttons */
#order-standard_cart .domain-selection-options .multiselect,
#order-standard_cart .domain-input-group .multiselect,
#order-standard_cart .domain-selection-options .multiselect-filter {
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.5rem !important;
    color: #334155 !important;
    font-size: 0.875rem !important;
}

/* ── Spacing between textarea row and filter row ─────────────── */
#order-standard_cart .domain-input-group > .row + .row {
    margin-top: 0.5rem !important;
}

/* ── Push filter buttons right + space them evenly ───────────── *
 * Target the actual visible elements (btn-group, label) directly
 * instead of manipulating the .row/.domains-row container.
 * :first-of-type matches the first <div> (= first .btn-group).
 * ~ (general sibling) skips the hidden <select> elements between
 * the .btn-group divs.                                            */
#domainregister .btn-group:first-of-type {
    margin-left: 1rem !important;
}
#domainregister .btn-group ~ .btn-group {
    margin-left: 0.75rem !important;
}
#domainregister .btn-group ~ label {
    margin-left: 0.75rem !important;
}

/* Domain search results inside product config */
#order-standard_cart #DomainSearchResults {
    margin-top: 1.5rem !important;
}

/* IDN language selector */
#order-standard_cart #idnLanguageSelector select {
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.5rem 0.75rem !important;
    font-size: 0.875rem !important;
}

/* ================================================================
   DOMAIN TRANSFER — domaintransfer.tpl
   Transfer form panel
   ================================================================ */
#order-standard_cart .cart-body .panel.panel-default,
#order-standard_cart .cart-body .card.panel-default {
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
}

/* Transfer form inputs */
#order-standard_cart .cart-body #inputTransferDomain,
#order-standard_cart .cart-body #inputAuthCode {
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.75rem 1rem !important;
    font-size: 1rem !important;
    color: #0f172a !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

#order-standard_cart .cart-body #inputTransferDomain:focus,
#order-standard_cart .cart-body #inputAuthCode:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15) !important;
}

/* Transfer button */
#order-standard_cart #btnTransferDomain,
#order-standard_cart .btn-transfer {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.75rem !important;
    padding: 0.5rem 1.25rem !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart #btnTransferDomain:hover,
#order-standard_cart .btn-transfer:hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4) !important;
    transform: translateY(-1px) !important;
}

/* Transfer unavailable alert */
#order-standard_cart #transferUnavailable {
    border-radius: 0.75rem !important;
    border-left: 4px solid #f59e0b !important;
    background: #fffbeb !important;
    color: #92400e !important;
    padding: 0.875rem 1.25rem !important;
}

/* Prepend icon field */
#order-standard_cart .cart-body .prepend-icon .field-icon {
    color: #64748b !important;
}

/* ================================================================
   CONFIGURE DOMAINS — configuredomains.tpl
   Addon panels and nameserver inputs
   ================================================================ */

/* Addon products container */
#order-standard_cart .addon-products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 1rem !important;
    margin-bottom: 2rem !important;
}

#order-standard_cart .addon-products > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    padding: 0 !important;
}

/* Individual addon panel */
#order-standard_cart .panel-addon {
    background: #ffffff !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
    transition: all 0.25s ease !important;
    cursor: pointer !important;
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}

#order-standard_cart .panel-addon:hover {
    border-color: #93c5fd !important;
    box-shadow: 0 10px 15px -3px rgba(2, 99, 224, 0.1) !important;
}

/* Selected addon */
#order-standard_cart .panel-addon.panel-addon-selected,
#order-standard_cart .panel-addon-selected {
    border-color: #0263e0 !important;
    background: linear-gradient(to bottom, #eff6ff, #ffffff) !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.1) !important;
}

/* Addon panel body */
#order-standard_cart .panel-addon .panel-body {
    padding: 1.25rem !important;
    flex-grow: 1 !important;
}

#order-standard_cart .panel-addon .panel-body label {
    font-weight: 700 !important;
    color: #0f172a !important;
    font-size: 0.9375rem !important;
    display: block !important;
    margin-bottom: 0.5rem !important;
}

#order-standard_cart .panel-addon .panel-body p,
#order-standard_cart .panel-addon .panel-body span {
    font-size: 0.8125rem !important;
    color: #64748b !important;
    line-height: 1.5 !important;
}

/* Addon checkbox */
#order-standard_cart .panel-addon input[type="checkbox"] {
    accent-color: #0263e0 !important;
    width: 1.125rem !important;
    height: 1.125rem !important;
    margin-right: 0.5rem !important;
}

/* Addon price section */
#order-standard_cart .panel-addon .panel-price {
    background: #f8fafc !important;
    padding: 0.75rem 1.25rem !important;
    text-align: center !important;
    font-weight: 800 !important;
    font-size: 1.125rem !important;
    color: #0150b5 !important;
    border-top: 1px solid #e2e8f0 !important;
}

#order-standard_cart .panel-addon-selected .panel-price {
    background: #eff6ff !important;
    color: #0150b5 !important;
}

/* Addon add section */
#order-standard_cart .panel-addon .panel-add {
    padding: 0.75rem 1.25rem !important;
    text-align: center !important;
    background: #f8fafc !important;
}

/* Nameserver inputs */
#order-standard_cart .cart-body input[id^="inputNs"] {
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.625rem 1rem !important;
    font-size: 0.875rem !important;
    color: #0f172a !important;
    font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

#order-standard_cart .cart-body input[id^="inputNs"]:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15) !important;
}

/* EPP code input on configure page */
#order-standard_cart .cart-body input[id^="inputEppcode"] {
    border-radius: 0.5rem !important;
    border: 1px solid #cbd5e1 !important;
    padding: 0.625rem 1rem !important;
    font-size: 0.875rem !important;
    color: #0f172a !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

#order-standard_cart .cart-body input[id^="inputEppcode"]:focus {
    border-color: #0263e0 !important;
    box-shadow: 0 0 0 3px rgba(2, 99, 224, 0.15) !important;
}

/* ================================================================
   SHARED — Alerts, loaders, form controls, buttons on domain pages
   ================================================================ */

/* Alerts */
#order-standard_cart .cart-body .alert {
    border-radius: 0.75rem !important;
    border: none !important;
    padding: 1rem 1.25rem !important;
    font-size: 0.875rem !important;
}

#order-standard_cart .cart-body .alert-info {
    background: #eff6ff !important;
    color: #1e40af !important;
    border-left: 4px solid #3b82f6 !important;
}

#order-standard_cart .cart-body .alert-warning {
    background: #fffbeb !important;
    color: #92400e !important;
    border-left: 4px solid #f59e0b !important;
}

#order-standard_cart .cart-body .alert-danger {
    background: #fef2f2 !important;
    color: #991b1b !important;
    border-left: 4px solid #dc2626 !important;
}

#order-standard_cart .cart-body .alert-success {
    background: #f0fdf4 !important;
    color: #166534 !important;
    border-left: 4px solid #16a34a !important;
}

/* Loading spinners — give them the indigo colour */
#order-standard_cart .domain-lookup-loader i,
#order-standard_cart .domain-lookup-loader .fa-spinner,
#order-standard_cart #addTransferLoader i {
    color: #0263e0 !important;
}

/* General cart-body buttons (Continue, Update, Submit) */
#order-standard_cart .cart-body .btn-primary:not(.cart-sidebar .btn-primary) {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0.75rem !important;
    padding: 0.625rem 1.5rem !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    text-shadow: none !important;
    box-shadow: 0 2px 8px rgba(2, 99, 224, 0.3) !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart .cart-body .btn-primary:not(.cart-sidebar .btn-primary):hover {
    background: linear-gradient(135deg, #0150b5, #2563eb) !important;
    box-shadow: 0 4px 14px rgba(2, 99, 224, 0.4) !important;
    transform: translateY(-1px) !important;
    color: #ffffff !important;
}

/* Secondary/default buttons in cart-body */
#order-standard_cart .cart-body .btn-default:not(.cart-sidebar .btn-default) {
    background: #ffffff !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 0.75rem !important;
    padding: 0.75rem 1.75rem !important;
    font-weight: 600 !important;
    font-size: 0.9375rem !important;
    text-shadow: none !important;
    box-shadow: none !important;
    transition: all 0.2s ease !important;
}

#order-standard_cart .cart-body .btn-default:not(.cart-sidebar .btn-default):hover {
    background: #f8fafc !important;
    border-color: #94a3b8 !important;
    color: #1e293b !important;
}

/* Captcha container */
#order-standard_cart #captchaContainer {
    margin-top: 1rem !important;
    padding: 1rem !important;
    background: #f8fafc !important;
    border-radius: 0.75rem !important;
    border: 1px solid #e2e8f0 !important;
}

/* Form group labels (generic) */
#order-standard_cart .cart-body .form-group label {
    font-weight: 600 !important;
    color: #334155 !important;
    font-size: 0.875rem !important;
    margin-bottom: 0.375rem !important;
}

/* Help text */
#order-standard_cart .cart-body .field-help-text,
#order-standard_cart .cart-body .help-block {
    font-size: 0.8125rem !important;
    color: #94a3b8 !important;
    margin-top: 0.25rem !important;
}

/* ================================================================
   TLD CATEGORY FILTERS — pill buttons for "Browse Extensions"
   ================================================================ */
#order-standard_cart .tld-filters {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.5rem !important;
    margin-bottom: 1.5rem !important;
}

#order-standard_cart .tld-filters a.badge {
    display: inline-block !important;
    background: #f1f5f9 !important;
    color: #475569 !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    padding: 0.5rem 1.125rem !important;
    border-radius: 9999px !important;
    border: 1px solid #e2e8f0 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    text-transform: capitalize !important;
    letter-spacing: 0.01em !important;
}

#order-standard_cart .tld-filters a.badge:hover {
    background: #eff6ff !important;
    color: #0263e0 !important;
    border-color: #93c5fd !important;
}

#order-standard_cart .tld-filters a.badge.active,
#order-standard_cart .tld-filters a.badge-primary {
    background: linear-gradient(135deg, #0263e0, #3B82F6) !important;
    color: #ffffff !important;
    border-color: #0263e0 !important;
    box-shadow: 0 2px 8px rgba(79, 70, 229, 0.25) !important;
}

/* ================================================================
   TLD PRICING TABLE — container + header + rows
   ================================================================ */

/* Wrapper — rounded card with border */
#order-standard_cart .domain-pricing .bg-white {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}

/* Header row */
#order-standard_cart .tld-pricing-header {
    background: #f8fafc !important;
    border-radius: 1rem 1rem 0 0 !important;
    font-weight: 700 !important;
    color: #64748b !important;
    font-size: 0.75rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    padding: 0.875rem 0 !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

#order-standard_cart .tld-pricing-header .tld-column,
#order-standard_cart .tld-pricing-header .col-xs-4,
#order-standard_cart .tld-pricing-header .col-4,
#order-standard_cart .tld-pricing-header div {
    color: #64748b !important;
}

/* Individual TLD rows — better padding + alternating stripe */
#order-standard_cart .domain-pricing .tld-row {
    padding: 0.875rem 0 !important;
    align-items: center !important;
    border-bottom: 1px solid #f1f5f9 !important;
    transition: background-color 0.15s ease !important;
}

#order-standard_cart .domain-pricing .tld-row:nth-child(even) {
    background: #f8fafc !important;
}

#order-standard_cart .domain-pricing .tld-row:hover {
    background: #eff6ff !important;
}

/* TLD name */
#order-standard_cart .domain-pricing .tld-row strong {
    color: #0f172a !important;
    font-size: 0.9375rem !important;
}

/* Price cells — ensure consistent alignment */
#order-standard_cart .domain-pricing .tld-row small {
    color: #94a3b8 !important;
    font-size: 0.75rem !important;
}

/* Price amounts */
#order-standard_cart .domain-pricing .tld-row .col-xs-4,
#order-standard_cart .domain-pricing .tld-row .col-4 {
    color: #334155 !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
}

/* ================================================================
   FEATURED TLDs — logo + price cards
   ================================================================ */
#order-standard_cart .featured-tlds-container {
    margin-bottom: 2rem !important;
}

#order-standard_cart .featured-tld {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 1rem !important;
    padding: 1.5rem 1rem !important;
    text-align: center !important;
    margin-bottom: 1.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
    transition: all 0.25s ease !important;
}

#order-standard_cart .featured-tld:hover {
    border-color: #93c5fd !important;
    box-shadow: 0 10px 15px -3px rgba(2, 99, 224, 0.1) !important;
    transform: translateY(-2px) !important;
}

#order-standard_cart .featured-tld .img-container {
    margin-bottom: 0.75rem !important;
}

#order-standard_cart .featured-tld .img-container img {
    max-height: 48px !important;
    width: auto !important;
}

#order-standard_cart .featured-tld .price {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #334155 !important;
}

/* ================================================================
   DOMAIN PRICING — section heading
   ================================================================ */
#order-standard_cart .domain-pricing {
    margin-top: 1.5rem !important;
    margin-bottom: 2rem !important;
    padding-top: 1.5rem !important;
    border-top: 1px solid #e2e8f0 !important;
}

#order-standard_cart .domain-pricing h4 {
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin-bottom: 1.25rem !important;
    letter-spacing: -0.02em !important;
}

/* (Advanced search now uses hst-* classes — see above) */

/* (Promo boxes removed from template — CSS removed) */

/* "No TLDs" message row */
#order-standard_cart .tld-row.no-tlds {
    color: #64748b !important;
    font-size: 0.875rem !important;
    border-bottom: none !important;
}

/* Domain suggestions warning text */
#order-standard_cart .domain-suggestions-warning {
    margin-top: 0.75rem !important;
}

#order-standard_cart .domain-suggestions-warning p {
    color: #94a3b8 !important;
    font-size: 0.8125rem !important;
}

/* ================================================================
   PAGE INTRO — clean heading + subtitle above domain search
   ================================================================ */
.hst-page-intro {
    margin-bottom: 1.5rem;
}

.hst-page-intro h1 {
    font-size: 1.75rem !important;
    font-weight: 800 !important;
    color: #0f172a !important;
    letter-spacing: -0.025em !important;
    margin: 0 0 0.375rem !important;
    line-height: 1.2 !important;
}

.hst-page-intro p {
    font-size: 1rem !important;
    color: #64748b !important;
    margin: 0 !important;
    line-height: 1.6 !important;
}

/* ================================================================
   DOMAIN PAGES — Responsive overrides
   ================================================================ */

/* ── Tablet (768–991px) — sidebar collapsed but more room ──────── */
@media (min-width: 768px) and (max-width: 991px) {
    /* Suggestion rows — keep inline on tablet */
    #order-standard_cart .domain-suggestion .actions {
        flex-shrink: 0 !important;
    }
}

/* ── Mobile (< 768px) ─────────────────────────────────────────── */
@media (max-width: 767px) {

    /* --- Store header compact on mobile --- */
    #order-standard_cart .hst-store-header {
        margin-bottom: 1.25rem !important;
        padding-bottom: 1rem !important;
    }

    #order-standard_cart .hst-store-header h1 {
        font-size: 1.5rem !important;
    }

    #order-standard_cart .hst-store-tagline {
        font-size: 0.875rem !important;
    }

    /* --- Page intro heading ------------------------------------ */
    .hst-page-intro {
        margin-bottom: 1rem;
    }

    .hst-page-intro h1 {
        font-size: 1.375rem !important;
    }

    .hst-page-intro p {
        font-size: 0.875rem !important;
    }

    /* --- Domain search container ------------------------------- */
    .hst-domain-search {
        padding: 1rem;
        border-radius: 0.75rem;
    }

    .hst-search-simple .hst-search-row {
        flex-direction: column;
    }

    .hst-search-options {
        flex-direction: column;
        align-items: stretch;
    }

    .hst-search-btn {
        width: 100%;
        padding: 0.75rem 1rem;
        font-size: 0.9375rem;
    }

    textarea.hst-search-input {
        min-height: 3.5rem;
        font-size: 0.875rem;
    }

    .hst-select-wrap {
        min-width: 0;
    }

    .hst-checkbox-label {
        padding: 0.25rem 0;
    }

    /* --- Captcha --- */
    .hst-captcha {
        margin-top: 0.5rem;
        padding-top: 0.5rem;
    }

    .hst-captcha-row {
        flex-wrap: wrap;
    }

    /* --- Search results / primary lookup ----------------------- */
    #order-standard_cart .domain-lookup-result,
    #order-standard_cart #primaryLookupResult {
        padding: 1rem !important;
        border-radius: 0.75rem !important;
    }

    #order-standard_cart .primary-domain-header {
        font-size: 1rem !important;
        margin: 1rem 0 0.75rem !important;
    }

    #order-standard_cart .domain-checker-result-headline {
        font-size: 1rem !important;
    }

    /* Price + button row inside primary result — stack on narrow */
    #order-standard_cart #primaryLookupResult .domain-price,
    #order-standard_cart #searchDomainInfo .domain-price {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.5rem !important;
    }

    #order-standard_cart #primaryLookupResult .domain-price .price,
    #order-standard_cart #searchDomainInfo .domain-price .price {
        text-align: center !important;
    }

    #order-standard_cart #primaryLookupResult .domain-price .btn-add-to-cart,
    #order-standard_cart #searchDomainInfo .domain-price .btn-add-to-cart {
        width: 100% !important;
    }

    /* --- Spotlight TLDs ---------------------------------------- */
    #order-standard_cart .spotlight-tlds-container {
        flex-direction: column !important;
    }

    #order-standard_cart [class*="spotlight-tld-container"] {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* --- Suggested domains — stack on mobile ------------------- */
    #order-standard_cart .domain-suggestion:not(.w-hidden),
    #order-standard_cart #domainSuggestions .list-group-item:not(.w-hidden) {
        flex-wrap: wrap !important;
        gap: 0.375rem !important;
        padding: 0.625rem 1rem !important;
    }

    /* Domain name takes full width */
    #order-standard_cart .domain-suggestion .domain,
    #order-standard_cart .domain-suggestion .extension {
        font-size: 0.875rem !important;
    }

    /* Promo badges */
    #order-standard_cart .domain-suggestion .promo {
        flex-basis: auto !important;
    }

    /* Actions (price + button) — full width row below name */
    #order-standard_cart .domain-suggestion .actions,
    #order-standard_cart #domainSuggestions .list-group-item .actions {
        width: 100% !important;
        justify-content: space-between !important;
        gap: 0.5rem !important;
        margin-left: 0 !important;
        padding-top: 0.25rem !important;
    }

    #order-standard_cart .domain-suggestion .actions .btn-add-to-cart {
        padding: 0.375rem 1rem !important;
        font-size: 0.75rem !important;
    }

    /* --- Addon products ---------------------------------------- */
    #order-standard_cart .addon-products {
        grid-template-columns: 1fr !important;
    }

    /* --- Domain selection options ------------------------------- */
    #order-standard_cart .domain-selection-options .option {
        padding: 1rem !important;
    }

    /* --- Headings ---------------------------------------------- */
    #order-standard_cart .cart-body h1 {
        font-size: 1.5rem !important;
    }

    #order-standard_cart .cart-body h2 {
        font-size: 1.25rem !important;
    }

    /* --- Domain pricing section -------------------------------- */
    #order-standard_cart .domain-pricing {
        margin-top: 1rem !important;
        padding-top: 1rem !important;
    }

    #order-standard_cart .domain-pricing .bg-white {
        border-radius: 0.75rem !important;
    }

    #order-standard_cart .domain-pricing h4 {
        font-size: 1.125rem !important;
    }

    /* TLD pricing header — reduce text */
    #order-standard_cart .tld-pricing-header {
        font-size: 0.625rem !important;
        padding: 0.625rem 0 !important;
    }

    /* TLD rows — tighter on mobile */
    #order-standard_cart .domain-pricing .tld-row {
        padding: 0.5rem 0 !important;
    }

    #order-standard_cart .domain-pricing .tld-row strong {
        font-size: 0.8125rem !important;
    }

    #order-standard_cart .domain-pricing .tld-row .col-xs-4,
    #order-standard_cart .domain-pricing .tld-row .col-4 {
        font-size: 0.75rem !important;
    }

    #order-standard_cart .domain-pricing .tld-row small {
        font-size: 0.625rem !important;
    }

    /* TLD name column — reduce left padding */
    #order-standard_cart .tld-row .two-row-center {
        padding-left: 0.75rem !important;
        padding-right: 0.25rem !important;
    }

    /* TLD filter pills — scrollable row on mobile */
    #order-standard_cart .tld-filters {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        padding-bottom: 0.5rem !important;
        margin-bottom: 1rem !important;
        scrollbar-width: none !important;
    }

    #order-standard_cart .tld-filters::-webkit-scrollbar {
        display: none !important;
    }

    #order-standard_cart .tld-filters a.badge {
        flex-shrink: 0 !important;
        font-size: 0.75rem !important;
        padding: 0.375rem 0.875rem !important;
    }

    /* Featured TLDs — 2 columns on mobile */
    #order-standard_cart .featured-tlds-container .row {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    #order-standard_cart .featured-tlds-container [class*="col-"] {
        flex: 0 0 50% !important;
        max-width: 50% !important;
    }

    #order-standard_cart .featured-tld {
        padding: 1rem 0.75rem !important;
        margin-bottom: 1rem !important;
    }

    /* --- Cart body general ------------------------------------- */
    #order-standard_cart .cart-body {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* --- More suggestions / footer links ----------------------- */
    #order-standard_cart .suggested-domains .panel-footer,
    #order-standard_cart .suggested-domains .card-footer {
        padding: 0.75rem !important;
    }

    #order-standard_cart .domain-suggestions-warning p {
        font-size: 0.75rem !important;
    }

    /* --- Domain checker container (legacy) --------------------- */
    #order-standard_cart .domain-checker-container {
        padding: 1.25rem !important;
        border-radius: 1rem !important;
    }

    /* --- Transfer form ----------------------------------------- */
    #order-standard_cart .cart-body .panel.panel-default,
    #order-standard_cart .cart-body .card.panel-default {
        border-radius: 0.75rem !important;
    }
}

/* ── Breathing room on mobile — subtle side padding ──────────── */
@media (max-width: 991px) {
    #order-standard_cart {
        padding-left: 6px !important;
        padding-right: 6px !important;
        overflow-x: hidden !important;
    }
    #order-standard_cart > .row {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* ── Small mobile (< 480px) ───────────────────────────────────── */
@media (max-width: 479px) {

    /* Collapsed sidebar slightly tighter on small screens */
    #order-standard_cart .sidebar-collapsed {
        padding: 1rem 1.25rem !important;
        border-radius: 1rem !important;
        background: #ffffff !important;
    }

    /* Stack featured TLDs to single column */
    #order-standard_cart .featured-tlds-container [class*="col-"] {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    /* Search button full bleed */
    .hst-search-btn {
        border-radius: 0.625rem;
    }

    /* Suggestion actions — stack price above button */
    #order-standard_cart .domain-suggestion .actions,
    #order-standard_cart #domainSuggestions .list-group-item .actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    #order-standard_cart .domain-suggestion .actions .price {
        text-align: center !important;
    }

    #order-standard_cart .domain-suggestion .actions .btn-add-to-cart {
        width: 100% !important;
        text-align: center !important;
    }

    /* Product cards — extra compact */
    #order-standard_cart .hst-card {
        padding: 1.25rem 1rem !important;
    }

    #order-standard_cart .hst-card-head h3 {
        font-size: 1.25rem !important;
    }

    #order-standard_cart .hst-price-amount {
        font-size: 1.75rem !important;
    }

    #order-standard_cart .hst-card-featured .hst-price-amount {
        font-size: 2rem !important;
    }
}