/* ─────────────────────────────────────────────
   PRODUCT PAGE
───────────────────────────────────────────── */
.product-main-container {
    display: flex;
    align-items: center;
    font-family: "Montserrat", sans-serif;

    .product-image-slider {
        display: flex;
        flex-direction: column;
        gap: 10px;
    }
    .slider-for .product-image {
        display: flex !important;
        justify-content: center;
        align-items: center;
        border: 5px solid #104860;
        border-radius: 15px;
    }
    .slider-for .product-image img {
        width: 100%;
        height: 100%;
        border-radius: 15px;
        object-fit: contain;
    }
    .slider-nav .product-image {
        margin: 0 5px;
    }
    .slider-nav .product-image.slick-current img {
        opacity: 1 !important;
        border: 5px solid #104860 !important;
    }
    .slider-nav .product-image img {
        object-fit: cover;
        border-radius: 15px;
        border: 5px solid rgba(0, 0, 0, 0);
        cursor: pointer;
        opacity: 0.75;
    }
    .slider-nav .slick-current .product-image img {
        opacity: 1;
        outline: 2px solid #333;
    }
    .right-column {
        flex: 1;
    }
    .slick-arrow {
        width: 50px !important;
        height: 50px !important;
    }
    .slick-arrow path {
        color: #104860;
    }
    h2.product-title {
        color: #104860;
    }
    .add-to-quote input {
        font-family: "Montserrat", sans-serif;
        border-radius: 5px;
        border: 1px solid #000 !important;
        outline: unset !important;
    }
    .add-to-quote {
        display: flex;
        align-items: center;
        gap: 15px;
        padding-top: 15px;
    }
    button.btn-quote {
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 35px;
        color: #fff;
        background-color: #104860;
        cursor: pointer;
        transition: all ease-in-out 0.2s;
        font-family: "Montserrat", sans-serif;
        font-weight: 600;
    }
    button.btn-quote:hover {
        transform: scale(0.95);
        transition: all ease-in-out 0.2s;
    }
}

/* ─────────────────────────────────────────────
   RELATED PRODUCTS
───────────────────────────────────────────── */
.related-main-container {
    .related-container {
        display: grid;
    }
    .related-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        cursor: pointer;
        gap: 10px;
        text-decoration: none;
    }
    .related-image {
        width: 100%;
        object-fit: contain;
    }
    .related-name {
        font-family: "Montserrat", sans-serif;
        font-style: italic;
        font-size: 1.05rem;
        font-weight: 500;
        color: #104860;
        line-height: 1.35;
    }
    .related-category {
        font-size: 16px;
        font-family: "Montserrat", sans-serif;
        font-weight: 600;
        color: #000;
    }
    h3.related-header {
        text-align: center;
        font-family: "Montserrat", sans-serif;
        color: #104860;
    }
}

