/**
 * Laysons WebAwesome Redesign - Global CSS
 * Dark mode theme with WebAwesome component overrides
 * 
 * Color Palette:
 * - Background: #1a1a1a (main), #222 (raised), #0d0d0d (lowered)
 * - Text: #ddd (standard), #fff (headings), #bbb (secondary)
 * - Brand Red: #cc0000
 * - Brand Blue: #006bff
 * - Accents: #66b3ff (links), #ff6b6b (prices)
 * - Borders: #444 (light), #555 (medium)
 */

:root {
    /* Dark Mode Color Tokens */
    --wa-color-surface-default: #1a1a1a;
    --wa-color-surface-raised: #222;
    --wa-color-surface-lowered: #0d0d0d;
    --wa-color-text-default: #ddd;
    --wa-color-text-heading: #fff;
    --wa-color-text-secondary: #bbb;
    --wa-color-border-default: #444;
    --wa-color-border-medium: #555;
    
    /* Brand Colors */
    --wa-color-brand-red: #cc0000;
    --wa-color-brand-blue: #006bff;
    
    /* Accent Colors */
    --wa-color-link: #66b3ff;
    --wa-color-price: #ff6b6b;
    --wa-color-success: #00aa00;
    --wa-color-warning: #ffaa00;
    --wa-color-danger: #aa0000;
    
    /* Spacing */
    --wa-space-xs: 0.5rem;
    --wa-space-s: 1rem;
    --wa-space-m: 1.5rem;
    --wa-space-l: 2rem;
    --wa-space-xl: 3rem;
    --wa-space-2xl: 4rem;
    --wa-space-3xl: 6rem;
    
    /* Font Stack */
    --wa-font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --wa-font-size-s: 0.875rem;
    --wa-font-size-m: 1rem;
    --wa-font-size-l: 1.25rem;
    --wa-font-size-xl: 1.5rem;
    --wa-font-size-2xl: 2rem;
    
    /* Border Radius */
    --wa-border-radius-s: 0.25rem;
    --wa-border-radius-m: 0.5rem;
    --wa-border-radius-l: 1rem;
}

/* Global Styles */
* {
    box-sizing: border-box;
}

html.wa-dark {
    background-color: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    font-family: var(--wa-font-family-base);
    line-height: 1.5;
}

body {
    margin: 0;
    padding: 0;
    background-color: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
}

/* Typography */
h1, h2, h3, h4, h5, h6 {
    color: var(--wa-color-text-heading);
    font-weight: 600;
    margin-top: var(--wa-space-l);
    margin-bottom: var(--wa-space-s);
}

h1 { font-size: var(--wa-font-size-2xl); }
h2 { font-size: var(--wa-font-size-xl); }
h3 { font-size: var(--wa-font-size-l); }
h4, h5, h6 { font-size: var(--wa-font-size-m); }

p {
    margin: var(--wa-space-s) 0;
    color: var(--wa-color-text-default);
}

a {
    color: var(--wa-color-link);
    text-decoration: none;
    transition: color 0.2s ease;
}

a:hover {
    color: var(--wa-color-brand-blue);
    text-decoration: underline;
}

/* WebAwesome Page Layout */
wa-page {
    --menu-width: 30ch;
    background-color: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
}

wa-page::part(base) {
    background-color: var(--wa-color-surface-default);
}

/* Header Styling */
[slot="header"] {
    background: linear-gradient(to bottom, var(--wa-color-surface-raised), var(--wa-color-surface-lowered));
    border-bottom: 1px solid var(--wa-color-border-default);
    padding: var(--wa-space-m) var(--wa-space-l);
}

[slot="header"] .wa-cluster {
    align-items: center;
    display: flex;
    gap: var(--wa-space-m);
    justify-content: space-between;
}

[slot="header"] .wa-heading-l {
    font-size: var(--wa-font-size-xl);
    font-weight: 700;
    flex: 0 1 auto;
}

[slot="header"] .wa-heading-l span:first-child {
    color: var(--wa-color-brand-red);
}

[slot="header"] .wa-heading-l span:last-child {
    color: var(--wa-color-brand-blue);
}

[slot="header"] #tagline {
    white-space: nowrap;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: var(--wa-color-text-secondary);
}

.info-links-bar {
    width: 100%;
    margin-top: var(--wa-space-s);
    margin-bottom: 0;
    border-top: 1px solid var(--wa-color-border-default);
    padding-top: var(--wa-space-s);
}

.info-links-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    margin: 0;
    padding: 0;
    list-style: none;
}

.info-links-list li {
    margin: 0 0.5em;
    padding: 0;
}

.info-links-list a {
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
    text-decoration: none;
}

.info-links-list a:hover {
    color: var(--wa-color-link);
    text-decoration: underline;
}

/* Search Input in Header */
#search-header {
    flex: 1 1 auto;
    max-width: 100%;
    --wa-input-background: var(--wa-color-surface-default);
    --wa-input-color: var(--wa-color-text-default);
    --wa-input-border-color: var(--wa-color-border-medium);
}

.header-actions {
    padding-inline-start: 0;
    position: absolute;
    right: 0;
}
.header-actions wa-button, .header-actions ::slotted(wa-button) {
    flex: 0 0 auto;
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
}
.header-actions-row {
    width: 100%;
    display: flex;
    align-items: center;
    gap: var(--wa-space-xs);
    margin-top: var(--wa-space-m);
}

.header-actions-row #search-header {
    flex: 1 1 auto;
}

.header-action-buttons {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--wa-space-s);
}

.header-action-buttons wa-button::part(base) {
    font-size: 1.35em;
    padding: 0em 0em 0em .7em;
}

