/* *****************************************************

    ** Zenith: shopping cart **

    Styles WHMCS' standard_cart markup (also used by the
    source_cart child), so the whole order flow matches the
    theme. Loaded only on cart pages.

***************************************************** */

/* Progress steps ----------------------------------------- */

.zenith-cart-steps {
    background: var(--bg);
    border-bottom: 1px solid var(--border-muted);
}

.zenith-cart-steps ol {
    display: flex;
    margin: 0;
    padding: 0.9rem 0;
    list-style: none;
    counter-reset: step;
}

.zenith-cart-steps li {
    display: flex;
    flex: 1;
    align-items: center;
    gap: 0.5rem;
    color: var(--text-muted);
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Connector line between steps */
.zenith-cart-steps li:not(:last-child)::after {
    content: "";
    flex: 1;
    height: 2px;
    margin: 0 0.5rem;
    border-radius: 2px;
    background: var(--border-muted);
}

.zenith-cart-steps li.is-done::after {
    background: var(--brand-500);
}

.zenith-cart-steps .step-dot {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 2px solid var(--border);
    background: var(--bg);
    font-family: var(--font-mono);
    font-size: 0.8rem;
}

.zenith-cart-steps li.is-done {
    color: var(--text-accented);
}

.zenith-cart-steps li.is-done .step-dot {
    border-color: var(--brand-500);
    background: var(--brand-500);
    color: var(--on-brand);
}

.zenith-cart-steps li.is-current {
    color: var(--text);
}

.zenith-cart-steps li.is-current .step-dot {
    border-color: var(--surface-dark);
    background: var(--surface-dark);
    color: #fff;
}

@media (max-width: 767.98px) {
    .zenith-cart-steps .step-label {
        display: none;
    }

    .zenith-cart-steps li.is-current .step-label {
        display: inline;
    }
}

/* Layout: no category sidebar once a product is chosen --------- */

body.page-configureproduct #order-standard_cart .cart-sidebar,
body.page-configureproduct #order-standard_cart .sidebar-collapsed,
body.page-viewcart #order-standard_cart .cart-sidebar,
body.page-viewcart #order-standard_cart .sidebar-collapsed {
    display: none;
}

body.page-configureproduct #order-standard_cart .cart-body,
body.page-viewcart #order-standard_cart .cart-body {
    width: 100%;
    float: none;
}

/* Headings */
body.zenith #order-standard_cart .header-lined h1 {
    font-size: clamp(1.6rem, 3vw, 2.1rem) !important;
    font-weight: 800;
}

body.zenith #order-standard_cart .header-lined {
    margin-bottom: 1.25rem;
    border-bottom: 0;
}

/* Section headings ("Choose Account", "Payment Details"...) */
body.zenith #order-standard_cart .sub-heading {
    height: auto;
    margin: 2rem 0 1rem;
    border-top: 0;
    text-align: left;
}

body.zenith #order-standard_cart .sub-heading span {
    padding: 0;
    background: transparent;
    color: var(--text);
    font-size: 1.05rem;
    font-weight: 700;
}

body.zenith #order-standard_cart .sub-heading span::before {
    content: "// ";
    font-family: var(--font-mono);
    color: var(--brand-600);
}

/* Cards and panels inside the cart */
body.zenith #order-standard_cart .product-info,
body.zenith #order-standard_cart .view-cart-items,
body.zenith #order-standard_cart .view-cart-tabs .tab-content,
body.zenith #order-standard_cart .already-registered,
body.zenith #order-standard_cart .field-container,
body.zenith #order-standard_cart .domain-selection-options .option,
body.zenith #order-standard_cart .account-select-container .account {
    border-color: var(--border-muted);
    border-radius: var(--rounding-lg);
}

body.zenith #order-standard_cart .product-info {
    padding: 1.25rem 1.5rem;
    background: var(--bg);
    border: 1px solid var(--border-muted);
}

