/* /Components/Pages/Public/HeroSection.razor.rz.scp.css */
.hero-section[b-nvwno0s9q0] {
    position: relative;
    width: 100%;
    height: 100vh;
    min-height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Lottie parallax container - positioned behind everything for scroll-driven effects */
.lottie-parallax-container[b-nvwno0s9q0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none;
    opacity: 0;
}

.hero-background[b-nvwno0s9q0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
}

.hero-image[b-nvwno0s9q0],
.hero-image-placeholder[b-nvwno0s9q0] {
    width: 100%;
    height: 120%;
    object-fit: cover;
    object-position: center;
    transition: filter 0.3s ease;
    will-change: filter, transform;
    transform: scale(1.2);
    backface-visibility: hidden;
}


.hero-image-placeholder[b-nvwno0s9q0] {
    background: linear-gradient(135deg, var(--primary-color, #DCAE96) 0%, var(--secondary-color, #B2AC88) 100%);
}

.hero-overlay[b-nvwno0s9q0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient( to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.1) 50%, rgba(0, 0, 0, 0.4) 100% );
    z-index: 1;
}

.hero-decorations[b-nvwno0s9q0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    opacity: 0.4;
}


@keyframes fadeInDecoration-b-nvwno0s9q0 {
    to {
        opacity: 0.4;
    }
}

.hero-content[b-nvwno0s9q0] {
    position: relative;
    z-index: 3;
    text-align: center;
    color: white;
    padding: 2rem;
    max-width: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}


.hero-monogram[b-nvwno0s9q0] {
    margin-bottom: 3rem;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 1.2s cubic-bezier(0.175, 0.885, 0.32, 1.275), transform 0.3s ease-out, filter 0.3s ease-out;
    position: relative;
    z-index: 1000;
    pointer-events: none;
    isolation: isolate;
}

    .hero-monogram.visible[b-nvwno0s9q0] {
        opacity: 1;
        transform: scale(1);
    }

    /* When JS sets position:fixed, ensure it stays above all content */
    [b-nvwno0s9q0] .hero-monogram[style*="position: fixed"],
    .hero-monogram[style*="position: fixed"][b-nvwno0s9q0] {
        z-index: 9999 !important;
    }


/* Lottie container for scroll-driven animations - positioned absolutely to not affect layout */
.lottie-monogram-container[b-nvwno0s9q0] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: -1;
}

.hero-monogram-svg[b-nvwno0s9q0] {
    width: 200px;
    height: 200px;
    max-width: 100%;
    display: block;
}

.hero-info[b-nvwno0s9q0] {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s ease-out 0.5s, transform 1s ease-out 0.5s;
}

    .hero-info.visible[b-nvwno0s9q0] {
        opacity: 1;
        transform: translateY(10vh);
    }

.hero-title[b-nvwno0s9q0] {
    font-family: var(--title-font, 'Playfair Display'), serif;
    font-size: 3.5rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    line-height: 1.2;
}

.hero-subtitle[b-nvwno0s9q0] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5rem;
    font-weight: 400;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
    letter-spacing: 0.05em;
}

.scroll-indicator[b-nvwno0s9q0] {
    position: absolute;
    bottom: 4.5rem;
    height: 100px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    animation: bounce-b-nvwno0s9q0 2s infinite;
    cursor: pointer;
}

.scroll-arrow[b-nvwno0s9q0] {
    width: 30px;
    height: 30px;
    border-right: 2px solid white;
    border-bottom: 2px solid white;
    transform: rotate(45deg);
    opacity: 0.8;
}

@keyframes bounce-b-nvwno0s9q0 {
    0%, 20%, 50%, 80%, 100% {
        transform: translateX(-50%) translateY(0);
    }

    40% {
        transform: translateX(-50%) translateY(-10px);
    }

    60% {
        transform: translateX(-50%) translateY(-5px);
    }
}

/* Mobile-first responsive */
@media (max-width: 768px) {
    .hero-section[b-nvwno0s9q0] {
        min-height: 100vh;
        height: 100dvh; /* Use dynamic viewport height for mobile */
    }

    .hero-image[b-nvwno0s9q0],
    .hero-image-placeholder[b-nvwno0s9q0] {
        height: 110%;
        /* Remove transform scale here since JS handles scaling during parallax */
        transform-origin: bottom center;
    }

    .hero-monogram-svg[b-nvwno0s9q0] {
        width: 150px;
        height: 150px;
    }

    .hero-title[b-nvwno0s9q0] {
        font-size: 2.5rem;
    }

    .hero-subtitle[b-nvwno0s9q0] {
        font-size: 1.25rem;
    }

    .decoration[b-nvwno0s9q0] {
        width: 100px;
        height: 100px;
    }

    .decoration-2[b-nvwno0s9q0] {
        width: 80px;
        height: 80px;
    }

    .decoration-3[b-nvwno0s9q0] {
        width: 70px;
        height: 70px;
    }
}

@media (max-width: 480px) {
    .hero-title[b-nvwno0s9q0] {
        font-size: 2rem;
    }

    .hero-subtitle[b-nvwno0s9q0] {
        font-size: 1rem;
    }

    .hero-monogram-svg[b-nvwno0s9q0] {
        width: 120px;
        height: 120px;
    }
}