.header-action-buttons .wa-desktop-only {
    padding-right: .8em;
}

wa-button[variant="blue"]::part(base) {
    background: #66b3ff;
    border-color: #66b3ff;
    color: #06243d;
}

wa-button[variant="blue"]:hover::part(base),
wa-button[variant="blue"]:focus-visible::part(base) {
    background: #7fc2ff;
    border-color: #7fc2ff;
    color: #06243d;
}

.search-header-row {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: var(--wa-space-s);
    align-items: center;
}

.search-header-row select,
.search-page-form select,
.search-page-form input,
.search-page-form button {
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
    min-height: 2.25rem;
    padding: 0.5rem 0.625rem;
}

.search-page-form .search-input-row {
    display: grid;
    grid-template-columns: 140px 1fr 120px;
    gap: var(--wa-space-s);
}

.results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: var(--wa-space-m);
}

.result-card {
    background: var(--wa-color-surface-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-m);
    padding: var(--wa-space-s);
}

.result-title {
    font-weight: 700;
    color: var(--wa-color-text-heading);
}

.result-subtitle {
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
    margin-top: 0.125rem;
}

.result-desc {
    margin-top: 0.375rem;
    color: var(--wa-color-text-default);
    font-size: var(--wa-font-size-s);
    max-height: 100px;
    overflow-y: auto;
}

.result-price {
    /*margin-top: 0.5rem;*/
    color: var(--wa-color-price);
    font-weight: 700;
}

.result-link {
    display: inline-block;
    margin-top: 0.625rem;
}

.result-empty {
    color: var(--wa-color-text-secondary);
    border: 1px dashed var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
    padding: var(--wa-space-s);
}

.alert-success {
    color: var(--wa-color-success-70);
}

/* Cart Page */
.cart-page {
    width: 100%;
}

.cart-item-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: var(--wa-space-m);
    align-items: start;
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-m);
    background: var(--wa-color-surface-default);
    padding: var(--wa-space-s);
}

.cart-item-main {
    display: grid;
    grid-template-columns: 92px minmax(0, 1fr);
    gap: var(--wa-space-s);
    align-items: start;
}

.cart-item-thumb-link {
    display: block;
}

.cart-item-thumb {
    width: 92px;
    height: 92px;
    object-fit: cover;
    border-radius: var(--wa-border-radius-s);
    border: 1px solid var(--wa-color-border-medium);
    background: #000;
}

.cart-item-thumb-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
}

.cart-item-controls {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 160px;
    align-items: flex-end;
}

.cart-item-pricing {
    display: grid;
    grid-template-columns: repeat(3, auto);
    align-items: start;
    gap: var(--wa-space-m);
}

.cart-pricing-col {
    display: grid;
    grid-template-rows: auto auto;
    justify-items: center;
    align-items: start;
    row-gap: 0.25rem;
}

.cart-pricing-label {
    min-height: 1.25rem;
    line-height: 1.25rem;
    opacity: 0.85;
}

.cart-pricing-value {
    min-height: 2.25rem;
    display: flex;
    align-items: center;
}

.cart-qty-input {
    width: 90px;
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
    min-height: 2.25rem;
    padding: 0.5rem 0.625rem;
    text-align: right;
}

.cart-summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--wa-space-s);
    padding-top: var(--wa-space-s);
}

.cart-actions-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--wa-space-s);
}

.cart-actions-left {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wa-space-s);
    align-items: center;
}

.cart-actions-right {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

/* Checkout */
.checkout-page {
    width: 100%;
}

.checkout-form {
    display: flex;
    flex-direction: column;
    gap: var(--wa-space-m);
}

.checkout-form-grid {
    display: grid;
    grid-template-columns: 180px minmax(0, 1fr);
    gap: var(--wa-space-s);
    align-items: center;
}

.checkout-form-grid input,
.checkout-form-grid select,
.checkout-form-grid textarea {
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
    min-height: 2.25rem;
    padding: 0.5rem 0.625rem;
}

.checkout-required {
    color: var(--wa-color-brand);
}

.checkout-progress {
    width: 100%;
    height: 1rem;
    border: 1px solid var(--wa-color-success-70);
    border-radius: 999px;
    border-top: none;
    border-right: none;
    overflow: hidden;
    background: none;
}

.checkout-progress-bar {
    height: 100%;
    background: var(--wa-color-success-70);
}

.checkout-actions {
    display: flex;
    gap: var(--wa-space-s);
    justify-content: space-between;
    flex-wrap: wrap;
}

/* ── Billing: same-as-shipping row ─────────────────────────── */
.checkout-same-as-row {
    display: flex;
    align-items: center;
    gap: var(--wa-space-xs);
    font-size: var(--wa-font-size-m);
    cursor: pointer;
    margin-bottom: var(--wa-space-s);
}

.checkout-same-as-row input[type="checkbox"] {
    width: 1.1em;
    height: 1.1em;
    accent-color: var(--wa-color-brand);
    cursor: pointer;
}

/* ── Order review table ─────────────────────────────────────── */
.review-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--wa-font-size-s);
}

.review-table th,
.review-table td {
    padding: var(--wa-space-xs) var(--wa-space-s);
    border-bottom: 1px solid var(--wa-color-border-light);
    vertical-align: top;
}

.review-table thead th {
    text-align: left;
    font-weight: 600;
    white-space: nowrap;
    border-bottom: 2px solid var(--wa-color-border-medium);
}

.review-th-part    { width: 7em; }
.review-th-qty     { width: 3.5em; }
.review-th-price   { width: 5.5em; }
.review-th-amount  { width: 6em; }