/* ─────────────────────────────────────────────
   CART WIDGET
───────────────────────────────────────────── */
#tw-cart-widget {
    position: fixed;
    display: inline-flex;
    align-items: center;
    font-family: inherit;
    z-index: 999;

    #tw-cart-trigger {
        display: inline-flex;
        align-items: center;
        background: none;
        border: none;
        cursor: pointer;
        padding: 6px 4px;
        color: inherit;
        position: relative;
        background-color: rgba(16, 72, 96, 1);
        border-radius: 50%;
        border: 2px solid #fff;
        padding: 10px;
        box-shadow: 2px 2px 7px 5px rgba(140, 140, 140, 0.29);
        transition: all ease-in-out 0.2s;

        &:hover {
            transform: scale(1.1);
            transition: all ease-in-out 0.2s;
        }

        svg {
            width: 22px;
            height: 22px;
            display: block;
            color: #fff;
        }
    }

    #tw-cart-badge {
        display: none;
        position: absolute;
        top: -2px;
        right: -6px;
        background: #e07a34;
        color: #fff;
        font-size: 10px;
        font-weight: 700;
        line-height: 1;
        min-width: 17px;
        height: 17px;
        border-radius: 999px;
        align-items: center;
        justify-content: center;
        padding: 0 4px;
        pointer-events: none;
    }

    #tw-cart-dropdown {
        display: none;
        flex-direction: column;
        justify-content: space-between;
        position: absolute;
        height: 250px;
        width: 300px;
        background: #fff;
        border: 1px solid #e8e8e8;
        border-radius: 10px;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.13);
        z-index: 9999;
        overflow: unset;
        right: calc(100% + 10px);
        top: 50%;
        transform: translateY(-50%);
        bottom: unset;

        &.open {
            display: flex;
        }
    }

    .tw-cart-header {
        padding: 13px 16px 10px;
        font-size: 13px;
        font-weight: 600;
        color: #222;
        border-bottom: 1px solid #f0f0f0;
    }

    .tw-cart-items {
        max-height: 240px;
        overflow-y: scroll;
        padding: 6px 0;
        height: 50%;
    }

    .tw-cart-item {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 8px 16px;

        &:hover {
            background: #faf8f6;
        }
    }

    .tw-cart-remove {
        flex-shrink: 0;
        background: none;
        border: none;
        cursor: pointer;
        color: #c0392b;
        font-size: 17px;
        line-height: 1;
        padding: 0 2px;
        opacity: 0.7;

        &:hover {
            opacity: 1;
        }
    }

    .tw-cart-thumb {
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        object-fit: cover;
        border-radius: 5px;
        border: 1px solid #eee;
    }

    .tw-cart-info {
        flex: 1;
        min-width: 0;
    }

    .tw-cart-name {
        display: block;
        font-size: 12.5px;
        font-weight: 600;
        color: #e07a34;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .tw-cart-qty {
        display: block;
        font-size: 11.5px;
        color: #888;
        margin-top: 2px;
    }

    .tw-cart-empty {
        padding: 22px 16px;
        text-align: center;
        color: #aaa;
        font-size: 13px;
    }

    .tw-cart-footer {
        padding: 10px 16px 14px;
        border-top: 1px solid #f0f0f0;
    }

    .tw-cart-view-btn {
        display: block;
        width: 100%;
        text-align: center;
        padding: 9px 0;
        border: 1.5px solid #104860;
        border-radius: 6px;
        font-size: 13px;
        font-weight: 600;
        color: #222;
        text-decoration: none;
        background: #fff;
        cursor: pointer;
        transition: background 0.14s, color 0.14s;

        &:hover {
            background: #104860;
            color: #fff;
        }
    }
}