/* Print styles */
@media print {
    .hero-section[b-nvwno0s9q0] {
        height: auto;
        min-height: 0;
        page-break-after: avoid;
        break-after: avoid;
        padding: 2rem 0;
    }

    .hero-background[b-nvwno0s9q0] {
        position: relative;
        height: 400px;
    }

    .hero-image[b-nvwno0s9q0],
    .hero-image-placeholder[b-nvwno0s9q0] {
        height: 100%;
        filter: none !important;
        transform: none !important;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .hero-overlay[b-nvwno0s9q0] {
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.05) 50%, rgba(0, 0, 0, 0.2) 100%);
    }

    .hero-content[b-nvwno0s9q0] {
        position: relative;
        padding: 1rem;
        margin-top: -200px;
    }

    .hero-monogram[b-nvwno0s9q0] {
        opacity: 1 !important;
        transform: scale(1) !important;
        margin-bottom: 1.5rem;
    }

    .hero-monogram-svg[b-nvwno0s9q0] {
        width: 120px;
        height: 120px;
    }

    .hero-info[b-nvwno0s9q0] {
        opacity: 1 !important;
        transform: translateY(0) !important;
    }

    .hero-title[b-nvwno0s9q0] {
        font-size: 2.5rem;
        color: white;
    }

    .hero-subtitle[b-nvwno0s9q0] {
        font-size: 1.25rem;
        color: white;
    }

    /* Hide interactive elements */
    .scroll-indicator[b-nvwno0s9q0] {
        display: none;
    }

    .hero-decorations[b-nvwno0s9q0] {
        opacity: 0.2;
    }

    /* Hide Lottie containers in print */
    .lottie-parallax-container[b-nvwno0s9q0],
    .lottie-monogram-container[b-nvwno0s9q0] {
        display: none;
    }
}
/* /Components/Pages/Public/PublicRsvp.razor.rz.scp.css */
[b-94tapqtulc] #rsvp-section {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: linear-gradient(to bottom, #FAF9F6 0%, #FFFFFF 100%);
    padding-top: 20em;
    padding-bottom: 4em;
    z-index: 0 !important;
}

@media (max-width: 768px) {
    [b-94tapqtulc] #rsvp-section {
        padding-top: 18em;
        padding-bottom: 3em;
    }
}


@media (max-width: 480px) {
    [b-94tapqtulc] #rsvp-section {
        padding-top: 13em;
        padding-bottom: 3em;
    }
}

/* RSVP page print styles */
@media print {
    /* Hide interactive elements in print */
    .mud-stepper[b-94tapqtulc],
    .mud-button[b-94tapqtulc],
    .mud-input[b-94tapqtulc],
    .mud-select[b-94tapqtulc],
    .mud-checkbox[b-94tapqtulc],
    button[b-94tapqtulc],
    input[b-94tapqtulc],
    select[b-94tapqtulc] {
        display: none !important;
    }

    /* Hide loading and error containers */
    .loading-container[b-94tapqtulc],
    .error-container[b-94tapqtulc] {
        display: none;
    }

    /* Ensure RSVP section doesn't take too much space */
    [b-94tapqtulc] #rsvp-section {
        padding: 1rem 0;
        page-break-inside: avoid;
        break-inside: avoid;
    }

    /* Make MudContainer fit better on print */
    .mud-container[b-94tapqtulc] {
        max-width: 100%;
        padding: 0.5rem;
    }

    /* Show alert messages in print */
    .mud-alert[b-94tapqtulc] {
        border: 1px solid #ddd;
        padding: 1rem;
        page-break-inside: avoid;
        break-inside: avoid;
    }
}
/* /Components/Pages/Public/PublicWeddingSite.razor.rz.scp.css */
:scope[b-i0v8ye5nvi] {
    scroll-behavior: smooth;
}

.loading-container[b-i0v8ye5nvi],
.error-container[b-i0v8ye5nvi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 2rem;
    text-align: center;
}

.loading-spinner[b-i0v8ye5nvi] {
    width: 50px;
    height: 50px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #DCAE96;
    border-radius: 50%;
    animation: spin-b-i0v8ye5nvi 1s linear infinite;
    margin-bottom: 1rem;
}

@keyframes spin-b-i0v8ye5nvi {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.error-container h1[b-i0v8ye5nvi] {
    font-family: 'Playfair Display', serif;
    font-size: 2.5rem;
    color: #2A2A33;
    margin-bottom: 1rem;
}

.error-container p[b-i0v8ye5nvi] {
    font-size: 1.125rem;
    color: #747685;
}

/* Mobile-first responsive */
@media (max-width: 768px) {
    .error-container h1[b-i0v8ye5nvi] {
        font-size: 2rem;
    }

    .error-container p[b-i0v8ye5nvi] {
        font-size: 1rem;
    }
}

/* Print styles */
@media print {
    .loading-container[b-i0v8ye5nvi],
    .loading-spinner[b-i0v8ye5nvi] {
        display: none;
    }

    .error-container[b-i0v8ye5nvi] {
        min-height: auto;
        padding: 1rem;
    }
}
/* /Components/Pages/Public/RsvpComponents/RsvpConfirmation.razor.rz.scp.css */
.rsvp-confirmation[b-syt057ruxj] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 24px;
}

.confirmation-card[b-syt057ruxj] {
    text-align: center;
    max-width: 480px;
    width: 100%;
    padding: 48px 32px;
    background: white;
    border-radius: 16px;
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.1);
    animation: fadeInUp-b-syt057ruxj 0.6s ease-out;
}

.confirmation-icon-wrap[b-syt057ruxj] {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--primary-color, #e91e63), var(--secondary-color, #9c27b0));
    display: flex;
    align-items: center;
    justify-content: center;
    animation: pulse-b-syt057ruxj 2s ease-in-out infinite;
}

[b-syt057ruxj] .confirmation-icon {
    font-size: 2.5rem !important;
    color: white !important;
}