.review-center { text-align: center; }
.review-right  { text-align: right; }

.review-desc-mobile {
    display: none;
}

.review-total-row td {
    border-top: 2px solid var(--wa-color-border-medium);
    border-bottom: none;
}

.review-savings-row td { color: var(--wa-color-success); }
.review-savings        { color: var(--wa-color-success); }

.review-shipping-note {
    font-size: var(--wa-font-size-xs);
    opacity: .7;
    padding-top: var(--wa-space-xs);
    border-bottom: none;
}

/* ── Review summary 3-col grid ──────────────────────────────── */
.review-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--wa-space-s);
}

.review-edit-link {
    font-size: var(--wa-font-size-xs);
    font-weight: 400;
    margin-left: var(--wa-space-xs);
    opacity: .75;
}

@media (max-width: 760px) {
    .review-summary-grid {
        grid-template-columns: 1fr;
    }

    .review-table thead {
        display: none;
    }

    .review-table tbody tr.review-item-row {
        /*display: grid-lanes;*/
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        grid-template-areas:
            "part part part"
            "desc desc desc"
            "qty price amount";
        gap: 0.35rem 0.75rem;
        padding: var(--wa-space-s) 0;
        border-bottom: 1px solid var(--wa-color-border-light);
        justify-items: stretch;
    }

    .review-table tbody tr.review-item-row td {
        border-bottom: none;
        padding: 0;
    }

    .review-table tbody tr.review-item-row .review-cell-part {
        grid-area: part;
        font-weight: 600;
        padding: 12px 12px 12px 0px;
    }

    .review-table tbody tr.review-item-row .review-cell-part::before {
        content: "";
        opacity: .85;
    }

    .review-table tbody tr.review-item-row .review-cell-desc {
        grid-area: desc;
        line-height: 1.35;
    }

    .review-desc-desktop {
        display: none;
    }

    .review-desc-mobile {
        display: block;
        padding: 12px 0px;
    }

    .review-table tbody tr.review-item-row .review-cell-qty,
    .review-table tbody tr.review-item-row .review-cell-price,
    .review-table tbody tr.review-item-row .review-cell-amount {
        text-align: left;
        white-space: nowrap;
    }

    .review-table tbody tr.review-item-row .review-cell-qty { 
        grid-area: qty;
        display: flex;
        align-items: center;
        padding: 12px 12px 6px;
    }
    
    .review-table tbody tr.review-item-row .review-cell-price { 
        grid-area: price;
        display: flex;
        align-items: center;        
        padding: 0px 12px;
    }
    
    .review-table tbody tr.review-item-row .review-cell-amount { 
        grid-area: amount;
        display: flex;
        align-items: center;
        padding: 6px 12px;
    }

    .review-table tbody tr.review-item-row .review-cell-qty::before {
        content: "Qty: ";
        opacity: .85;
        padding-right: .5em;
    }

    .review-table tbody tr.review-item-row .review-cell-price::before {
        content: "@ ";
        opacity: .85;
        padding-right: .15em;
    }

    .review-table tbody tr.review-item-row .review-cell-amount::before {
        content: "= ";
        opacity: .85;
        padding-right: .5em;
    }
}

/* ── Responsive ─────────────────────────────────────────────── */
@media (max-width: 760px) {
    .cart-item-row {
        grid-template-columns: 1fr;
    }

    .cart-item-controls {
        align-items: flex-start;
        min-width: 0;
        width: 100%;
    }

    .cart-item-pricing {
        width: 100%;
        justify-content: flex-start;
        grid-template-columns: repeat(3, auto);
    }

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

    .cart-actions-row {
        flex-direction: column;
        align-items: stretch;
    }

    .cart-actions-left {
        width: 100%;
    }

    .cart-actions-right {
        width: 100%;
        justify-content: flex-start;
    }
}

.catalog-no-parts-message {
    color: var(--wa-color-brand);
}

.catalog-branch-cta {
    display: flex;
    align-items: flex-start;
    gap: var(--wa-space-s);
    padding: var(--wa-space-s);
    border: 1px solid color-mix(in srgb, var(--wa-color-brand-blue) 35%, var(--wa-color-border-medium) 65%);
    border-radius: var(--wa-border-radius-m);
    background: color-mix(in srgb, var(--wa-color-surface-raised) 82%, var(--wa-color-brand-blue) 18%);
}

.catalog-branch-cta wa-icon {
    color: var(--wa-color-link);
    font-size: 1.15rem;
    margin-top: 0.1rem;
}

.catalog-branch-meta {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 0.5rem;
}

.catalog-subcategory-title-link {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.45rem;
    color: var(--wa-color-link);
    text-decoration: none;
}

.catalog-subcategory-title-link wa-icon {
    margin-top: 0.12em;
    flex-shrink: 0;
}

.catalog-subcategory-title-link:hover,
.catalog-subcategory-title-link:focus-visible {
    color: var(--wa-color-brand-blue);
    text-decoration: underline;
}

.catalog-parts-match-link {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.6rem;
    color: var(--wa-color-link);
    text-decoration: none;
    font-size: var(--wa-font-size-m);
}

.catalog-parts-match-link:hover,
.catalog-parts-match-link:focus-visible {
    color: var(--wa-color-brand-blue);
    text-decoration: underline;
}

.search-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--wa-space-s);
}

.search-tab {
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: 999px;
    padding: 0.375rem 0.75rem;
    cursor: pointer;
}

.search-tab.active {
    border-color: var(--wa-color-brand-blue);
    color: #fff;
    background: color-mix(in srgb, var(--wa-color-brand-blue) 30%, transparent);
}