/* ─────────────────────────────────────────────
   QUOTE PAGE
───────────────────────────────────────────── */
.quote-main-container {
    a {
        color: #104860;
        text-decoration: none;
    }
    a:hover {
        text-decoration: underline;
    }

    img {
        display: block;
        max-width: 100%;
    }

    p,
    label {
        font-family: "Montserrat", sans-serif;
    }

    /* ── Page Header ── */
    .page-header {
        text-align: center;
        padding: 40px 24px 24px;
        border-bottom: 1px solid #ede8e0;
    }

    .page-title {
        font-family: "Montserrat", sans-serif;
        font-weight: 600;
        font-size: clamp(1.75rem, 4vw, 2.5rem);
        letter-spacing: 0.01em;
        color: #2c2820;
    }

    /* ── Step Numbers ── */
    .step-number {
        font-family: "Montserrat", sans-serif;
        font-size: 2rem;
        font-weight: 600;
        color: #104860;
        line-height: 1;
        flex-shrink: 0;
    }

    /* ── Step 1 Card ── */
    .step-card {
        background: #f5f0e8;
        border: 1px solid #ddd6cc;
        border-radius: 10px;
    }

    .step-heading {
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
        font-size: 1.05rem;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: #2c2820;
        margin-bottom: 4px;
    }

    .step-sub {
        font-size: 0.875rem;
        color: #7a7268;
        font-weight: 300;
    }

    /* ── Dealer Search Input Row ── */
    .dealer-search {
        display: flex;
        gap: 8px;
        align-items: center;
    }

    .dealer-input {
        flex: 1;
        padding: 10px 14px !important;
        border: 1px solid #ddd6cc !important;
        border-radius: 3px;
        background: #ffffff;
        font-family: "Montserrat", sans-serif;
        font-weight: 300;
        font-size: 0.875rem;
        color: #2c2820;
        outline: none;
        transition: border-color 0.2s, box-shadow 0.2s;

        &:focus {
            border-color: #104860;
            box-shadow: 0 0 0 3px rgba(107, 158, 160, 0.25);
        }
        &::placeholder {
            color: #a09790;
        }
    }

    /* ── Dealer Search Loading / No Results ── */
    .dealer-search-loading {
        display: none;
        align-items: center;
        gap: 10px;
        margin-top: 14px;
        color: #7a7268;
        font-size: 0.875rem;

        &.is-visible {
            display: flex;
        }
    }

    .dealer-search-spinner {
        width: 18px;
        height: 18px;
        border: 2px solid #ddd6cc;
        border-top-color: #104860;
        border-radius: 50%;
        animation: tw-spin 0.7s linear infinite;
        flex-shrink: 0;
    }

    @keyframes tw-spin {
        to { transform: rotate(360deg); }
    }

    .dealer-no-results {
        display: none;
        margin-top: 14px;
        color: #7a7268;
        font-size: 0.875rem;
    }

    /* ── Dealer Results Grid ── */
    #dealerResults {
        display: none;
        margin-top: 20px;
    }

    .dealer-results-grid {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
        gap: 16px;
    }

    .dealer-card {
        border: 1px solid #ddd6cc;
        border-radius: 8px;
        overflow: hidden;
        background: #fff;
        display: flex;
        flex-direction: column;
        transition: box-shadow 0.2s;

        &:hover {
            box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
        }

        &.is-closest {
            border-color: #104860;
        }
    }

    .dealer-card-badge {
        background: #104860;
        color: #fff;
        font-family: "Montserrat", sans-serif;
        font-size: 10px;
        font-weight: 600;
        letter-spacing: 0.07em;
        text-transform: uppercase;
        padding: 5px 10px;
        text-align: center;
    }

    .dealer-card-img {
        width: 100%;
        height: 130px;
        object-fit: cover;
        display: block;
    }

    .dealer-card-body {
        padding: 12px;
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 3px;
    }

    .dealer-card-name {
        font-family: "Montserrat", sans-serif;
        font-weight: 700;
        font-size: 13px;
        color: #2c2820;
        margin: 0;
    }

    .dealer-card-distance {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        color: #a09790;
        margin: 0;
    }

    .dealer-card-address {
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        color: #7a7268;
        margin: 0;
        line-height: 1.4;
    }

    .dealer-card-actions {
        display: flex;
        gap: 8px;
        padding: 10px 12px 12px;
    }

    .btn-set-dealer {
        flex: 1;
        background: #104860;
        color: #fff;
        border: none;
        border-radius: 3px;
        padding: 8px 10px;
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        cursor: pointer;
        transition: all ease-in-out 0.2s;

        &:hover {
            transform: scale(0.97);
        }
    }

    .btn-more-info {
        background: transparent;
        color: #104860;
        border: 1px solid #104860;
        border-radius: 3px;
        padding: 8px 10px;
        font-family: "Montserrat", sans-serif;
        font-size: 11px;
        font-weight: 600;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        cursor: pointer;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        transition: all ease-in-out 0.2s;

        &:hover {
            background: #104860;
            color: #fff;
            text-decoration: none;
        }
    }

    /* ── Selected Dealer Banner ── */
    #dealerSelected {
        display: none;
        margin-top: 16px;
    }

    .dealer-selected-banner {
        display: flex;
        align-items: center;
        gap: 16px;
        background: #eef4f6;
        border: 1px solid #c0d8e2;
        border-radius: 8px;
        padding: 16px;
    }

    .dealer-selected-img {
        width: 80px;
        height: 60px;
        object-fit: cover;
        border-radius: 4px;
        flex-shrink: 0;
    }

    .dealer-selected-info {
        flex: 1;
        min-width: 0;
    }

    .dealer-selected-name {
        font-family: "Montserrat", sans-serif;
        font-weight: 700;
        font-size: 14px;
        color: #2c2820;
        margin: 0 0 2px;
    }

    .dealer-selected-phone,
    .dealer-selected-address {
        font-family: "Montserrat", sans-serif;
        font-size: 12px;
        color: #7a7268;
        margin: 0;
    }

    .dealer-selected-links {
        display: flex;
        gap: 14px;
        margin-top: 6px;

        a {
            font-size: 12px;
            color: #104860;
            text-decoration: underline;
            cursor: pointer;

            &:hover {
                color: #0c3347;
            }
        }
    }

    /* ── Buttons ── */
    .btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-family: "Montserrat", sans-serif;
        font-weight: 400;
        font-size: 0.875rem;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        border: none;
        border-radius: 3px;
        cursor: pointer;
        transition: all ease-in-out 0.2s;
        white-space: nowrap;
        text-decoration: none;
    }

    .btn-search {
        padding: 10px 20px;
        background: #104860;
        color: #fff;

        &:hover {
            transform: scale(0.95);
        }
    }

    .btn-outline {
        padding: 8px 18px;
        background: #104860;
        color: #fff;

        &:hover {
            transform: scale(0.95);
            text-decoration: none;
        }
    }

    .btn-ghost {
        padding: 6px 14px;
        background: #b85c5c;
        color: #fff;

        &:hover {
            transform: scale(0.95);
            text-decoration: none;
        }
    }

    .btn-sm {
        font-size: 0.8rem;
        padding: 6px 14px;
    }

    .btn-submit {
        width: 100%;
        padding: 14px;
        background: #104860;
        color: #fff;
        font-size: 0.9rem;
        letter-spacing: 0.1em;
        border-radius: 3px;
        margin-top: 16px;
        cursor: pointer;
        transition: background 0.2s;

        &:hover:not(:disabled) {
            background: #0c3347;
        }
        &:disabled {
            background: #d5cec7;
            color: #a09790;
            cursor: not-allowed;
        }
    }

    /* ── Cart Empty State ── */
    .cart-empty {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 16px;
        min-height: 260px;
        text-align: center;
    }

    .empty-icon-wrap {
        width: 72px;
        height: 72px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px dashed #ddd6cc;
        border-radius: 50%;
        color: #a09790;
    }

    .empty-icon {
        width: 36px;
        height: 36px;
    }

    .empty-text {
        font-size: 0.9rem;
        color: #7a7268;
        max-width: 280px;
        line-height: 1.5;
    }

    /* ── Cart Filled State ── */
    .cart-topbar {
        margin-bottom: 16px;
    }

    .cart-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 0.875rem;
    }

    .cart-table thead tr {
        border-bottom: 1px solid #ddd6cc;
    }

    .cart-table th {
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
        font-size: 0.75rem;
        letter-spacing: 0.08em;
        text-transform: uppercase;
        color: #7a7268;
        padding: 6px 8px 10px;
        text-align: left;
    }

    .cart-row {
        border-bottom: 1px solid #ede8e0;

        &:last-child {
            border-bottom: none;
        }

        td {
            padding: 14px 8px;
            vertical-align: middle;
        }
    }

    .col-remove { width: 28px; }
    .col-thumb  { width: 88px; }
    .col-qty    { width: 72px; }

    .remove-btn {
        background: none;
        border: none;
        color: #b85c5c;
        font-size: 1.25rem;
        line-height: 1;
        cursor: pointer;
        padding: 2px 6px;
        border-radius: 3px;
        transition: background 0.15s;

        &:hover {
            background: rgba(184, 92, 92, 0.1);
        }
    }

    .product-thumb {
        width: 72px;
        height: 72px;
        object-fit: cover;
        border-radius: 3px;
        border: 1px solid #ede8e0;
    }

    .product-name {
        display: block;
        font-weight: 400;
        font-size: 0.9rem;
        color: #104860;
        margin-bottom: 2px;

        &:hover {
            text-decoration: underline;
        }
    }

    .product-meta {
        display: block;
        font-size: 0.78rem;
        color: #7a7268;
        font-style: italic;
        margin-bottom: 4px;
    }

    .qty-input {
        width: 60px;
        padding: 6px 8px;
        border: 1px solid #ddd6cc;
        border-radius: 3px;
        font-family: "Montserrat", sans-serif;
        font-size: 0.875rem;
        font-weight: 400;
        color: #2c2820;
        text-align: center;
        outline: none;
        background: #ffffff;
        transition: border-color 0.2s, box-shadow 0.2s;

        &:focus {
            border-color: #104860;
            box-shadow: 0 0 0 3px rgba(107, 158, 160, 0.25);
        }
    }

    .cart-footer {
        margin-top: 16px;
        display: flex;
        justify-content: flex-start;
    }

    /* ── Quote Form ── */
    .form-heading {
        font-family: "Montserrat", sans-serif;
        font-weight: 500;
        font-size: 1.5rem;
        letter-spacing: 0.01em;
        margin-bottom: 4px;
    }

    .form-sub {
        font-size: 0.84rem;
        color: #7a7268;
        margin-bottom: 24px;
        line-height: 1.6;
    }

    .form-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .field {
        display: flex;
        flex-direction: column;
        gap: 5px;
        margin-bottom: 16px;
    }

    .field-label {
        font-size: 0.8rem;
        font-weight: 400;
        letter-spacing: 0.04em;
        color: #2c2820;
        text-align: left;
    }

    .req {
        color: #b85c5c;
    }

    .field-input {
        padding: 9px 12px;
        border: 1px solid #ddd6cc;
        border-radius: 3px;
        background: #ffffff;
        font-family: "Montserrat", sans-serif;
        font-weight: 300;
        font-size: 0.875rem;
        color: #2c2820;
        outline: none;
        width: auto;
        transition: border-color 0.2s, box-shadow 0.2s;
        appearance: none;

        &:focus {
            border-color: #104860;
            box-shadow: 0 0 0 3px rgba(107, 158, 160, 0.25);
        }
        &::placeholder {
            color: #a09790;
        }
    }

    .field-select {
        cursor: pointer;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%237a7268' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 12px center;
        padding-right: 32px;
    }

    .field-textarea {
        resize: vertical;
        min-height: 90px;
    }

    .radio-group {
        display: flex;
        gap: 24px;
        padding: 6px 0;
    }

    .radio-label {
        display: flex;
        align-items: center;
        gap: 7px;
        font-size: 0.875rem;
        cursor: pointer;
        color: #2c2820;

        input[type="radio"] {
            accent-color: #104860;
            width: 15px;
            height: 15px;
            cursor: pointer;
        }
    }

    .form-notice {
        font-size: 0.8rem;
        color: #7a7268;
        line-height: 1.6;
        margin-bottom: 8px;
    }

    .checkbox-label {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        font-size: 0.85rem;
        cursor: pointer;
        margin-top: 8px;
        color: #2c2820;

        input[type="checkbox"] {
            accent-color: #104860;
            width: 15px;
            height: 15px;
            margin-top: 2px;
            cursor: pointer;
            flex-shrink: 0;
        }
    }

    /* ── Utility ── */
    .hidden {
        display: none !important;
    }
}