.confirmation-title[b-syt057ruxj] {
    font-family: var(--title-font, serif);
    color: var(--primary-color, #e91e63);
    margin-bottom: 8px;
    font-weight: bold;
}

.confirmation-guest-name[b-syt057ruxj] {
    color: #424242;
    margin-bottom: 16px;
    font-weight: 600;
}

.confirmation-message[b-syt057ruxj] {
    color: #616161;
    margin-bottom: 20px;
    line-height: 1.6;
}

.confirmation-date[b-syt057ruxj],
.confirmation-venue[b-syt057ruxj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-bottom: 8px;
    color: #424242;
}

[b-syt057ruxj] .confirmation-button {
    border-radius: 24px !important;
    padding: 8px 32px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
}

.confirmation-telegram[b-syt057ruxj] {
    padding: 16px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(var(--primary-rgb, 233, 30, 99), 0.05), rgba(var(--primary-rgb, 233, 30, 99), 0.1));
    border: 1px solid rgba(var(--primary-rgb, 233, 30, 99), 0.15);
}

[b-syt057ruxj] .confirmation-telegram-button {
    border-radius: 20px !important;
}

@keyframes fadeInUp-b-syt057ruxj {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pulse-b-syt057ruxj {
    0%, 100% {
        transform: scale(1);
        box-shadow: 0 0 0 0 rgba(var(--primary-rgb, 233, 30, 99), 0.4);
    }
    50% {
        transform: scale(1.05);
        box-shadow: 0 0 0 12px rgba(var(--primary-rgb, 233, 30, 99), 0);
    }
}

@media (max-width: 600px) {
    .confirmation-card[b-syt057ruxj] {
        padding: 32px 20px;
    }

    .confirmation-icon-wrap[b-syt057ruxj] {
        width: 64px;
        height: 64px;
    }

    [b-syt057ruxj] .confirmation-icon {
        font-size: 2rem !important;
    }
}
/* /Components/Pages/Public/RsvpComponents/RsvpPaymentStep.razor.rz.scp.css */
.payment-primary-button[b-zr0hwuis6g] {
    justify-content: center;
    gap: 8px;
    text-transform: none;
}

.payment-icons[b-zr0hwuis6g] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: 6px;
}

.payment-icons img[b-zr0hwuis6g] {
    height: 20px;
    width: auto;
    display: block;
}

[b-zr0hwuis6g] .payment-icon {
    font-size: 20px;
}
/* /Components/Pages/Public/WeddingInfoSection.razor.rz.scp.css */
.wedding-info-section[b-dqnpwwe0wj] {
    position: relative;
    width: 100%;
    min-height: 100vh;
    background: linear-gradient(to bottom, #FAF9F6 0%, #FFFFFF 100%);
    padding-top: 16em;
    padding-bottom: 4em;
    z-index: 0;
}

.timeline-container[b-dqnpwwe0wj] {
    position: relative;
    max-width: 800px;
    margin: 0 auto;
    padding: 2rem 0;
    animation: fadeInUp-b-dqnpwwe0wj 1s ease-out;
}

@keyframes fadeInUp-b-dqnpwwe0wj {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.timeline-item[b-dqnpwwe0wj] {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 0;
    z-index: 2;
    text-align: center;
}

.timeline-item-full[b-dqnpwwe0wj] {
    align-items: center;
    text-align: center;
}

.timeline-content[b-dqnpwwe0wj] {
    width: 100%;
    max-width: 600px;
    padding: 2rem 1rem;
    /*background: linear-gradient(to bottom, #FAF9F6 0%, #FFFFFF 100%);*/
    position: relative;
    z-index: 3;
}

/* Timeline decor connector between items */
.timeline-decor[b-dqnpwwe0wj] {
    width: 100%;
    max-width: 300px;
    height: 30px;
    margin: 0.5rem auto;
    background-image: var(--timeline-decor-url);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /*transform: rotate(90deg);*/
    opacity: 0.7;
}

.info-title[b-dqnpwwe0wj] {
    font-size: 2rem;
    font-weight: 600;
    color: #2A2A33;
    margin: 0 0 1rem 0;
}

.info-date[b-dqnpwwe0wj],
.info-time[b-dqnpwwe0wj] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25rem;
    color: #747685;
    margin: 0.5rem 0;
    font-weight: 500;
}

.info-time[b-dqnpwwe0wj] {
    font-size: 1rem;
    color: #92929F;
}

.info-venue[b-dqnpwwe0wj] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    color: #2A2A33;
    margin: 0;
    line-height: 1.6;
}

.info-description[b-dqnpwwe0wj] {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.125rem;
    color: #2A2A33;
    line-height: 1.8;
    margin: 0;
}