.tab-badge {
    display: inline-block;
    min-width: 1.5em;
    text-align: center;
    margin-left: 0.25rem;
    padding: 0.05rem 0.4rem;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.15);
    font-size: var(--wa-font-size-s);
}

.search-panel {
    display: none;
}

.search-panel.active {
    display: block;
}

.info-page {
    width: 100%;
}

.info-hero {
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-m);
    padding: clamp(1rem, 2vw, 1.5rem);
    background:
        radial-gradient(1200px 220px at 95% -20%, rgba(102, 179, 255, 0.18), transparent 60%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
}

.info-hero-about {
    box-shadow: inset 0 0 0 1px rgba(102, 179, 255, 0.14);
}

.info-hero-shipping {
    box-shadow: inset 0 0 0 1px rgba(102, 179, 255, 0.16);
}

.info-hero-eyebrow {
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.info-hero-actions {
    margin-top: 0.25rem;
    flex-wrap: wrap;
}

.info-highlight-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wa-space-s);
}

.info-highlight-grid-two {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.info-highlight-card {
    min-height: 100%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.01));
}

.info-content-shell {
    padding: clamp(1rem, 2vw, 1.5rem);
    border-color: color-mix(in srgb, var(--wa-color-border-medium) 78%, var(--wa-color-brand-blue) 22%);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.info-two-col {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.about-owner-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: var(--wa-space-m);
    align-items: center;
}

.about-owner-copy > :first-child {
    margin-top: 0;
}

.about-owner-image-wrap {
    border-radius: calc(var(--wa-border-radius-m) - 2px);
    overflow: hidden;
    border: 1px solid var(--wa-color-border-default);
    background: color-mix(in srgb, var(--wa-color-surface-raised) 88%, #fff 12%);
}

.about-owner-image {
    display: block;
    width: 100%;
    height: 100%;
    max-height: 360px;
    object-fit: contain;
}

.about-collection-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--wa-space-s);
}

.about-collection-card {
    min-height: 100%;
}

.about-collection-image-wrap {
    border-radius: calc(var(--wa-border-radius-m) - 2px);
    overflow: hidden;
    border: 1px solid var(--wa-color-border-default);
    background: color-mix(in srgb, var(--wa-color-surface-raised) 88%, #fff 12%);
}

.about-collection-image {
    display: block;
    width: 100%;
    height: 260px;
    object-fit: contain;
}

.info-rich-content h1,
.info-rich-content h2,
.info-rich-content h3,
.info-rich-content h4 {
    margin-top: var(--wa-space-m);
    margin-bottom: var(--wa-space-s);
}

.info-rich-content p,
.info-rich-content li,
.info-rich-content td,
.info-rich-content th {
    color: var(--wa-color-text-default);
    line-height: 1.55;
}

.info-rich-content table {
    width: 100%;
    border-collapse: collapse;
    margin: var(--wa-space-s) 0;
}

.info-rich-content td,
.info-rich-content th {
    border: 1px solid var(--wa-color-border-default);
    padding: 0.5rem 0.625rem;
    vertical-align: top;
}

.shipping-rich-content {
    max-height: none;
}

.shipping-rich-content h1,
.shipping-rich-content h2,
.shipping-rich-content h3,
.shipping-rich-content h4,
.shipping-rich-content h5,
.shipping-rich-content h6,
.shipping-rich-content span,
.shipping-rich-content p,
.shipping-rich-content li,
.shipping-rich-content td,
.shipping-rich-content th,
.shipping-rich-content u,
.shipping-rich-content b,
.shipping-rich-content i,
.shipping-rich-content font {
    color: var(--wa-color-text-default) !important;
}

.body-style-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--wa-space-s);
}

.body-style-card {
    border-color: color-mix(in srgb, var(--wa-color-border-medium) 70%, var(--wa-color-brand-blue) 30%);
}

.body-style-subtitle {
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
    letter-spacing: 0.02em;
    text-transform: uppercase;
    border-top: 1px solid var(--wa-color-border-default);
    padding-top: 0.45rem;
}

.body-style-card-content > :first-child {
    margin-top: 0;
}

.body-style-card-content ul {
    margin: 0;
    padding-left: 1rem;
}

.body-style-card-content li {
    margin-bottom: 0.4rem;
}

.body-style-pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.body-style-pill {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.58rem;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--wa-color-border-medium) 65%, var(--wa-color-brand-blue) 35%);
    background: color-mix(in srgb, var(--wa-color-surface-raised) 82%, var(--wa-color-brand-blue) 18%);
    color: var(--wa-color-text-default);
    font-size: var(--wa-font-size-s);
    line-height: 1.2;
    white-space: nowrap;
}
.body-style-subtitle {
    color: #c94c4a;
}

.inquiries-page .checkout-form-grid {
    grid-template-columns: 220px minmax(0, 1fr);
}

.inquiries-page .inquiries-submit-actions {
    justify-content: flex-end;
}

@media (max-width: 900px) {
    .about-owner-layout,
    .body-style-card-grid,
    .info-highlight-grid,
    .info-highlight-grid-two,
    .info-two-col {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 1180px) {
    .about-collection-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .about-collection-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 760px) {
    .inquiries-page .checkout-form-grid {
        grid-template-columns: 1fr;
    }
}

/* Product Detail Page */
.product-layout-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(300px, 1fr);
    grid-template-areas: "details image";
    align-items: start;
}

.part-details-column {
    grid-area: details;
}

.part-image-column {
    grid-area: image;
}

.part-image-frame {
    /*border: 1px dashed var(--wa-color-border-medium);
    background: var(--wa-color-surface-default);*/
    aspect-ratio: auto;
    overflow: hidden;
}