/* ─────────────────────────────────────────────
   TABLET & DESKTOP  (min-width: 768px)
───────────────────────────────────────────── */
@media (min-width: 768px) {

    /* Product */
    .product-main-container {
        padding: 15px;
        flex-direction: row;
        align-items: flex-start;
        text-align: left;
        gap: 40px;

        .left-column {
            width: 50%;
            padding: 20px;
        }
        .right-column {
            width: 50%;
            padding: 15px;

            h2.product-title {
                margin: 15px 0;
            }
        }
        .slider-for .product-image {
            height: 400px;
        }
        .slider-nav .product-image img {
            height: 150px;
        }
        .slider-nav .slick-slide {
            transform: none !important;
            transition: opacity 0.2s ease;
        }
        .slick-prev { left: -45px !important; }
        .slick-next { right: -45px !important; }
        .add-to-quote {
            flex-direction: row;
        }
        .add-to-quote input {
            width: 65px !important;
            height: 40px !important;
            padding: 10px !important;
        }
        button.btn-quote {
            width: 280px;
            height: 50px;
        }
    }

    /* Related */
    .related-main-container {
        .related-container {
            grid-template-columns: repeat(4, 1fr);
            gap: 40px;
        }
        .related-image {
            height: 220px;
        }
    }

    /* Cart Widget */
    #tw-cart-widget {
        top: 50%;
        right: 20px;
    }

    /* Quote Page */
    .quote-main-container {
        .main-layout {
            max-width: 980px;
            margin: 0 auto;
            padding: 40px 32px 80px;
            display: flex;
            flex-direction: column;
            gap: 40px;
        }

        .step-dealer {
            padding: 24px 28px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 32px;
            flex-wrap: wrap;
        }

        .step-label {
            display: flex;
            align-items: flex-start;
            gap: 16px;
            flex: 1;
            min-width: 260px;

            .step-number {
                font-size: 2.25rem;
                padding-top: 2px;
            }
        }

        /* Search row constrained width on desktop */
        #dealerSearchArea .dealer-search {
            max-width: 380px;
        }

        .dealer-results-grid {
            grid-template-columns: repeat(3, 1fr);
        }

        .step-two-wrapper {
            display: flex;
            gap: 20px;
            align-items: flex-start;
        }

        .step-number--two {
            font-size: 2.25rem;
            padding-top: 6px;
        }

        .step-two-inner {
            flex: 1;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 36px;
            align-items: start;
            min-width: 0;
        }

        .cart-panel {
            border: 1.5px dashed #ddd6cc;
            border-radius: 10px;
            background: #ffffff;
            padding: 24px;
            min-height: 280px;
        }

        .quote-form-panel {
            background: #ffffff;
            border: 1px solid #ede8e0;
            border-radius: 10px;
            padding: 28px 28px 32px;
            box-shadow: 0 1px 4px rgba(44, 40, 32, 0.07),
                        0 4px 16px rgba(44, 40, 32, 0.05);
        }
    }
}