/* Mobile-first responsive */
@media (max-width: 768px) {
    .wedding-info-section[b-dqnpwwe0wj] {
        padding-top: 18em;
        padding-bottom: 3em;
    }

    .timeline-container[b-dqnpwwe0wj] {
        padding: 1.5rem 0;
    }

    .timeline-content[b-dqnpwwe0wj] {
        padding: 1.5rem 0;
    }

    .timeline-decor[b-dqnpwwe0wj] {
        max-width: 200px;
        height: 30px;
    }

    .info-title[b-dqnpwwe0wj] {
        font-size: 1.75rem;
    }

    .info-date[b-dqnpwwe0wj] {
        font-size: 1.125rem;
    }

    .info-venue[b-dqnpwwe0wj],
    .info-description[b-dqnpwwe0wj] {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {

    .wedding-info-section[b-dqnpwwe0wj] {
        padding-top: 12em;
        padding-bottom: 3em;
    }

    .timeline-content[b-dqnpwwe0wj] {
        padding: 1rem 0;
    }

    .timeline-decor[b-dqnpwwe0wj] {
        max-width: 150px;
        height: 25px;
    }

    .info-title[b-dqnpwwe0wj] {
        font-size: 1.5rem;
    }
}

/* Elegant map link styling */
.venue-map-link[b-dqnpwwe0wj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1rem;
    padding: 0.625rem 1.25rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.875rem;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: #747685;
    text-decoration: none;
    border: 1px solid #D4D4D8;
    border-radius: 2rem;
    background: transparent;
    transition: all 0.3s ease;
}

    .venue-map-link:hover[b-dqnpwwe0wj] {
        color: #2A2A33;
        border-color: var(--primary-color, #DCAE96);
        background: rgba(var(--primary-rgb, 220, 174, 150), 0.08);
    }

        .venue-map-link:hover .map-icon[b-dqnpwwe0wj] {
            transform: scale(1.1);
        }

.map-icon[b-dqnpwwe0wj] {
    width: 18px;
    height: 18px;
    color: var(--primary-color, #DCAE96);
    transition: transform 0.3s ease;
}

/* Print styles */
@media print {
    .wedding-info-section[b-dqnpwwe0wj] {
        min-height: auto;
        padding: 2rem 1rem;
        page-break-inside: avoid;
        break-inside: avoid;
        print-color-adjust: exact;
        -webkit-print-color-adjust: exact;
    }

    .timeline-container[b-dqnpwwe0wj] {
        page-break-inside: avoid;
        break-inside: avoid;
    }

    .timeline-item[b-dqnpwwe0wj] {
        page-break-inside: avoid;
        break-inside: avoid;
        margin-bottom: 1rem;
    }

    .timeline-content[b-dqnpwwe0wj] {
        padding: 1rem 0.5rem;
    }

    .info-title[b-dqnpwwe0wj] {
        font-size: 1.5rem;
    }

    .info-date[b-dqnpwwe0wj],
    .info-time[b-dqnpwwe0wj] {
        font-size: 1rem;
    }

    .info-venue[b-dqnpwwe0wj],
    .info-description[b-dqnpwwe0wj] {
        font-size: 0.875rem;
    }

    .timeline-decor[b-dqnpwwe0wj] {
        max-width: 150px;
        height: 20px;
    }

    /* Print link URLs after link text */
    .venue-map-link[b-dqnpwwe0wj] {
        border: 1px solid #D4D4D8;
        padding: 0.5rem 1rem;
    }

    .venue-map-link[b-dqnpwwe0wj]::after {
        content: " (" attr(href) ")";
        font-size: 0.75rem;
        color: #747685;
    }
}
/* /Components/Pages/SeatingChart/VenueEditor.razor.rz.scp.css */
/* ==========================================
   VENUE VIEW STYLES
   ========================================== */

.venue-view-container[b-4rrxq1s2hy] {
    background-color: var(--mud-palette-background);
    padding: 16px;
    border-radius: 8px;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 85vh;
}

/* Fullscreen mode */
.venue-view-container.venue-fullscreen[b-4rrxq1s2hy] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 2000;
    border-radius: 0;
}

/* Controls bar - wraps on narrow viewports */
.venue-controls-bar[b-4rrxq1s2hy] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
}

.venue-layout-wrapper[b-4rrxq1s2hy] {
    display: flex;
    flex-grow: 1;
    overflow: hidden;
    gap: 16px;
}

.venue-canvas-wrapper[b-4rrxq1s2hy] {
    flex-grow: 1;
    overflow: auto;
    background-color: #e0e0e0;
    border: 1px solid var(--mud-palette-lines-default);
    position: relative;
    cursor: grab;
    -webkit-overflow-scrolling: touch;
}

.venue-canvas-wrapper:active[b-4rrxq1s2hy] {
    cursor: grabbing;
}

.venue-canvas-scaler[b-4rrxq1s2hy] {
    width: 100%;
    height: 100%;
}

.venue-canvas[b-4rrxq1s2hy] {
    box-shadow: 0 0 20px rgba(0,0,0,0.1);
    position: relative;
    background-image: linear-gradient(var(--mud-palette-lines-default) 1px, transparent 1px),
    linear-gradient(90deg, var(--mud-palette-lines-default) 1px, transparent 1px);
    background-size: 20px 20px;
}

/* Background floor plan image */
.venue-canvas-background[b-4rrxq1s2hy] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
    z-index: 0;
    opacity: 0.5;
}

.venue-properties-panel[b-4rrxq1s2hy] {
    width: 300px;
    flex-shrink: 0;
    background-color: var(--mud-palette-surface);
    border-left: 1px solid var(--mud-palette-lines-default);
    padding: 16px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    z-index: 100;
}

/* ==========================================
   VENUE TABLES
   ========================================== */

.venue-table[b-4rrxq1s2hy] {
    position: absolute;
    cursor: grab;
    user-select: none;
    transition: box-shadow 0.25s ease, transform 0.15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
}

.venue-table:hover[b-4rrxq1s2hy] {
    z-index: 20;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.12));
}

.venue-table.dragging[b-4rrxq1s2hy] {
    opacity: 0.8;
    cursor: grabbing;
    z-index: 1000 !important;
}

.venue-table.selected[b-4rrxq1s2hy] {
    z-index: 50;
}

.venue-table-circle.selected[b-4rrxq1s2hy]  .venue-table-center {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 2px var(--mud-palette-primary);
}

.venue-table-rectangle.selected[b-4rrxq1s2hy]  .venue-table-center-rect {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 2px var(--mud-palette-primary);
}

.venue-table-square.selected[b-4rrxq1s2hy]  .venue-table-center-square {
    border-color: var(--mud-palette-primary);
    box-shadow: 0 0 0 2px var(--mud-palette-primary);
}