.part-photo-trigger {
    appearance: none;
    -webkit-appearance: none;
    display: block;
    width: 100%;
    line-height: 0;
    font-size: 0;
    padding: 0;
    border: 0;
    margin: 0;
    background: transparent;
    cursor: zoom-in;
    overflow: hidden;
}

.product-photo {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
}

.product-photo-placeholder {
    /*min-height: 280px;*/
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--wa-color-text-secondary);
}

.part-qty-row {
    --flank-size: auto;
    align-items: center;
    gap: var(--wa-space-s);
}

.part-cart-form {
    display: flex;
    flex-direction: column;
    gap: var(--wa-space-s);
}

.part-price-qty-row {
    display: flex;
    align-items: center;
    gap: var(--wa-space-s);
}

.part-spec-grid {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0;
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-m);
    overflow: hidden;
}

.part-spec-label,
.part-spec-value {
    padding: var(--wa-space-s);
    border-bottom: 1px solid var(--wa-color-border-medium);
    font-size: var(--wa-font-size-s);
}

.part-spec-label {
    font-weight: 600;
    color: var(--wa-color-text-heading);
    background: color-mix(in srgb, var(--wa-color-surface-raised) 70%, transparent);
}

.part-spec-grid > :nth-last-child(-n+2) {
    border-bottom: 0;
}

.part-spec-availability {
    color: #90EE90;
    font-weight: 600;
}

@media (max-width: 900px) {
    .product-layout-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "image"
            "details";
    }
}

wa-drawer::part(drawer__dialog) {
    border-right: 3px solid red;
    background: lime !important;
}
/* Navigation Header (Vehicle Selector) */
[slot="navigation-header"] {
    background-color: var(--wa-color-surface-raised);
    border-bottom: 1px solid var(--wa-color-border-default);
    padding: var(--wa-space-m) var(--wa-space-l);
}

@media (max-width: 1023px) {
    [slot="navigation-header"] {
        position: relative;
        padding-right: var(--wa-space-l);
        background-color: #1f2128;
        overflow: visible;
        z-index: 2;
    }

    /* Mask the component's built-in top-right close icon area
    [slot="navigation-header"]::before {
        content: "";
        position: absolute;
        top: 0;
        right: -2.25rem;
        width: 3rem;
        height: 3rem;
        background: #000;
        z-index: 3;
    } */

    /* Mobile drawer close button (X) */
    .drawer-close-btn {
        position: absolute;
        top: 0rem;
        right: -2.5rem;
        transform: translateX(28%);
        width: 2.75rem;
        height: 2.75rem;
        min-width: 2.75rem;
        min-height: 2.75rem;
        border: 0;
        border-radius: 0.625rem;
        background: #a5292d;
        color: #fff;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 2rem;
        font-weight: 700;
        line-height: 1;
        cursor: pointer;
        z-index: 4;
        padding: 0;
        box-shadow: var(--shadow-pop-out), inset 0 0 0 var(--wa-form-control-border-width) var(--border-color, var(--background-color, transparent));
    }

    .drawer-close-btn:hover,
    .drawer-close-btn:focus-visible {
        background: #e00000;
        outline: none;
    }
}

[slot="navigation-header"] h2 {
    margin: 0 0 var(--wa-space-s) 0;
    font-size: var(--wa-font-size-l);
}

[slot="navigation-header"] .wa-stack {
    gap: var(--wa-space-s);
}

.drawer-page-links {
    width: 100%;
    border: 1px solid var(--wa-color-border-default);
    border-radius: var(--wa-border-radius-m);
    background: rgba(255, 255, 255, 0.03);
    overflow: hidden;
}

.drawer-page-links-toggle {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 0.875rem 1rem;
    color: var(--wa-color-text-heading);
    font-size: var(--wa-font-size-l);
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--wa-space-s);
    text-align: left;
    cursor: pointer;
    pointer-events: auto;
}

.drawer-page-links-label {
    display: inline-flex;
    align-items: center;
    gap: var(--wa-space-xs);
}

.drawer-page-links-toggle:hover,
.drawer-page-links-toggle:focus-visible {
    background: rgba(255, 255, 255, 0.04);
    outline: none;
}

.drawer-page-links-chevron {
    color: var(--wa-color-text-secondary);
    font-size: 1.25rem;
    line-height: 1;
    transition: transform 0.2s ease;
}

.drawer-page-links-toggle[aria-expanded="true"] {
    border-bottom: 1px solid var(--wa-color-border-default);
}

.drawer-page-links-toggle[aria-expanded="true"] .drawer-page-links-chevron {
    transform: rotate(90deg);
}

.drawer-page-links-panel {
    padding: 0.5rem 0;
    pointer-events: auto;
}

.drawer-page-links-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.drawer-page-links-list li {
    margin: 0;
}

.drawer-page-links-list a {
    display: block;
    padding: 0.7rem 1rem;
    color: var(--wa-color-link);
    text-decoration: none;
    font-size: var(--wa-font-size-m);
    font-weight: normal;
}

.drawer-page-links-list a:hover,
.drawer-page-links-list a:focus-visible {
    background: rgba(255, 255, 255, 0.05);
    color: var(--wa-color-link);
    text-decoration: none;
    outline: none;
}

#search-nav-drawer.wa-mobile-only {
    margin-top: var(--wa-space-s);
    padding-top: var(--wa-space-s);
    border-top: 1px solid var(--wa-color-border-default);
}

.vehicle-current-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--wa-space-xs);
}

.vehicle-current-value {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--wa-color-text-default);
    font: inherit;
    padding: 0 8px;
    margin: 0;
    cursor: pointer;
    text-align: left;
}