/* ─────────────────────────────────────────────
   MOBILE  (max-width: 767px)
───────────────────────────────────────────── */
@media (max-width: 767px) {

    /* Product */
    .product-main-container {
        padding: 10px;
        flex-direction: column;
        gap: 10px;

        .left-column {
            width: 100%;
            padding: 0px;
        }
        .slider-nav .product-image {
            height: 80px;          /* fixed height — no more padding trick */
            overflow: hidden;
        }
        .slider-nav .product-image img {
            position: static;      /* remove absolute positioning */
            width: 100%;
            height: 100%;
            object-fit: cover;     /* or 'contain' if you want full image visible */
            background: #f5f5f5;
        }
        .slider-nav .product-image.slick-current img {
            opacity: 1 !important;
            outline: 3px solid #104860;
            outline-offset: -3px;
            border: 5px solid transparent !important;
        }
        .slider-nav {
            padding: 0 25px;
        }
        .slick-prev { left: -25px !important; }
        .slick-next { right: -25px !important; }
        .right-column {
            width: 100%;
            padding: 10px;
        }
        h2.product-title {
            font-size: 20px !important;
        }
        .product-description {
            font-size: 14px;
        }
        .add-to-quote {
            flex-direction: column;
        }
        .add-to-quote input {
            width: 50px !important;
            height: 30px !important;
            padding: 8px !important;
            font-size: 14px !important;
        }
        button.btn-quote {
            width: 160px;
            height: 40px;
            font-size: 14px;
        }
    }

    /* Related */
    .related-main-container {
        .related-container {
            grid-template-columns: repeat(1, 1fr);
            gap: 25px;
        }
        .related-image {
            height: auto;
        }
        .related-name {
            font-size: 15px;
        }
        .related-category {
            font-size: 14px;
        }
    }

    /* Cart Widget */
    #tw-cart-widget {
        top: 50%;
        right: 16px;
    }

    /* Quote Page */
    .quote-main-container {
        .page-header {
            padding: 28px 20px 16px;
        }

        .main-layout {
            padding: 24px 16px 60px;
            gap: 28px;
        }

        .step-dealer {
            flex-direction: column;
            align-items: flex-start;
            gap: 18px;
            padding: 18px 18px 20px;
        }

        .step-label {
            gap: 12px;
            min-width: unset;

            .step-number {
                font-size: 1.75rem;
            }
        }

        .step-heading {
            font-size: 0.95rem;
        }

        .dealer-search {
            width: 100%;
            flex-direction: column;
            gap: 10px;
        }

        .btn-search {
            width: 100%;
            padding: 12px;
        }

        .dealer-results-grid {
            grid-template-columns: 1fr;
            gap: 12px;
        }

        .dealer-card-img {
            height: 100px;
        }

        .dealer-selected-banner {
            flex-direction: column;
            align-items: flex-start;
            gap: 10px;
        }

        .dealer-selected-img {
            width: 100%;
            height: 120px;
        }

        .dealer-selected-info {
            width: 100%;
        }

        .dealer-selected-links {
            justify-content: center;
        }

        .step-two-wrapper {
            flex-direction: column;
            gap: 16px;
            padding: 20px 0;
        }

        .step-number--two {
            font-size: 1.75rem;
            padding-top: 0;
        }

        .step-two-inner {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 24px;
        }

        .cart-panel {
            padding: 18px;
            min-height: 220px;
        }

        /* Cart table collapses to card layout */
        .cart-table thead {
            display: none;
        }
        .cart-table,
        .cart-table tbody,
        .cart-table tr,
        .cart-table td {
            display: block;
            width: 100%;
        }
        .cart-row {
            display: grid !important;
            grid-template-columns: 28px 72px 1fr;
            grid-template-rows: auto auto;
            column-gap: 10px;
            row-gap: 8px;
            padding: 14px 0;
            border-bottom: 1px solid #ede8e0;
            align-items: center;

            &:last-child { border-bottom: none; }

            .col-remove {
                grid-column: 1; grid-row: 1;
                padding: 0;
                display: flex;
                align-items: center;
                padding-top: 4px;
            }
            .col-thumb {
                grid-column: 2; grid-row: 1 / 3;
                padding: 0;
            }
            .col-product {
                grid-column: 3; grid-row: 1;
                padding: 0;
            }
            .col-qty {
                grid-column: 3; grid-row: 2;
                padding: 0;
            }
        }

        .qty-input    { width: 56px; }
        .product-thumb { width: 64px; height: 64px; }

        .quote-form-panel {
            padding: 22px 18px 26px;
        }

        .form-heading {
            font-size: 1.3rem;
        }

        .form-grid {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .radio-group {
            gap: 20px;
        }

        .btn-submit {
            padding: 13px;
            font-size: 0.85rem;
        }
    }

    /* SWAL */
    h2#swal2-title {
        font-size: 15px;
    }
    div#swal2-content {
        font-size: 14px;
    }
    button.swal2-confirm, button.swal2-cancel {
        font-size: 14px !important;
    }
}