/* Table Type Visuals */
.venue-table.head-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.head-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.head-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #FFD700 0%, #FFC107 50%, #FFB300 100%);
    border-color: #DAA520;
    box-shadow: 0 2px 8px rgba(218, 165, 32, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.3);
    color: #5D4037;
}

.venue-table.vip-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.vip-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.vip-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #E8EAF6 0%, #C5CAE9 100%);
    border: 3px double var(--mud-palette-secondary);
    box-shadow: 0 2px 8px rgba(103, 58, 183, 0.2);
}

.venue-table.family-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.family-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.family-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #E8F5E9 0%, #C8E6C9 100%);
    border-color: #66BB6A;
    box-shadow: 0 2px 6px rgba(102, 187, 106, 0.25);
}

.venue-table.kids-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.kids-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.kids-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #FFF3E0 0%, #FFE0B2 100%);
    border-color: #FFA726;
    box-shadow: 0 2px 6px rgba(255, 167, 38, 0.25);
}

.venue-table.buffet-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.buffet-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.buffet-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #EFEBE9 0%, #D7CCC8 100%);
    border-color: #8D6E63;
    box-shadow: 0 2px 6px rgba(141, 110, 99, 0.25);
}

.venue-table.cake-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.cake-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.cake-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #FCE4EC 0%, #F8BBD0 100%);
    border-color: #EC407A;
    box-shadow: 0 2px 6px rgba(236, 64, 122, 0.2);
}

.venue-table.gift-table[b-4rrxq1s2hy]  .venue-table-center,
.venue-table.gift-table[b-4rrxq1s2hy]  .venue-table-center-rect,
.venue-table.gift-table[b-4rrxq1s2hy]  .venue-table-center-square {
    background: linear-gradient(135deg, #E0F7FA 0%, #B2EBF2 100%);
    border-color: #26C6DA;
    box-shadow: 0 2px 6px rgba(38, 198, 218, 0.25);
}

/* ==========================================
   VENUE ELEMENTS
   ========================================== */

.venue-element[b-4rrxq1s2hy] {
    position: absolute;
    cursor: grab;
    user-select: none;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid transparent;
    transition: box-shadow 0.2s;
    background-color: var(--mud-palette-surface);
    overflow: visible;
}

.venue-element:hover[b-4rrxq1s2hy] {
    border-color: var(--mud-palette-lines-default);
}

.venue-element.selected[b-4rrxq1s2hy] {
    box-shadow: 0 0 0 2px var(--mud-palette-primary);
    z-index: 50;
    border-color: var(--mud-palette-primary);
}

.venue-element.dragging[b-4rrxq1s2hy] {
    opacity: 0.8;
    cursor: grabbing;
    z-index: 1000 !important;
}

.venue-element-stage[b-4rrxq1s2hy] {
    background-color: #424242;
    color: white;
    border-radius: 2px;
}

.venue-element-dancefloor[b-4rrxq1s2hy] {
    background-color: #f5f5f5;
    background-image:
        linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc),
        linear-gradient(45deg, #ccc 25%, transparent 25%, transparent 75%, #ccc 75%, #ccc);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
    border: 1px solid #999;
}

.venue-element-bar[b-4rrxq1s2hy] {
    background-color: #795548;
    color: white;
    border-radius: 4px;
}

.venue-element-entrance[b-4rrxq1s2hy] {
    border-bottom: 4px solid var(--mud-palette-success);
    background: transparent;
    align-items: flex-end;
}

.venue-element-exit[b-4rrxq1s2hy] {
    border-top: 4px solid var(--mud-palette-error);
    background: transparent;
    align-items: flex-start;
}

.venue-element-label[b-4rrxq1s2hy] {
    padding: 4px;
    text-align: center;
    font-weight: bold;
    font-size: 0.8rem;
    pointer-events: none;
    max-width: 100%;
}

.venue-element-icon[b-4rrxq1s2hy] {
    opacity: 0.5;
    pointer-events: none;
}

/* ==========================================
   VENUE TABLE RENDERING
   ========================================== */

[b-4rrxq1s2hy] .venue-table-circle-layout {
    position: relative;
    width: 130px;
    height: 130px;
}

[b-4rrxq1s2hy] .venue-table-circle-layout .venue-table-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.6);
    transition: border-color 0.2s, box-shadow 0.2s;
}

[b-4rrxq1s2hy] .venue-table-circle-layout .venue-seat-wrapper {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 42px;
    height: 36px;
}

[b-4rrxq1s2hy] .venue-seat-name-label {
    font-size: 0.5rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
    text-align: center;
    margin-bottom: 1px;
    max-width: 42px;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 12px;
    line-height: 12px;
}