.vehicle-current-value.is-placeholder {
    color: var(--wa-color-brand);
}

.vehicle-current-value:hover,
.vehicle-current-value:focus-visible {
    color: var(--wa-color-link);
    text-decoration: underline;
    outline: none;
}

.vehicle-selectors {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.vehicle-selectors select {
    display: none;
}

.vehicle-expanded-select-row {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wa-space-xs);
    margin-top: var(--wa-space-xs);
}

.vehicle-expanded-select-row[hidden] {
    display: none !important;
}

#vehicle-expanded-select {
    width: 100%;
    background: var(--wa-color-surface-default);
    color: var(--wa-color-text-default);
    border: 1px solid var(--wa-color-border-medium);
    border-radius: var(--wa-border-radius-s);
    padding: 0.5rem 0.625rem;
    min-height: 2.25rem;
}

#vehicle-expanded-select.is-expanded-list {
    height: auto;
    max-height: 16rem;
    overflow-y: auto;
    padding: 0.25rem;
}

#vehicle-expanded-select.is-expanded-list option {
    padding: 0.4rem 0.5rem;
}

#vehicle-save {
    width: 100%;
    display: none;
}

#vehicle-save.visible {
    display: block;
}

#category-trail:empty {
    display: none;
}

#category-trail a {
    color: var(--wa-color-link);
}

#category-list {
    gap: var(--wa-space-xs);
}

#category-list .category-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: var(--wa-space-xs);
}

#category-list .category-link {
    min-width: 0;
    overflow-wrap: anywhere;
    word-break: break-word;
    line-height: 1.25;
}

#category-list .category-expand {
    justify-self: end;
    align-self: start;
    flex-shrink: 0;
}

[slot="navigation-header"] .wa-flank {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--wa-space-s);
    background-color: var(--wa-color-surface-default);
    border-radius: var(--wa-border-radius-m);
    border: 1px solid var(--wa-color-border-default);
}

/* Navigation Sidebar */
[slot="navigation"] {
    background-color: var(--wa-color-surface-default);
    padding: var(--wa-space-l) var(--wa-space-m);
    overflow-y: auto;
    max-height: calc(100vh - 200px);
}

@media (max-width: 1023px) {
    /* Keep drawer shell black while panel sections are dark gray */
    wa-page[view="mobile"] [slot*="navigation"] {
        background-color: darkblue;
    }

    wa-page[view="mobile"] [slot="navigation-header"],
    wa-page[view="mobile"] [slot="navigation"] {
        background-color: #1f2128;
        border-right: 0;
    }

    /* Single full-height drawer edge border (component-level + fallback) */
    wa-page[view="mobile"]::part(navigation),
    wa-page[view="mobile"]::part(navigation-panel),
    wa-page[view="mobile"]::part(drawer),
    wa-page[view="mobile"]::part(menu) {
        border-right: 3px solid #5e6168;
    }

    [slot="header"] .wa-cluster {
        align-items: flex-start;
        gap: 0.35rem;
    }

    [slot="header"] .wa-heading-l {
        font-size: var(--wa-font-size-l);
    }
    [slot="header"] #tagline {
        position: static;
        display: block;
        width: 100%;
        text-align: left;
        margin-top: 0;
        line-height: 1.05;
        letter-spacing: 2px;
    }

    .header-actions-row {
        margin-top: 0.45rem;
        gap: 0.35rem;
    }

    .header-action-buttons {
        gap: 0.45rem;
    }

    button#vehicle-current-make, button#vehicle-current-model, button#vehicle-current-year {
        font-size: medium;
    }
}

[slot="navigation"] h3 {
    margin-top: 0;
    margin-bottom: var(--wa-space-m);
    font-size: var(--wa-font-size-l);
    color: var(--wa-color-text-heading);
}

[slot="navigation"] ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

[slot="navigation"] li {
    margin: 0;
    padding: 0;
}

[slot="navigation"] li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: var(--wa-space-s) var(--wa-space-m);
    color: var(--wa-color-link);
    border-radius: var(--wa-border-radius-m);
    transition: background-color 0.2s ease;
}

[slot="navigation"] li a:hover {
    background-color: rgba(102, 179, 255, 0.1);
}

[slot="navigation"] li a .wa-flank {
    width: 100%;
    justify-content: space-between;
}

/* Main Content Area */
[slot="main-header"] {
    background-color: var(--wa-color-surface-raised);
    border: 1px solid var(--wa-color-border-default);
    border-bottom: none;
    border-radius: var(--wa-border-radius-l) var(--wa-border-radius-l) 0 0;
    padding: var(--wa-space-l);
    margin-inline: var(--wa-space-m);
    margin-top: .5em;
}

main,
[slot="main-footer"] {
    background-color: var(--wa-color-surface-raised);
    border-left: 1px solid var(--wa-color-border-default);
    border-right: 1px solid var(--wa-color-border-default);
    padding: var(--wa-space-l);
    margin-inline: var(--wa-space-m);
}

main {
    margin-top: 0;
    margin-bottom: 0;
    min-height: calc(100vh - 400px);
}

[slot="main-footer"] {
    border-bottom: 1px solid var(--wa-color-border-default);
    border-radius: 0 0 var(--wa-border-radius-l) var(--wa-border-radius-l);
    margin-top: 0;
    margin-bottom: var(--wa-space-m);
}

[slot="main-footer"]:empty {
    display: none;
}

/* If a page has no main-footer slot, close the main card with rounded bottom edges. */
wa-page.no-main-footer main {
    border-bottom: 1px solid var(--wa-color-border-default);
    border-radius: 0 0 var(--wa-border-radius-l) var(--wa-border-radius-l);
    margin-bottom: var(--wa-space-m);
}

