<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\AppLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
    <?php
        $checkoutStep = request('step', 'cart');
        if (! in_array($checkoutStep, ['cart', 'account', 'payment'], true)) {
            $checkoutStep = 'cart';
        }
        if ($cart->items->isEmpty() && $checkoutStep !== 'cart') {
            $checkoutStep = 'cart';
        }
        $checkoutDetails = session('checkout_details', []);
        $hasDomainRegistration = $cart->items->contains(fn ($item) => $item->item_type === 'domain_register');
        $configuredProductId = (int) request('configure', 0);
        $showPlanBrowser = $cart->items->isEmpty() || request()->boolean('browse') || $configuredProductId > 0;
        $showPlanCatalog = $showPlanBrowser && ($configuredProductId === 0 || request()->boolean('browse'));
    ?>

    <style>
        .checkout-container {
            max-width: 1500px;
        }

        .checkout-page-head {
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            margin-bottom: 26px;
        }

        .checkout-title-wrap .page-title {
            margin: 0;
        }

        .checkout-head-message {
            margin: 0;
            max-width: min(680px, 65vw);
            padding: 12px 18px;
            flex: 1 1 auto;
        }

        .checkout-head-message.is-hiding {
            opacity: 0;
            transform: translateY(-4px);
            transition: opacity .25s ease, transform .25s ease;
        }

        .checkout-step-tabs {
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
            margin: 0 0 26px;
        }

        .checkout-step-tab {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 10px 18px;
            border: 1px solid rgba(15, 23, 42, .10);
            border-radius: 999px;
            text-decoration: none;
            font-weight: 800;
            color: #111827;
            background: #fff;
            box-shadow: 0 10px 26px rgba(15, 23, 42, .05);
        }

        .checkout-step-tab.active {
            background: #111827;
            color: #fff;
        }

        .checkout-step-tab.disabled {
            opacity: .45;
            pointer-events: none;
        }

        .checkout-step-number {
            display: inline-grid;
            place-items: center;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: rgba(15, 23, 42, .08);
            font-size: 12px;
            font-weight: 900;
        }

        .checkout-step-tab.active .checkout-step-number {
            background: rgba(255, 255, 255, .20);
        }

        .checkout-layout {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(380px, 430px);
            gap: 48px;
            align-items: start;
        }

        .checkout-left-scroll {
            align-self: start;
            position: static;
            max-height: none;
            overflow: visible;
            padding-right: 0;
        }

        .checkout-summary {
            align-self: start;
            position: sticky;
            top: 92px;
            z-index: 20;
        }

        .sticky-summary {
            position: static;
            max-height: calc(100vh - 112px);
            overflow-y: auto;
            overscroll-behavior: contain;
        }

        .summary-card {
            padding: 32px 34px;
            border-radius: 24px;
        }

        .summary-card h2 {
            margin: 0 0 26px;
            font-size: 28px;
            line-height: 1.15;
            font-weight: 800;
        }

        .summary-item {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            column-gap: 14px;
            row-gap: 14px;
            align-items: start;
            padding: 20px 0 18px;
            border-bottom: 1px solid rgba(15, 23, 42, .08);
        }

        .summary-item-info {
            min-width: 0;
        }

        .summary-item-info strong {
            display: block;
            margin-bottom: 6px;
            line-height: 1.25;
        }

        .summary-item-info span {
            display: block;
            color: #6b7280;
            line-height: 1.35;
            word-break: break-word;
        }

        .summary-item > b {
            white-space: nowrap;
            text-align: right;
            line-height: 1.25;
        }

        .summary-remove-form {
            margin: 0;
        }

        .summary-remove {
            width: 26px;
            height: 26px;
            display: inline-grid;
            place-items: center;
            border-radius: 50%;
        }

        .summary-edit-form {
            grid-column: 1 / -1;
            margin-top: 10px;
        }

        .summary-select {
            width: 100%;
            max-width: 100%;
        }

        .summary-line,
        .summary-total {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 20px;
        }

        .summary-note {
            font-size: 12px;
            line-height: 1.5;
            text-align: center;
            color: #6b7280;
        }

        .order-panel.clean-panel {
            border-radius: 22px;
        }

        .section-heading {
            margin-bottom: 20px;
        }

        .section-heading h2 {
            line-height: 1.15;
        }

        .zt-large-select {
            width: 100%;
        }

        .checkout-step-actions {
            display: flex;
            gap: 12px;
            flex-wrap: wrap;
            margin-top: 22px;
        }

        .slider-plan-card.is-selected {
            border-color: #111827;
            box-shadow: 0 18px 44px rgba(15, 23, 42, .16);
        }

        .plan-configurator {
            margin-top: 24px;
        }

        .plan-configuration-panel {
            padding: 28px;
            border: 1px solid rgba(15, 23, 42, .10);
            border-radius: 22px;
            background: #fff;
            box-shadow: 0 14px 38px rgba(15, 23, 42, .07);
        }

        .plan-configuration-panel[hidden] {
            display: none;
        }

        .plan-configuration-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 20px;
            margin-bottom: 22px;
        }

        .plan-configuration-head h3 {
            margin: 4px 0 0;
            font-size: 24px;
            line-height: 1.2;
        }

        .plan-configuration-head p {
            margin: 6px 0 0;
            color: #6b7280;
        }

        .plan-configuration-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 18px;
        }

        .plan-configuration-grid .plan-config-field,
        .server-configuration-grid label {
            display: grid;
            gap: 8px;
            font-weight: 700;
        }

        .config-cycle-panel[hidden] {
            display: none;
        }

        .server-configuration-block {
            margin-top: 24px;
            padding-top: 22px;
            border-top: 1px solid rgba(15, 23, 42, .10);
        }

        .server-configuration-block h4 {
            margin: 0 0 16px;
            font-size: 18px;
        }

        .server-configuration-grid {
            display: grid;
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: 18px;
        }

        .plan-config-submit-row {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 18px;
            margin-top: 24px;
        }

        .plan-config-submit-row p {
            margin: 0;
            color: #6b7280;
            font-size: 13px;
        }


        .zt-cart-summary-toggle {
            display: none;
        }

        .checkout-catalog-toolbar {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 16px;
            margin-bottom: 24px;
        }

        .checkout-group-select-form {
            flex: 1 1 420px;
            max-width: 560px;
        }

        .checkout-catalog-toolbar .slider-actions {
            flex: 0 0 auto;
        }

        @media (min-width: 981px) {
            .checkout-summary {
                position: sticky !important;
                top: 96px;
                align-self: start;
                height: fit-content;
            }

            .checkout-summary .sticky-summary {
                max-height: calc(100vh - 120px);
                overflow-y: auto;
                overscroll-behavior: contain;
                scrollbar-gutter: stable;
            }
        }

        @media (max-width: 1180px) {
            .checkout-layout {
                grid-template-columns: minmax(0, 1fr) 380px;
                gap: 28px;
            }

            .summary-card {
                padding: 28px 26px;
            }
        }

        @media (max-width: 980px) {
            .checkout-container {
                padding-bottom: 118px;
            }

            .checkout-layout {
                display: block;
            }

            .checkout-catalog-toolbar {
                align-items: stretch;
                flex-direction: column;
            }

            .checkout-group-select-form {
                max-width: none;
                width: 100%;
            }

            .checkout-catalog-toolbar .slider-actions {
                align-self: flex-end;
            }

            .checkout-left-scroll,
            .sticky-summary {
                position: static;
                max-height: none;
                overflow: visible;
                padding-right: 0;
            }

            .checkout-summary {
                position: fixed;
                left: max(12px, env(safe-area-inset-left));
                right: max(12px, env(safe-area-inset-right));
                bottom: max(12px, env(safe-area-inset-bottom));
                z-index: 80;
                margin: 0;
                pointer-events: none;
            }

            .zt-cart-summary-toggle {
                width: 100%;
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 12px;
                padding: 16px 18px;
                border: 0;
                border-radius: 24px;
                background: #111827;
                color: #fff;
                cursor: pointer;
                box-shadow: 0 20px 50px rgba(15, 23, 42, .22);
                pointer-events: auto;
            }

            .zt-cart-summary-toggle span:first-child {
                font-size: 18px;
                line-height: 1.2;
                font-weight: 900;
                letter-spacing: -.02em;
            }

            .zt-cart-summary-toggle strong {
                margin-left: auto;
                font-size: 18px;
                line-height: 1.2;
                font-weight: 900;
                white-space: nowrap;
            }

            .zt-cart-summary-toggle-icon {
                width: 34px;
                height: 34px;
                display: inline-grid;
                place-items: center;
                flex: 0 0 34px;
                border-radius: 999px;
                background: rgba(255, 255, 255, .14);
                color: #fff;
                transition: transform .2s ease, background .2s ease;
            }

            .zt-cart-summary-toggle-icon svg {
                width: 16px;
                height: 16px;
                display: block;
            }

            .zt-cart-summary-toggle[aria-expanded="true"] .zt-cart-summary-toggle-icon {
                transform: rotate(180deg);
                background: rgba(255, 255, 255, .20);
            }

            .checkout-summary .summary-card {
                margin-top: 10px;
                padding: 22px 18px 18px;
                max-height: min(68vh, 560px);
                overflow-y: auto;
                overscroll-behavior: contain;
                border-radius: 22px;
                box-shadow: 0 20px 50px rgba(15, 23, 42, .20);
                pointer-events: auto;
            }

            .checkout-summary .summary-card h2 {
                display: none;
            }

            .checkout-summary .zt-mobile-summary-collapsed {
                display: none;
            }

            .plan-configuration-grid,
            .server-configuration-grid {
                grid-template-columns: 1fr;
            }
        }

        @media (max-width: 640px) {
            .summary-card {
                padding: 24px 20px;
            }

            .summary-item {
                grid-template-columns: minmax(0, 1fr) auto;
            }

            .summary-item > b {
                text-align: right;
            }
        }

        body { background: #f5efff; }
        .checkout-container { max-width: 1320px; padding-top: 56px; padding-bottom: 90px; }
        .checkout-page-head { margin-bottom: 22px; }
        .checkout-page-head .page-title { font-size: 36px; color: #0b1836; }
        .currency-note { background: rgba(255,255,255,.72); border: 1px solid #e8ddf8; box-shadow: none; }
        .checkout-step-tabs { gap: 8px; }
        .checkout-step-tab { box-shadow: none; border-color: #e4d9f2; background: rgba(255,255,255,.76); }
        .checkout-step-tab.active { background: #7800ff; border-color: #7800ff; }
        .checkout-layout { grid-template-columns: minmax(0,1fr) minmax(390px,470px); gap: 24px; }
        .order-panel.clean-panel, .summary-card, .zt-cart-products-card {
            background: #fff;
            border: 1px solid #e8e2ef;
            box-shadow: none;
            border-radius: 14px;
        }
        .order-panel.clean-panel { padding: 28px; }
        .checkout-main { display: grid; gap: 22px; }
        .checkout-main > section { margin: 0; }
        .summary-card { padding: 34px 38px; }
        .summary-card h2 { color: #0b1836; font-size: 27px; }
        .summary-item { padding: 16px 0; }
        .summary-line { padding: 11px 0; border-bottom: 1px solid #edf0f4; }
        .summary-total { margin-top: 12px; padding: 18px 0 4px; font-size: 18px; }
        .complete-btn { margin-top: 24px; background: linear-gradient(90deg,#7000ff,#9000ff); border-radius: 9px; }
        .zt-cart-products-card { padding: 30px 34px; }
        .zt-cart-products-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:20px; }
        .zt-cart-products-head h2 { margin:5px 0 0;font-size:25px;color:#0b1836; }
        .zt-cart-count { padding:7px 11px;background:#f5efff;color:#7800ff;border-radius:999px;font-size:12px;font-weight:900; }
        .zt-cart-products-list { display:grid;gap:14px; }
        .zt-cart-product-row { display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:start;padding:18px 0;border-top:1px solid #edf0f4; }
        .zt-cart-product-row:first-child { border-top:0; }
        .zt-cart-product-icon { width:38px;height:38px;display:grid;place-items:center;border-radius:8px;background:#f2f3f7;color:#20293d; }
        .zt-cart-product-main { min-width:0;display:grid;gap:5px; }
        .zt-cart-product-main > strong { font-size:18px;color:#0b1836; }
        .zt-cart-product-main > span { color:#62708a;font-size:14px; }
        .zt-cart-period-form { margin-top:10px;display:grid;gap:6px;max-width:240px; }
        .zt-cart-period-form label { font-size:12px;font-weight:800;color:#59657d; }
        .zt-cart-period-form .select { height:42px; }
        .zt-cart-product-price { text-align:right;display:grid;gap:8px;justify-items:end; }
        .zt-cart-product-price strong { white-space:nowrap;color:#101a35;font-size:18px; }
        .zt-cart-product-price button { border:0;background:transparent;color:#7c00ff;font-weight:800;cursor:pointer;padding:0; }
        .zt-cart-benefits { display:flex;gap:24px;flex-wrap:wrap;border-top:1px solid #edf0f4;margin-top:16px;padding-top:18px;color:#56627a;font-size:13px; }
        .zt-cart-benefits i { color:#22b94f;margin-right:6px; }
        .zt-promo-block { padding:18px 0;border-bottom:1px solid #edf0f4; }
        .zt-promo-form label { display:block;color:#7c00ff;font-weight:800;font-size:14px;margin-bottom:9px; }
        .zt-promo-form > div { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px; }
        .zt-promo-form input { height:44px; }
        .zt-promo-form button, .zt-promo-applied button { border:0;border-radius:8px;padding:0 16px;background:#7c00ff;color:#fff;font-weight:800;cursor:pointer; }
        .zt-promo-applied { display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;background:#f3edff;border-radius:10px; }
        .zt-promo-applied div { display:grid;gap:2px; }.zt-promo-applied small{color:#69738a}.zt-promo-applied strong{color:#6200d8}
        .zt-promo-applied button { background:transparent;color:#7c00ff;padding:5px; }
        .zt-discount-line strong { color:#159947; }
        .zt-add-another-card { display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 28px; }
        .zt-add-another-card h3 { margin:5px 0 5px;color:#0b1836;font-size:20px; }
        .zt-add-another-card p { margin:0;color:#647089; }
        .zt-add-another-card .secondary-btn { white-space:nowrap; }
        .plan-slider-panel, #domain-search { scroll-margin-top: 100px; }
        @media(max-width:980px){body{background:#f5efff}.checkout-layout{display:block}.zt-cart-product-row{grid-template-columns:40px minmax(0,1fr)}.zt-cart-product-price{grid-column:2;text-align:left;justify-items:start}.zt-add-another-card{align-items:flex-start;flex-direction:column}}
        @media(max-width:600px){.checkout-container{padding-top:28px}.zt-cart-products-card,.order-panel.clean-panel{padding:22px 18px}.zt-cart-product-row{grid-template-columns:1fr}.zt-cart-product-icon{display:none}.zt-cart-product-price{grid-column:1}.summary-card{padding:24px 20px}}

        /* Compact checkout layout: both columns use normal page scrolling. */
        body { background: #f6f6f7; }
        .checkout-container { max-width: 1240px; padding-top: 32px; padding-bottom: 64px; }
        .checkout-page-head { margin-bottom: 16px; }
        .checkout-page-head .page-title {
            font-size: 28px;
            line-height: 1.15;
            letter-spacing: -.025em;
            font-weight: 700;
            color: #111827;
        }
        .currency-note {
            min-width: 0;
            padding: 8px 12px;
            border-radius: 10px;
            display: flex;
            align-items: center;
            gap: 7px;
            background: #fff;
            border-color: #e5e7eb;
        }
        .currency-note strong { font-size: 14px; font-weight: 700; }
        .currency-note span { font-size: 11px; color: #6b7280; }

        .checkout-step-tabs { gap: 7px; margin-bottom: 18px; }
        .checkout-step-tab {
            gap: 7px;
            padding: 8px 13px;
            border-radius: 999px;
            font-size: 13px;
            font-weight: 650;
            box-shadow: none;
        }
        .checkout-step-number { width: 21px; height: 21px; font-size: 11px; }

        .checkout-layout {
            grid-template-columns: minmax(0, 1fr) minmax(350px, 400px);
            gap: 22px;
            align-items: start;
        }
        .checkout-main { gap: 18px; }
        .checkout-summary {
            position: static !important;
            top: auto !important;
            z-index: auto !important;
            height: auto !important;
        }
        .checkout-summary .sticky-summary,
        .sticky-summary {
            position: static !important;
            max-height: none !important;
            height: auto !important;
            overflow: visible !important;
            overscroll-behavior: auto !important;
            scrollbar-gutter: auto !important;
        }
        .zt-cart-summary-toggle { display: none !important; }
        .zt-mobile-summary-collapsed { display: block !important; }

        .order-panel.clean-panel,
        .summary-card,
        .zt-cart-products-card {
            border-radius: 16px;
            border-color: #e6e7eb;
            box-shadow: none;
        }
        .order-panel.clean-panel { padding: 22px; }
        .zt-cart-products-card { padding: 10px 24px; }
        .summary-card { padding: 24px; }
        .summary-card h2 {
            margin-bottom: 14px;
            font-size: 23px;
            font-weight: 700;
            letter-spacing: -.02em;
        }
        .summary-item {
            padding: 14px 0;
            row-gap: 4px;
            column-gap: 14px;
        }
        .summary-item-info strong { margin-bottom: 4px; font-size: 14px; font-weight: 650; }
        .summary-item-info span { font-size: 12px; }
        .summary-item > b { font-size: 14px; font-weight: 650; }
        .summary-line { padding: 10px 0; font-size: 14px; }
        .summary-total { margin-top: 8px; padding: 15px 0 2px; font-size: 18px; }
        .summary-total strong { font-size: 20px; }
        .complete-btn { min-height: 48px; margin-top: 18px; border-radius: 9px; }
        .zt-promo-block { padding: 15px 0; }
        .zt-promo-form label { font-size: 13px; font-weight: 650; }
        .zt-promo-form input { height: 42px; font-size: 14px; }
        .zt-promo-form button { min-width: 72px; font-size: 13px; }

        .zt-cart-product-row {
            grid-template-columns: 38px minmax(0, 1fr) auto;
            gap: 14px;
            padding: 17px 0;
        }
        .zt-cart-product-icon { width: 36px; height: 36px; }
        .zt-cart-product-main { gap: 3px; }
        .zt-cart-product-main > strong { font-size: 16px; font-weight: 650; }
        .zt-cart-product-main > span { font-size: 13px; }
        .zt-cart-period-form {
            width: min(100%, 690px);
            max-width: none;
            margin-top: 12px;
            gap: 8px;
        }
        .zt-cart-period-form label {
            font-size: 12px;
            font-weight: 700;
            color: #4b5563;
        }
        .zt-term-options {
            display: grid;
            grid-template-columns: repeat(4, minmax(108px, 1fr));
            gap: 9px;
        }
        .zt-term-option {
            min-width: 0;
            padding: 0;
            overflow: hidden;
            border: 1px solid #ded7e8;
            border-radius: 11px;
            background: #fff;
            color: #111827;
            text-align: left;
            cursor: pointer;
            transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease, background .2s ease;
        }
        .zt-term-option:hover {
            border-color: #a96cff;
            box-shadow: 0 8px 20px rgba(120, 0, 255, .09);
            transform: translateY(-1px);
        }
        .zt-term-option > span,
        .zt-term-option > strong {
            display: block;
            padding-left: 12px;
            padding-right: 12px;
        }
        .zt-term-option > span {
            padding-top: 11px;
            font-size: 12px;
            font-weight: 700;
            color: #4b5563;
        }
        .zt-term-option > strong {
            padding-top: 4px;
            padding-bottom: 10px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            font-size: 14px;
            font-weight: 750;
            color: #111827;
        }
        .zt-term-option > small {
            display: block;
            padding: 5px 10px;
            background: #f4ecff;
            color: #6d20ce;
            text-align: center;
            font-size: 10px;
            font-weight: 700;
        }
        .zt-term-option.is-active {
            border-color: #7800ff;
            background: #fcfaff;
            box-shadow: 0 0 0 2px rgba(120, 0, 255, .12);
        }
        .zt-term-option.is-active > small {
            background: #7800ff;
            color: #fff;
        }
        .zt-cart-product-price { gap: 7px; }
        .zt-cart-product-price strong { font-size: 16px; font-weight: 650; }
        .zt-cart-product-price button { font-size: 13px; font-weight: 650; }

        .section-heading { margin-bottom: 15px; }
        .section-heading h2 { margin: 0 0 5px; font-size: 21px; font-weight: 700; letter-spacing: -.02em; }
        .section-heading p { margin: 0; font-size: 13px; line-height: 1.5; color: #6b7280; }
        .domain-checkout-search { display: grid; gap: 13px; }
        .domain-tabs { display: flex; flex-wrap: wrap; gap: 18px; }
        .domain-tabs label { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; }
        .domain-tabs input { width: 16px; height: 16px; }
        .domain-input-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 128px; }
        .domain-input-wrap .domain-search-input,
        .domain-input-wrap .domain-search-button { height: 46px; }
        .domain-input-wrap .domain-search-input {
            min-width: 0;
            border-radius: 10px 0 0 10px;
            font-size: 14px;
        }
        .domain-input-wrap .domain-search-button {
            border: 0;
            border-radius: 0 10px 10px 0;
            background: #7800ff;
            color: #fff;
            font-size: 14px;
            font-weight: 700;
            cursor: pointer;
        }
        .divider-text { margin: 18px 0 14px; font-size: 11px; }
        .existing-domain-form { display: grid; grid-template-columns: minmax(0,1fr) 180px; gap: 9px; }
        .existing-domain-form .input,
        .existing-domain-form .secondary-btn { height: 46px; font-size: 13px; }
        .inline-domain-result { margin-top: 15px; }
        .domain-dropdown-actions { gap: 11px; }
        .domain-dropdown-card .input,
        .domain-dropdown-card .select { min-height: 42px; font-size: 13px; }
        .domain-add-btn { min-height: 44px; }

        .zt-brand-protection-list { margin-top: 4px; }
        .zt-brand-status { margin: 0; padding: 11px 0; color: #6b7280; font-size: 13px; }
        .zt-brand-domain-grid { display: grid; gap: 0; border-top: 1px solid #eceef2; }
        .zt-brand-domain-row {
            display: grid;
            grid-template-columns: minmax(0,1fr) auto 64px;
            gap: 14px;
            align-items: center;
            padding: 13px 0;
            border-bottom: 1px solid #eceef2;
        }
        .zt-brand-domain-name { min-width: 0; display: grid; gap: 2px; }
        .zt-brand-domain-name strong { font-size: 15px; font-weight: 700; color: #111827; }
        .zt-brand-domain-name span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; color: #6b7280; }
        .zt-brand-domain-price { display: flex; align-items: baseline; gap: 3px; white-space: nowrap; }
        .zt-brand-domain-price strong { font-size: 14px; font-weight: 650; }
        .zt-brand-domain-price span { font-size: 11px; color: #6b7280; }
        .zt-brand-domain-row button {
            height: 34px;
            border: 1px solid #7800ff;
            border-radius: 8px;
            background: #fff;
            color: #7800ff;
            font-size: 12px;
            font-weight: 700;
            cursor: pointer;
        }
        .zt-brand-domain-row button:hover { background: #f5edff; }

        @media (max-width: 980px) {
            .checkout-container { padding-bottom: 48px; }
            .checkout-layout { display: grid; grid-template-columns: 1fr; }
            .checkout-summary {
                position: static !important;
                inset: auto !important;
                margin: 0;
                pointer-events: auto;
            }
            .checkout-summary .summary-card { display: block !important; margin-top: 0; }
        }
        @media (max-width: 640px) {
            .checkout-container { padding-top: 22px; }
            .checkout-page-head { align-items: flex-start; flex-direction: column; gap: 12px; }
            .checkout-page-head .page-title { font-size: 24px; }
            .checkout-head-message { width: 100%; max-width: none; }
            .currency-note { align-items: flex-start; flex-direction: column; gap: 1px; }
            .checkout-step-tabs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; }
            .checkout-step-tab { white-space: nowrap; }
            .zt-cart-products-card,
            .order-panel.clean-panel,
            .summary-card { padding: 18px; }
            .zt-cart-product-row { grid-template-columns: minmax(0,1fr) auto; }
            .zt-cart-product-icon { display: none; }
            .zt-cart-product-price { grid-column: 2; grid-row: 1; text-align: right; justify-items: end; }
            .zt-term-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
            .domain-input-wrap { grid-template-columns: minmax(0,1fr) 100px; }
            .existing-domain-form { grid-template-columns: 1fr; }
            .zt-brand-domain-row { grid-template-columns: minmax(0,1fr) auto; }
            .zt-brand-domain-row button { grid-column: 1 / -1; width: 100%; }
        }
    </style>

    <div class="portal-container checkout-container">
        <div class="page-head compact-page-head checkout-page-head">
            <div class="checkout-title-wrap">
                <h1 class="page-title">Your Cart</h1>
            </div>

            <?php if(session('status')): ?>
                <div class="alert alert-success checkout-head-message" data-checkout-live-message data-auto-dismiss="5000"><?php echo e(session('status')); ?></div>
            <?php endif; ?>
        </div>

        <?php if($errors->any()): ?>
            <div class="alert alert-error"><?php echo e($errors->first()); ?></div>
        <?php endif; ?>

        <div id="checkout-step" class="checkout-step-tabs">
            <a class="checkout-step-tab <?php echo e($checkoutStep === 'cart' ? 'active' : ''); ?>" href="<?php echo e(route('checkout.index', ['step' => 'cart'])); ?>#checkout-step"><span class="checkout-step-number">1</span>Cart</a>
            <a class="checkout-step-tab <?php echo e($checkoutStep === 'account' ? 'active' : ''); ?> <?php echo e($cart->items->isEmpty() ? 'disabled' : ''); ?>" href="<?php echo e(route('checkout.index', ['step' => 'account'])); ?>#checkout-step"><span class="checkout-step-number">2</span>Account</a>
            <a class="checkout-step-tab <?php echo e($checkoutStep === 'payment' ? 'active' : ''); ?> <?php echo e(empty($checkoutDetails) ? 'disabled' : ''); ?>" href="<?php echo e(route('checkout.index', ['step' => 'payment'])); ?>#checkout-step"><span class="checkout-step-number">3</span>Payment</a>
        </div>

        <div class="checkout-layout">
            <div class="checkout-main checkout-left-scroll">
                <?php if($checkoutStep === 'cart'): ?>
                    <div id="zt-cart-items">
                        <?php echo $__env->make('checkout.partials.cart-items', ['cart' => $cart, 'pricing' => $pricing], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                    </div>

                    <?php if($showPlanBrowser): ?>
                    <section id="plans" class="order-panel clean-panel plan-slider-panel">
                        <?php if($showPlanCatalog): ?>
                        <div data-plan-catalog>
                        <div class="checkout-catalog-toolbar">
                            <form method="GET" action="<?php echo e(route('checkout.index')); ?>" class="checkout-group-select-form">
                                <input type="hidden" name="step" value="cart">
                                <label class="sr-only" for="checkout-product-group">Product group</label>
                                <select id="checkout-product-group" class="select zt-large-select" name="group" aria-label="Product group" onchange="this.form.submit()">
                                    <?php $__currentLoopData = $groups; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $group): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <option value="<?php echo e($group['slug']); ?>" <?php echo e($selectedGroup === $group['slug'] ? 'selected' : ''); ?>>
                                            <?php echo e($group['label']); ?> — <?php echo e($group['count']); ?> plans
                                        </option>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </select>
                            </form>
                            <div class="slider-actions" aria-label="Plan slider controls">
                                <button type="button" class="slider-btn" aria-label="Previous plans" onclick="document.querySelector('.plan-slider').scrollBy({left:-360,behavior:'smooth'})">‹</button>
                                <button type="button" class="slider-btn" aria-label="Next plans" onclick="document.querySelector('.plan-slider').scrollBy({left:360,behavior:'smooth'})">›</button>
                            </div>
                        </div>

                        <div class="plan-slider">
                            <?php $__empty_1 = true; $__currentLoopData = $products; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                                <?php
                                    $cycle = array_key_first($product['available_cycles']);
                                    $price = $product['available_cycles'][$cycle];
                                    $initialConfiguration = $pricing->configurationForProduct($product, $cart->currency, $cycle);
                                    $requiresServerConfiguration = $pricing->productRequiresServerConfiguration($product) || in_array(($product['group_slug'] ?? ''), ['vps-hosting', 'dedicated-server'], true);
                                    $requiresConfiguration = ! empty($initialConfiguration) || $requiresServerConfiguration;
                                ?>
                                <article class="plan-card slider-plan-card" data-plan-card="<?php echo e($product['pid']); ?>">
                                    <?php if($product['requires_domain'] ?? false): ?>
                                        <div class="domain-required">Domain Required</div>
                                    <?php endif; ?>
                                    <h3><?php echo e($product['name']); ?></h3>
                                    <form method="POST" action="<?php echo e(route('cart.add-product')); ?>" class="plan-form" data-ajax-cart>
                                        <?php echo csrf_field(); ?>
                                        <input type="hidden" name="api_pid" value="<?php echo e($product['pid']); ?>">
                                        <label>
                                            Choose Billing Cycle
                                            <select class="select plan-cycle-select" name="billing_cycle" data-plan-cycle="<?php echo e($product['pid']); ?>" onchange="ztUpdatePlanCardPrice(this); ztSyncPlanConfigurationCycle('<?php echo e($product['pid']); ?>', this.value)">
                                                <?php $__currentLoopData = $product['available_cycles']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $cycleKey => $cyclePrice): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                    <option value="<?php echo e($cycleKey); ?>" data-cycle-price="<?php echo e($pricing->formatMoney($cyclePrice, $cart->currency)); ?>"><?php echo e($pricing->cycleLabel($cycleKey)); ?></option>
                                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                            </select>
                                        </label>
                                        <div class="plan-price" data-plan-price><?php echo e($pricing->formatMoney($price, $cart->currency)); ?></div>
                                        <?php if($requiresConfiguration): ?>
                                            <button class="primary-btn" type="button" onclick="ztSelectPlanConfiguration('<?php echo e($product['pid']); ?>')">Select & Configure <span class="btn-circle">+</span></button>
                                        <?php else: ?>
                                            <button class="primary-btn" type="submit">Add to Cart <span class="btn-circle">+</span></button>
                                        <?php endif; ?>
                                    </form>
                                    <ul class="feature-list compact">
                                        <?php $__currentLoopData = array_slice($product['features'], 0, 6); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $feature): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <li><span>✓</span><?php echo e($feature); ?></li>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </ul>
                                </article>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                                <div class="empty-card">No products found for this group.</div>
                            <?php endif; ?>
                        </div>
                        </div>
                        <?php endif; ?>

                        <div id="plan-configurator" class="plan-configurator">
                            <?php $__currentLoopData = $products; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $product): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <?php
                                    $firstCycle = array_key_first($product['available_cycles']);
                                    $requestedConfigurationCycle = (string) request('cycle', '');
                                    $selectedConfigurationCycle = $configuredProductId === (int) $product['pid']
                                        && isset($product['available_cycles'][$requestedConfigurationCycle])
                                            ? $requestedConfigurationCycle
                                            : $firstCycle;
                                    $firstConfiguration = $pricing->configurationForProduct($product, $cart->currency, $selectedConfigurationCycle);
                                    $requiresServerConfiguration = $pricing->productRequiresServerConfiguration($product) || in_array(($product['group_slug'] ?? ''), ['vps-hosting', 'dedicated-server'], true);
                                    $requiresConfiguration = ! empty($firstConfiguration) || $requiresServerConfiguration;
                                ?>

                                <?php if($requiresConfiguration && ($configuredProductId === 0 || (int) $product['pid'] === $configuredProductId)): ?>
                                    <section id="plan-config-panel-<?php echo e($product['pid']); ?>" class="plan-configuration-panel" data-plan-config-panel="<?php echo e($product['pid']); ?>" data-server-configuration="<?php echo e($requiresServerConfiguration ? '1' : '0'); ?>" hidden>
                                        <div class="plan-configuration-head">
                                            <div>
                                                <span class="service-eyebrow">Selected Plan</span>
                                                <h3><?php echo e($product['name']); ?></h3>
                                                <p>Complete the configuration below, then add the configured plan to your cart.</p>
                                            </div>
                                        </div>

                                        <form method="POST" action="<?php echo e(route('cart.add-product')); ?>" data-ajax-cart data-plan-config-form="<?php echo e($product['pid']); ?>">
                                            <?php echo csrf_field(); ?>
                                            <input type="hidden" name="api_pid" value="<?php echo e($product['pid']); ?>">
                                            <input type="hidden" name="billing_cycle" value="<?php echo e($selectedConfigurationCycle); ?>" data-plan-config-cycle-input="<?php echo e($product['pid']); ?>">

                                            <?php if(! $showPlanCatalog): ?>
                                                <div class="plan-configuration-grid">
                                                    <label class="plan-config-field">
                                                        <span>Choose Billing Cycle</span>
                                                        <select class="select" data-plan-cycle="<?php echo e($product['pid']); ?>" onchange="ztSyncPlanConfigurationCycle('<?php echo e($product['pid']); ?>', this.value)">
                                                            <?php $__currentLoopData = $product['available_cycles']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $cycleKey => $cyclePrice): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                                <option value="<?php echo e($cycleKey); ?>" data-cycle-price="<?php echo e($pricing->formatMoney($cyclePrice, $cart->currency)); ?>" <?php echo e($selectedConfigurationCycle === $cycleKey ? 'selected' : ''); ?>>
                                                                    <?php echo e($pricing->cycleLabel($cycleKey)); ?> — <?php echo e($pricing->formatMoney($cyclePrice, $cart->currency)); ?>

                                                                </option>
                                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                                        </select>
                                                    </label>
                                                </div>
                                            <?php endif; ?>

                                            <?php $__currentLoopData = $product['available_cycles']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $cycleKey => $cyclePrice): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                <?php
                                                    $cycleConfiguration = $pricing->configurationForProduct($product, $cart->currency, $cycleKey);
                                                    $cycleIsActive = $cycleKey === $selectedConfigurationCycle;
                                                ?>
                                                <div class="config-cycle-panel" data-plan-cycle-panel="<?php echo e($product['pid']); ?>" data-cycle="<?php echo e($cycleKey); ?>" <?php echo e($cycleIsActive ? '' : 'hidden'); ?>>
                                                    <?php if(! empty($cycleConfiguration)): ?>
                                                        <div class="plan-configuration-grid">
                                                            <?php $__currentLoopData = $cycleConfiguration; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $configGroup): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                                <?php
                                                                    $configType = (int) ($configGroup['type'] ?? 1);
                                                                    $configOptions = data_get($configGroup, 'options.option', []);
                                                                    $firstConfigOption = $configOptions[0] ?? null;
                                                                ?>
                                                                <label class="plan-config-field">
                                                                    <span><?php echo e($configGroup['name']); ?></span>
                                                                    <?php if($configType === 4): ?>
                                                                        <input class="input" type="number" min="0" name="config_options[<?php echo e($configGroup['id']); ?>]" value="0" <?php echo e($cycleIsActive ? '' : 'disabled'); ?>>
                                                                        <?php if(($firstConfigOption['selected_price'] ?? 0) > 0): ?>
                                                                            <small><?php echo e($pricing->formatMoney($firstConfigOption['selected_price'], $cart->currency)); ?> per unit</small>
                                                                        <?php endif; ?>
                                                                    <?php elseif($configType === 3): ?>
                                                                        <select class="select" name="config_options[<?php echo e($configGroup['id']); ?>]" <?php echo e($cycleIsActive ? '' : 'disabled'); ?>>
                                                                            <option value="0">No</option>
                                                                            <option value="1">Yes <?php if(($firstConfigOption['selected_price'] ?? 0) > 0): ?> (+<?php echo e($pricing->formatMoney($firstConfigOption['selected_price'], $cart->currency)); ?>) <?php endif; ?></option>
                                                                        </select>
                                                                    <?php else: ?>
                                                                        <select class="select" name="config_options[<?php echo e($configGroup['id']); ?>]" <?php echo e($cycleIsActive ? '' : 'disabled'); ?>>
                                                                            <?php $__currentLoopData = $configOptions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $configOption): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                                                                <option value="<?php echo e($configOption['id']); ?>">
                                                                                    <?php echo e($configOption['name']); ?>

                                                                                    <?php if(($configOption['selected_price'] ?? 0) > 0): ?>
                                                                                        (+<?php echo e($pricing->formatMoney($configOption['selected_price'], $cart->currency)); ?>)
                                                                                    <?php endif; ?>
                                                                                </option>
                                                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                                                        </select>
                                                                    <?php endif; ?>
                                                                </label>
                                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                                        </div>
                                                    <?php endif; ?>
                                                </div>
                                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>

                                            <?php if($requiresServerConfiguration): ?>
                                                <div class="server-configuration-block">
                                                    <h4>Server Details</h4>
                                                    <div class="server-configuration-grid">
                                                        <label>
                                                            Hostname
                                                            <input class="input" name="hostname" placeholder="server1.example.com" autocomplete="off" required>
                                                        </label>
                                                        <label>
                                                            Root Password
                                                            <input class="input" type="password" name="root_password" placeholder="Minimum 8 characters" minlength="8" autocomplete="new-password" required>
                                                        </label>
                                                        <label>
                                                            NS1 Prefix
                                                            <input class="input" name="ns1_prefix" placeholder="ns1" pattern="[A-Za-z0-9][A-Za-z0-9-]{0,62}" autocomplete="off" required>
                                                        </label>
                                                        <label>
                                                            NS2 Prefix
                                                            <input class="input" name="ns2_prefix" placeholder="ns2" pattern="[A-Za-z0-9][A-Za-z0-9-]{0,62}" autocomplete="off" required>
                                                        </label>
                                                    </div>
                                                </div>
                                            <?php endif; ?>

                                            <div class="plan-config-submit-row">
                                                <p>Your price updates automatically with the selected billing period and options.</p>
                                                <button class="primary-btn" type="submit">Add Configured Plan <span class="btn-circle">+</span></button>
                                            </div>
                                        </form>
                                    </section>
                                <?php endif; ?>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </div>
                    </section>
                    <?php endif; ?>

                    <div id="zt-domain-section">
                        <?php echo $__env->make('checkout.partials.domain-section', [
                            'cart' => $cart,
                            'pricing' => $pricing,
                            'domainResult' => $domainResult,
                            'selectedGroup' => $selectedGroup,
                        ], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                    </div>
                <?php endif; ?>
                <?php if($checkoutStep === 'account'): ?>
                    <form id="checkout-account-form" method="POST" action="<?php echo e(route('checkout.account')); ?>">
                        <?php echo csrf_field(); ?>
                        <?php if(auth()->guard()->guest()): ?>
                            <section class="order-panel clean-panel">
                                <div class="section-heading">
                                    <h2>Account Details</h2>
                                    <p>Login first, or create your account before payment.</p>
                                </div>
                                <div class="signin-grid">
                                    <div class="signin-box">
                                        <h3>Existing Customer</h3>
                                        <p>Login first and your cart will stay attached.</p>
                                        <a class="secondary-btn" href="<?php echo e(route('login')); ?>">Login Here</a>
                                    </div>
                                    <div class="signin-box">
                                        <h3>New Customer</h3>
                                        <p>Create your account, then continue to payment.</p>
                                    </div>
                                </div>

                                <h3 class="subsection-title">Personal Information</h3>
                                <div class="form-grid">
                                    <div class="form-group"><label>First Name</label><input class="input" name="first_name" value="<?php echo e(old('first_name', $checkoutDetails['first_name'] ?? '')); ?>" required></div>
                                    <div class="form-group"><label>Last Name</label><input class="input" name="last_name" value="<?php echo e(old('last_name', $checkoutDetails['last_name'] ?? '')); ?>" required></div>
                                    <div class="form-group"><label>Email Address</label><input class="input" type="email" name="email" value="<?php echo e(old('email', $checkoutDetails['email'] ?? '')); ?>" required></div>
                                    <div class="form-group"><label>Phone Number</label><div class="phone-row"><input class="input code" name="phone_country_code" value="<?php echo e(old('phone_country_code', $checkoutDetails['phone_country_code'] ?? '+92')); ?>"><input class="input" name="phone" value="<?php echo e(old('phone', $checkoutDetails['phone'] ?? '')); ?>" placeholder="3012345678"></div></div>
                                </div>

                                <h3 class="subsection-title">Account Security</h3>
                                <div class="form-grid">
                                    <div class="form-group"><label>Password</label><input class="input" type="password" name="password" required></div>
                                    <div class="form-group"><label>Confirm Password</label><input class="input" type="password" name="password_confirmation" required></div>
                                </div>
                            </section>
                        <?php else: ?>
                            <section class="order-panel compact-panel clean-panel">
                                <h2>Account Details</h2>
                                <p>Logged in as <strong><?php echo e(Auth::user()->email); ?></strong>.</p>
                            </section>
                        <?php endif; ?>

                        <section class="order-panel clean-panel">
                            <div class="section-heading"><h2>Billing Address</h2></div>
                            <div class="form-grid">
                                <div class="form-group"><label>Company Name <?php echo e($hasDomainRegistration ? 'Required for Domain Registration' : 'Optional'); ?></label><input class="input" name="company_name" value="<?php echo e(old('company_name', $checkoutDetails['company_name'] ?? Auth::user()?->profile?->company_name)); ?>" <?php echo e($hasDomainRegistration ? 'required' : ''); ?>></div>
                                <div class="form-group"><label>Country</label><select class="select" name="country" required><option value="PK" <?php echo e(old('country', $checkoutDetails['country'] ?? Auth::user()?->country ?? 'PK') === 'PK' ? 'selected' : ''); ?>>Pakistan</option><option value="US" <?php echo e(old('country', $checkoutDetails['country'] ?? Auth::user()?->country) === 'US' ? 'selected' : ''); ?>>United States</option><option value="GB" <?php echo e(old('country', $checkoutDetails['country'] ?? Auth::user()?->country) === 'GB' ? 'selected' : ''); ?>>United Kingdom</option><option value="AE" <?php echo e(old('country', $checkoutDetails['country'] ?? Auth::user()?->country) === 'AE' ? 'selected' : ''); ?>>United Arab Emirates</option></select></div>
                                <div class="form-group"><label>Street Address</label><input class="input" name="street_address" value="<?php echo e(old('street_address', $checkoutDetails['street_address'] ?? Auth::user()?->profile?->street_address)); ?>" required></div>
                                <div class="form-group"><label>Street Address 2</label><input class="input" name="street_address_2" value="<?php echo e(old('street_address_2', $checkoutDetails['street_address_2'] ?? Auth::user()?->profile?->street_address_2)); ?>"></div>
                                <div class="form-group"><label>City</label><input class="input" name="city" value="<?php echo e(old('city', $checkoutDetails['city'] ?? Auth::user()?->profile?->city)); ?>" required></div>
                                <div class="form-group"><label>State</label><input class="input" name="state" value="<?php echo e(old('state', $checkoutDetails['state'] ?? Auth::user()?->profile?->state)); ?>" required></div>
                                <div class="form-group"><label>Postcode</label><input class="input" name="postcode" value="<?php echo e(old('postcode', $checkoutDetails['postcode'] ?? Auth::user()?->profile?->postcode)); ?>" required></div>
                            </div>
                        </section>
                    </form>
                <?php endif; ?>
                <?php if($checkoutStep === 'payment'): ?>
                    <form id="complete-order-form" method="POST" action="<?php echo e(route('checkout.complete')); ?>" enctype="multipart/form-data">
                        <?php echo csrf_field(); ?>
                        <section class="order-panel clean-panel">
                            <div class="section-heading"><h2>Payment Method</h2></div>
                            <?php if($paymentMethods->isEmpty()): ?>
                                <div class="alert alert-error">Payment methods are temporarily unavailable. Please contact support or try again later.</div>
                            <?php else: ?>
                                <div class="payment-methods">
                                    <?php $__currentLoopData = $paymentMethods; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $method): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <label class="payment-option">
                                            <input type="radio" name="payment_method" value="<?php echo e($method->slug); ?>" <?php echo e($loop->first ? 'checked' : ''); ?>>
                                            <span><strong><?php echo e($method->name); ?></strong><small><?php echo e($method->instructions); ?></small></span>
                                        </label>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </div>
                                <div id="checkout-bank-transfer" style="display:none; margin-top:18px; padding:18px; border:1px solid #e2e8f0; border-radius:16px;">
                                    <h3 style="margin-top:0;">Select Bank or Wallet</h3>
                                    <select class="select" name="payment_channel" data-checkout-bank-channel style="width:100%;">
                                        <option value="">Choose an option</option>
                                        <?php $__currentLoopData = $bankChannels; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $slug => $channel): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <option value="<?php echo e($slug); ?>"><?php echo e($channel['name']); ?></option>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </select>
                                    <div data-checkout-bank-details class="alert alert-warning" style="display:none; margin-top:12px; white-space:pre-line;"></div>
                                    <label style="display:block; margin-top:14px;"><strong>Payment screenshot or PDF</strong><input class="input" type="file" name="payment_proof" accept=".jpg,.jpeg,.png,.webp,.pdf" style="margin-top:7px; width:100%;"></label>
                                    <textarea class="textarea" name="payment_note" maxlength="1000" placeholder="Optional transaction/reference note" style="margin-top:12px;"></textarea>
                                </div>
                            <?php endif; ?>
                        </section>

                        <section class="order-panel clean-panel">
                            <div class="section-heading"><h2>Order Notes</h2></div>
                            <textarea class="textarea" name="customer_note" placeholder="Any notes for this order..."><?php echo e(old('customer_note')); ?></textarea>
                            <label class="radio-line terms-line"><input type="checkbox" name="terms" value="1" required> I agree to the Terms of Service and understand services/domains activate after payment confirmation.</label>
                        </section>
                    </form>
                    <script>
                        (() => {
                            const channels = <?php echo json_encode($bankChannels, 15, 512) ?>;
                            const panel = document.getElementById('checkout-bank-transfer');
                            const radios = document.querySelectorAll('input[name="payment_method"]');
                            const select = panel?.querySelector('[data-checkout-bank-channel]');
                            const proof = panel?.querySelector('input[name="payment_proof"]');
                            const details = panel?.querySelector('[data-checkout-bank-details]');
                            const isBank = value => (value || '').toLowerCase().replace(/[^a-z0-9]/g, '') === 'banktransfer';
                            const refresh = () => {
                                const selected = document.querySelector('input[name="payment_method"]:checked');
                                const show = isBank(selected?.value);
                                if (panel) panel.style.display = show ? 'block' : 'none';
                                if (select) select.required = show;
                                if (proof) proof.required = show;
                            };
                            radios.forEach(radio => radio.addEventListener('change', refresh));
                            select?.addEventListener('change', () => {
                                const item = channels[select.value];
                                if (!item) { details.style.display = 'none'; details.textContent = ''; return; }
                                details.style.display = 'block';
                                details.textContent = item.name + '\nTitle: ' + item.title + '\n' + item.account_label + ': ' + (item.account || 'Not configured');
                            });
                            refresh();
                        })();
                    </script>
                <?php endif; ?>
            </div>

            <aside id="cart-summary" class="checkout-summary">
                <div id="zt-cart-summary" class="summary-card sticky-summary">
                    <?php echo $__env->make('checkout.partials.cart-summary', ['cart' => $cart, 'pricing' => $pricing, 'checkoutStep' => $checkoutStep], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>
                </div>
            </aside>
        </div>
    </div>

    <script>
        function ztUpdatePlanCardPrice(select) {
            const card = select.closest('.plan-card');
            const priceNode = card ? card.querySelector('[data-plan-price]') : null;
            const selected = select.options[select.selectedIndex];

            if (priceNode && selected && selected.dataset.cyclePrice) {
                priceNode.textContent = selected.dataset.cyclePrice;
            }
        }

        function ztSyncPlanConfigurationCycle(productId, cycle) {
            const panel = document.querySelector(`[data-plan-config-panel="${productId}"]`);
            if (!panel) return;

            const cycleInput = panel.querySelector(`[data-plan-config-cycle-input="${productId}"]`);
            if (cycleInput) cycleInput.value = cycle;

            panel.querySelectorAll(`[data-plan-cycle-panel="${productId}"]`).forEach((cyclePanel) => {
                const isActive = cyclePanel.dataset.cycle === cycle;
                cyclePanel.hidden = !isActive;
                cyclePanel.querySelectorAll('input, select, textarea').forEach((control) => {
                    control.disabled = !isActive;
                });
            });
        }

        function ztSelectPlanConfiguration(productId) {
            document.querySelectorAll('[data-plan-config-panel]').forEach((panel) => {
                panel.hidden = panel.dataset.planConfigPanel !== String(productId);
            });

            document.querySelectorAll('[data-plan-card]').forEach((card) => {
                card.classList.toggle('is-selected', card.dataset.planCard === String(productId));
            });

            const cycleSelect = document.querySelector(`[data-plan-cycle="${productId}"]`);
            if (cycleSelect) {
                ztSyncPlanConfigurationCycle(productId, cycleSelect.value);
            }

            const panel = document.querySelector(`[data-plan-config-panel="${productId}"]`);
            if (panel) {
                const catalog = document.querySelector('[data-plan-catalog]');
                if (catalog && panel.dataset.serverConfiguration === '1') {
                    catalog.hidden = true;
                }
                panel.hidden = false;
                panel.scrollIntoView({behavior: 'smooth', block: 'start'});
            }
        }

        function ztClosePlanConfiguration(productId) {
            const panel = document.querySelector(`[data-plan-config-panel="${productId}"]`);
            const card = document.querySelector(`[data-plan-card="${productId}"]`);
            if (panel) panel.hidden = true;
            const catalog = document.querySelector('[data-plan-catalog]');
            if (catalog) catalog.hidden = false;
            if (card) {
                card.classList.remove('is-selected');
                card.scrollIntoView({behavior: 'smooth', block: 'center', inline: 'center'});
            }
        }

        function ztCsrfToken() {
            const token = document.querySelector('input[name="_token"]');
            return token ? token.value : '';
        }

        function ztSetButtonLoading(form, loading) {
            const buttons = form.querySelectorAll('button[type="submit"], input[type="submit"], .zt-term-option');
            buttons.forEach((button) => {
                button.disabled = loading;

                // Term tiles contain structured labels and prices. Disable them
                // during the request without replacing their internal markup.
                if (button.classList.contains('zt-term-option')) {
                    return;
                }

                if (loading && !button.dataset.originalText) {
                    button.dataset.originalText = button.textContent;
                    button.textContent = 'Please wait...';
                } else if (!loading && button.dataset.originalText) {
                    button.textContent = button.dataset.originalText;
                    delete button.dataset.originalText;
                }
            });
        }

        let ztCheckoutMessageTimer = null;

        function ztDismissCheckoutMessage(box, delay = 5000) {
            if (!box) return;
            window.clearTimeout(ztCheckoutMessageTimer);
            ztCheckoutMessageTimer = window.setTimeout(() => {
                box.classList.add('is-hiding');
                window.setTimeout(() => box.remove(), 260);
            }, delay);
        }

        function ztShowCheckoutMessage(message, isError = false) {
            if (!message) return;

            let box = document.querySelector('[data-checkout-live-message]');
            if (!box) {
                box = document.createElement('div');
                box.setAttribute('data-checkout-live-message', '1');
                const header = document.querySelector('.checkout-page-head');
                if (header) header.appendChild(box);
            }

            box.className = isError
                ? 'alert alert-error checkout-head-message'
                : 'alert alert-success checkout-head-message';
            box.textContent = message;
            box.classList.remove('is-hiding');

            if (!isError) {
                ztDismissCheckoutMessage(box, 5000);
            } else {
                window.clearTimeout(ztCheckoutMessageTimer);
            }
        }

        function ztToggleMobileCartSummary(forceOpen = null) {
            const panel = document.getElementById('zt-cart-summary');
            const toggle = document.querySelector('.zt-cart-summary-toggle');
            if (!panel || !toggle) return;

            const shouldOpen = forceOpen === null ? panel.classList.contains('zt-mobile-summary-collapsed') : Boolean(forceOpen);
            panel.classList.toggle('zt-mobile-summary-collapsed', !shouldOpen);
            toggle.setAttribute('aria-expanded', shouldOpen ? 'true' : 'false');
        }

        function ztUpdateCartSummaryToggle() {
            const panel = document.getElementById('zt-cart-summary');
            const totalNode = panel ? panel.querySelector('.summary-total strong') : null;
            const toggleTotal = document.querySelector('[data-cart-summary-toggle-total]');

            if (totalNode && toggleTotal) {
                toggleTotal.textContent = totalNode.textContent.trim();
            }
        }

        function ztSelectCartPeriod(button) {
            const form = button?.closest('.zt-cart-period-form');
            const field = button?.dataset.cartPeriodField;
            const value = button?.dataset.cartPeriodValue;

            if (!form || !field || value === undefined) return;

            const input = form.querySelector(`input[name="${field}"]`);
            if (!input || input.value === value) return;

            input.value = value;
            form.querySelectorAll('.zt-term-option').forEach((option) => {
                const active = option === button;
                option.classList.toggle('is-active', active);
                option.setAttribute('aria-pressed', active ? 'true' : 'false');

                const footer = option.querySelector('small');
                if (footer) footer.textContent = active ? 'Selected' : 'Choose term';
            });

            form.requestSubmit();
        }

        async function ztSubmitAjaxCartForm(form) {
            if (!form || form.dataset.submitting === '1') return;
            form.dataset.submitting = '1';
            ztSetButtonLoading(form, true);

            try {
                const response = await fetch(form.action, {
                    method: form.method || 'POST',
                    headers: {
                        'Accept': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest',
                        'X-CSRF-TOKEN': ztCsrfToken(),
                        'X-ZT-Checkout-Step': '<?php echo e($checkoutStep); ?>',
                        'X-ZT-Checkout-Group': '<?php echo e($selectedGroup); ?>',
                    },
                    body: new FormData(form),
                });

                const data = await response.json().catch(() => ({}));
                if (!response.ok || data.ok === false) {
                    ztShowCheckoutMessage(data.message || 'Cart update failed.', true);
                    return;
                }

                if (data.cart_html) {
                    const summary = document.getElementById('zt-cart-summary');
                    if (summary) {
                        summary.innerHTML = data.cart_html;
                        ztUpdateCartSummaryToggle();
                    }
                }

                if (Object.prototype.hasOwnProperty.call(data, 'cart_items_html')) {
                    const cartItems = document.getElementById('zt-cart-items');
                    if (cartItems) {
                        cartItems.innerHTML = data.cart_items_html || '';
                    }
                }

                if (data.domain_section_html) {
                    const domainSection = document.getElementById('zt-domain-section');
                    if (domainSection) {
                        domainSection.innerHTML = data.domain_section_html;
                        ztStartBrandProtectionSearch();
                    }
                }

                ztShowCheckoutMessage(data.message || 'Cart updated.');
            } catch (error) {
                ztShowCheckoutMessage('Network error. Please try again.', true);
            } finally {
                form.dataset.submitting = '0';
                ztSetButtonLoading(form, false);
            }
        }

        let ztDomainSuggestionRun = 0;

        function ztCurrentSuggestionList() {
            return document.getElementById('zt-domain-alternative-list');
        }

        async function ztCheckDomainDnsRecords(domain, timeoutMs = 1400) {
            const controller = new AbortController();
            const timeout = window.setTimeout(() => controller.abort(), timeoutMs);

            try {
                let normalized = String(domain || '')
                    .trim()
                    .toLowerCase()
                    .replace(/^https?:\/\//, '')
                    .replace(/^www\./, '')
                    .split(/[\/?#]/)[0]
                    .replace(/\.$/, '');

                if (normalized && !normalized.includes('.')) {
                    normalized += '.com';
                }

                if (!normalized) {
                    return {checked: false, hasRecords: false};
                }

                const encoded = encodeURIComponent(normalized);
                const requests = ['A', 'AAAA', 'NS'].map((type) =>
                    fetch(`https://dns.google/resolve?name=${encoded}&type=${type}`, {
                        cache: 'no-store',
                        signal: controller.signal,
                    }).then((response) => response.ok ? response.json() : null)
                );

                const responses = await Promise.all(requests);
                const hasRecords = responses.some((payload) => Array.isArray(payload?.Answer) && payload.Answer.length > 0);

                return {checked: true, hasRecords};
            } catch (error) {
                return {checked: false, hasRecords: false};
            } finally {
                window.clearTimeout(timeout);
            }
        }

        async function ztCheckDomainSuggestion(candidate, operation, runId, list, context = 'suggestion') {
            const dnsResult = await ztCheckDomainDnsRecords(candidate);
            if (list.dataset.runId !== runId) return null;

            // Positive DNS is enough to mark a registration suggestion as taken.
            // No DNS is not proof of availability, so authoritative WHOIS still runs.
            if (dnsResult.checked && dnsResult.hasRecords) {
                return null;
            }

            const formData = new FormData();
            formData.append('candidate_domain', candidate);
            formData.append('operation', operation);
            formData.append('context', context);

            try {
                const response = await fetch('<?php echo e(route('checkout.domain-suggestion')); ?>', {
                    method: 'POST',
                    headers: {
                        'Accept': 'application/json',
                        'X-Requested-With': 'XMLHttpRequest',
                        'X-CSRF-TOKEN': ztCsrfToken(),
                    },
                    body: formData,
                });

                const data = await response.json().catch(() => ({}));
                if (list.dataset.runId !== runId) return null;

                return response.ok && data.available && data.result_html
                    ? data.result_html
                    : null;
            } catch (error) {
                return null;
            }
        }

        async function ztStartDomainSuggestionSearch(list) {
            if (!list) return;

            let candidates = [];
            try {
                candidates = JSON.parse(list.dataset.candidates || '[]');
            } catch (error) {
                candidates = [];
            }

            const itemsNode = list.querySelector('[data-domain-suggestion-items]');
            const statusNode = list.querySelector('[data-domain-suggestion-status]');
            const operation = list.dataset.operation || 'register';
            const maxResults = parseInt(list.dataset.maxResults || '6', 10);
            const runId = String(++ztDomainSuggestionRun);
            let found = itemsNode ? itemsNode.children.length : 0;
            let nextIndex = 0;
            let checked = 0;

            list.dataset.runId = runId;

            if (!itemsNode || candidates.length === 0) {
                if (statusNode) statusNode.textContent = 'No suggestions available for this domain.';
                return;
            }

            const worker = async () => {
                while (nextIndex < candidates.length && found < maxResults && list.dataset.runId === runId) {
                    const index = nextIndex++;
                    const candidate = candidates[index];
                    const resultHtml = await ztCheckDomainSuggestion(candidate, operation, runId, list);
                    checked++;

                    if (list.dataset.runId !== runId) return;

                    if (resultHtml && found < maxResults) {
                        itemsNode.insertAdjacentHTML('beforeend', resultHtml);
                        found++;
                    }

                    if (statusNode) {
                        statusNode.textContent = found > 0
                            ? `Found ${found} available option${found === 1 ? '' : 's'}. Checked ${checked}/${candidates.length}.`
                            : `Checking suggestions... ${checked}/${candidates.length}`;
                    }
                }
            };

            const workerCount = Math.min(4, candidates.length);
            await Promise.all(Array.from({length: workerCount}, () => worker()));

            if (list.dataset.runId !== runId) return;

            if (statusNode) {
                statusNode.textContent = found > 0
                    ? `Found ${found} available option${found === 1 ? '' : 's'}.`
                    : 'No available suggestions found. Try another name or TLD.';
            }
        }

        function ztStartVisibleDomainSuggestionSearch() {
            const list = ztCurrentSuggestionList();
            if (list) {
                ztStartDomainSuggestionSearch(list);
            }
        }

        async function ztStartBrandProtectionSearch() {
            const list = document.getElementById('zt-brand-protection-list');
            if (!list || list.dataset.started === '1') return;

            let candidates = [];
            try {
                candidates = JSON.parse(list.dataset.candidates || '[]');
            } catch (error) {
                candidates = [];
            }

            const itemsNode = list.querySelector('[data-brand-protection-items]');
            const statusNode = list.querySelector('[data-brand-protection-status]');
            const operation = list.dataset.operation || 'register';
            const maxResults = parseInt(list.dataset.maxResults || '7', 10);
            const runId = String(++ztDomainSuggestionRun);
            let nextIndex = 0;
            let checked = 0;
            let found = 0;

            list.dataset.started = '1';
            list.dataset.runId = runId;

            if (!itemsNode || candidates.length === 0) {
                if (statusNode) statusNode.textContent = 'No additional supported extensions are available.';
                return;
            }

            const worker = async () => {
                while (nextIndex < candidates.length && found < maxResults && list.dataset.runId === runId) {
                    const candidate = candidates[nextIndex++];
                    const resultHtml = await ztCheckDomainSuggestion(candidate, operation, runId, list, 'brand');
                    checked++;

                    if (list.dataset.runId !== runId) return;

                    if (resultHtml && found < maxResults) {
                        itemsNode.insertAdjacentHTML('beforeend', resultHtml);
                        found++;
                    }

                    if (statusNode) {
                        statusNode.textContent = found > 0
                            ? `Found ${found} available extension${found === 1 ? '' : 's'}.`
                            : `Checking extensions... ${checked}/${candidates.length}`;
                    }
                }
            };

            const workerCount = Math.min(4, candidates.length);
            await Promise.all(Array.from({length: workerCount}, () => worker()));

            if (list.dataset.runId !== runId || !statusNode) return;
            statusNode.textContent = found > 0
                ? 'Available extensions for your brand'
                : 'No additional extensions are currently available.';
        }

        document.addEventListener('submit', async function (event) {
            const cartForm = event.target.closest('[data-ajax-cart]');
            if (cartForm) {
                event.preventDefault();
                await ztSubmitAjaxCartForm(cartForm);
                return;
            }

            const domainForm = event.target.closest('[data-ajax-domain-search]');
            if (domainForm) {
                event.preventDefault();
                if (domainForm.dataset.submitting === '1') return;
                domainForm.dataset.submitting = '1';
                ztSetButtonLoading(domainForm, true);

                try {
                    // Submit immediately. The authoritative registry/WHMCS
                    // lookup runs server-side; waiting for a second browser DNS
                    // lookup here was adding avoidable latency to the first search.
                    const formData = new FormData(domainForm);

                    const response = await fetch('<?php echo e(route('checkout.domain-search')); ?>', {
                        method: 'POST',
                        headers: {
                            'Accept': 'application/json',
                            'X-Requested-With': 'XMLHttpRequest',
                            'X-CSRF-TOKEN': ztCsrfToken(),
                        },
                        body: formData,
                    });

                    const data = await response.json().catch(() => ({}));
                    const result = document.getElementById('zt-domain-result');
                    if (result && data.result_html) {
                        result.innerHTML = data.result_html;
                        ztStartVisibleDomainSuggestionSearch();
                    }

                    if (!response.ok || data.ok === false) {
                        ztShowCheckoutMessage(data.message || 'Domain search failed.', true);
                    }
                } catch (error) {
                    ztShowCheckoutMessage('Network error. Please try again.', true);
                } finally {
                    domainForm.dataset.submitting = '0';
                    ztSetButtonLoading(domainForm, false);
                }
            }
        });

        document.addEventListener('DOMContentLoaded', function () {
            const initialMessage = document.querySelector('[data-checkout-live-message][data-auto-dismiss]');
            if (initialMessage) {
                ztDismissCheckoutMessage(initialMessage, Number(initialMessage.dataset.autoDismiss || 5000));
            }

            ztStartVisibleDomainSuggestionSearch();
            ztStartBrandProtectionSearch();
            ztUpdateCartSummaryToggle();

            <?php if((int) request('configure', 0) > 0): ?>
                const productId = <?php echo json_encode((string) request('configure'), 15, 512) ?>;
                const requestedCycle = <?php echo json_encode((string) request('cycle', ''), 512) ?>;
                const cycleSelect = document.querySelector(`[data-plan-cycle="${productId}"]`);
                if (cycleSelect && requestedCycle && [...cycleSelect.options].some(option => option.value === requestedCycle)) {
                    cycleSelect.value = requestedCycle;
                    ztUpdatePlanCardPrice(cycleSelect);
                }
                ztSelectPlanConfiguration(productId);
            <?php endif; ?>
        });
    </script>

    <?php echo $__env->make('components.browser-currency-detector', ['cart' => $cart, 'currencyInfo' => $currencyInfo], array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?>

 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php /**PATH /home/ovbopdha/public_html/ztcart.eagale.xyz/resources/views/checkout/index.blade.php ENDPATH**/ ?>