[b-4rrxq1s2hy] .venue-seat {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[b-4rrxq1s2hy] .venue-seat:hover {
    transform: scale(1.1);
}

[b-4rrxq1s2hy] .venue-seat.empty {
    background-color: var(--mud-palette-surface);
    border: 2px dashed color-mix(in srgb, var(--mud-palette-lines-default) 60%, transparent);
}

[b-4rrxq1s2hy] .venue-seat.confirmed {
    background: linear-gradient(145deg, var(--mud-palette-success-lighten), var(--mud-palette-success));
    box-shadow: 0 1px 4px rgba(76, 175, 80, 0.3);
}

[b-4rrxq1s2hy] .venue-seat.pending {
    background: linear-gradient(145deg, var(--mud-palette-warning-lighten), var(--mud-palette-warning));
    box-shadow: 0 1px 4px rgba(255, 152, 0, 0.3);
}

[b-4rrxq1s2hy] .venue-seat-square {
    width: 24px;
    height: 24px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

[b-4rrxq1s2hy] .venue-seat-square:hover {
    transform: scale(1.1);
}

[b-4rrxq1s2hy] .venue-seat-square.empty {
    background-color: var(--mud-palette-surface);
    border: 2px dashed color-mix(in srgb, var(--mud-palette-lines-default) 60%, transparent);
}

[b-4rrxq1s2hy] .venue-seat-square.confirmed {
    background: linear-gradient(145deg, var(--mud-palette-success-lighten), var(--mud-palette-success));
    box-shadow: 0 1px 4px rgba(76, 175, 80, 0.3);
}

[b-4rrxq1s2hy] .venue-seat-square.pending {
    background: linear-gradient(145deg, var(--mud-palette-warning-lighten), var(--mud-palette-warning));
    box-shadow: 0 1px 4px rgba(255, 152, 0, 0.3);
}

/* Rect layout */
[b-4rrxq1s2hy] .venue-table-rect-layout {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 4px;
}

[b-4rrxq1s2hy] .venue-table-row {
    display: flex;
    justify-content: center;
    gap: 4px;
}

[b-4rrxq1s2hy] .venue-seat-rect-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 42px;
}

[b-4rrxq1s2hy] .venue-table-center-rect {
    height: 30px;
    margin: 0 auto;
    width: calc(100% - 6px);
    padding: 0 8px;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    transition: border-color 0.2s, box-shadow 0.2s;
}

/* Legend dot for empty seats */
.venue-seat-dot.empty[b-4rrxq1s2hy] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px dashed var(--mud-palette-lines-default);
    background-color: var(--mud-palette-surface);
}

/* ==========================================
   COMPACT MODE (low zoom)
   Hides name labels and shrinks seats for
   high-density overview at ≤50% zoom.
   ========================================== */

.venue-compact[b-4rrxq1s2hy]  .venue-seat-name-label {
    display: none;
}

.venue-compact[b-4rrxq1s2hy]  .venue-element-label {
    font-size: 0.65rem;
}

/* ==========================================
   VENUE SQUARE TABLE RENDERING
   ========================================== */

[b-4rrxq1s2hy] .venue-table-square-layout {
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 4px;
    padding: 4px;
}

[b-4rrxq1s2hy] .venue-table-middle {
    display: flex;
    align-items: stretch;
    gap: 4px;
}

[b-4rrxq1s2hy] .venue-table-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

[b-4rrxq1s2hy] .venue-table-center-square {
    flex: 1;
    min-height: 30px;
    min-width: 30px;
    padding: 0 8px;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    transition: border-color 0.2s, box-shadow 0.2s;
}

/* ==========================================
   INLINE MANIPULATION HANDLES
   ========================================== */

.inline-rotate-handle[b-4rrxq1s2hy] {
    position: absolute;
    top: -28px;
    left: 50%;
    transform: translateX(-50%);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background-color: var(--mud-palette-primary);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
    z-index: 100;
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    transition: transform 0.15s;
}

.inline-rotate-handle:hover[b-4rrxq1s2hy] {
    transform: translateX(-50%) scale(1.2);
}

.inline-rotate-handle:active[b-4rrxq1s2hy] {
    cursor: grabbing;
}

.inline-rotate-handle[b-4rrxq1s2hy]::after {
    content: '';
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 6px;
    background-color: var(--mud-palette-primary);
}

.inline-resize-handle[b-4rrxq1s2hy] {
    position: absolute;
    bottom: -4px;
    right: -4px;
    width: 12px;
    height: 12px;
    background-color: var(--mud-palette-primary);
    border: 2px solid white;
    border-radius: 2px;
    cursor: nwse-resize;
    z-index: 100;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

.inline-resize-handle:hover[b-4rrxq1s2hy] {
    background-color: var(--mud-palette-primary-darken);
}

/* ==========================================
   SHARED LEGEND STYLES
   ========================================== */

.seatmap-legend[b-4rrxq1s2hy] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    padding: 8px 12px;
    background-color: var(--mud-palette-surface);
    border-radius: 4px;
    flex-wrap: wrap;
}

.seatmap-legend-item[b-4rrxq1s2hy] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
}

.seatmap-legend-dot[b-4rrxq1s2hy] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.seatmap-legend-dot.confirmed[b-4rrxq1s2hy] {
    background-color: var(--mud-palette-success);
}

.seatmap-legend-dot.pending[b-4rrxq1s2hy] {
    background-color: var(--mud-palette-warning);
}

/* ==========================================
   RESPONSIVE BREAKPOINTS
   ========================================== */

/* Tablets and small laptops */
@media (max-width: 1280px) {
    .venue-properties-panel[b-4rrxq1s2hy] {
        width: 240px;
        padding: 12px;
    }
}

/* Small tablets and large phones */
@media (max-width: 960px) {
    .venue-view-container[b-4rrxq1s2hy] {
        padding: 8px;
        height: 80vh;
    }

    .venue-layout-wrapper[b-4rrxq1s2hy] {
        flex-direction: column;
        gap: 8px;
    }

    .venue-controls-bar[b-4rrxq1s2hy] {
        padding: 4px 0;
        gap: 4px;
    }

    .venue-properties-panel[b-4rrxq1s2hy] {
        width: 100%;
        max-height: 200px;
        border-left: none;
        border-top: 1px solid var(--mud-palette-lines-default);
        padding: 8px;
        flex-direction: row;
        flex-wrap: wrap;
    }
}