/* Footer */
footer[slot="footer"] {
    background-color: #000000;
    border-top: 1px solid var(--wa-color-border-default);
    padding: var(--wa-space-l);
    text-align: center;
    font-size: var(--wa-font-size-s);
    color: var(--wa-color-text-secondary);
}

footer[slot="footer"] a {
    color: var(--wa-color-link);
}

footer[slot="footer"] img {
    max-width: 200px;
    height: auto;
    margin-top: var(--wa-space-s);
}

/* WebAwesome Button Overrides */
wa-button {
    --wa-button-background: var(--wa-color-brand-blue);
    --wa-button-color: #fff;
}

wa-button[appearance="outlined"] {
    --wa-button-border-color: var(--wa-color-border-medium);
    --wa-button-color: var(--wa-color-text-default);
}

wa-button[appearance="plain"] {
    --wa-button-color: var(--wa-color-link);
}

/* Breadcrumb Styling */
wa-breadcrumb {
    --wa-breadcrumb-color: var(--wa-color-text-secondary);
}

wa-breadcrumb-item {
    color: var(--wa-color-link);
}

/* Input Styling */
wa-input {
    --wa-input-background: var(--wa-color-surface-default);
    --wa-input-color: var(--wa-color-text-default);
    --wa-input-border-color: var(--wa-color-border-medium);
}

/* Callout Styling */
wa-callout {
    --wa-callout-background-color: color-mix(in srgb, var(--wa-color-surface-raised) 86%, var(--wa-color-brand-blue) 14%);
    --wa-callout-border-color: color-mix(in srgb, var(--wa-color-border-medium) 72%, var(--wa-color-brand-blue) 28%);
    --wa-callout-text-color: var(--wa-color-text-default);
}

wa-callout[variant="brand"] {
    --wa-callout-background-color: color-mix(in srgb, var(--wa-color-surface-raised) 82%, var(--wa-color-brand-blue) 18%);
    --wa-callout-border-color: color-mix(in srgb, var(--wa-color-border-medium) 66%, var(--wa-color-brand-blue) 34%);
}

wa-callout[variant="success"] {
    --wa-callout-background-color: color-mix(in srgb, var(--wa-color-surface-raised) 80%, var(--wa-color-success) 20%);
    --wa-callout-border-color: color-mix(in srgb, var(--wa-color-border-medium) 58%, var(--wa-color-success) 42%);
}

wa-callout[variant="warning"] {
    --wa-callout-background-color: rgba(255, 170, 0, 0.1);
    --wa-callout-border-color: var(--wa-color-warning);
}

wa-callout[variant="danger"] {
    --wa-callout-background-color: rgba(255, 107, 107, 0.1);
    --wa-callout-border-color: var(--wa-color-danger);
}

/* Divider */
wa-divider {
    --wa-divider-color: var(--wa-color-border-medium);
}

/* Badge */
wa-badge {
    --wa-badge-background: var(--wa-color-danger);
    --wa-badge-color: #fff;
}

/* Responsive Layout */
wa-page[view="mobile"] {
    --menu-width: auto;
}

wa-page[view="mobile"] [slot*="navigation"],
wa-page[view="mobile"] [slot*="main"] {
    padding: var(--wa-space-m);
}

/* Avoid double scrollbars in the mobile navigation drawer */
@media (max-width: 1023px) {
    [slot="navigation"] {
        overflow-y: visible;
        max-height: none;
    }
}

/* Desktop Layout */
@media (min-width: 1024px) {
    [slot="header"] {
        padding: var(--wa-space-l) var(--wa-space-l);
    }
    
    [slot="main-header"],
    main,
    [slot="main-footer"] {
        margin-inline: var(--wa-space-xl);
    }
    
    wa-page[view="desktop"] [slot*="navigation"] {
        max-width: 30ch;
    }
}

@media (max-width: 1023px) {
    .vehicle-current-line {
        gap: var(--wa-space-xs) var(--wa-space-xs);
    }
}

/* Checkout Mode (Distraction-Free) */
wa-page.checkout-mode [slot="navigation"],
wa-page.checkout-mode [slot="navigation-header"] {
    display: none;
}

/* Collapse the sidebar column so main content fills full width */
wa-page.checkout-mode {
    --menu-width: 0;
}

wa-page.checkout-mode [slot="header"] {
    padding: var(--wa-space-m) var(--wa-space-l);
}

/* Hide the mobile nav toggle (no sidebar to open in checkout) */
wa-page.checkout-mode [slot="header"] [data-toggle-nav] {
    display: none;
}

/* Keep logo visible; let it take available space */
wa-page.checkout-mode [slot="header"] .wa-heading-l {
    flex: 1 1 auto;
}

/* Product Grid Layout */
main .wa-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--wa-space-xl);
}

@media (min-width: 768px) {
    main .wa-grid {
        grid-template-columns: 1fr 1fr;
    }
    
    /* Image first on mobile, second on desktop */
    main .wa-grid > *:first-child {
        order: 2;
    }
    
    main .wa-grid > *:last-child {
        order: 1;
    }
}

/* Utility Classes */
.wa-cluster {
    display: flex;
    align-items: center;
    gap: var(--wa-space-m);
    flex-wrap: wrap;
}

.wa-split {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--wa-space-m);
}

.wa-stack {
    display: flex;
    flex-direction: column;
    gap: var(--wa-space-m);
}