body.zenith #order-standard_cart .product-info .product-title {
    font-family: var(--font-mono);
    font-weight: 700;
}

body.zenith #order-standard_cart .view-cart-items-header {
    padding: 0.75rem 1.25rem;
    border-radius: var(--rounding-lg) var(--rounding-lg) 0 0;
    background: var(--surface-dark);
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

body.zenith #order-standard_cart .view-cart-items {
    background: var(--bg);
    border: 1px solid var(--border-muted);
    border-top: 0;
    border-radius: 0 0 var(--rounding-lg) var(--rounding-lg);
}

body.zenith #order-standard_cart .view-cart-items .item {
    padding: 1.1rem 1.25rem;
    border-bottom: 1px solid var(--border-muted);
}

body.zenith #order-standard_cart .view-cart-items .item:last-child {
    border-bottom: 0;
}

body.zenith #order-standard_cart .view-cart-items .item-title {
    font-family: var(--font-mono);
    font-weight: 700;
    font-size: 1.05rem;
}

body.zenith #order-standard_cart .view-cart-items .item-price span:first-child {
    font-weight: 800;
    font-size: 1.1rem;
}

body.zenith #order-standard_cart .btn-remove-from-cart {
    color: var(--text-muted);
}

body.zenith #order-standard_cart .btn-remove-from-cart:hover {
    color: var(--error);
}

/* Promo code tabs */
body.zenith #order-standard_cart .view-cart-tabs .nav-tabs {
    border-bottom: 0;
}

body.zenith #order-standard_cart .view-cart-tabs .nav-tabs a {
    border: 1px solid var(--border-muted);
    border-bottom: 0;
    border-radius: var(--rounding-md) var(--rounding-md) 0 0;
    background: var(--bg);
    color: var(--text-accented);
    font-weight: 600;
}

body.zenith #order-standard_cart .view-cart-tabs .tab-content {
    background: var(--bg);
    border: 1px solid var(--border-muted);
    border-top-left-radius: 0;
}

/* Order summary: dark "editor window" card -------------------- */

body.zenith #order-standard_cart .order-summary {
    position: sticky;
    top: 96px;
    overflow: hidden;
    border: 0;
    border-radius: var(--rounding-lg);
    background: linear-gradient(160deg, var(--surface-dark-2), var(--surface-dark));
    box-shadow: 0 26px 50px -30px rgba(17, 24, 39, 0.65);
}

body.zenith #order-standard_cart .order-summary h2 {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.9rem 1.25rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    font-family: var(--font-mono);
    font-size: 0.9rem;
    font-weight: 700;
    text-align: left;
    color: rgba(255, 255, 255, 0.7);
}

/* Window dots before the title */
body.zenith #order-standard_cart .order-summary h2::before {
    content: "";
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #f87171;
    box-shadow: 16px 0 0 #fbbf24, 32px 0 0 #34d399;
    margin-right: 32px;
}

body.zenith #order-standard_cart .summary-container {
    padding: 1.25rem;
    background: transparent;
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9rem;
}

body.zenith #order-standard_cart .order-summary .product-name {
    color: #fff;
    font-family: var(--font-mono);
}

body.zenith #order-standard_cart .order-summary .summary-totals,
body.zenith #order-standard_cart .order-summary .subtotal,
body.zenith #order-standard_cart .order-summary .bordered-totals {
    border-color: rgba(255, 255, 255, 0.12) !important;
}

body.zenith #order-standard_cart .order-summary .total-due-today {
    margin-top: 1rem;
}

body.zenith #order-standard_cart .order-summary .total-due-today .amt {
    font-size: 2.25rem;
    font-weight: 800;
    color: #fff;
}

body.zenith #order-standard_cart .order-summary .total-due-today span:last-child {
    color: rgba(255, 255, 255, 0.55);
}

body.zenith #order-standard_cart .order-summary .text-muted,
body.zenith #order-standard_cart .order-summary small {
    color: rgba(255, 255, 255, 0.55) !important;
}