/* Phones */
@media (max-width: 600px) {
    .venue-view-container[b-4rrxq1s2hy] {
        padding: 4px;
        height: 75vh;
    }

    .venue-controls-bar[b-4rrxq1s2hy] {
        flex-direction: column;
        align-items: stretch;
    }

    .venue-properties-panel[b-4rrxq1s2hy] {
        max-height: 160px;
    }

    .seatmap-legend[b-4rrxq1s2hy] {
        gap: 8px;
        padding: 6px 8px;
        font-size: 0.65rem;
    }
}

/* Touch devices: larger hit targets for handles */
@media (hover: none) and (pointer: coarse) {
    .inline-rotate-handle[b-4rrxq1s2hy] {
        width: 32px;
        height: 32px;
        top: -36px;
    }

    .inline-resize-handle[b-4rrxq1s2hy] {
        width: 18px;
        height: 18px;
        bottom: -8px;
        right: -8px;
    }

    [b-4rrxq1s2hy] .venue-seat,
    [b-4rrxq1s2hy] .venue-seat-square {
        min-width: 28px;
        min-height: 28px;
    }
}

/* Mobile FAB for adding elements */
.venue-mobile-fab[b-4rrxq1s2hy] {
    position: absolute;
    bottom: 16px;
    right: 16px;
    z-index: 200;
}
/* /Components/Pages/SeatingChart/VenueToolbox.razor.rz.scp.css */
.venue-toolbox[b-wev1cpk7iv] {
    width: 60px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    background-color: var(--mud-palette-surface);
    padding: 8px;
    border-radius: 8px;
    border: 1px solid var(--mud-palette-lines-default);
    overflow-y: auto;
}
/* /Components/Pages/SeatingChartPage.razor.rz.scp.css */
/* ==========================================
   OVERVIEW TAB - GUEST PANEL & TABLE GRID
   ========================================== */

.seatmap-guest-panel[b-rrhfro549h] {
    background-color: var(--mud-palette-background);
}

.seatmap-guest-list[b-rrhfro549h] {
    display: flex;
    flex-direction: column;
    gap: 12px !important;
}

.seatmap-table-card[b-rrhfro549h] {
    border: 1px solid color-mix(in srgb, var(--mud-palette-lines-default) 70%, transparent);
    transition: box-shadow 0.2s ease, transform 0.15s ease;
}

.seatmap-table-card:hover[b-rrhfro549h] {
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    transform: translateY(-2px);
}

.seatmap-table-guests[b-rrhfro549h] {
    gap: 8px !important;
}

.seatmap-guest-chip[b-rrhfro549h] {
    border-left-width: 4px;
    border-left-style: solid;
    border-radius: 4px !important;
}

.seatmap-guest-confirmed[b-rrhfro549h] {
    border-left-color: var(--mud-palette-success);
    background-color: color-mix(in srgb, var(--mud-palette-success) 10%, var(--mud-palette-surface));
    transition: box-shadow 0.15s ease;
}

.seatmap-guest-confirmed:hover[b-rrhfro549h] {
    box-shadow: 0 2px 8px rgba(76, 175, 80, 0.15);
}

.seatmap-guest-pending[b-rrhfro549h] {
    border-left-color: var(--mud-palette-warning);
    background-color: color-mix(in srgb, var(--mud-palette-warning) 10%, var(--mud-palette-surface));
    transition: box-shadow 0.15s ease;
}

.seatmap-guest-pending:hover[b-rrhfro549h] {
    box-shadow: 0 2px 8px rgba(255, 152, 0, 0.15);
}

.seatmap-guest-selected[b-rrhfro549h] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 1px;
}

/* ==========================================
   LEGEND (shared between tabs)
   ========================================== */

.seatmap-legend[b-rrhfro549h] {
    display: flex;
    gap: 16px;
    margin-bottom: 12px;
    padding: 8px 12px;
    background-color: var(--mud-palette-surface);
    border-radius: 4px;
    flex-wrap: wrap;
}

.seatmap-legend-item[b-rrhfro549h] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.75rem;
}

.seatmap-legend-dot[b-rrhfro549h] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.seatmap-legend-dot.confirmed[b-rrhfro549h] {
    background-color: var(--mud-palette-success);
}

.seatmap-legend-dot.pending[b-rrhfro549h] {
    background-color: var(--mud-palette-warning);
}

/* ==========================================
   TABLE LAYOUTS (circle & rectangle seats)
   ========================================== */

[b-rrhfro549h] .table-layout-circle {
    position: relative;
    width: 180px;
    height: 180px;
    margin: 20px auto;
}

[b-rrhfro549h] .table-layout-circle .table-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

[b-rrhfro549h] .table-layout-circle .seat-wrapper {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 60px;
    height: 52px;
}

[b-rrhfro549h] .seat-name-label {
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
    text-align: center;
    margin-bottom: 2px;
    max-width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 14px;
    line-height: 14px;
}

[b-rrhfro549h] .seat-name-label-below {
    font-size: 0.6rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
    text-align: center;
    margin-top: 2px;
    max-width: 60px;
    overflow: hidden;
    text-overflow: ellipsis;
    height: 14px;
    line-height: 14px;
}

[b-rrhfro549h] .table-layout-rectangle {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
    padding: 10px;
}

[b-rrhfro549h] .table-layout-rectangle .table-row {
    display: flex;
    justify-content: center;
    gap: 4px;
}

[b-rrhfro549h] .table-layout-rectangle .seat-wrapper-rect {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    width: 60px;
    height: 52px;
}