.wa-gap-xs { gap: var(--wa-space-xs) !important; }
.wa-gap-s { gap: var(--wa-space-s) !important; }
.wa-gap-m { gap: var(--wa-space-m) !important; }
.wa-gap-l { gap: var(--wa-space-l) !important; }
.wa-gap-xl { gap: var(--wa-space-xl) !important; }
.wa-gap-2xl { gap: var(--wa-space-2xl) !important; }

.wa-flank {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.wa-flank:end {
    justify-content: flex-end;
}

/* Desktop-Only / Mobile-Only Utilities */
.wa-desktop-only {
    display: none;
}

.wa-mobile-only {
    display: block;
}

.tight-btn::part(base) {
    height: 1.5em;
    width: 1.5em;
    font-size: 1.75em;
    padding: 0.2rem;
}

@media (min-width: 1024px) {
    .wa-desktop-only {
        display: block;
    }
    
    .wa-mobile-only {
        display: none;
    }

    /* Full-site mode only: tighten header icon/text spacing. */
    .header-action-buttons wa-button > wa-icon[slot="start"] {
        margin-inline-end: 0em;
    }

    .header-action-buttons wa-button > .wa-desktop-only {
        margin-inline-start: .2em;
    }
}

/* Lightbox Dialog */
wa-dialog#lightbox::part(dialog) {
    background: #0d0d0d;
    text-align: center;
}

wa-dialog#lightbox img {
    max-width: 100vw;
    max-height: 70vh;
    object-fit: contain;
}

/* Part Photo Dialog */
wa-dialog#part-photo-dialog::part(dialog) {
    width: 100vw;
    max-width: 100vw;
    height: 100vh;
    max-height: 100vh;
    height: var(--part-photo-vh, 100dvh);
    max-height: var(--part-photo-vh, 100dvh);
    margin: 0;
    border: 0;
    border-radius: 0;
    background: #0d0d0d;
    color: #fff;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    overflow: hidden;
}

wa-dialog#part-photo-dialog::part(header),
wa-dialog#part-photo-dialog::part(title) {
    color: #fff;
}

wa-dialog#part-photo-dialog::part(close-button),
wa-dialog#part-photo-dialog::part(close-button__base),
wa-dialog#part-photo-dialog::part(close-button__icon) {
    color: #fff;
}

wa-dialog#part-photo-dialog::part(close-button__base):hover,
wa-dialog#part-photo-dialog::part(close-button__base):focus-visible {
    color: #fff;
}

wa-dialog#part-photo-dialog::part(close-button__base) {
    background: #c62828;
    border: 1px solid #ff6b6b;
    border-radius: 0.5rem;
}

wa-dialog#part-photo-dialog::part(close-button__base):hover,
wa-dialog#part-photo-dialog::part(close-button__base):focus-visible {
    background: #e53935;
    border-color: #ff8a80;
}

wa-dialog#part-photo-dialog::part(body) {
    padding: 0;
    min-height: 0;
}

wa-dialog#part-photo-dialog::part(footer) {
    width: 100%;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom));
}

.part-photo-stage {
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: auto;
    background: #000;
    user-select: none;
    -webkit-user-select: none;
    touch-action: none;
}

.part-photo-lightbox-image {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    user-select: none;
    -webkit-user-drag: none;
}

.part-photo-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--wa-space-s);
    width: 100%;
}

.part-photo-toolbar-buttons {
    display: flex;
    gap: var(--wa-space-xs);
}

.part-photo-zoom-status {
    color: var(--wa-color-text-secondary);
    font-size: var(--wa-font-size-s);
}

/* Vehicle Validation Dialog */
wa-dialog#vehicle-validation-dialog::part(dialog) {
    background: var(--wa-color-surface-raised);
    border: 1px solid #fff;
    color: var(--wa-color-text-default);
}

wa-dialog#vehicle-validation-dialog::part(header),
wa-dialog#vehicle-validation-dialog::part(title) {
    color: #fff;
}

wa-dialog#vehicle-validation-dialog::part(body) {
    padding-bottom: 0.5rem;
}

wa-dialog#vehicle-validation-dialog::part(footer) {
    width: 100%;
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    padding: 0.5rem 1.5rem 0.375rem;
    margin-top: 0.5rem;
    display: flex;
    justify-content: flex-end;
}

/* Animations */
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

main {
    animation: fadeIn 0.3s ease-in;
}

/* Print Styles */
@media print {
    @page {
        margin: 0.5in;
        size: auto;
    }

    html,
    body,
    wa-page,
    wa-page::part(base),
    main,
    .checkout-page,
    .result-card,
    .review-table,
    .review-table th,
    .review-table td,
    .result-title,
    .result-desc,
    .wa-heading-xl,
    .wa-caption-m,
    .checkout-page * {
        color: #000 !important;
        background: #fff !important;
        text-shadow: none !important;
        box-shadow: none !important;
        filter: none !important;
    }

    html,
    body {
        margin: 0 !important;
        padding: 0 !important;
        print-color-adjust: economy;
        -webkit-print-color-adjust: economy;
    }

    [slot="header"],
    [slot="navigation"],
    [slot="navigation-header"],
    [slot="main-header"],
    [slot="main-footer"],
    [slot="footer"] {
        display: none !important;
    }

    .checkout-actions,
    wa-button,
    .checkout-progress,
    wa-icon,
    .wa-mobile-only {
        display: none !important;
    }

    wa-callout {
        display: block !important;
        border: 1px solid #000 !important;
        border-radius: 0 !important;
        padding: 0.3rem 0.5rem !important;
        margin: 0 0 0.5rem 0 !important;
    }

    .result-card,
    .review-table,
    .review-table th,
    .review-table td,
    .review-total-row td,
    .review-savings-row td {
        border-color: #000 !important;
    }

    .review-table {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .result-card {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    main {
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}