body.zenith #order-standard_cart .order-summary a:not(.btn),
body.zenith #order-standard_cart .order-summary .btn-link {
    color: rgba(255, 255, 255, 0.65);
}

body.zenith #order-standard_cart .order-summary a:not(.btn):hover,
body.zenith #order-standard_cart .order-summary .btn-link:hover {
    color: #fff;
}

/* Main actions in amber */
body.zenith #order-standard_cart .btn-checkout,
body.zenith #order-standard_cart #btnCompleteProductConfig,
body.zenith #order-standard_cart #btnCompleteOrder,
body.zenith #order-standard_cart .btn-success {
    background: var(--brand-500);
    border-color: var(--brand-500);
    color: var(--on-brand);
    border-radius: var(--rounding-md);
    font-weight: 700;
}

body.zenith #order-standard_cart .btn-checkout:hover,
body.zenith #order-standard_cart #btnCompleteProductConfig:hover,
body.zenith #order-standard_cart #btnCompleteOrder:hover,
body.zenith #order-standard_cart .btn-success:hover {
    background: var(--brand-600);
    border-color: var(--brand-600);
    color: var(--on-brand);
}

body.zenith #order-standard_cart .btn-checkout.disabled {
    opacity: 0.4;
}

/* Checkout */
/* The checkout's "Total Due Today" bar (the summary card reuses #totalDueToday) */
body.zenith #order-standard_cart .alert-success.text-center {
    border: 1px solid var(--brand-200);
    border-radius: var(--rounding-md);
    background: var(--brand-50);
    color: var(--brand-900);
}

body.zenith #order-standard_cart .checkout-security-msg {
    border: 1px solid var(--border-muted);
    border-radius: var(--rounding-md);
    background: var(--bg);
    color: var(--text-lifted);
}

body.zenith #order-standard_cart .checkout-security-msg i {
    color: var(--brand-600);
}

/* Form fields */
body.zenith #order-standard_cart .field,
body.zenith #order-standard_cart .form-control {
    border-radius: var(--rounding-md);
}

/* Right-to-left */
html[dir="rtl"] body.zenith #order-standard_cart .sub-heading,
html[dir="rtl"] body.zenith #order-standard_cart .order-summary h2 {
    text-align: right;
}

html[dir="rtl"] body.zenith #order-standard_cart .order-summary h2::before {
    margin-right: 0;
    margin-left: 32px;
    box-shadow: -16px 0 0 #fbbf24, -32px 0 0 #34d399;
}

/* The monospace font has no Arabic glyphs: use the Arabic font in RTL */
html[dir="rtl"] body.zenith #order-standard_cart .order-summary h2,
html[dir="rtl"] body.zenith #order-standard_cart .order-summary .product-name,
html[dir="rtl"] body.zenith #order-standard_cart .view-cart-items .item-title,
html[dir="rtl"] body.zenith #order-standard_cart .product-info .product-title {
    font-family: var(--font-arabic);
}

/* Order complete (step 6). Not visually tested yet: it needs a real order. */
body.page-complete #order-standard_cart .cart-sidebar {
    display: none;
}

body.page-complete #order-standard_cart .cart-body {
    width: 100%;
    float: none;
    text-align: center;
}

body.zenith #order-standard_cart .order-confirmation {
    max-width: 560px;
    margin: 1.5rem auto;
    padding: 1.5rem;
    border: 1px solid var(--border-muted);
    border-radius: var(--rounding-lg);
    background: var(--bg);
    color: var(--text);
    font-size: 1.05rem;
}

body.zenith #order-standard_cart .order-confirmation span {
    display: inline-block;
    margin-top: 0.25rem;
    padding: 0.2rem 0.75rem;
    border-radius: 999px;
    background: var(--surface-dark);
    color: #fff;
    font-family: var(--font-mono);
    font-weight: 700;
}