[b-rrhfro549h] .table-layout-rectangle .table-center {
    height: 40px;
    margin: 0 auto;
    width: calc(100% - 8px);
    padding: 0 12px;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

.table-width-circle[b-rrhfro549h] { width: 240px; }
.table-width-rectangle[b-rrhfro549h] { width: 260px; }
.table-width-square[b-rrhfro549h] { width: 280px; }
.table-width-default[b-rrhfro549h] { width: 220px; }

/* ==========================================
   SEAT DROP ZONES
   ========================================== */

[b-rrhfro549h] .table-layout-circle .seat-zone,
[b-rrhfro549h] .table-layout-rectangle .seat-zone,
[b-rrhfro549h] .table-layout-square .seat-zone {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s;
    z-index: 10;
    min-height: unset !important;
    padding: 0 !important;
}

[b-rrhfro549h] .table-layout-circle .seat-zone {
    border-radius: 50%;
}

[b-rrhfro549h] .table-layout-rectangle .seat-zone {
    border-radius: 4px;
}

[b-rrhfro549h] .table-layout-square .seat-zone {
    border-radius: 4px;
}

[b-rrhfro549h] .table-layout-circle .seat-zone:hover,
[b-rrhfro549h] .table-layout-rectangle .seat-zone:hover,
[b-rrhfro549h] .table-layout-square .seat-zone:hover {
    transform: scale(1.1);
    z-index: 20;
}

[b-rrhfro549h] .seat-zone.empty {
    background-color: var(--mud-palette-surface);
    border: 2px dashed color-mix(in srgb, var(--mud-palette-lines-default) 60%, transparent);
    cursor: pointer;
    transition: border-color 0.2s, background-color 0.2s;
}

[b-rrhfro549h] .seat-zone.empty:hover {
    border-color: var(--mud-palette-primary);
    background-color: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
}

[b-rrhfro549h] .seat-zone.occupied {
    background: transparent;
    border: none;
}

[b-rrhfro549h] .seated-guest {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: grab;
    transition: transform 0.2s;
}

[b-rrhfro549h] .seated-guest:active {
    cursor: grabbing;
}

[b-rrhfro549h] .table-layout-circle .seated-guest {
    border-radius: 50%;
}

[b-rrhfro549h] .table-layout-rectangle .seated-guest {
    border-radius: 4px;
}

[b-rrhfro549h] .table-layout-square .seated-guest {
    border-radius: 4px;
}

[b-rrhfro549h] .seated-guest.confirmed {
    background: linear-gradient(145deg, var(--mud-palette-success-lighten), var(--mud-palette-success));
    box-shadow: 0 1px 3px rgba(76, 175, 80, 0.3);
}

[b-rrhfro549h] .seated-guest.pending {
    background: linear-gradient(145deg, var(--mud-palette-warning-lighten), var(--mud-palette-warning));
    box-shadow: 0 1px 3px rgba(255, 152, 0, 0.3);
}

[b-rrhfro549h] .mud-drop-zone:hover {
    opacity: 0.85;
}

[b-rrhfro549h] .table-layout-circle .mud-drop-zone.seat,
[b-rrhfro549h] .table-layout-rectangle .mud-drop-zone.seat,
[b-rrhfro549h] .table-layout-square .mud-drop-zone.seat {
    min-height: unset !important;
    padding: 0 !important;
}

/* ==========================================
   QUICK ASSIGN POPUP
   ========================================== */

[b-rrhfro549h] .quick-assign-popup {
    position: absolute;
    z-index: 1000;
    min-width: 220px;
    max-width: 280px;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 4px;
    background-color: var(--mud-palette-surface);
    border-radius: 8px;
}

[b-rrhfro549h] .quick-assign-list .mud-list-item {
    cursor: pointer;
    border-radius: 4px;
}

[b-rrhfro549h] .quick-assign-list .mud-list-item:hover {
    background-color: var(--mud-palette-action-default-hover);
}

/* Rectangle seat wrapper needs relative for popup positioning */
[b-rrhfro549h] .table-layout-rectangle .seat-wrapper-rect,
[b-rrhfro549h] .table-layout-square .seat-wrapper-rect {
    position: relative;
}

/* ==========================================
   SQUARE TABLE LAYOUT
   ========================================== */

[b-rrhfro549h] .table-layout-square {
    display: grid;
    grid-template-rows: auto 1fr auto;
    gap: 4px;
    padding: 10px;
}

[b-rrhfro549h] .table-layout-square .table-row {
    display: flex;
    justify-content: center;
    gap: 4px;
}

[b-rrhfro549h] .table-layout-square .table-middle {
    display: flex;
    align-items: stretch;
    gap: 4px;
}

[b-rrhfro549h] .table-layout-square .table-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
}

[b-rrhfro549h] .table-layout-square .table-center-square {
    flex: 1;
    min-height: 60px;
    min-width: 60px;
    background: linear-gradient(145deg, var(--mud-palette-surface) 0%, var(--mud-palette-background-gray) 100%);
    border: 2px solid var(--mud-palette-lines-default);
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

/* Template picker card hover */
[b-rrhfro549h] .template-card:hover {
    border-color: var(--mud-palette-primary) !important;
    background-color: var(--mud-palette-action-default-hover);
    transition: border-color 0.15s, background-color 0.15s;
}
/* /Components/Pages/WeddingWebsiteEditor.razor.rz.scp.css */
/* Ensure monogram doesn't break out of preview container */
.preview-container[b-a77hhz8pbs]  .hero-monogram {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: translateX(0) scale(1) !important;
    filter: none !important;
    z-index: auto !important;
    will-change: auto !important;
}

/* Ensure hero section fits within preview */
.preview-container[b-a77hhz8pbs]  .hero-section {
    position: relative;
    height: 100vh;
    min-height: 600px;
}

/* Keep scroll indicator visible in preview */
.preview-container[b-a77hhz8pbs]  .scroll-indicator {
    position: absolute;
    bottom: 2rem;
}
