/* /Pages/AppointmentBook/Components/Appointment.razor.rz.scp.css */
.uds-apt[b-7m4rf39mjs] {
    position:absolute;
    box-sizing:border-box;
    padding:.3rem .1rem .1rem .4rem;
    border-radius: .5rem;
    border-width: 2px;
    color: var(--mud-palette-primary-text);
    box-shadow: var(--mud-elevation-4);
    user-select:none;
    z-index: 2;
}
.uds-apt-disabled[b-7m4rf39mjs] {
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
    opacity: .7;
    box-shadow: var(--mud-elevation-1);
}
.uds-apt-title[b-7m4rf39mjs] { font-weight:500; line-height:1.1; }
.uds-apt-time[b-7m4rf39mjs] { font-size:.77rem; opacity:.9; }

.uds-apt-live[b-7m4rf39mjs] {
    /* Required so interact.js can own pointer/touch events on the card.
       Without this the browser intercepts touch gestures for scrolling first.
       On touch input we still allow vertical scroll: scheduleInterop.js
       proxies pointermove to .uds-body-scroll while the hold timer is pending,
       so a quick swipe scrolls the schedule even though touch-action is none. */
    touch-action: none;
    transition: transform 120ms ease, box-shadow 120ms ease;
}

.uds-apt-resize-handle[b-7m4rf39mjs] {
    position:absolute; left:0; right:0; bottom:-6px; height:12px;
    cursor: ns-resize;
    touch-action: none;
    border-bottom-left-radius:.5rem; border-bottom-right-radius:.5rem;
}

/* Long-press feedback (touch only).
   - .uds-apt-pressing is applied on pointerdown and removed when the hold
     either completes or is cancelled by movement. Subtle to telegraph
     "something is happening" during the ~350ms wait.
   - .uds-apt-armed is applied when the hold timer fires and drag/resize
     becomes active. A bigger lift confirms the arm; haptic vibration
     fires alongside it. */
.uds-apt-live.uds-apt-pressing[b-7m4rf39mjs] {
    transform: scale(1.01);
    box-shadow: var(--mud-elevation-6);
}

.uds-apt-live.uds-apt-armed[b-7m4rf39mjs] {
    transform: scale(1.03);
    box-shadow: var(--mud-elevation-12);
}

@media (max-width: 768px) {
    /* Larger touch target for the resize handle on mobile */
    .uds-apt-resize-handle[b-7m4rf39mjs] {
        bottom: -10px;
        height: 20px;
    }
}
/* /Pages/AppointmentBook/Components/AppointmentCreator.razor.rz.scp.css */
.page[b-xpre3fdo7v] {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100vh - 48px);
    overflow: hidden;
}

.header-bar[b-xpre3fdo7v] {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    padding: 3px;
    position: static;
    justify-content: space-between;
}

.section[b-xpre3fdo7v] {
    display: flex;
    flex-direction: column;
    width: 100%;
    flex: 1;
    overflow: hidden;
    padding-top: 64px; /* MudAppBar height */
}

/* Desktop 3-column layout */
@media (min-width: 960px) {
    .section[b-xpre3fdo7v] {
        flex-direction: row;
    }

    .client-list-container[b-xpre3fdo7v] {
        height: calc(100vh - 128px);
        overflow: hidden;
    }

    .client-list-container > *[b-xpre3fdo7v] {
        height: 100%;
    }

    .service-container[b-xpre3fdo7v] {
        height: calc(100vh - 128px);
        overflow: hidden;
    }

    .service-container > *[b-xpre3fdo7v] {
        height: 100%;
    }

    .info-container[b-xpre3fdo7v] {
        height: calc(100vh - 128px);
        overflow: hidden;
    }

    .info-container > *[b-xpre3fdo7v] {
        height: 100%;
    }
}

/* Mobile stepper layout */
@media (max-width: 959px) {
    .page[b-xpre3fdo7v] {
        height: 100vh;
    }

    .section[b-xpre3fdo7v] {
        overflow-y: auto;
        padding-top: 56px; /* Smaller mobile app bar */
    }
}

/* Ensure MudGrid doesn't add extra padding/margin in desktop mode */
@media (min-width: 960px) {
    .section .mud-grid[b-xpre3fdo7v] {
        height: 100%;
        margin: 0 !important;
        padding: 8px !important;
    }
}
/* /Pages/AppointmentBook/Components/AppointmentViewer.razor.rz.scp.css */
.app[b-e15huwoqp5] {
    width: 100%;
    height: 100%;
    background-color: green;
    border-radius: 10px;
    border: 5px dashed;
}

.control-section[b-e15huwoqp5] {
    height: 100%;
    overflow: hidden;
}


/* /Pages/AppointmentBook/Components/MobileScheduleList.razor.rz.scp.css */
.msl-root[b-cwiqgv0i1j] {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px);
    background: var(--mud-palette-background);
}

.msl-week-header[b-cwiqgv0i1j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 8px;
    background: var(--mud-palette-surface);
    border-bottom: 1px solid var(--mud-palette-divider);
    flex-shrink: 0;
}

.msl-week-label[b-cwiqgv0i1j] {
    flex: 1;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    line-height: 1.1;
}

.msl-week-range[b-cwiqgv0i1j] {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
}

.msl-this-week-btn[b-cwiqgv0i1j] {
    min-height: 0;
    padding: 0 6px;
    font-size: 0.7rem;
    text-transform: none;
}

.msl-progress[b-cwiqgv0i1j] {
    flex-shrink: 0;
}

.msl-empty[b-cwiqgv0i1j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 48px 24px;
    text-align: center;
    color: var(--mud-palette-text-secondary);
}

.msl-scroll[b-cwiqgv0i1j] {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 0 0 8px 0;
}

.msl-scroll-bottom-pad[b-cwiqgv0i1j] {
    height: 80px;
}

/* ----- Sticky day header ----- */
.msl-day-header[b-cwiqgv0i1j] {
    position: sticky;
    top: 0;
    z-index: 2;
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 10px 14px 6px 14px;
    background: var(--mud-palette-background-grey);
    border-top: 1px solid var(--mud-palette-divider);
    border-bottom: 1px solid var(--mud-palette-divider);
    text-transform: uppercase;
    letter-spacing: 0.6px;
}

.msl-day-name[b-cwiqgv0i1j] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
}

.msl-day-date[b-cwiqgv0i1j] {
    font-size: 0.72rem;
    color: var(--mud-palette-text-secondary);
}

.msl-day-today .msl-day-name[b-cwiqgv0i1j] {
    color: var(--mud-palette-primary);
}

.msl-day-today .msl-day-date[b-cwiqgv0i1j] {
    color: var(--mud-palette-primary);
    font-weight: 600;
}

.msl-day-closed[b-cwiqgv0i1j] {
    background: repeating-linear-gradient(
        135deg,
        var(--mud-palette-background-grey) 0,
        var(--mud-palette-background-grey) 6px,
        var(--mud-palette-divider) 6px,
        var(--mud-palette-divider) 7px
    );
}

.msl-day-closed .msl-day-name[b-cwiqgv0i1j],
.msl-day-closed .msl-day-date[b-cwiqgv0i1j] {
    opacity: 0.6;
}

.msl-closed-chip[b-cwiqgv0i1j] {
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 10px;
    background: var(--mud-palette-divider);
    color: var(--mud-palette-text-secondary);
    margin-left: 8px;
}

/* ----- Boundary rows ----- */
.msl-boundary[b-cwiqgv0i1j] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 18px;
    color: var(--mud-palette-text-secondary);
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.4px;
}

/* ----- Day off ----- */
.msl-day-off[b-cwiqgv0i1j] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 16px;
    color: var(--mud-palette-text-disabled);
    font-size: 0.85rem;
    font-style: italic;
}

/* ----- Gap CTA ----- */
.msl-gap[b-cwiqgv0i1j] {
    display: flex;
    align-items: center;
    gap: 10px;
    width: calc(100% - 20px);
    margin: 6px 10px;
    padding: 10px 12px;
    background: transparent;
    border: 1px dashed var(--mud-palette-primary);
    border-radius: 8px;
    color: var(--mud-palette-primary);
    font: inherit;
    font-size: 0.85rem;
    cursor: pointer;
    text-align: left;
    transition: background 120ms ease;
}

.msl-gap:active[b-cwiqgv0i1j] {
    background: rgba(var(--mud-palette-primary-rgb), 0.08);
}

.msl-gap-label[b-cwiqgv0i1j] {
    flex: 1;
    font-weight: 500;
}

.msl-gap-time[b-cwiqgv0i1j] {
    font-size: 0.75rem;
    color: var(--mud-palette-text-secondary);
}

/* ----- Appointment row ----- */
.msl-apt[b-cwiqgv0i1j] {
    display: flex;
    gap: 12px;
    width: calc(100% - 20px);
    margin: 4px 10px;
    padding: 10px 12px;
    background: var(--mud-palette-surface);
    border: 1px solid var(--mud-palette-divider);
    border-left: 4px solid var(--mud-palette-primary);
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    box-shadow: var(--mud-elevation-1);
    font: inherit;
    color: var(--mud-palette-text-primary);
    transition: transform 80ms ease, box-shadow 120ms ease;
}

.msl-apt:active[b-cwiqgv0i1j] {
    transform: scale(0.99);
    box-shadow: var(--mud-elevation-0);
}

.msl-apt-block[b-cwiqgv0i1j] {
    background: var(--mud-palette-background-grey);
    cursor: default;
    opacity: 0.85;
}

.msl-apt-time[b-cwiqgv0i1j] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 64px;
    flex-shrink: 0;
    line-height: 1.15;
}

.msl-apt-time > span:first-child[b-cwiqgv0i1j] {
    font-size: 0.92rem;
    font-weight: 600;
}

.msl-apt-len[b-cwiqgv0i1j] {
    font-size: 0.72rem;
    color: var(--mud-palette-text-secondary);
    margin-top: 2px;
}

.msl-apt-body[b-cwiqgv0i1j] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.msl-apt-title[b-cwiqgv0i1j] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--mud-palette-text-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.msl-apt-details[b-cwiqgv0i1j] {
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Squish back-to-back appointments by tightening adjacent margins */
.msl-apt + .msl-apt[b-cwiqgv0i1j] {
    margin-top: 0;
}
/* /Pages/AppointmentBook/Components/Schedule.razor.rz.scp.css */
.uds-root[b-53kho0hl1w] { width:100%; height: 100%; }
.uds-container[b-53kho0hl1w] { padding:0; overflow:hidden; }

.uds-header[b-53kho0hl1w] {
    display:grid;
    grid-template-columns: 60px repeat(var(--uds-col-count, 1), 1fr);
    align-items:center;
    border-bottom: 1px solid var(--mud-palette-lines-default);
    background: var(--mud-palette-background);
}
.uds-time-gutter[b-53kho0hl1w] { width:60px; }
.uds-col-header[b-53kho0hl1w] {
    display:flex; align-items:center; gap:.5rem;
    min-width: 0;
    padding:.5rem .75rem;
    border-left: 1px solid var(--mud-palette-lines-default);
    min-height:40px;
    max-height: 40px;
}
.uds-user-name[b-53kho0hl1w] { font-weight:600; font-size: 1em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.uds-body[b-53kho0hl1w] {
    display:grid;
    grid-template-columns: 60px repeat(var(--uds-col-count, 1), 1fr);
    height: calc( var(--uds-rows, 20) * var(--uds-slot-h, 40px) );
    position: relative;
}

.uds-time-gutter .uds-time-slot[b-53kho0hl1w] {
    width: 60px;
    position: relative;
    border-bottom: 1px dashed var(--mud-palette-lines-default);
    display:flex;
    align-items:center;
    justify-content:center;
    box-sizing:border-box;
}

.uds-time-label[b-53kho0hl1w] { position: sticky; top:0; font-size:.8rem; color: var(--mud-palette-text-secondary); text-align:center; }

.uds-col[b-53kho0hl1w] {
    position: relative;
    border-left: 1px solid var(--mud-palette-lines-default);
    overflow: hidden;
}
.uds-col.uds-drop-hover[b-53kho0hl1w] {
    box-shadow: inset 0 0 0 3px rgba(25,118,210,0.25);
    background-color: rgba(25,118,210,0.05);
    transition: box-shadow 0.15s ease, background-color 0.15s ease;
}

.uds-col-slot[b-53kho0hl1w] {
    border-bottom: 1px dashed rgba(0,0,0,.08);
}

/* ---- Schedule boundary blocks (unavailable time) ---- */
.uds-boundary[b-53kho0hl1w] {
    position: absolute;
    left: 0;
    right: 0;
    box-sizing: border-box;
    background: repeating-linear-gradient(
        135deg,
        rgba(128,128,128,0.07) 0px,
        rgba(128,128,128,0.07) 3px,
        transparent 3px,
        transparent 10px
    );
    z-index: 1;
    user-select: none;
}

.uds-boundary-handle[b-53kho0hl1w] {
    position: absolute;
    left: 0;
    right: 0;
    height: 10px;
    cursor: ns-resize;
    touch-action: none;
    background: rgba(128,128,128,0.28);
    z-index: 2;
}

.uds-boundary-handle-b[b-53kho0hl1w] {
    bottom: 0;
    border-radius: 0 0 3px 3px;
    border-top: 1px solid rgba(128,128,128,0.35);
}

.uds-boundary-handle-t[b-53kho0hl1w] {
    top: 0;
    border-radius: 3px 3px 0 0;
    border-bottom: 1px solid rgba(128,128,128,0.35);
}

/* Long-press feedback on schedule boundary blocks (touch).
   See Appointment.razor.css for the matching appointment-card variants. */
.uds-boundary.uds-apt-pressing[b-53kho0hl1w] {
    background: repeating-linear-gradient(
        135deg,
        rgba(128,128,128,0.14) 0px,
        rgba(128,128,128,0.14) 3px,
        transparent 3px,
        transparent 10px
    );
    transition: background 120ms ease;
}

.uds-boundary.uds-apt-armed .uds-boundary-handle[b-53kho0hl1w] {
    background: rgba(25,118,210,0.55);
    transition: background 100ms ease;
}

.uds-apt[b-53kho0hl1w] {
    position:absolute;
    box-sizing:border-box;
    padding:.3rem .1rem .1rem .3rem;
    border-radius: .5rem;
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    box-shadow: var(--mud-elevation-4);
    user-select:none;
    z-index: 2;
}
.uds-apt-disabled[b-53kho0hl1w] {
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
    opacity: .7;
    box-shadow: var(--mud-elevation-1);
}
.uds-apt-title[b-53kho0hl1w] { font-weight:500; line-height:1.1; }
.uds-apt-time[b-53kho0hl1w] { font-size:.77rem; opacity:.9; }

.uds-apt-resize-handle[b-53kho0hl1w] {
    position:absolute; left:0; right:0; bottom:-6px; height:12px;
    cursor: ns-resize;
    border-bottom-left-radius:.5rem; border-bottom-right-radius:.5rem;
}

.uds-ghost[b-53kho0hl1w] {
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    box-shadow: 0 4px 12px rgba(0,0,0,0.3);
    border-radius: .5rem;
    opacity: 0.7;
    transform: scale(0.98);
    transition: opacity 0.15s ease, transform 0.1s ease;
}

.uds-time-indicator[b-53kho0hl1w] {
    position: fixed;
    background: var(--mud-palette-surface);
    color: var(--mud-palette-text-primary);
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    padding: 2px 6px;
    font-size: 0.8rem;
    opacity: 0;
    animation: fadeInGhostTime-b-53kho0hl1w 0.2s ease forwards;
    transition: opacity 0.1s ease;
    pointer-events: none;
    z-index: 1000;
}

@keyframes udsTimePulse-b-53kho0hl1w {
    0%   { transform: translateX(-50%) scale(1);    opacity: 1; }
    40%  { transform: translateX(-50%) scale(1.15); opacity: 0.9; }
    100% { transform: translateX(-50%) scale(1);    opacity: 1; }
}

@keyframes fadeInGhostTime-b-53kho0hl1w {
    from { opacity: 0; transform: translateX(-50%) scale(0.9); }
    to   { opacity: 1; transform: translateX(-50%) scale(1); }
}


.uds-ghost-time[b-53kho0hl1w] {
    position: absolute;
    top: -1.4rem;
    left: 50%;
    transform: translateX(-50%);
    background: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    padding: 1px 6px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.25);
    pointer-events: none;
    transition: opacity 0.1s ease;
}

.uds-ghost-time.pulse[b-53kho0hl1w] {
    animation: udsTimePulse-b-53kho0hl1w 0.25s ease;
}

.uds-time-guide[b-53kho0hl1w] {
    transition: top 0.05s linear;
}

.sticky-header[b-53kho0hl1w] {
    position: sticky;
    top: 0;
    z-index: 10;
    background: var(--mud-palette-surface);
}

.uds-body-scroll[b-53kho0hl1w] {
    overflow-y: auto;
    max-height: calc(100dvh - 100px); /* 48px bottom appbar + 52px mt-13 offset */
}

/* ---- Current time indicator line ---- */
.uds-now-line[b-53kho0hl1w] {
    position: absolute;
    left: 60px;
    right: 0;
    height: 1px;
    background: rgba(229, 57, 53, 0.45);
    z-index: 3;
    pointer-events: none;
}

.uds-now-line[b-53kho0hl1w]::before {
    content: '';
    position: absolute;
    left: -4px;
    top: -3px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(229, 57, 53, 0.55);
}

@media (max-width: 768px) {
    .uds-mobile-hidden[b-53kho0hl1w] {
        display: none !important;
    }

    .uds-header[b-53kho0hl1w] {
        grid-template-columns: 60px 1fr !important;
    }

    .uds-body[b-53kho0hl1w] {
        grid-template-columns: 60px 1fr !important;
    }
}

/* ---- Empty-slot context menu ----
   The MudPaper menu uses inline styles for positioning because Blazor CSS
   isolation does not pierce child components without ::deep, and the
   positioning is critical to the menu rendering correctly. */
.uds-ctx-backdrop[b-53kho0hl1w] {
    position: fixed;
    inset: 0;
    z-index: 99998;
    background: transparent;
}
/* /Pages/Auth/EmpLink.razor.rz.scp.css */
.emp-link-wrap[b-p1urgi5ewk] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background: var(--mud-palette-background);
}

.link-status[b-p1urgi5ewk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    text-align: center;
    padding: 2rem;
    max-width: 360px;
    animation: fadeIn-b-p1urgi5ewk 0.3s ease;
}

.link-status p[b-p1urgi5ewk] {
    font-size: 0.95rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
    line-height: 1.6;
}

.link-status h2[b-p1urgi5ewk] {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0;
    color: var(--mud-palette-text-primary);
}

.status-icon[b-p1urgi5ewk] {
    font-size: 3.5rem !important;
}

.status-icon.expired[b-p1urgi5ewk] {
    color: var(--mud-palette-warning);
}

.status-icon.invalid[b-p1urgi5ewk] {
    color: var(--mud-palette-error);
}

@keyframes fadeIn-b-p1urgi5ewk {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* /Pages/Auth/EmployeeLoginPage.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-lvk7zwzkya] {
    display: grid;
    grid-template-columns: 42% 58%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-lvk7zwzkya] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-lvk7zwzkya] {
    width: 100%;
    max-width: 360px;
    animation: slideInLeft-b-lvk7zwzkya 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-logo[b-lvk7zwzkya] {
    margin-bottom: 2.5rem;
}

.auth-heading[b-lvk7zwzkya] {
    margin-bottom: 2rem;
}

.auth-heading h1[b-lvk7zwzkya] {
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.3rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-lvk7zwzkya] {
    font-size: 0.95rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

.login-fields[b-lvk7zwzkya] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.login-submit-btn[b-lvk7zwzkya] {
    margin-top: 0.375rem;
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

.auth-meta[b-lvk7zwzkya] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

.auth-link[b-lvk7zwzkya] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-lvk7zwzkya] {
    opacity: 0.7;
}

.auth-version[b-lvk7zwzkya] {
    margin-top: 2.5rem;
    text-align: center;
}

.auth-version a[b-lvk7zwzkya] {
    font-size: 0.72rem;
    color: var(--mud-palette-text-disabled);
    text-decoration: none;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right) — mirrors Login/SelectShop/Register
═══════════════════════════════════════════ */
.hero-panel[b-lvk7zwzkya] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

.orb[b-lvk7zwzkya] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-lvk7zwzkya] {
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -140px;
    right: -100px;
    animation: driftA-b-lvk7zwzkya 20s ease-in-out infinite;
}

.orb-2[b-lvk7zwzkya] {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -60px;
    animation: driftB-b-lvk7zwzkya 25s ease-in-out infinite;
}

.orb-3[b-lvk7zwzkya] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 55%;
    left: 38%;
    animation: driftC-b-lvk7zwzkya 16s ease-in-out infinite;
}

.hero-grid[b-lvk7zwzkya] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.065) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

.hero-inner[b-lvk7zwzkya] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 3rem;
    max-width: 540px;
    width: 100%;
    animation: slideInRight-b-lvk7zwzkya 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-lvk7zwzkya] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(167, 139, 250, 0.95);
    margin-bottom: 1.5rem;
}

.eyebrow-icon[b-lvk7zwzkya] {
    font-size: 0.85rem !important;
}

.hero-headline[b-lvk7zwzkya] {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.1rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-lvk7zwzkya] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-lvk7zwzkya] {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.7;
    margin: 0 0 2rem;
}

.hero-cards[b-lvk7zwzkya] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hero-feature-card[b-lvk7zwzkya] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    backdrop-filter: blur(12px);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.hero-feature-card:hover[b-lvk7zwzkya] {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.15);
}

.hfc-icon[b-lvk7zwzkya] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.hfc-icon-blue[b-lvk7zwzkya] {
    background: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.hfc-icon-teal[b-lvk7zwzkya] {
    background: rgba(6, 182, 212, 0.2);
    border-color: rgba(6, 182, 212, 0.3);
}

.hfc-icon .mud-icon-root[b-lvk7zwzkya] { font-size: 1.1rem !important; color: #c4b5fd; }
.hfc-icon-blue .mud-icon-root[b-lvk7zwzkya] { color: #93c5fd; }
.hfc-icon-teal .mud-icon-root[b-lvk7zwzkya] { color: #67e8f9; }

.hfc-title[b-lvk7zwzkya] {
    font-size: 0.875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0.15rem;
}

.hfc-desc[b-lvk7zwzkya] {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-lvk7zwzkya {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-lvk7zwzkya {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-lvk7zwzkya {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-lvk7zwzkya {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-lvk7zwzkya {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-lvk7zwzkya] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-lvk7zwzkya] {
        display: none;
    }

    .form-panel[b-lvk7zwzkya] {
        padding: 2rem 1.25rem;
    }

    .auth-heading h1[b-lvk7zwzkya] {
        font-size: 1.65rem;
    }
}
/* /Pages/Auth/FeatureInfo.razor.rz.scp.css */
/* /Pages/Auth/ForgotPassword.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-c2960cj0vw] {
    display: grid;
    grid-template-columns: 42% 58%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-c2960cj0vw] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-c2960cj0vw] {
    width: 100%;
    max-width: 360px;
    animation: slideInLeft-b-c2960cj0vw 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-heading[b-c2960cj0vw] {
    margin-bottom: 2rem;
}

.auth-heading h1[b-c2960cj0vw] {
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.5rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-c2960cj0vw] {
    font-size: 0.95rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.5;
    margin: 0;
}

/* Form fields */
[b-c2960cj0vw] .login-fields {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[b-c2960cj0vw] .login-submit-btn {
    margin-top: 0.375rem;
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

/* Standalone success-state button (not inside .login-fields) */
.login-submit-btn[b-c2960cj0vw] {
    margin-top: 0.5rem;
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

.success-alert[b-c2960cj0vw] {
    margin-bottom: 1rem;
}

.auth-meta[b-c2960cj0vw] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

.auth-link[b-c2960cj0vw] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-c2960cj0vw] {
    opacity: 0.7;
}

.auth-version[b-c2960cj0vw] {
    margin-top: 2.5rem;
    text-align: center;
}

.auth-version a[b-c2960cj0vw] {
    font-size: 0.72rem;
    color: var(--mud-palette-text-disabled);
    text-decoration: none;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right)
═══════════════════════════════════════════ */
.hero-panel[b-c2960cj0vw] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Animated glow orbs */
.orb[b-c2960cj0vw] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-c2960cj0vw] {
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -160px;
    right: -100px;
    animation: driftA-b-c2960cj0vw 20s ease-in-out infinite;
}

.orb-2[b-c2960cj0vw] {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -80px;
    animation: driftB-b-c2960cj0vw 25s ease-in-out infinite;
}

.orb-3[b-c2960cj0vw] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%);
    animation: driftC-b-c2960cj0vw 16s ease-in-out infinite;
}

/* Subtle dot grid overlay */
.hero-grid[b-c2960cj0vw] {
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

/* Hero content */
.hero-inner[b-c2960cj0vw] {
    position: relative;
    z-index: 1;
    padding: 3rem 3.5rem;
    max-width: 560px;
    width: 100%;
    animation: slideInRight-b-c2960cj0vw 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-c2960cj0vw] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(167, 139, 250, 0.95);
    margin-bottom: 1.75rem;
}

.eyebrow-icon[b-c2960cj0vw] {
    font-size: 0.85rem !important;
}

.hero-headline[b-c2960cj0vw] {
    font-size: 3.25rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.25rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-c2960cj0vw] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-c2960cj0vw] {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.58);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Reassurance steps */
.hero-steps[b-c2960cj0vw] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.hero-step[b-c2960cj0vw] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 1.1rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 12px;
    backdrop-filter: blur(12px);
}

.hero-step .step-icon[b-c2960cj0vw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(139, 92, 246, 0.18);
    color: #a78bfa;
    flex-shrink: 0;
}

.hero-step .step-icon .mud-icon-root[b-c2960cj0vw] {
    font-size: 1.1rem !important;
}

.hero-step .step-text[b-c2960cj0vw] {
    color: rgba(255, 255, 255, 0.82);
    font-size: 0.9rem;
    font-weight: 500;
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-c2960cj0vw {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-c2960cj0vw {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-c2960cj0vw {
    0%, 100% { transform: translate(-50%, -50%); }
    50%      { transform: translate(-50%, -50%) translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-c2960cj0vw {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-c2960cj0vw {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-c2960cj0vw] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-c2960cj0vw] {
        display: none;
    }

    .form-panel[b-c2960cj0vw] {
        padding: 2rem 1.25rem;
    }

    .auth-heading h1[b-c2960cj0vw] {
        font-size: 1.65rem;
    }
}
/* /Pages/Auth/Login.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-eetf3a5mhu] {
    display: grid;
    grid-template-columns: 42% 58%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-eetf3a5mhu] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-eetf3a5mhu] {
    width: 100%;
    max-width: 360px;
    animation: slideInLeft-b-eetf3a5mhu 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-logo[b-eetf3a5mhu] {
    margin-bottom: 2.5rem;
}

.auth-heading[b-eetf3a5mhu] {
    margin-bottom: 2rem;
}

.auth-heading h1[b-eetf3a5mhu] {
    font-size: 2rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.3rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-eetf3a5mhu] {
    font-size: 0.95rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

/* Form fields inside AccountLogin via ::deep */
[b-eetf3a5mhu] .login-fields {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

[b-eetf3a5mhu] .login-submit-btn {
    margin-top: 0.375rem;
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

.auth-meta[b-eetf3a5mhu] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

/* Mobile-only hint pointing employees to /employee-login.
   Hidden by default; revealed in the <=960px breakpoint below. */
.employee-mobile-hint[b-eetf3a5mhu] {
    display: none;
}

.emh-icon[b-eetf3a5mhu] {
    font-size: 1.05rem !important;
    color: var(--mud-palette-primary);
}

.auth-link[b-eetf3a5mhu] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-eetf3a5mhu] {
    opacity: 0.7;
}

.auth-sep[b-eetf3a5mhu] {
    color: var(--mud-palette-text-disabled);
}

.auth-version[b-eetf3a5mhu] {
    margin-top: 2.5rem;
    text-align: center;
}

.auth-version a[b-eetf3a5mhu] {
    font-size: 0.72rem;
    color: var(--mud-palette-text-disabled);
    text-decoration: none;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right)
═══════════════════════════════════════════ */
.hero-panel[b-eetf3a5mhu] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Animated glow orbs */
.orb[b-eetf3a5mhu] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-eetf3a5mhu] {
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -160px;
    right: -100px;
    animation: driftA-b-eetf3a5mhu 20s ease-in-out infinite;
}

.orb-2[b-eetf3a5mhu] {
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -80px;
    animation: driftB-b-eetf3a5mhu 25s ease-in-out infinite;
}

.orb-3[b-eetf3a5mhu] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 50%;
    left: 40%;
    transform: translate(-50%, -50%);
    animation: driftC-b-eetf3a5mhu 16s ease-in-out infinite;
}

/* Subtle dot grid overlay */
.hero-grid[b-eetf3a5mhu] {
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(circle, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

/* Hero content */
.hero-inner[b-eetf3a5mhu] {
    position: relative;
    z-index: 1;
    padding: 3rem 3.5rem;
    max-width: 560px;
    width: 100%;
    animation: slideInRight-b-eetf3a5mhu 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-eetf3a5mhu] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(139, 92, 246, 0.15);
    border: 1px solid rgba(139, 92, 246, 0.3);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(167, 139, 250, 0.95);
    margin-bottom: 1.75rem;
}

.eyebrow-icon[b-eetf3a5mhu] {
    font-size: 0.85rem !important;
}

.hero-headline[b-eetf3a5mhu] {
    font-size: 3.25rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.25rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-eetf3a5mhu] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-eetf3a5mhu] {
    font-size: 1.05rem;
    color: rgba(255, 255, 255, 0.58);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Feature pills */
.hero-pills[b-eetf3a5mhu] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-bottom: 2.5rem;
}

.hero-pill[b-eetf3a5mhu] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.875rem;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.11);
    border-radius: 50px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.82rem;
    font-weight: 500;
    backdrop-filter: blur(12px);
    transition: background 0.2s ease, border-color 0.2s ease;
    cursor: default;
}

.hero-pill:hover[b-eetf3a5mhu] {
    background: rgba(255, 255, 255, 0.11);
    border-color: rgba(255, 255, 255, 0.2);
}

.hero-pill .mud-icon-root[b-eetf3a5mhu] {
    font-size: 0.95rem !important;
    color: #a78bfa;
}

/* Testimonial card */
.hero-quote[b-eetf3a5mhu] {
    padding: 1.25rem 1.5rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 16px;
    backdrop-filter: blur(16px);
}

.quote-stars[b-eetf3a5mhu] {
    color: #fbbf24;
    font-size: 0.85rem;
    letter-spacing: 0.15em;
    margin-bottom: 0.6rem;
}

.hero-quote p[b-eetf3a5mhu] {
    color: rgba(255, 255, 255, 0.75);
    font-size: 0.9rem;
    line-height: 1.65;
    font-style: italic;
    margin: 0 0 0.6rem;
}

.hero-quote span[b-eetf3a5mhu] {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.38);
    font-weight: 500;
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-eetf3a5mhu {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-eetf3a5mhu {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-eetf3a5mhu {
    0%, 100% { transform: translate(-50%, -50%); }
    50%      { transform: translate(-50%, -50%) translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-eetf3a5mhu {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-eetf3a5mhu {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-eetf3a5mhu] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-eetf3a5mhu] {
        display: none;
    }

    .form-panel[b-eetf3a5mhu] {
        padding: 2rem 1.25rem;
    }

    .auth-heading h1[b-eetf3a5mhu] {
        font-size: 1.65rem;
    }

    .employee-mobile-hint[b-eetf3a5mhu] {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        margin-top: 1.25rem;
        padding: 0.75rem 1rem;
        background: rgba(139, 92, 246, 0.08);
        border: 1px solid rgba(139, 92, 246, 0.22);
        border-radius: 10px;
        font-size: 0.85rem;
        line-height: 1.4;
        color: var(--mud-palette-text-secondary);
        text-align: center;
    }
}
/* /Pages/Auth/Register.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-2en4c35qbk] {
    display: grid;
    grid-template-columns: 44% 56%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-2en4c35qbk] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-2en4c35qbk] {
    width: 100%;
    max-width: 400px;
    animation: slideInLeft-b-2en4c35qbk 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-logo[b-2en4c35qbk] {
    margin-bottom: 2rem;
}

.auth-heading[b-2en4c35qbk] {
    margin-bottom: 1.5rem;
}

.auth-heading h1[b-2en4c35qbk] {
    font-size: 1.9rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.25rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-2en4c35qbk] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

/* Progress bar */
.progress-bar-wrap[b-2en4c35qbk] {
    margin-bottom: 1.75rem;
}

.progress-track[b-2en4c35qbk] {
    height: 3px;
    background: var(--mud-palette-lines-default);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.progress-fill[b-2en4c35qbk] {
    height: 100%;
    width: 50%;
    background: linear-gradient(90deg, var(--mud-palette-primary), var(--mud-palette-secondary));
    border-radius: 2px;
    transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.progress-fill.full[b-2en4c35qbk] {
    width: 100%;
}

.progress-labels[b-2en4c35qbk] {
    display: flex;
    justify-content: space-between;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--mud-palette-text-disabled);
}

.progress-labels span.active[b-2en4c35qbk] {
    color: var(--mud-palette-primary);
}

/* Step block */
.step-block[b-2en4c35qbk] {
    animation: stepIn-b-2en4c35qbk 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes stepIn-b-2en4c35qbk {
    from { opacity: 0; transform: translateX(16px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Form fields */
.form-fields[b-2en4c35qbk] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-bottom: 1.125rem;
}

.name-pair[b-2en4c35qbk] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

/* Buttons */
.submit-btn[b-2en4c35qbk] {
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

.step2-actions[b-2en4c35qbk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.back-btn[b-2en4c35qbk] {
    white-space: nowrap;
    flex-shrink: 0;
}

.step2-actions .submit-btn[b-2en4c35qbk] {
    flex: 1;
}

.auth-meta[b-2en4c35qbk] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

.auth-link[b-2en4c35qbk] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-2en4c35qbk] {
    opacity: 0.7;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right)
═══════════════════════════════════════════ */
.hero-panel[b-2en4c35qbk] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Animated glow orbs */
.orb[b-2en4c35qbk] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-2en4c35qbk] {
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -140px;
    right: -100px;
    animation: driftA-b-2en4c35qbk 20s ease-in-out infinite;
}

.orb-2[b-2en4c35qbk] {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -60px;
    animation: driftB-b-2en4c35qbk 25s ease-in-out infinite;
}

.orb-3[b-2en4c35qbk] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 55%;
    left: 38%;
    animation: driftC-b-2en4c35qbk 16s ease-in-out infinite;
}

/* Dot grid */
.hero-grid[b-2en4c35qbk] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.065) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

/* Hero content */
.hero-inner[b-2en4c35qbk] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 3rem;
    max-width: 540px;
    width: 100%;
    animation: slideInRight-b-2en4c35qbk 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-2en4c35qbk] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(52, 211, 153, 0.12);
    border: 1px solid rgba(52, 211, 153, 0.25);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(110, 231, 183, 0.95);
    margin-bottom: 1.5rem;
}

.eyebrow-icon[b-2en4c35qbk] {
    font-size: 0.85rem !important;
}

.hero-headline[b-2en4c35qbk] {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.1rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-2en4c35qbk] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-2en4c35qbk] {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Feature cards */
.hero-cards[b-2en4c35qbk] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.hero-feature-card[b-2en4c35qbk] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    backdrop-filter: blur(12px);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.hero-feature-card:hover[b-2en4c35qbk] {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.15);
}

.hfc-icon[b-2en4c35qbk] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.hfc-icon-blue[b-2en4c35qbk] {
    background: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.hfc-icon-teal[b-2en4c35qbk] {
    background: rgba(6, 182, 212, 0.2);
    border-color: rgba(6, 182, 212, 0.3);
}

.hfc-icon .mud-icon-root[b-2en4c35qbk] {
    font-size: 1.1rem !important;
    color: #c4b5fd;
}

.hfc-icon-blue .mud-icon-root[b-2en4c35qbk] { color: #93c5fd; }
.hfc-icon-teal .mud-icon-root[b-2en4c35qbk] { color: #67e8f9; }

.hfc-title[b-2en4c35qbk] {
    font-size: 0.875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0.15rem;
}

.hfc-desc[b-2en4c35qbk] {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

/* Trust stats bar */
.hero-trust[b-2en4c35qbk] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 1.1rem 1.5rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    backdrop-filter: blur(12px);
}

.trust-stat[b-2en4c35qbk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

.trust-num[b-2en4c35qbk] {
    font-size: 1.6rem;
    font-weight: 800;
    color: #a78bfa;
    line-height: 1;
    letter-spacing: -0.02em;
}

.trust-label[b-2en4c35qbk] {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.4);
    font-weight: 500;
    text-align: center;
}

.trust-divider[b-2en4c35qbk] {
    width: 1px;
    height: 36px;
    background: rgba(255, 255, 255, 0.1);
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-2en4c35qbk {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-2en4c35qbk {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-2en4c35qbk {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-2en4c35qbk {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-2en4c35qbk {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-2en4c35qbk] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-2en4c35qbk] {
        display: none;
    }

    .form-panel[b-2en4c35qbk] {
        padding: 2rem 1.25rem;
    }

    .name-pair[b-2en4c35qbk] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Auth/SelectShop.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-tfaecap2cy] {
    display: grid;
    grid-template-columns: 44% 56%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-tfaecap2cy] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-tfaecap2cy] {
    width: 100%;
    max-width: 400px;
    animation: slideInLeft-b-tfaecap2cy 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-logo[b-tfaecap2cy] {
    margin-bottom: 2rem;
}

.auth-heading[b-tfaecap2cy] {
    margin-bottom: 1.75rem;
}

.auth-heading h1[b-tfaecap2cy] {
    font-size: 1.9rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.25rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-tfaecap2cy] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

/* Shop cards list */
.shop-list[b-tfaecap2cy] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
    margin-bottom: 1rem;
}

.shop-card[b-tfaecap2cy] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    width: 100%;
    padding: 0.875rem 1rem;
    background: var(--mud-palette-surface);
    border: 1.5px solid var(--mud-palette-lines-default);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, transform 0.1s ease;
    text-align: left;
}

.shop-card:hover:not(:disabled)[b-tfaecap2cy] {
    border-color: var(--mud-palette-primary);
    background: color-mix(in srgb, var(--mud-palette-primary) 5%, transparent);
    transform: translateY(-1px);
}

.shop-card:active:not(:disabled)[b-tfaecap2cy] {
    transform: translateY(0);
}

.shop-card:disabled[b-tfaecap2cy] {
    opacity: 0.6;
    cursor: default;
}

.shop-card.loading[b-tfaecap2cy] {
    border-color: var(--mud-palette-primary);
}

.shop-card-icon[b-tfaecap2cy] {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--mud-palette-primary) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--mud-palette-primary) 25%, transparent);
}

.shop-card-icon .mud-icon-root[b-tfaecap2cy] {
    font-size: 1.1rem !important;
    color: var(--mud-palette-primary);
}

.shop-card-body[b-tfaecap2cy] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    min-width: 0;
}

.shop-name[b-tfaecap2cy] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.shop-phone[b-tfaecap2cy] {
    font-size: 0.78rem;
    color: var(--mud-palette-text-secondary);
}

.shop-arrow[b-tfaecap2cy] {
    color: var(--mud-palette-text-disabled) !important;
    font-size: 1.25rem !important;
}

.auth-actions[b-tfaecap2cy] {
    margin-bottom: 1.5rem;
}

.auth-meta[b-tfaecap2cy] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

.auth-link[b-tfaecap2cy] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-tfaecap2cy] {
    opacity: 0.7;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right)  — mirrors Register/Login
═══════════════════════════════════════════ */
.hero-panel[b-tfaecap2cy] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

.orb[b-tfaecap2cy] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-tfaecap2cy] {
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -140px;
    right: -100px;
    animation: driftA-b-tfaecap2cy 20s ease-in-out infinite;
}

.orb-2[b-tfaecap2cy] {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -60px;
    animation: driftB-b-tfaecap2cy 25s ease-in-out infinite;
}

.orb-3[b-tfaecap2cy] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 55%;
    left: 38%;
    animation: driftC-b-tfaecap2cy 16s ease-in-out infinite;
}

.hero-grid[b-tfaecap2cy] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.065) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

.hero-inner[b-tfaecap2cy] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 3rem;
    max-width: 540px;
    width: 100%;
    animation: slideInRight-b-tfaecap2cy 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-tfaecap2cy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(59, 130, 246, 0.12);
    border: 1px solid rgba(59, 130, 246, 0.25);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(147, 197, 253, 0.95);
    margin-bottom: 1.5rem;
}

.eyebrow-icon[b-tfaecap2cy] {
    font-size: 0.85rem !important;
}

.hero-headline[b-tfaecap2cy] {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.1rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-tfaecap2cy] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-tfaecap2cy] {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.7;
    margin: 0 0 2rem;
}

.hero-cards[b-tfaecap2cy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.hero-feature-card[b-tfaecap2cy] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    backdrop-filter: blur(12px);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.hero-feature-card:hover[b-tfaecap2cy] {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.15);
}

.hfc-icon[b-tfaecap2cy] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.hfc-icon-blue[b-tfaecap2cy] {
    background: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.hfc-icon-teal[b-tfaecap2cy] {
    background: rgba(6, 182, 212, 0.2);
    border-color: rgba(6, 182, 212, 0.3);
}

.hfc-icon .mud-icon-root[b-tfaecap2cy] { font-size: 1.1rem !important; color: #c4b5fd; }
.hfc-icon-blue .mud-icon-root[b-tfaecap2cy] { color: #93c5fd; }
.hfc-icon-teal .mud-icon-root[b-tfaecap2cy] { color: #67e8f9; }

.hfc-title[b-tfaecap2cy] {
    font-size: 0.875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0.15rem;
}

.hfc-desc[b-tfaecap2cy] {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-tfaecap2cy {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-tfaecap2cy {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-tfaecap2cy {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-tfaecap2cy {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-tfaecap2cy {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-tfaecap2cy] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-tfaecap2cy] {
        display: none;
    }

    .form-panel[b-tfaecap2cy] {
        padding: 2rem 1.25rem;
    }
}
/* /Pages/Auth/SetupShop.razor.rz.scp.css */
/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
.auth-wrap[b-n0eiejjcf2] {
    display: grid;
    grid-template-columns: 44% 56%;
    height: 100vh;
    overflow: hidden;
}

/* ═══════════════════════════════════════════
   FORM PANEL (left)
═══════════════════════════════════════════ */
.form-panel[b-n0eiejjcf2] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 2.5rem;
    background: var(--mud-palette-surface);
    overflow-y: auto;
}

.form-inner[b-n0eiejjcf2] {
    width: 100%;
    max-width: 400px;
    animation: slideInLeft-b-n0eiejjcf2 0.45s cubic-bezier(0.4, 0, 0.2, 1);
}

.auth-logo[b-n0eiejjcf2] {
    margin-bottom: 2rem;
}

.auth-heading[b-n0eiejjcf2] {
    margin-bottom: 1.5rem;
}

.auth-heading h1[b-n0eiejjcf2] {
    font-size: 1.9rem;
    font-weight: 800;
    letter-spacing: -0.03em;
    margin: 0 0 0.25rem;
    color: var(--mud-palette-text-primary);
}

.auth-heading p[b-n0eiejjcf2] {
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
    margin: 0;
}

/* Progress bar */
.progress-bar-wrap[b-n0eiejjcf2] {
    margin-bottom: 1.75rem;
}

.progress-track[b-n0eiejjcf2] {
    height: 3px;
    background: var(--mud-palette-lines-default);
    border-radius: 2px;
    overflow: hidden;
    margin-bottom: 0.5rem;
}

.progress-fill[b-n0eiejjcf2] {
    height: 100%;
    width: 50%;
    background: linear-gradient(90deg, var(--mud-palette-primary), var(--mud-palette-secondary));
    border-radius: 2px;
    transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.progress-fill.full[b-n0eiejjcf2] {
    width: 100%;
}

.progress-labels[b-n0eiejjcf2] {
    display: flex;
    justify-content: space-between;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--mud-palette-text-disabled);
}

.progress-labels span.active[b-n0eiejjcf2] {
    color: var(--mud-palette-primary);
}

/* Step block */
.step-block[b-n0eiejjcf2] {
    animation: stepIn-b-n0eiejjcf2 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes stepIn-b-n0eiejjcf2 {
    from { opacity: 0; transform: translateX(16px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* Form fields */
.form-fields[b-n0eiejjcf2] {
    display: flex;
    flex-direction: column;
    gap: 0.875rem;
    margin-bottom: 1.125rem;
}

.name-pair[b-n0eiejjcf2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

/* Buttons */
.submit-btn[b-n0eiejjcf2] {
    height: 48px !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    border-radius: 10px !important;
}

.step2-actions[b-n0eiejjcf2] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.back-btn[b-n0eiejjcf2] {
    white-space: nowrap;
    flex-shrink: 0;
}

.step2-actions .submit-btn[b-n0eiejjcf2] {
    flex: 1;
}

.auth-meta[b-n0eiejjcf2] {
    margin-top: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    font-size: 0.875rem;
    color: var(--mud-palette-text-secondary);
}

.auth-link[b-n0eiejjcf2] {
    color: var(--mud-palette-primary);
    text-decoration: none;
    font-weight: 600;
    transition: opacity 0.15s ease;
}

.auth-link:hover[b-n0eiejjcf2] {
    opacity: 0.7;
}

/* ═══════════════════════════════════════════
   HERO PANEL (right)
═══════════════════════════════════════════ */
.hero-panel[b-n0eiejjcf2] {
    position: relative;
    overflow: hidden;
    background: #0a0a18;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Animated glow orbs */
.orb[b-n0eiejjcf2] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    pointer-events: none;
    will-change: transform;
}

.orb-1[b-n0eiejjcf2] {
    width: 480px;
    height: 480px;
    background: radial-gradient(circle, rgba(109, 40, 217, 0.55), transparent 65%);
    top: -140px;
    right: -100px;
    animation: driftA-b-n0eiejjcf2 20s ease-in-out infinite;
}

.orb-2[b-n0eiejjcf2] {
    width: 380px;
    height: 380px;
    background: radial-gradient(circle, rgba(29, 78, 216, 0.5), transparent 65%);
    bottom: -80px;
    left: -60px;
    animation: driftB-b-n0eiejjcf2 25s ease-in-out infinite;
}

.orb-3[b-n0eiejjcf2] {
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent 65%);
    top: 55%;
    left: 38%;
    animation: driftC-b-n0eiejjcf2 16s ease-in-out infinite;
}

/* Dot grid */
.hero-grid[b-n0eiejjcf2] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(circle, rgba(255, 255, 255, 0.065) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
}

/* Hero content */
.hero-inner[b-n0eiejjcf2] {
    position: relative;
    z-index: 1;
    padding: 2.5rem 3rem;
    max-width: 540px;
    width: 100%;
    animation: slideInRight-b-n0eiejjcf2 0.55s cubic-bezier(0.4, 0, 0.2, 1);
}

.hero-eyebrow[b-n0eiejjcf2] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.875rem;
    background: rgba(52, 211, 153, 0.12);
    border: 1px solid rgba(52, 211, 153, 0.25);
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(110, 231, 183, 0.95);
    margin-bottom: 1.5rem;
}

.eyebrow-icon[b-n0eiejjcf2] {
    font-size: 0.85rem !important;
}

.hero-headline[b-n0eiejjcf2] {
    font-size: 3rem;
    font-weight: 800;
    line-height: 1.08;
    color: #ffffff;
    margin: 0 0 1.1rem;
    letter-spacing: -0.04em;
}

.gradient-text[b-n0eiejjcf2] {
    background: linear-gradient(135deg, #a78bfa 0%, #60a5fa 45%, #34d399 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-desc[b-n0eiejjcf2] {
    font-size: 1rem;
    color: rgba(255, 255, 255, 0.55);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Feature cards */
.hero-cards[b-n0eiejjcf2] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-bottom: 2rem;
}

.hero-feature-card[b-n0eiejjcf2] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: rgba(255, 255, 255, 0.045);
    border: 1px solid rgba(255, 255, 255, 0.09);
    border-radius: 14px;
    backdrop-filter: blur(12px);
    transition: background 0.2s ease, border-color 0.2s ease;
}

.hero-feature-card:hover[b-n0eiejjcf2] {
    background: rgba(255, 255, 255, 0.07);
    border-color: rgba(255, 255, 255, 0.15);
}

.hfc-icon[b-n0eiejjcf2] {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(139, 92, 246, 0.2);
    border: 1px solid rgba(139, 92, 246, 0.3);
}

.hfc-icon-blue[b-n0eiejjcf2] {
    background: rgba(59, 130, 246, 0.2);
    border-color: rgba(59, 130, 246, 0.3);
}

.hfc-icon-teal[b-n0eiejjcf2] {
    background: rgba(6, 182, 212, 0.2);
    border-color: rgba(6, 182, 212, 0.3);
}

.hfc-icon .mud-icon-root[b-n0eiejjcf2] {
    font-size: 1.1rem !important;
    color: #c4b5fd;
}

.hfc-icon-blue .mud-icon-root[b-n0eiejjcf2] { color: #93c5fd; }
.hfc-icon-teal .mud-icon-root[b-n0eiejjcf2] { color: #67e8f9; }

.hfc-title[b-n0eiejjcf2] {
    font-size: 0.875rem;
    font-weight: 700;
    color: rgba(255, 255, 255, 0.9);
    margin-bottom: 0.15rem;
}

.hfc-desc[b-n0eiejjcf2] {
    font-size: 0.78rem;
    color: rgba(255, 255, 255, 0.45);
    line-height: 1.5;
}

/* Trust stats bar */
.hero-trust[b-n0eiejjcf2] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 1.1rem 1.5rem;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 16px;
    backdrop-filter: blur(12px);
}

.trust-stat[b-n0eiejjcf2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.15rem;
}

.trust-num[b-n0eiejjcf2] {
    font-size: 1.6rem;
    font-weight: 800;
    color: #a78bfa;
    line-height: 1;
    letter-spacing: -0.02em;
}

.trust-label[b-n0eiejjcf2] {
    font-size: 0.7rem;
    color: rgba(255, 255, 255, 0.4);
    font-weight: 500;
    text-align: center;
}

.trust-divider[b-n0eiejjcf2] {
    width: 1px;
    height: 36px;
    background: rgba(255, 255, 255, 0.1);
}

/* ═══════════════════════════════════════════
   ANIMATIONS
═══════════════════════════════════════════ */
@keyframes driftA-b-n0eiejjcf2 {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(-45px, 30px); }
    66%      { transform: translate(30px, -40px); }
}

@keyframes driftB-b-n0eiejjcf2 {
    0%, 100% { transform: translate(0, 0); }
    33%      { transform: translate(35px, -25px); }
    66%      { transform: translate(-25px, 40px); }
}

@keyframes driftC-b-n0eiejjcf2 {
    0%, 100% { transform: translate(0, 0); }
    50%      { transform: translate(-30px, 30px) scale(1.1); }
}

@keyframes slideInLeft-b-n0eiejjcf2 {
    from { opacity: 0; transform: translateX(-24px); }
    to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight-b-n0eiejjcf2 {
    from { opacity: 0; transform: translateX(24px); }
    to   { opacity: 1; transform: translateX(0); }
}

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media (max-width: 960px) {
    .auth-wrap[b-n0eiejjcf2] {
        grid-template-columns: 1fr;
    }

    .hero-panel[b-n0eiejjcf2] {
        display: none;
    }

    .form-panel[b-n0eiejjcf2] {
        padding: 2rem 1.25rem;
    }

    .name-pair[b-n0eiejjcf2] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/CheckOut/Components/CheckOutItemsList.razor.rz.scp.css */
.co-items-scroll[b-9a4vvwiibk] {
    overflow-y: auto;
    max-height: calc(100vh - 380px);
}

/* On mobile, let the page scroll naturally instead of constraining the list */
@media (max-width: 959px) {
    .co-items-scroll[b-9a4vvwiibk] {
        max-height: none;
        overflow-y: visible;
    }
}
/* /Pages/Index.razor.rz.scp.css */
.app[b-m9g4t7dpwr] {
    width: 100vw;
    height: 100vh;
    background-color: red;
}
/* /Pages/OnlineBooking/OnlineBookingPage.razor.rz.scp.css */
/* ── Page wrap ──────────────────────────────────────────────── */
.olb-wrap[b-frob3dlj3w] {
    min-height: 100vh;
    max-width: 680px;
    margin: 0 auto;
    padding: 16px 12px 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ── Hero Header ────────────────────────────────────────────── */
.olb-hero[b-frob3dlj3w] {
    text-align: center;
    padding: 20px 16px 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.shop-logo-wrap[b-frob3dlj3w] {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 0 0 3px rgba(124,58,237,0.35), 0 8px 32px rgba(0,0,0,0.5);
}

.shop-logo[b-frob3dlj3w] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.shop-logo-fallback[b-frob3dlj3w] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #7C3AED, #A855F7);
    z-index: 0;
    font-size: 32px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -1px;
}

.hero-shop-name[b-frob3dlj3w] {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #F8FAFC !important;
    letter-spacing: -0.5px;
    line-height: 1.2;
    margin: 0 !important;
}

.hero-sub[b-frob3dlj3w] {
    color: #475569 !important;
    font-size: 13px !important;
    margin: 0 !important;
}

/* ── Hero contact bar ───────────────────────────────────────── */
.hero-contact-bar[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 6px;
}

.hero-contact-item[b-frob3dlj3w] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #64748B;
    text-decoration: none;
    padding: 3px 8px;
    border-radius: 20px;
    transition: background 0.15s, color 0.15s;
}

.hero-contact-item:hover[b-frob3dlj3w] {
    background: rgba(124,58,237,0.1);
    color: #A78BFA;
}

.hero-contact-dot[b-frob3dlj3w] {
    color: #334155;
    font-size: 14px;
    line-height: 1;
}

/* ── Step track ─────────────────────────────────────────────── */
.step-track[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    flex-wrap: nowrap;
    overflow: hidden;
}

.step-node[b-frob3dlj3w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.step-circle[b-frob3dlj3w] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    border: 2px solid rgba(255,255,255,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.step-node.active .step-circle[b-frob3dlj3w] {
    background: #7C3AED;
    border-color: #7C3AED;
    color: #fff;
    box-shadow: 0 0 0 4px rgba(124,58,237,0.2);
}

.step-node.done .step-circle[b-frob3dlj3w] {
    background: rgba(124,58,237,0.25);
    border-color: #7C3AED;
    color: #A78BFA;
}

.step-label[b-frob3dlj3w] {
    font-size: 10px;
    font-weight: 500;
    color: #475569;
    white-space: nowrap;
}

.step-node.active .step-label[b-frob3dlj3w] { color: #A78BFA; }
.step-node.done .step-label[b-frob3dlj3w]  { color: #7C3AED; }

.step-line[b-frob3dlj3w] {
    flex: 1;
    height: 2px;
    background: rgba(255,255,255,0.07);
    margin: 0 4px;
    margin-bottom: 18px;
    transition: background 0.3s ease;
}

.step-line.done[b-frob3dlj3w] { background: rgba(124,58,237,0.35); }

/* ── Wizard card ────────────────────────────────────────────── */
.olb-card[b-frob3dlj3w] {
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 20px;
    padding: 20px 18px;
    backdrop-filter: blur(20px);
    box-shadow: 0 4px 24px rgba(0,0,0,0.4);
}

.step-title[b-frob3dlj3w] {
    color: #F8FAFC !important;
    font-weight: 700 !important;
    margin-bottom: 2px;
}

.step-sub[b-frob3dlj3w] {
    color: #64748B !important;
}

/* ── Category list ──────────────────────────────────────────── */
.cat-list[b-frob3dlj3w] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cat-card[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
    height: 64px;
}

.cat-card:hover[b-frob3dlj3w] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(124,58,237,0.35);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.cat-card-sub[b-frob3dlj3w] {
    margin-left: 16px;
    border-left: 3px solid rgba(255,255,255,0.08);
    border-radius: 0 14px 14px 0;
}

.cat-accent[b-frob3dlj3w] {
    width: 5px;
    height: 100%;
    flex-shrink: 0;
}

.cat-body[b-frob3dlj3w] {
    flex: 1;
    padding: 0 16px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cat-breadcrumb[b-frob3dlj3w] {
    font-size: 10px;
    font-weight: 500;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1;
    margin-bottom: 1px;
}

.cat-name[b-frob3dlj3w] {
    font-size: 15px;
    font-weight: 600;
    color: #E2E8F0;
}

.cat-count[b-frob3dlj3w] {
    font-size: 12px;
    color: #475569;
}

.cat-back-btn[b-frob3dlj3w] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: #7C3AED;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    padding: 0 0 12px;
    transition: color 0.15s;
}

.cat-back-btn:hover[b-frob3dlj3w] { color: #A78BFA; }

/* ── Service cards ──────────────────────────────────────────── */
.service-card[b-frob3dlj3w] {
    display: flex;
    align-items: stretch;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 12px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
}

.service-card:hover[b-frob3dlj3w] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(124,58,237,0.4);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.service-card.selected[b-frob3dlj3w] {
    background: rgba(124,58,237,0.1);
    border-color: #7C3AED;
}

.service-accent[b-frob3dlj3w] {
    width: 4px;
    background: var(--cat-color, #7C3AED);
    flex-shrink: 0;
}

.service-body[b-frob3dlj3w] {
    flex: 1;
    padding: 11px 14px;
}

.service-top[b-frob3dlj3w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.service-name[b-frob3dlj3w] {
    color: #F1F5F9 !important;
    font-weight: 600 !important;
}

.service-top-right[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.service-price[b-frob3dlj3w] {
    color: #A78BFA;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

/* ── Inline service expand ──────────────────────────────────── */
.service-expand[b-frob3dlj3w] {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.25s ease;
}

.service-card.selected .service-expand[b-frob3dlj3w] {
    max-height: 160px;
    opacity: 1;
}

.service-expand-desc[b-frob3dlj3w] {
    font-size: 12px;
    color: #94A3B8;
    line-height: 1.5;
    margin: 10px 0 8px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.service-expand-hint[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    color: #7C3AED;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding-bottom: 2px;
}

.time-chip[b-frob3dlj3w] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255,255,255,0.06);
    border-radius: 20px;
    padding: 2px 8px;
    font-size: 11px;
    color: #64748B;
}

/* ── Category icon ──────────────────────────────────────────── */
.cat-icon-wrap[b-frob3dlj3w] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 12px;
    flex-shrink: 0;
    opacity: 0.88;
}

/* ── Employee grid ───────────────────────────────────────────── */
.emp-grid[b-frob3dlj3w] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

@media (min-width: 480px) {
    .emp-grid[b-frob3dlj3w] { grid-template-columns: repeat(4, 1fr); }
}

.emp-grid-card[b-frob3dlj3w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 8px 12px;
    background: rgba(255,255,255,0.04);
    border: 2px solid transparent;
    border-radius: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.emp-grid-card:hover[b-frob3dlj3w] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(124,58,237,0.3);
}

.emp-grid-card.selected[b-frob3dlj3w] {
    background: rgba(124,58,237,0.1);
    border-color: #7C3AED;
    box-shadow: 0 0 0 1px rgba(124,58,237,0.2);
}

.emp-grid-avatar[b-frob3dlj3w] {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

.emp-grid-card.selected .emp-grid-avatar[b-frob3dlj3w] {
    box-shadow: 0 0 0 3px #7C3AED, 0 4px 14px rgba(124,58,237,0.4);
}

.emp-grid-avatar-fallback[b-frob3dlj3w] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.emp-grid-avatar-img[b-frob3dlj3w] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.emp-grid-name[b-frob3dlj3w] {
    font-size: 12px;
    font-weight: 600;
    color: #94A3B8;
    text-align: center;
    line-height: 1.25;
    word-break: break-word;
    transition: color 0.2s;
}

.emp-grid-card.selected .emp-grid-name[b-frob3dlj3w] { color: #A78BFA; }

/* ── Selected employee detail strip ─────────────────────────── */
.emp-selected-detail[b-frob3dlj3w] {
    margin-top: 12px;
    background: rgba(124,58,237,0.07);
    border: 1px solid rgba(124,58,237,0.25);
    border-radius: 14px;
    padding: 14px 16px;
}

.emp-detail-header[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.emp-detail-name[b-frob3dlj3w] {
    font-size: 15px;
    font-weight: 700;
    color: #F1F5F9;
}

.emp-detail-bio[b-frob3dlj3w] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.55;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.emp-detail-bio-empty[b-frob3dlj3w] {
    color: #475569;
    font-style: italic;
}

.emp-detail-hint[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    color: #7C3AED;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* ── Date strip ─────────────────────────────────────────────── */
.date-strip[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.date-nav-btn[b-frob3dlj3w] {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #94A3B8;
    flex-shrink: 0;
    transition: all 0.2s;
}

.date-nav-btn:hover:not(:disabled)[b-frob3dlj3w] {
    background: rgba(124,58,237,0.15);
    border-color: #7C3AED;
    color: #A78BFA;
}

.date-nav-btn:disabled[b-frob3dlj3w] { opacity: 0.3; cursor: default; }

.date-pills[b-frob3dlj3w] {
    display: flex;
    flex: 1;
    gap: 5px;
    justify-content: space-between;
}

.date-pill[b-frob3dlj3w] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 7px 3px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
    color: #94A3B8;
    min-width: 0;
}

.date-pill:hover[b-frob3dlj3w] {
    background: rgba(124,58,237,0.1);
    border-color: rgba(124,58,237,0.4);
    color: #A78BFA;
}

.date-pill.selected[b-frob3dlj3w] {
    background: #7C3AED;
    border-color: #7C3AED;
    color: #fff;
    box-shadow: 0 4px 12px rgba(124,58,237,0.4);
}

.date-dow[b-frob3dlj3w] { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.date-num[b-frob3dlj3w] { font-size: 18px; font-weight: 700; line-height: 1; }
.date-mon[b-frob3dlj3w] { font-size: 9px; text-transform: uppercase; }

/* ── Slot grid & pills ──────────────────────────────────────── */
.time-group-label[b-frob3dlj3w] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #475569;
    margin-bottom: 8px;
    display: block;
}

.slot-grid[b-frob3dlj3w] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

@media (min-width: 480px) {
    .slot-grid[b-frob3dlj3w] { grid-template-columns: repeat(4, 1fr); }
}

.slot-pill[b-frob3dlj3w] {
    padding: 8px 4px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    color: #CBD5E1;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: center;
    white-space: nowrap;
}

.slot-pill:hover[b-frob3dlj3w] {
    background: rgba(124,58,237,0.12);
    border-color: #7C3AED;
    color: #A78BFA;
    transform: scale(1.03);
}

.slot-pill.selected[b-frob3dlj3w] {
    background: #7C3AED;
    border-color: #7C3AED;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(124,58,237,0.35);
}

/* ── Summary card ───────────────────────────────────────────── */
.summary-card[b-frob3dlj3w] {
    background: rgba(124,58,237,0.06);
    border: 1px solid rgba(124,58,237,0.18);
    border-radius: 12px;
    overflow: hidden;
}

.summary-row[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.summary-row:last-child[b-frob3dlj3w] { border-bottom: none; }

.summary-label[b-frob3dlj3w] {
    color: #64748B;
    font-size: 12px;
    width: 56px;
    flex-shrink: 0;
}

.summary-value[b-frob3dlj3w] {
    color: #E2E8F0;
    font-size: 13px;
    font-weight: 500;
}

/* ── Form fields ────────────────────────────────────────────── */
.olb-field[b-frob3dlj3w]  .mud-input-root { color: #E2E8F0 !important; }
.olb-field[b-frob3dlj3w]  .mud-input-outlined-border { border-color: rgba(255,255,255,0.15) !important; }
.olb-field[b-frob3dlj3w]  .mud-input-label { color: #64748B !important; }
.olb-field[b-frob3dlj3w]  .mud-input-adorned-start .mud-input-adornment { color: #64748B; }

/* ── Extras (reminders / contact) ───────────────────────────── */
.extras-section[b-frob3dlj3w] {
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 14px;
}

.contact-chips[b-frob3dlj3w] {
    display: flex;
    gap: 8px;
}

.contact-chip[b-frob3dlj3w] {
    padding: 6px 16px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #94A3B8;
    cursor: pointer;
    transition: all 0.15s;
}

.contact-chip:hover[b-frob3dlj3w] {
    background: rgba(124,58,237,0.1);
    border-color: rgba(124,58,237,0.4);
    color: #A78BFA;
}

.contact-chip.selected[b-frob3dlj3w] {
    background: #7C3AED;
    border-color: #7C3AED;
    color: #fff;
}

/* ── Navigation bar ─────────────────────────────────────────── */
.olb-nav[b-frob3dlj3w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px;
}

.next-btn[b-frob3dlj3w] {
    background: linear-gradient(135deg, #7C3AED, #6D28D9) !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 8px 24px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 16px rgba(124,58,237,0.4) !important;
    transition: all 0.2s !important;
}

.next-btn:hover:not(:disabled)[b-frob3dlj3w] {
    box-shadow: 0 6px 20px rgba(124,58,237,0.55) !important;
    transform: translateY(-1px) !important;
}

.next-btn:disabled[b-frob3dlj3w] { opacity: 0.5 !important; }

/* ── Empty state ────────────────────────────────────────────── */
.empty-state[b-frob3dlj3w] {
    padding: 32px 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ── Success screen ─────────────────────────────────────────── */
.success-screen[b-frob3dlj3w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 8px 0;
}

.success-ring[b-frob3dlj3w] {
    animation: pop-b-frob3dlj3w 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes pop-b-frob3dlj3w {
    0%   { transform: scale(0.5); opacity: 0; }
    80%  { transform: scale(1.1); }
    100% { transform: scale(1);   opacity: 1; }
}



/* ── ReminderSelect dark-theme overrides ────────────────────── */
/* Neutralise blue Info chips → subtle dark pill */
.extras-section[b-frob3dlj3w]  .mud-chip {
    background-color: rgba(255,255,255,0.07) !important;
    color: #94A3B8 !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    height: 30px !important;
    font-size: 12px !important;
}
/* Active (Info-coloured) chip when type selected */
.extras-section[b-frob3dlj3w]  .mud-chip-color-info {
    background-color: rgba(124,58,237,0.2) !important;
    color: #A78BFA !important;
    border-color: rgba(124,58,237,0.4) !important;
}
.extras-section[b-frob3dlj3w]  .mud-chip .mud-chip-content { color: inherit !important; }
.extras-section[b-frob3dlj3w]  .mud-chip .mud-icon-root { color: inherit !important; font-size: 16px !important; }
/* Replace amber Warning label with muted slate */
.extras-section[b-frob3dlj3w]  .mud-warning-text { color: #64748B !important; font-size: 13px !important; }
/* Menu items match dark surface */
.extras-section[b-frob3dlj3w]  .mud-popover { background: #1E293B !important; }

/* ── Privacy checkbox row ───────────────────────────────────── */
.privacy-row[b-frob3dlj3w] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 0 4px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.privacy-checkbox[b-frob3dlj3w] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 1px;
    accent-color: #7C3AED;
    cursor: pointer;
}

.privacy-label[b-frob3dlj3w] {
    font-size: 12px;
    color: #64748B;
    line-height: 1.5;
    cursor: default;
}

.privacy-link[b-frob3dlj3w] {
    background: none;
    border: none;
    padding: 0;
    color: #A78BFA;
    font-size: inherit;
    font-family: inherit;
    text-decoration: underline;
    cursor: pointer;
    transition: color 0.15s;
}

.privacy-link:hover[b-frob3dlj3w] { color: #C4B5FD; }

/* ── Privacy policy overlay ─────────────────────────────────── */
.privacy-overlay[b-frob3dlj3w] {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background: rgba(2, 6, 23, 0.82);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: fadeIn-b-frob3dlj3w 0.2s ease;
}

@keyframes fadeIn-b-frob3dlj3w {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.privacy-sheet[b-frob3dlj3w] {
    width: 100%;
    max-width: 680px;
    max-height: 88vh;
    background: #0F172A;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 24px 24px 0 0;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-frob3dlj3w 0.28s cubic-bezier(0.34, 1.3, 0.64, 1) both;
    overflow: hidden;
}

@keyframes slideUp-b-frob3dlj3w {
    from { transform: translateY(60px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.privacy-sheet-header[b-frob3dlj3w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    flex-shrink: 0;
}

.privacy-sheet-title[b-frob3dlj3w] {
    font-size: 17px;
    font-weight: 700;
    color: #F1F5F9;
}

.privacy-close-btn[b-frob3dlj3w] {
    background: rgba(255,255,255,0.07);
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94A3B8;
    cursor: pointer;
    transition: background 0.15s;
}

.privacy-close-btn:hover[b-frob3dlj3w] {
    background: rgba(255,255,255,0.14);
    color: #F1F5F9;
}

.privacy-sheet-body[b-frob3dlj3w] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    overscroll-behavior: contain;
}

.pp-effective[b-frob3dlj3w] {
    font-size: 12px;
    color: #475569;
    margin: 0 0 16px;
}

.pp-heading[b-frob3dlj3w] {
    font-size: 14px;
    font-weight: 700;
    color: #E2E8F0;
    margin: 20px 0 6px;
}

.pp-body[b-frob3dlj3w] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.6;
    margin: 0 0 10px;
}

.pp-list[b-frob3dlj3w] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.6;
    margin: 0 0 10px;
    padding-left: 20px;
}

.pp-list li[b-frob3dlj3w] { margin-bottom: 4px; }
.pp-list strong[b-frob3dlj3w] { color: #CBD5E1; }

.privacy-sheet-footer[b-frob3dlj3w] {
    padding: 14px 20px 20px;
    border-top: 1px solid rgba(255,255,255,0.07);
    flex-shrink: 0;
}

.privacy-accept-btn[b-frob3dlj3w] {
    width: 100%;
    padding: 13px;
    background: linear-gradient(135deg, #7C3AED, #6D28D9);
    border: none;
    border-radius: 14px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(124,58,237,0.4);
    transition: box-shadow 0.2s, transform 0.15s;
}

.privacy-accept-btn:hover[b-frob3dlj3w] {
    box-shadow: 0 6px 20px rgba(124,58,237,0.55);
    transform: translateY(-1px);
}

/* ── Footer ─────────────────────────────────────────────────── */
.olb-footer[b-frob3dlj3w] {
    text-align: center;
    padding-bottom: 8px;
}
/* /Pages/Portal/Login/PortalLogin.razor.rz.scp.css */
.portal-login-page[b-el4jq1hbjy] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
    position: relative;
}

/* Gradient blobs — fixed to the viewport so they fill the full screen
   regardless of the 480px layout container constraint */
.portal-login-blob[b-el4jq1hbjy] {
    position: fixed;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

.portal-login-blob--1[b-el4jq1hbjy] {
    width: 420px;
    height: 420px;
    background: #1E90FF;
    top: -120px;
    right: -80px;
}

.portal-login-blob--2[b-el4jq1hbjy] {
    width: 340px;
    height: 340px;
    background: #06B6D4;
    bottom: -80px;
    left: -80px;
}

/* Card */
.portal-login-card[b-el4jq1hbjy] {
    position: relative;
    z-index: 1;
    background: rgba(30, 41, 59, 0.80);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    padding: 40px 32px 32px;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

/* Logo */
.portal-login-logo[b-el4jq1hbjy] {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
}

/* Title */
.portal-login-title[b-el4jq1hbjy] {
    font-weight: 700;
    letter-spacing: -0.02em;
}

/* Button */
.portal-login-btn[b-el4jq1hbjy] {
    border-radius: 12px !important;
    padding-top: 12px !important;
    padding-bottom: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.03em !important;
}

/* Subtitle helper note (above the input) */
.portal-login-subnote[b-el4jq1hbjy] {
    opacity: 0.75;
}

/* Info list under the button */
.portal-login-info[b-el4jq1hbjy] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 14px 14px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.025);
}

.portal-login-info-item[b-el4jq1hbjy] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 0.78rem;
    line-height: 1.35;
    color: rgba(255, 255, 255, 0.72);
}

.portal-login-info-icon[b-el4jq1hbjy] {
    flex: 0 0 auto;
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    color: rgba(30, 144, 255, 0.85);
    margin-top: 1px;
}
/* /Pages/Portal/Login/PortalVerify.razor.rz.scp.css */
.portal-verify-page[b-p123nl3xkf] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 32px 24px;
    position: relative;
}

/* Gradient blobs — fixed so they fill the full screen */
.portal-verify-blob[b-p123nl3xkf] {
    position: fixed;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

.portal-verify-blob--1[b-p123nl3xkf] {
    width: 420px;
    height: 420px;
    background: #1E90FF;
    top: -120px;
    right: -80px;
}

.portal-verify-blob--2[b-p123nl3xkf] {
    width: 340px;
    height: 340px;
    background: #06B6D4;
    bottom: -80px;
    left: -80px;
}

/* Card */
.portal-verify-card[b-p123nl3xkf] {
    position: relative;
    z-index: 1;
    background: rgba(30, 41, 59, 0.80);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 24px;
    padding: 40px 32px 32px;
    width: 100%;
    max-width: 380px;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5);
}

/* Icon badge */
.portal-verify-icon[b-p123nl3xkf] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    border-radius: 18px;
    background: rgba(30, 144, 255, 0.15);
    border: 1px solid rgba(30, 144, 255, 0.35);
    margin: 0 auto 24px;
}

/* Title */
.portal-verify-title[b-p123nl3xkf] {
    font-weight: 700;
    letter-spacing: -0.02em;
}

/* OTP row */
.portal-otp-row[b-p123nl3xkf] {
    display: flex;
    gap: 10px;
    justify-content: center;
}

.otp-input[b-p123nl3xkf] {
    width: 44px;
    height: 52px;
    text-align: center;
    font-size: 1.4rem;
    font-weight: 600;
    border-radius: 12px;
    border: 1.5px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.05);
    color: #fff;
    outline: none;
    caret-color: #1E90FF;
    transition: border-color 0.15s, box-shadow 0.15s;
    /* suppress browser number spinners */
    -moz-appearance: textfield;
}

.otp-input:focus[b-p123nl3xkf] {
    border-color: #1E90FF;
    box-shadow: 0 0 0 3px rgba(30, 144, 255, 0.25);
}

.otp-input:disabled[b-p123nl3xkf] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Pages/Portal/PortalMessages.razor.rz.scp.css */
.portal-messages-wrap[b-qj429xqcvt] {
    display: flex;
    flex-direction: column;
    
    /* Viewport minus: Dense AppBar (48px) + body top padding (16px) + body bottom padding (80px) */
    height: calc(100dvh - 76px);
}

.portal-messages-scroll[b-qj429xqcvt] {
    flex: 1;
    overflow-y: auto;
    min-height: 0;
    padding: 12px 0 12px 0;
}

.portal-messages-center[b-qj429xqcvt] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    padding: 2rem;
}

.portal-messages-input[b-qj429xqcvt] {
    flex-shrink: 0;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 0 !important;
}
/* /Pages/Products/ProductsPage.razor.rz.scp.css */
.grid-container[b-8pg86mieuf] {
    display: grid;
    border-color: white;
    border-width: 3px;
    height: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: repeat(10, 25px);
}

.item-a[b-8pg86mieuf] {
    grid-column: 1;
    grid-row: 1 / span 3;
    background: red;
}

.item-b[b-8pg86mieuf] {
    grid-column: 3;
    grid-row: 1 / span 2;
    background: blue; 
}
/* /Pages/Public/GiftCardView.razor.rz.scp.css */
body[b-re5ktxcd96] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background-color: #fff;
    background-image: url(https://cdn.shopify.com/s/files/1/2504/3282/files/marbles_seemless.jpg?5912703254077228492);
}


.d-flex[b-re5ktxcd96] {
    display: flex;
}

.mar-t-1[b-re5ktxcd96] {
    margin-top: 15px;
}

.text-center[b-re5ktxcd96] {
    text-align: center;
}

.gift-card[b-re5ktxcd96] {
    border-radius: 10px;
    background: #fafafa;
    width: 430px;
    color: #3d3d3d;
    font-family: sans-serif;
    display: flex;
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
}

.gift-card__image[b-re5ktxcd96] {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    flex: 1;
    max-width: 150px;
    background-size: cover;
    background-image: url(https://cdn.shopify.com/s/files/1/2504/3282/files/annie-spratt-102799-unsplash.jpg?15904179471993750892);
}

.gift-card__content[b-re5ktxcd96] {
    padding: 30px 20px;
//flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.gift-card__msg[b-re5ktxcd96] {
    font-size: 10px;
    display: block;
    margin-top: 10px;
}

.gift-card__details[b-re5ktxcd96] {
    margin-top: auto;
    align-items: center;
    line-height: 1;
}

.gift-card__code[b-re5ktxcd96] {
    display: inline-block;
    background: white;
    color: black;
    padding: 10px 13px;
    margin-top: 20px;
    font-size: 20px;
    border: 1px solid #e3e3e3;
}

.gift-card__amount[b-re5ktxcd96] {
    font-size: 70px;
}
.gift-card__amount-remaining[b-re5ktxcd96] {
    font-size: 14px;
    margin-top: 7px;
}
/* /Pages/Reports/ReportsPage.razor.rz.scp.css */
/* ── Reports page: unloaded prompt ─────────────────────────────────────── */

.rp-panel[b-2ib1jyyfu5] {
    min-height: calc(100dvh - 100px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem 3rem;
    gap: 1.5rem;
}

/* Hero card */
.rp-hero[b-2ib1jyyfu5] {
    background: linear-gradient(135deg, var(--mud-palette-primary) 0%, var(--mud-palette-primary-darken) 100%);
    border-radius: 16px;
    padding: 2rem 2.5rem;
    max-width: 560px;
    width: 100%;
    color: #fff;
    text-align: center;
}

.rp-hero-badge[b-2ib1jyyfu5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255,255,255,0.18);
    border-radius: 999px;
    padding: 4px 14px;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.rp-hero-title[b-2ib1jyyfu5] {
    margin: 0 0 0.5rem;
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 1.2;
}

.rp-hero-sub[b-2ib1jyyfu5] {
    margin: 0;
    font-size: 0.92rem;
    opacity: 0.88;
    line-height: 1.55;
}

/* Picker card */
.rp-picker-card[b-2ib1jyyfu5] {
    max-width: 560px;
    width: 100%;
    border-radius: 12px !important;
}

/* Mobile */
@media (max-width: 600px) {
    .rp-panel[b-2ib1jyyfu5] {
        min-height: unset;
        padding: 1.5rem 0.75rem 4rem;
    }

    .rp-hero[b-2ib1jyyfu5] {
        padding: 1.5rem 1.25rem;
    }

    .rp-hero-title[b-2ib1jyyfu5] {
        font-size: 1.4rem;
    }
}
/* /Pages/Services/ServiceEmailTemplates.razor.rz.scp.css */
/* ── Type toggle ────────────────────────────── */

.et-type-toggle[b-z21r3egabb] {
    display: inline-flex;
    border: 1px solid var(--mud-palette-divider);
    border-radius: 6px;
    overflow: hidden;
}

.et-type-btn[b-z21r3egabb] {
    padding: 4px 16px;
    font-size: .8rem;
    font-weight: 500;
    border: none;
    background: transparent;
    cursor: pointer;
    color: var(--mud-palette-text-primary);
    transition: background .12s, color .12s;
    line-height: 1.7;
}

.et-type-btn:first-child[b-z21r3egabb] {
    border-right: 1px solid var(--mud-palette-divider);
}

.et-type-btn--active[b-z21r3egabb] {
    background: var(--mud-palette-primary);
    color: white;
}

.et-type-btn:hover:not(.et-type-btn--active)[b-z21r3egabb] {
    background: var(--mud-palette-action-hover);
}

/* ── Quill editor ───────────────────────────── */

.et-editor-wrap[b-z21r3egabb] {
    border: 1px solid var(--mud-palette-divider);
    border-radius: 4px;
    overflow: hidden;
}

.et-editor-wrap[b-z21r3egabb]  .ql-toolbar {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid var(--mud-palette-divider);
    background: var(--mud-palette-surface);
}

.et-editor-wrap[b-z21r3egabb]  .ql-container {
    border: none;
    background: var(--mud-palette-surface);
    font-size: .875rem;
    min-height: 200px;
}

.et-editor-wrap[b-z21r3egabb]  .ql-editor {
    color: var(--mud-palette-text-primary);
}

/* Quill toolbar icon colours adapt to dark mode */
.et-editor-wrap[b-z21r3egabb]  .ql-stroke {
    stroke: var(--mud-palette-text-secondary) !important;
}

.et-editor-wrap[b-z21r3egabb]  .ql-fill {
    fill: var(--mud-palette-text-secondary) !important;
}

.et-editor-wrap[b-z21r3egabb]  .ql-picker-label,
.et-editor-wrap[b-z21r3egabb]  .ql-picker-item {
    color: var(--mud-palette-text-secondary) !important;
}

.et-editor-wrap[b-z21r3egabb]  .ql-picker-options {
    background: var(--mud-palette-surface) !important;
    border-color: var(--mud-palette-divider) !important;
}

.et-editor-wrap[b-z21r3egabb]  button:hover .ql-stroke,
.et-editor-wrap[b-z21r3egabb]  .ql-active .ql-stroke {
    stroke: var(--mud-palette-primary) !important;
}

.et-editor-wrap[b-z21r3egabb]  button:hover .ql-fill,
.et-editor-wrap[b-z21r3egabb]  .ql-active .ql-fill {
    fill: var(--mud-palette-primary) !important;
}

.et-editor-wrap[b-z21r3egabb]  .ql-active .ql-picker-label {
    color: var(--mud-palette-primary) !important;
}
/* /Shared/ClientPortalLayout.razor.rz.scp.css */
.portal-layout[b-fyid45s9t0] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    max-width: 480px;
    margin: 0 auto;
    position: relative;
}

.portal-auth-guard[b-fyid45s9t0] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
}

.portal-appbar[b-fyid45s9t0] {
    border-bottom: 1px solid rgba(255,255,255,0.08);
}

.portal-shop-name[b-fyid45s9t0] {
    font-weight: 600;
    letter-spacing: 0.02em;
}

.portal-body[b-fyid45s9t0] {
    flex: 1;
    overflow-y: auto;
}

.portal-body--padded[b-fyid45s9t0] {
    padding: 16px 0px 60px 0px;
}

.portal-body--full[b-fyid45s9t0] {
    padding: 0;
}

/* /Shared/Components/Molecules/ListDetailView.razor.rz.scp.css */
.view-container[b-ncjdjhingx] {
    height: calc(100dvh - 45px);
    width: 100%;
    display: grid;
    overflow: hidden;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    align-content: start;
}

.header-view[b-ncjdjhingx] {
    padding: 5px 20px 0 20px;
}

.list-preview[b-ncjdjhingx] {
    display: grid;
    grid-template-columns: 1.5fr 2fr;
    overflow: hidden;
}

.list-preview-flipped[b-ncjdjhingx] {
    display: grid;
    grid-template-columns: 2fr 1.5fr;
    overflow: hidden;
}

.list-container[b-ncjdjhingx]{
    padding: 0;
    flex: 1;
    overflow-y: auto;
}
.preview-window[b-ncjdjhingx],
.placeholder[b-ncjdjhingx] {
    padding: 0 0 0 0;
    flex: 1;
    overflow-y: auto;
}

.fixed-preview .preview-window[b-ncjdjhingx]{
   
    overflow-y: hidden;
}

.preview-card[b-ncjdjhingx] {
    overflow-y: hidden;
}

.preview-card-fixed .preview-card[b-ncjdjhingx] {
    overflow-y: hidden;
}



.back[b-ncjdjhingx] {
    display: none;
    cursor: pointer;
}

.has-placeholder .preview-window[b-ncjdjhingx] {
    display: none;
}

@media (max-width: 1300px) {
    .view-container[b-ncjdjhingx] {
        height: calc(100dvh - 45px);
    }
    
    .list-preview[b-ncjdjhingx] {
        grid-template-columns: 1fr;
    }

    .list-container[b-ncjdjhingx] {
        padding: 0;
        transition: opacity 0.2s;
        opacity: 1;
        position: relative;
    }

    .open-preview .list-container[b-ncjdjhingx] {
        opacity: 0;
    }

    .has-placeholder .list-container[b-ncjdjhingx] {
        overflow: visible;
    }

    .placeholder[b-ncjdjhingx] {
        padding: 5px;
    }

    .preview-window[b-ncjdjhingx] {
        padding: 0 0 0 0;
        position: fixed;
        transition: left 0.4s ease;
        left: 100%;
        right: 0;
        bottom: 0;
        top: 0;
        z-index: 2;
    }

    .hide-preview[b-ncjdjhingx] {
        z-index: -1;
    }

    .open-preview .preview-window[b-ncjdjhingx] {
        left: 0;
    }

    .back[b-ncjdjhingx] {
        display: block;
        opacity: 0;
        position: fixed;
        top: 18px;
        right: 40px;
        z-index: 1000;
        transition: opacity 0.2s;
    }

    .open-preview .back[b-ncjdjhingx] {
        opacity: 1;
        z-index: 2;
    }

    .preview-card[b-ncjdjhingx] {
        
        width: 100%;
        min-height: 100%;
        border-radius: 0;
        z-index: -10;
        overflow-y: auto;
    }

    .has-placeholder[b-ncjdjhingx] {
        overflow-y: scroll;
    }

    .has-placeholder .placeholder[b-ncjdjhingx] {
        overflow: visible;
    }
}

@media (max-width: 360px) {
    .list-preview[b-ncjdjhingx] {
        max-width: 90vw;
    }
}
/* /Shared/Components/Molecules/ListItems/CheckOutListItem.razor.rz.scp.css */
.co-card[b-kl4b5s0hqc] {
    border-radius: 0 6px 6px 0;
    margin: 2px 4px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.07);
    transition: box-shadow 0.12s ease;
}

.co-card:hover[b-kl4b5s0hqc] {
    box-shadow: 0 2px 6px rgba(0,0,0,0.13);
}

/* Zone 1 — name row */
.co-header[b-kl4b5s0hqc] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 8px 5px;
    cursor: pointer;
}

.co-name[b-kl4b5s0hqc] {
    flex: 1;
    font-weight: 600;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.co-total[b-kl4b5s0hqc] {
    font-weight: 700;
    font-size: 0.9rem;
    white-space: nowrap;
    flex-shrink: 0;
}

.co-del[b-kl4b5s0hqc] {
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    opacity: 0.5;
    transition: opacity 0.1s;
}

.co-del:hover[b-kl4b5s0hqc] { opacity: 1; }

/* Zone 2 — controls row */
.co-controls[b-kl4b5s0hqc] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 4px 8px 6px;
    background: var(--mud-palette-background-grey);
    border-top: 1px solid var(--mud-palette-divider);
}

.co-emp[b-kl4b5s0hqc] {
    flex: 1;
    min-width: 110px;
}

/* Compact native field groups */
.co-field[b-kl4b5s0hqc] {
    display: flex;
    align-items: baseline;
    gap: 2px;
    flex-shrink: 0;
}

.co-prefix[b-kl4b5s0hqc] {
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    user-select: none;
    line-height: 1;
}

.co-input[b-kl4b5s0hqc] {
    border: none;
    border-bottom: 1px solid var(--mud-palette-divider);
    background: transparent;
    text-align: right;
    font-size: 0.85rem;
    font-family: inherit;
    padding: 1px 0;
    outline: none;
    color: var(--mud-palette-text-primary);
    width: 56px;
    -moz-appearance: textfield;
    appearance: textfield;
}

.co-input[b-kl4b5s0hqc]::-webkit-outer-spin-button,
.co-input[b-kl4b5s0hqc]::-webkit-inner-spin-button { -webkit-appearance: none; }

.co-input:focus[b-kl4b5s0hqc] {
    border-bottom: 1px solid var(--mud-palette-primary);
}

.co-input-sm[b-kl4b5s0hqc] { width: 32px; }

/* Discount type toggle */
.co-disc-toggle[b-kl4b5s0hqc] {
    border: none;
    border-bottom: 1px solid var(--mud-palette-divider);
    background: transparent;
    cursor: pointer;
    padding: 1px 3px;
    font-size: 0.7rem;
    font-family: inherit;
    color: var(--mud-palette-text-secondary);
    border-radius: 2px 2px 0 0;
    line-height: 1.4;
    transition: color 0.1s, background 0.1s;
}

.co-disc-toggle:hover[b-kl4b5s0hqc] {
    color: var(--mud-palette-primary);
    background: var(--mud-palette-action-default-hover);
}
/* /Shared/Components/Organisms/ClientList.razor.rz.scp.css */
.header-bar[b-oaz0va8q4o] {
    z-index: 1000;
    position: absolute;
    background: red;
    width: 100%;
}

.list-container[b-oaz0va8q4o] {
    
    overflow: clip;
    
}

.tool-bar[b-oaz0va8q4o]{
    position: sticky;
    top: 0;
    z-index: 1000;
}
/* /Shared/Components/Organisms/Dialogs/DateTimeSelector.razor.rz.scp.css */
.dts-host[b-5s2i00yjk8] {
    display: flex;
    align-items: center;
    gap: 8px;
}

[b-5s2i00yjk8] .dts-trigger {
    text-transform: none;
    font-weight: 500;
    border-color: var(--mud-palette-lines-default);
    color: var(--mud-palette-text-primary);
}

.dts-root[b-5s2i00yjk8] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 280px;
    padding: 4px 4px 24px;
}

.dts-toolbar[b-5s2i00yjk8] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 4px;
}

.dts-toolbar-title[b-5s2i00yjk8] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-width: 220px;
}

[b-5s2i00yjk8] .dts-month-button,
[b-5s2i00yjk8] .dts-year-button {
    text-transform: none;
    font-size: 1.05rem;
    font-weight: 500;
    padding: 2px 6px;
    min-width: 0;
    color: var(--mud-palette-text-primary);
}

[b-5s2i00yjk8] .dts-month-button {
    font-weight: 600;
}

.dts-toolbar-spacer[b-5s2i00yjk8] {
    flex: 1;
}

[b-5s2i00yjk8] .dts-today-btn {
    text-transform: none;
    color: var(--mud-palette-text-secondary);
}

.dts-months[b-5s2i00yjk8] {
    display: flex;
    flex-direction: row;
    gap: 24px;
    flex-wrap: wrap;
    justify-content: center;
}

.dts-month[b-5s2i00yjk8] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 264px;
    flex: 1 1 264px;
    max-width: 320px;
}

.dts-month-title[b-5s2i00yjk8] {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--mud-palette-text-secondary);
    text-align: center;
    margin-bottom: 6px;
    letter-spacing: 0.02em;
}

.dts-grid[b-5s2i00yjk8] {
    display: grid;
    grid-template-columns: 28px repeat(7, 1fr);
    gap: 2px;
    align-items: center;
}

.dts-grid-row[b-5s2i00yjk8] {
    min-height: 40px;
}

.dts-weekoffset-head[b-5s2i00yjk8],
.dts-weekday[b-5s2i00yjk8] {
    font-size: 0.7rem;
    color: var(--mud-palette-text-secondary);
    text-align: center;
    padding: 4px 0;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.dts-weekoffset[b-5s2i00yjk8] {
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}

.dts-weekoffset > span[b-5s2i00yjk8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    height: 18px;
    padding: 0 6px;
    background-color: var(--mud-palette-action-default-hover);
    border-radius: 9px;
    font-size: 0.7rem;
    font-weight: 500;
    color: var(--mud-palette-text-secondary);
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.dts-day[b-5s2i00yjk8] {
    appearance: none;
    background: transparent;
    border: 1.5px solid transparent;
    color: var(--mud-palette-text-primary);
    font-size: 0.875rem;
    font-weight: 400;
    height: 36px;
    width: 36px;
    margin: 0 auto;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
    padding: 0;
    line-height: 1;
}

.dts-day:hover[b-5s2i00yjk8] {
    background-color: var(--mud-palette-action-default-hover);
}

.dts-day:focus-visible[b-5s2i00yjk8] {
    outline: 2px solid var(--mud-palette-primary);
    outline-offset: 2px;
}

.dts-day-other[b-5s2i00yjk8] {
    color: var(--mud-palette-text-disabled);
}

.dts-day-today[b-5s2i00yjk8] {
    border-color: var(--mud-palette-primary);
    font-weight: 600;
}

.dts-day-today.dts-day-other[b-5s2i00yjk8] {
    border-color: var(--mud-palette-lines-default);
    color: var(--mud-palette-text-disabled);
    font-weight: 500;
}

.dts-day-selected[b-5s2i00yjk8],
.dts-day-selected:hover[b-5s2i00yjk8] {
    background-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
    border-color: var(--mud-palette-primary);
    font-weight: 600;
}

/* Selected day rendered as a leading/trailing day in another panel's month — solid filled
   in a muted grey so it reads as "the picked date, but this is the spillover view." */
.dts-day-selected.dts-day-other[b-5s2i00yjk8],
.dts-day-selected.dts-day-other:hover[b-5s2i00yjk8] {
    background-color: var(--mud-palette-action-default-hover);
    color: var(--mud-palette-text-disabled);
    border-color: transparent;
    font-weight: 500;
}

@media (max-width: 600px) {
    .dts-month[b-5s2i00yjk8] {
        min-width: 0;
        max-width: 100%;
        width: 100%;
    }

    .dts-day[b-5s2i00yjk8] {
        height: 40px;
        width: 40px;
    }

    .dts-grid-row[b-5s2i00yjk8] {
        min-height: 44px;
    }
}
/* /Shared/Components/Organisms/GettingStarted.razor.rz.scp.css */
/* ── Outer panel ────────────────────────────────────────── */
.gs-panel[b-t09sx1ztqg] {
    min-height: calc(100dvh - 100px);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1.5rem;
    gap: 2rem;
}

/* ── Hero ────────────────────────────────────────────────── */
.gs-hero[b-t09sx1ztqg] {
    width: 100%;
    max-width: 640px;
    background: linear-gradient(135deg, var(--mud-palette-primary-darken) 0%, var(--mud-palette-primary) 100%);
    border-radius: 20px;
    padding: 36px 40px;
    text-align: center;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
}

.gs-hero-badge[b-t09sx1ztqg] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.18);
    border-radius: 100px;
    padding: 5px 14px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.92);
    margin-bottom: 18px;
}

.gs-hero-title[b-t09sx1ztqg] {
    margin: 0 0 8px 0;
    font-size: 1.9rem;
    font-weight: 800;
    color: white;
    line-height: 1.15;
    letter-spacing: -0.4px;
}

.gs-hero-sub[b-t09sx1ztqg] {
    margin: 0 0 22px 0;
    font-size: 0.93rem;
    color: rgba(255, 255, 255, 0.76);
    line-height: 1.55;
}

.gs-progress-row[b-t09sx1ztqg] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.gs-progress-bar[b-t09sx1ztqg] {
    width: 100%;
}

.gs-progress-label[b-t09sx1ztqg] {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.65);
    font-weight: 500;
}

/* ── Steps row ───────────────────────────────────────────── */
.gs-steps[b-t09sx1ztqg] {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
    max-width: 960px;
    gap: 0;
}

/* ── Connector arrow ─────────────────────────────────────── */
.gs-connector[b-t09sx1ztqg] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
}

.gs-connector-icon[b-t09sx1ztqg] {
    font-size: 2rem !important;
    color: var(--mud-palette-text-disabled) !important;
}

/* ── Individual step card ────────────────────────────────── */
.gs-step[b-t09sx1ztqg] {
    flex: 1;
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    overflow: hidden;
    background: var(--mud-palette-surface);
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.gs-step--active:hover[b-t09sx1ztqg] {
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.13);
    transform: translateY(-4px);
}

.gs-step--done[b-t09sx1ztqg] {
    opacity: 0.68;
}

.gs-step--done:hover[b-t09sx1ztqg] {
    transform: none;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07);
}

.gs-step--locked[b-t09sx1ztqg] {
    opacity: 0.5;
}

/* ── Step coloured header ────────────────────────────────── */
.gs-step-head[b-t09sx1ztqg] {
    position: relative;
    min-height: 128px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 16px 16px;
    gap: 6px;
    overflow: hidden;
}

.gs-head-primary[b-t09sx1ztqg] {
    background: linear-gradient(145deg, var(--mud-palette-primary-darken) 0%, var(--mud-palette-primary) 100%);
}

.gs-head-secondary[b-t09sx1ztqg] {
    background: var(--mud-palette-secondary);
}

.gs-head-tertiary[b-t09sx1ztqg] {
    background: var(--mud-palette-tertiary);
}

.gs-head-locked[b-t09sx1ztqg] {
    background: var(--mud-palette-action-disabled-background);
}

.gs-step-num[b-t09sx1ztqg] {
    position: absolute;
    top: 10px;
    left: 14px;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 0.55);
    font-family: ui-monospace, monospace;
}

.gs-step-icon[b-t09sx1ztqg] {
    font-size: 2.6rem !important;
    color: rgba(255, 255, 255, 0.95) !important;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.2));
}

/* ── Done overlay ────────────────────────────────────────── */
.gs-done-overlay[b-t09sx1ztqg] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
}

.gs-check-icon[b-t09sx1ztqg] {
    font-size: 3.2rem !important;
    color: white !important;
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.35));
}

/* ── Lock overlay ────────────────────────────────────────── */
.gs-lock-overlay[b-t09sx1ztqg] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.gs-lock-icon[b-t09sx1ztqg] {
    font-size: 2rem !important;
    color: rgba(255, 255, 255, 0.4) !important;
}

/* ── Step body ───────────────────────────────────────────── */
.gs-step-body[b-t09sx1ztqg] {
    padding: 20px 20px 6px;
    flex: 1;
}

.gs-step-title[b-t09sx1ztqg] {
    margin: 0 0 6px 0;
    font-size: 1rem;
    font-weight: 700;
    color: var(--mud-palette-text-primary);
    line-height: 1.3;
}

.gs-step-desc[b-t09sx1ztqg] {
    margin: 0;
    font-size: 0.845rem;
    color: var(--mud-palette-text-secondary);
    line-height: 1.6;
}

/* ── Step footer ─────────────────────────────────────────── */
.gs-step-foot[b-t09sx1ztqg] {
    padding: 12px 20px 20px;
}

.gs-complete-label[b-t09sx1ztqg] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--mud-palette-success);
    font-size: 0.875rem;
    font-weight: 600;
    padding: 4px 0;
}

/* ── Mobile ──────────────────────────────────────────────── */
@media (max-width: 860px) {
    .gs-panel[b-t09sx1ztqg] {
        min-height: unset;
        justify-content: flex-start;
        padding: 1.5rem 1rem 3rem;
    }

    .gs-hero[b-t09sx1ztqg] {
        padding: 28px 24px;
    }

    .gs-hero-title[b-t09sx1ztqg] {
        font-size: 1.5rem;
    }

    .gs-steps[b-t09sx1ztqg] {
        flex-direction: column;
    }

    .gs-connector[b-t09sx1ztqg] {
        width: auto;
        height: 28px;
        transform: rotate(90deg);
    }

    .gs-step-head[b-t09sx1ztqg] {
        min-height: 100px;
    }
}
/* /Shared/Components/Organisms/OlbWizard.razor.rz.scp.css */
/* ── Page wrap ──────────────────────────────────────────────── */
.olb-wrap[b-oq1lvulaux] {
    min-height: 100vh;
    max-width: 680px;
    margin: 0 auto;
    padding: 16px 12px 40px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ── Hero Header ────────────────────────────────────────────── */
.olb-hero[b-oq1lvulaux] {
    text-align: center;
    padding: 20px 16px 4px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.shop-logo-wrap[b-oq1lvulaux] {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 0 0 3px rgba(74,143,212,0.35), 0 8px 32px rgba(0,0,0,0.5);
}

.shop-logo[b-oq1lvulaux] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.shop-logo-fallback[b-oq1lvulaux] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #4a8fd4, #88abf2);
    z-index: 0;
    font-size: 32px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -1px;
}

.hero-shop-name[b-oq1lvulaux] {
    font-size: 24px !important;
    font-weight: 800 !important;
    color: #F8FAFC !important;
    letter-spacing: -0.5px;
    line-height: 1.2;
    margin: 0 !important;
}

.hero-sub[b-oq1lvulaux] {
    color: #475569 !important;
    font-size: 13px !important;
    margin: 0 !important;
}

/* ── Hero contact bar ───────────────────────────────────────── */
.hero-contact-bar[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 10px;
    margin-top: 6px;
}

.hero-contact-item[b-oq1lvulaux] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #64748B;
    text-decoration: none;
    padding: 3px 8px;
    border-radius: 20px;
    transition: background 0.15s, color 0.15s;
}

.hero-contact-item:hover[b-oq1lvulaux] {
    background: rgba(74,143,212,0.1);
    color: #a8c5f0;
}

.hero-contact-dot[b-oq1lvulaux] {
    color: #334155;
    font-size: 14px;
    line-height: 1;
}

/* ── Step track ─────────────────────────────────────────────── */
.step-track[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    flex-wrap: nowrap;
    overflow: hidden;
}

.step-node[b-oq1lvulaux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

.step-circle[b-oq1lvulaux] {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: rgba(255,255,255,0.06);
    border: 2px solid rgba(255,255,255,0.1);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #475569;
    font-size: 12px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.step-node.active .step-circle[b-oq1lvulaux] {
    background: #4a8fd4;
    border-color: #4a8fd4;
    color: #fff;
    box-shadow: 0 0 0 4px rgba(74,143,212,0.2);
}

.step-node.done .step-circle[b-oq1lvulaux] {
    background: rgba(74,143,212,0.25);
    border-color: #4a8fd4;
    color: #a8c5f0;
}

.step-label[b-oq1lvulaux] {
    font-size: 10px;
    font-weight: 500;
    color: #475569;
    white-space: nowrap;
}

.step-node.active .step-label[b-oq1lvulaux] { color: #a8c5f0; }
.step-node.done .step-label[b-oq1lvulaux]  { color: #4a8fd4; }

.step-line[b-oq1lvulaux] {
    flex: 1;
    height: 2px;
    background: rgba(255,255,255,0.07);
    margin: 0 4px;
    margin-bottom: 18px;
    transition: background 0.3s ease;
}

.step-line.done[b-oq1lvulaux] { background: rgba(74,143,212,0.35); }

/* ── Wizard card ────────────────────────────────────────────── */
.olb-card[b-oq1lvulaux] {
    background: rgba(15, 23, 42, 0.9);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 20px;
    padding: 20px 18px;
    backdrop-filter: blur(20px);
    box-shadow: 0 4px 24px rgba(0,0,0,0.4);
}

.step-title[b-oq1lvulaux] {
    color: #F8FAFC !important;
    font-weight: 700 !important;
    margin-bottom: 2px;
}

.step-sub[b-oq1lvulaux] {
    color: #64748B !important;
}

/* ── Category list ──────────────────────────────────────────── */
.cat-list[b-oq1lvulaux] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cat-card[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
    height: 64px;
}

.cat-card:hover[b-oq1lvulaux] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(74,143,212,0.35);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.cat-card-sub[b-oq1lvulaux] {
    margin-left: 16px;
    border-left: 3px solid rgba(255,255,255,0.08);
    border-radius: 0 14px 14px 0;
}

.cat-accent[b-oq1lvulaux] {
    width: 5px;
    height: 100%;
    flex-shrink: 0;
}

.cat-body[b-oq1lvulaux] {
    flex: 1;
    padding: 0 16px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cat-breadcrumb[b-oq1lvulaux] {
    font-size: 10px;
    font-weight: 500;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    line-height: 1;
    margin-bottom: 1px;
}

.cat-name[b-oq1lvulaux] {
    font-size: 15px;
    font-weight: 600;
    color: #E2E8F0;
}

.cat-count[b-oq1lvulaux] {
    font-size: 12px;
    color: #475569;
}

.cat-back-btn[b-oq1lvulaux] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: none;
    border: none;
    color: #4a8fd4;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    padding: 0 0 12px;
    transition: color 0.15s;
}

.cat-back-btn:hover[b-oq1lvulaux] { color: #a8c5f0; }

/* ── Service cards ──────────────────────────────────────────── */
.service-card[b-oq1lvulaux] {
    display: flex;
    align-items: stretch;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 12px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    overflow: hidden;
}

.service-card:hover[b-oq1lvulaux] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(74,143,212,0.4);
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.25);
}

.service-card.selected[b-oq1lvulaux] {
    background: rgba(74,143,212,0.1);
    border-color: #4a8fd4;
}

.service-accent[b-oq1lvulaux] {
    width: 4px;
    background: var(--cat-color, #4a8fd4);
    flex-shrink: 0;
}

.service-body[b-oq1lvulaux] {
    flex: 1;
    padding: 11px 14px;
}

.service-top[b-oq1lvulaux] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.service-name[b-oq1lvulaux] {
    color: #F1F5F9 !important;
    font-weight: 600 !important;
}

.service-top-right[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.service-price[b-oq1lvulaux] {
    color: #a8c5f0;
    font-size: 14px;
    font-weight: 600;
    white-space: nowrap;
}

/* ── Inline service expand ──────────────────────────────────── */
.service-expand[b-oq1lvulaux] {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    transition: max-height 0.3s ease, opacity 0.25s ease;
}

.service-card.selected .service-expand[b-oq1lvulaux] {
    max-height: 160px;
    opacity: 1;
}

.service-expand-desc[b-oq1lvulaux] {
    font-size: 12px;
    color: #94A3B8;
    line-height: 1.5;
    margin: 10px 0 8px;
    padding-top: 10px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.service-expand-hint[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    color: #4a8fd4;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    padding-bottom: 2px;
}

.time-chip[b-oq1lvulaux] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: rgba(255,255,255,0.06);
    border-radius: 20px;
    padding: 2px 8px;
    font-size: 11px;
    color: #64748B;
}

/* ── Category icon ──────────────────────────────────────────── */
.cat-icon-wrap[b-oq1lvulaux] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 12px;
    flex-shrink: 0;
    opacity: 0.88;
}

/* ── Employee grid ───────────────────────────────────────────── */
.emp-grid[b-oq1lvulaux] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

@media (min-width: 480px) {
    .emp-grid[b-oq1lvulaux] { grid-template-columns: repeat(4, 1fr); }
}

.emp-grid-card[b-oq1lvulaux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 8px 12px;
    background: rgba(255,255,255,0.04);
    border: 2px solid transparent;
    border-radius: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.emp-grid-card:hover[b-oq1lvulaux] {
    background: rgba(255,255,255,0.07);
    border-color: rgba(74,143,212,0.3);
}

.emp-grid-card.selected[b-oq1lvulaux] {
    background: rgba(74,143,212,0.1);
    border-color: #4a8fd4;
    box-shadow: 0 0 0 1px rgba(74,143,212,0.2);
}

.emp-grid-avatar[b-oq1lvulaux] {
    position: relative;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 2px 10px rgba(0,0,0,0.45);
}

.emp-grid-card.selected .emp-grid-avatar[b-oq1lvulaux] {
    box-shadow: 0 0 0 3px #4a8fd4, 0 4px 14px rgba(74,143,212,0.4);
}

.emp-grid-avatar-fallback[b-oq1lvulaux] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
    font-size: 22px;
    font-weight: 700;
    color: #fff;
}

.emp-grid-avatar-img[b-oq1lvulaux] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
}

.emp-grid-name[b-oq1lvulaux] {
    font-size: 12px;
    font-weight: 600;
    color: #94A3B8;
    text-align: center;
    line-height: 1.25;
    word-break: break-word;
    transition: color 0.2s;
}

.emp-grid-card.selected .emp-grid-name[b-oq1lvulaux] { color: #a8c5f0; }

/* ── Selected employee detail strip ─────────────────────────── */
.emp-selected-detail[b-oq1lvulaux] {
    margin-top: 12px;
    background: rgba(74,143,212,0.07);
    border: 1px solid rgba(74,143,212,0.25);
    border-radius: 14px;
    padding: 14px 16px;
}

.emp-detail-header[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
}

.emp-detail-name[b-oq1lvulaux] {
    font-size: 15px;
    font-weight: 700;
    color: #F1F5F9;
}

.emp-detail-bio[b-oq1lvulaux] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.55;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.emp-detail-bio-empty[b-oq1lvulaux] {
    color: #475569;
    font-style: italic;
}

.emp-detail-hint[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    font-size: 11px;
    font-weight: 600;
    color: #4a8fd4;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

/* ── Date strip ─────────────────────────────────────────────── */
.date-strip[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.date-nav-btn[b-oq1lvulaux] {
    background: rgba(255,255,255,0.06);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 50%;
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #94A3B8;
    flex-shrink: 0;
    transition: all 0.2s;
}

.date-nav-btn:hover:not(:disabled)[b-oq1lvulaux] {
    background: rgba(74,143,212,0.15);
    border-color: #4a8fd4;
    color: #a8c5f0;
}

.date-nav-btn:disabled[b-oq1lvulaux] { opacity: 0.3; cursor: default; }

.date-pills[b-oq1lvulaux] {
    display: flex;
    flex: 1;
    gap: 5px;
    justify-content: space-between;
}

.date-pill[b-oq1lvulaux] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 7px 3px;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.07);
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.2s;
    color: #94A3B8;
    min-width: 0;
}

.date-pill:hover[b-oq1lvulaux] {
    background: rgba(74,143,212,0.1);
    border-color: rgba(74,143,212,0.4);
    color: #a8c5f0;
}

.date-pill.selected[b-oq1lvulaux] {
    background: #4a8fd4;
    border-color: #4a8fd4;
    color: #fff;
    box-shadow: 0 4px 12px rgba(74,143,212,0.4);
}

.date-pill.closed[b-oq1lvulaux] {
    opacity: 0.35;
    cursor: not-allowed;
    pointer-events: none;
}

.date-dow[b-oq1lvulaux] { font-size: 9px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; }
.date-num[b-oq1lvulaux] { font-size: 18px; font-weight: 700; line-height: 1; }
.date-mon[b-oq1lvulaux] { font-size: 9px; text-transform: uppercase; }

/* ── Slot grid & pills ──────────────────────────────────────── */
.time-group-label[b-oq1lvulaux] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #475569;
    margin-bottom: 8px;
    display: block;
}

.slot-grid[b-oq1lvulaux] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
}

@media (min-width: 480px) {
    .slot-grid[b-oq1lvulaux] { grid-template-columns: repeat(4, 1fr); }
}

.slot-pill[b-oq1lvulaux] {
    padding: 8px 4px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    color: #CBD5E1;
    cursor: pointer;
    transition: all 0.15s ease;
    text-align: center;
    white-space: nowrap;
}

.slot-pill:hover[b-oq1lvulaux] {
    background: rgba(74,143,212,0.12);
    border-color: #4a8fd4;
    color: #a8c5f0;
    transform: scale(1.03);
}

.slot-pill.selected[b-oq1lvulaux] {
    background: #4a8fd4;
    border-color: #4a8fd4;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(74,143,212,0.35);
}

/* ── Summary card ───────────────────────────────────────────── */
.summary-card[b-oq1lvulaux] {
    background: rgba(74,143,212,0.06);
    border: 1px solid rgba(74,143,212,0.18);
    border-radius: 12px;
    overflow: hidden;
}

.summary-row[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.04);
}

.summary-row:last-child[b-oq1lvulaux] { border-bottom: none; }

.summary-label[b-oq1lvulaux] {
    color: #64748B;
    font-size: 12px;
    width: 56px;
    flex-shrink: 0;
}

.summary-value[b-oq1lvulaux] {
    color: #E2E8F0;
    font-size: 13px;
    font-weight: 500;
}

/* ── Form fields ────────────────────────────────────────────── */
.olb-field[b-oq1lvulaux]  .mud-input-root { color: #E2E8F0 !important; }
.olb-field[b-oq1lvulaux]  .mud-input-outlined-border { border-color: rgba(255,255,255,0.15) !important; }
.olb-field[b-oq1lvulaux]  .mud-input-label { color: #64748B !important; }
.olb-field[b-oq1lvulaux]  .mud-input-adorned-start .mud-input-adornment { color: #64748B; }

/* ── Extras (reminders / contact) ───────────────────────────── */
.extras-section[b-oq1lvulaux] {
    border-top: 1px solid rgba(255,255,255,0.06);
    padding-top: 14px;
}

.contact-chips[b-oq1lvulaux] {
    display: flex;
    gap: 8px;
}

.contact-chip[b-oq1lvulaux] {
    padding: 6px 16px;
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #94A3B8;
    cursor: pointer;
    transition: all 0.15s;
}

.contact-chip:hover[b-oq1lvulaux] {
    background: rgba(74,143,212,0.1);
    border-color: rgba(74,143,212,0.4);
    color: #a8c5f0;
}

.contact-chip.selected[b-oq1lvulaux] {
    background: #4a8fd4;
    border-color: #4a8fd4;
    color: #fff;
}

/* ── Navigation bar ─────────────────────────────────────────── */
.olb-nav[b-oq1lvulaux] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px;
}

.next-btn[b-oq1lvulaux] {
    background: linear-gradient(135deg, #4a8fd4, #3a6fea) !important;
    color: #fff !important;
    border-radius: 12px !important;
    padding: 8px 24px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 16px rgba(74,143,212,0.4) !important;
    transition: all 0.2s !important;
}

.next-btn:hover:not(:disabled)[b-oq1lvulaux] {
    box-shadow: 0 6px 20px rgba(74,143,212,0.55) !important;
    transform: translateY(-1px) !important;
}

.next-btn:disabled[b-oq1lvulaux] { opacity: 0.5 !important; }

/* ── Empty state ────────────────────────────────────────────── */
.empty-state[b-oq1lvulaux] {
    padding: 32px 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* ── Success screen ─────────────────────────────────────────── */
.success-screen[b-oq1lvulaux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 8px 0;
}

.success-ring[b-oq1lvulaux] {
    animation: pop-b-oq1lvulaux 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes pop-b-oq1lvulaux {
    0%   { transform: scale(0.5); opacity: 0; }
    80%  { transform: scale(1.1); }
    100% { transform: scale(1);   opacity: 1; }
}



/* ── ReminderSelect dark-theme overrides ────────────────────── */
/* Neutralise blue Info chips → subtle dark pill */
.extras-section[b-oq1lvulaux]  .mud-chip {
    background-color: rgba(255,255,255,0.07) !important;
    color: #94A3B8 !important;
    border: 1px solid rgba(255,255,255,0.12) !important;
    height: 30px !important;
    font-size: 12px !important;
}
/* Active (Info-coloured) chip when type selected */
.extras-section[b-oq1lvulaux]  .mud-chip-color-info {
    background-color: rgba(74,143,212,0.2) !important;
    color: #a8c5f0 !important;
    border-color: rgba(74,143,212,0.4) !important;
}
.extras-section[b-oq1lvulaux]  .mud-chip .mud-chip-content { color: inherit !important; }
.extras-section[b-oq1lvulaux]  .mud-chip .mud-icon-root { color: inherit !important; font-size: 16px !important; }
/* Replace amber Warning label with muted slate */
.extras-section[b-oq1lvulaux]  .mud-warning-text { color: #64748B !important; font-size: 13px !important; }
/* Menu items match dark surface */
.extras-section[b-oq1lvulaux]  .mud-popover { background: #1E293B !important; }

/* ── Privacy checkbox row ───────────────────────────────────── */
.privacy-row[b-oq1lvulaux] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 12px 0 4px;
    border-top: 1px solid rgba(255,255,255,0.06);
}

.privacy-checkbox[b-oq1lvulaux] {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    margin-top: 1px;
    accent-color: #4a8fd4;
    cursor: pointer;
}

.privacy-label[b-oq1lvulaux] {
    font-size: 12px;
    color: #64748B;
    line-height: 1.5;
    cursor: default;
}

.privacy-link[b-oq1lvulaux] {
    background: none;
    border: none;
    padding: 0;
    color: #a8c5f0;
    font-size: inherit;
    font-family: inherit;
    text-decoration: underline;
    cursor: pointer;
    transition: color 0.15s;
}

.privacy-link:hover[b-oq1lvulaux] { color: #cce0f5; }

/* ── Privacy policy overlay ─────────────────────────────────── */
.privacy-overlay[b-oq1lvulaux] {
    position: fixed;
    inset: 0;
    z-index: 9000;
    background: rgba(2, 6, 23, 0.82);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: fadeIn-b-oq1lvulaux 0.2s ease;
}

@keyframes fadeIn-b-oq1lvulaux {
    from { opacity: 0; }
    to   { opacity: 1; }
}

.privacy-sheet[b-oq1lvulaux] {
    width: 100%;
    max-width: 680px;
    max-height: 88vh;
    background: #0F172A;
    border: 1px solid rgba(255,255,255,0.1);
    border-radius: 24px 24px 0 0;
    display: flex;
    flex-direction: column;
    animation: slideUp-b-oq1lvulaux 0.28s cubic-bezier(0.34, 1.3, 0.64, 1) both;
    overflow: hidden;
}

@keyframes slideUp-b-oq1lvulaux {
    from { transform: translateY(60px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
}

.privacy-sheet-header[b-oq1lvulaux] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 18px 20px 14px;
    border-bottom: 1px solid rgba(255,255,255,0.07);
    flex-shrink: 0;
}

.privacy-sheet-title[b-oq1lvulaux] {
    font-size: 17px;
    font-weight: 700;
    color: #F1F5F9;
}

.privacy-close-btn[b-oq1lvulaux] {
    background: rgba(255,255,255,0.07);
    border: none;
    border-radius: 50%;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94A3B8;
    cursor: pointer;
    transition: background 0.15s;
}

.privacy-close-btn:hover[b-oq1lvulaux] {
    background: rgba(255,255,255,0.14);
    color: #F1F5F9;
}

.privacy-sheet-body[b-oq1lvulaux] {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    overscroll-behavior: contain;
}

.pp-effective[b-oq1lvulaux] {
    font-size: 12px;
    color: #475569;
    margin: 0 0 16px;
}

.pp-heading[b-oq1lvulaux] {
    font-size: 14px;
    font-weight: 700;
    color: #E2E8F0;
    margin: 20px 0 6px;
}

.pp-body[b-oq1lvulaux] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.6;
    margin: 0 0 10px;
}

.pp-list[b-oq1lvulaux] {
    font-size: 13px;
    color: #94A3B8;
    line-height: 1.6;
    margin: 0 0 10px;
    padding-left: 20px;
}

.pp-list li[b-oq1lvulaux] { margin-bottom: 4px; }
.pp-list strong[b-oq1lvulaux] { color: #CBD5E1; }

.privacy-sheet-footer[b-oq1lvulaux] {
    padding: 14px 20px 20px;
    border-top: 1px solid rgba(255,255,255,0.07);
    flex-shrink: 0;
}

.privacy-accept-btn[b-oq1lvulaux] {
    width: 100%;
    padding: 13px;
    background: linear-gradient(135deg, #4a8fd4, #3a6fea);
    border: none;
    border-radius: 14px;
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(74,143,212,0.4);
    transition: box-shadow 0.2s, transform 0.15s;
}

.privacy-accept-btn:hover[b-oq1lvulaux] {
    box-shadow: 0 6px 20px rgba(74,143,212,0.55);
    transform: translateY(-1px);
}

/* ── Footer ─────────────────────────────────────────────────── */
.olb-footer[b-oq1lvulaux] {
    text-align: center;
    padding-bottom: 8px;
}

/* ── Portal pill (hero) ──────────────────────────────────────── */
.olb-portal-pill[b-oq1lvulaux] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 999px;
    border: 1px solid rgba(74, 143, 212, 0.35);
    background: rgba(74, 143, 212, 0.08);
    color: rgba(74, 143, 212, 0.9);
    font-size: 0.72rem;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.15s, border-color 0.15s;
    margin-top: 2px;
}

.olb-portal-pill:hover[b-oq1lvulaux] {
    background: rgba(74, 143, 212, 0.16);
    border-color: rgba(74, 143, 212, 0.55);
    text-decoration: none;
}

/* ── Portal CTA (success screen) ────────────────────────────── */
.olb-portal-cta[b-oq1lvulaux] {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    width: 100%;
}
/* /Shared/Components/Organisms/PreviousItemsRow.razor.rz.scp.css */
.previous-row[b-fixte1o8xx] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.previous-row__label[b-fixte1o8xx] {
    flex-shrink: 0;
    font-weight: 600;
}

.previous-row__scroller[b-fixte1o8xx] {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: thin;
    padding-bottom: 2px;
}

.previous-row__scroller[b-fixte1o8xx]::-webkit-scrollbar {
    height: 4px;
}

.previous-row__scroller[b-fixte1o8xx]::-webkit-scrollbar-thumb {
    background: var(--mud-palette-divider);
    border-radius: 2px;
}

.previous-row__skeleton[b-fixte1o8xx] {
    flex-shrink: 0;
    border-radius: 16px;
}

.previous-row__chip-text[b-fixte1o8xx] {
    display: inline-block;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
}
/* /Shared/MainLayout.razor.rz.scp.css */

.snow[b-tk4g26mx7r] {
    opacity: 60%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 5;
    width: 120%;
    height: 100%;
    pointer-events: none;
    animation: snow-direction-b-tk4g26mx7r cubic-bezier(2, 0, 2, 1) 4s both alternate infinite;
}

@keyframes snow-direction-b-tk4g26mx7r {
    from {
        transform: translateX(-10%);
    }
    to {
        transform: translateX(10%);
    }
}

.snow[b-tk4g26mx7r]:before,
.snow[b-tk4g26mx7r]:after {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 10px;
    height: 10px;
    background-color: #fff;
    border-radius: 50%;
    filter: blur(1px);
    animation: snow-b-tk4g26mx7r 10s linear infinite;
    box-shadow:
            -5vw 10vh #fff,
            30vw 5vh #fff,
            55vw 5vh #fff,
            75vw 10vh #fff,
            105vw 15vh #fff,
            -10vw 30vh #fff,
            40vw 25vh #fff,
            60vw 20vh #fff,
            90vw 25vh #fff,
            20vw 40vh #fff,
            5vw 45vh #fff,
            65vw 45vh #fff,
            105vw 40vh #fff,
            50vw 50vh #fff,
            30vw 50vh #fff,
            10vw 55vh #fff,
            20vw 60vh #fff,
            40vw 65vh #fff,
            60vw 60vh #fff,
            80vw 65vh #fff,
            5vw 70vh #fff,
            30vw 75vh #fff,
            55vw 85vh #fff,
            75vw 80vh #fff,
            105vw 75vh #fff,
            20vw 90vh #fff,
            -5vw 95vh #fff,
            65vw 95vh #fff,
            100vw 90vh #fff,

            -5vw 110vh #fff,
            30vw 105vh #fff,
            55vw 105vh #fff,
            75vw 110vh #fff,
            105vw 115vh #fff,
            -10vw 130vh #fff,
            40vw 125vh #fff,
            60vw 120vh #fff,
            90vw 125vh #fff,
            20vw 140vh #fff,
            5vw 145vh #fff,
            65vw 145vh #fff,
            105vw 140vh #fff,
            50vw 150vh #fff,
            30vw 150vh #fff,
            10vw 155vh #fff,
            20vw 160vh #fff,
            40vw 165vh #fff,
            60vw 160vh #fff,
            80vw 165vh #fff,
            5vw 170vh #fff,
            30vw 175vh #fff,
            55vw 185vh #fff,
            75vw 180vh #fff,
            105vw 175vh #fff,
            20vw 190vh #fff,
            -5vw 195vh #fff,
            65vw 195vh #fff,
            100vw 190vh #fff;
}

.snow[b-tk4g26mx7r]:after {
    position: absolute;
    left: 50px;
    top: 60px;
    animation-duration: 6s;
    width: 8px;
    height: 8px;
    opacity: 0.7;
    filter: blur(3px);
}

@keyframes snow-b-tk4g26mx7r {
    from {
        transform: rotate(10deg) translateY(-100vh);
    }
    to {
        transform: rotate(10deg) translateY(0);
    }
}

/* Falling leaves effect */
.leaves[b-tk4g26mx7r] {
    opacity: 45%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 6;
    width: 120%;
    height: 100%;
    pointer-events: none;
}

.leaves--a[b-tk4g26mx7r] { animation: leaves-direction-b-tk4g26mx7r ease-in-out 7s 0s both alternate infinite; }
.leaves--b[b-tk4g26mx7r] { animation: leaves-direction-b-tk4g26mx7r ease-in-out 9s -3.5s both alternate infinite; }

@keyframes leaves-direction-b-tk4g26mx7r {
    from { transform: translateX(-7%); }
    to   { transform: translateX(7%);  }
}

/* Shared particle styles */
.leaves[b-tk4g26mx7r]:before,
.leaves[b-tk4g26mx7r]:after {
    content: '';
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 12px;
    height: 10px;
    border-radius: 40% 60% 30% 70% / 50% 40% 60% 50%;
    filter: blur(1px);
}

/* Layer A — rotate right, fall at 17s / 11s */
.leaves--a[b-tk4g26mx7r]:before {
    animation: leaves-fall-a-b-tk4g26mx7r 17s linear 0s infinite;
    background-color: #C0392B;
    box-shadow:
            -5vw 10vh #D35400,
            30vw 5vh #228B22,
            55vw 5vh #F1C40F,
            75vw 10vh #B7410E,
            105vw 15vh #E67E22,
            -10vw 30vh #6B8E23,
            40vw 25vh #8B4513,
            60vw 20vh #C0392B,
            90vw 25vh #F39C12,
            20vw 40vh #A0522D,
            5vw 45vh #228B22,
            65vw 45vh #D35400,
            105vw 40vh #F1C40F,
            50vw 50vh #B7410E,
            30vw 50vh #6B8E23,
            10vw 55vh #E67E22,
            20vw 60vh #8B4513,
            40vw 65vh #C0392B,
            60vw 60vh #F39C12,
            80vw 65vh #A0522D,
            5vw 70vh #D35400,
            30vw 75vh #228B22,
            55vw 85vh #F1C40F,
            75vw 80vh #B7410E,
            105vw 75vh #6B8E23,
            20vw 90vh #E67E22,
            -5vw 95vh #8B4513,
            65vw 95vh #C0392B,
            100vw 90vh #F39C12,
            -5vw 110vh #A0522D,
            30vw 105vh #D35400,
            55vw 105vh #228B22,
            75vw 110vh #F1C40F,
            105vw 115vh #B7410E,
            -10vw 130vh #6B8E23,
            40vw 125vh #E67E22,
            60vw 120vh #8B4513,
            90vw 125vh #C0392B,
            20vw 140vh #F39C12,
            5vw 145vh #A0522D,
            65vw 145vh #D35400,
            105vw 140vh #228B22,
            50vw 150vh #F1C40F,
            30vw 150vh #B7410E,
            10vw 155vh #6B8E23,
            20vw 160vh #E67E22,
            40vw 165vh #8B4513,
            60vw 160vh #C0392B,
            80vw 165vh #F39C12,
            5vw 170vh #A0522D,
            30vw 175vh #D35400,
            55vw 185vh #228B22,
            75vw 180vh #F1C40F,
            105vw 175vh #B7410E,
            20vw 190vh #6B8E23,
            -5vw 195vh #E67E22,
            65vw 195vh #8B4513,
            100vw 190vh #C0392B;
}
.leaves--a[b-tk4g26mx7r]:after {
    position: absolute;
    left: 55px;
    top: 75px;
    width: 10px;
    height: 8px;
    opacity: 0.7;
    filter: blur(2px);
    animation: leaves-fall-a-b-tk4g26mx7r 11s linear -4s infinite;
    background-color: #E67E22;
    box-shadow:
            -5vw 10vh #8B4513,
            30vw 5vh #C0392B,
            55vw 5vh #6B8E23,
            75vw 10vh #F39C12,
            105vw 15vh #A0522D,
            -10vw 30vh #D35400,
            40vw 25vh #F1C40F,
            60vw 20vh #228B22,
            90vw 25vh #B7410E,
            20vw 40vh #E67E22,
            5vw 45vh #8B4513,
            65vw 45vh #C0392B,
            105vw 40vh #6B8E23,
            50vw 50vh #F39C12,
            30vw 50vh #A0522D,
            10vw 55vh #D35400,
            20vw 60vh #F1C40F,
            40vw 65vh #228B22,
            60vw 60vh #B7410E,
            80vw 65vh #E67E22,
            5vw 70vh #8B4513,
            30vw 75vh #C0392B,
            55vw 85vh #6B8E23,
            75vw 80vh #F39C12,
            105vw 75vh #A0522D,
            20vw 90vh #D35400,
            -5vw 95vh #F1C40F,
            65vw 95vh #228B22,
            100vw 90vh #B7410E,
            -5vw 110vh #E67E22,
            30vw 105vh #8B4513,
            55vw 105vh #C0392B,
            75vw 110vh #6B8E23,
            105vw 115vh #F39C12,
            -10vw 130vh #A0522D,
            40vw 125vh #D35400,
            60vw 120vh #F1C40F,
            90vw 125vh #228B22,
            20vw 140vh #B7410E,
            5vw 145vh #E67E22,
            65vw 145vh #8B4513,
            105vw 140vh #C0392B,
            50vw 150vh #6B8E23,
            30vw 150vh #F39C12,
            10vw 155vh #A0522D,
            20vw 160vh #D35400,
            40vw 165vh #F1C40F,
            60vw 160vh #228B22,
            80vw 165vh #B7410E,
            5vw 170vh #E67E22,
            30vw 175vh #8B4513,
            55vw 185vh #C0392B,
            75vw 180vh #6B8E23,
            105vw 175vh #F39C12,
            20vw 190vh #A0522D,
            -5vw 195vh #D35400,
            65vw 195vh #F1C40F,
            100vw 190vh #228B22;
}

/* Layer B — rotate left, fall at 22s / 15s, delayed */
.leaves--b[b-tk4g26mx7r]:before {
    animation: leaves-fall-b-b-tk4g26mx7r 22s linear -7s infinite;
    background-color: #F39C12;
    box-shadow:
            -5vw 10vh #6B8E23,
            30vw 5vh #B7410E,
            55vw 5vh #A0522D,
            75vw 10vh #D35400,
            105vw 15vh #228B22,
            -10vw 30vh #F1C40F,
            40vw 25vh #C0392B,
            60vw 20vh #E67E22,
            90vw 25vh #8B4513,
            20vw 40vh #F39C12,
            5vw 45vh #6B8E23,
            65vw 45vh #B7410E,
            105vw 40vh #A0522D,
            50vw 50vh #D35400,
            30vw 50vh #228B22,
            10vw 55vh #F1C40F,
            20vw 60vh #C0392B,
            40vw 65vh #E67E22,
            60vw 60vh #8B4513,
            80vw 65vh #F39C12,
            5vw 70vh #6B8E23,
            30vw 75vh #B7410E,
            55vw 85vh #A0522D,
            75vw 80vh #D35400,
            105vw 75vh #228B22,
            20vw 90vh #F1C40F,
            -5vw 95vh #C0392B,
            65vw 95vh #E67E22,
            100vw 90vh #8B4513,
            -5vw 110vh #F39C12,
            30vw 105vh #6B8E23,
            55vw 105vh #B7410E,
            75vw 110vh #A0522D,
            105vw 115vh #D35400,
            -10vw 130vh #228B22,
            40vw 125vh #F1C40F,
            60vw 120vh #C0392B,
            90vw 125vh #E67E22,
            20vw 140vh #8B4513,
            5vw 145vh #F39C12,
            65vw 145vh #6B8E23,
            105vw 140vh #B7410E,
            50vw 150vh #A0522D,
            30vw 150vh #D35400,
            10vw 155vh #228B22,
            20vw 160vh #F1C40F,
            40vw 165vh #C0392B,
            60vw 160vh #E67E22,
            80vw 165vh #8B4513,
            5vw 170vh #F39C12,
            30vw 175vh #6B8E23,
            55vw 185vh #B7410E,
            75vw 180vh #A0522D,
            105vw 175vh #D35400,
            20vw 190vh #228B22,
            -5vw 195vh #F1C40F,
            65vw 195vh #C0392B,
            100vw 190vh #E67E22;
}
.leaves--b[b-tk4g26mx7r]:after {
    position: absolute;
    left: 80px;
    top: 40px;
    width: 10px;
    height: 8px;
    opacity: 0.65;
    filter: blur(2px);
    animation: leaves-fall-b-b-tk4g26mx7r 15s linear -11s infinite;
    background-color: #228B22;
    box-shadow:
            -5vw 10vh #F1C40F,
            30vw 5vh #A0522D,
            55vw 5vh #E67E22,
            75vw 10vh #6B8E23,
            105vw 15vh #C0392B,
            -10vw 30vh #8B4513,
            40vw 25vh #B7410E,
            60vw 20vh #D35400,
            90vw 25vh #F39C12,
            20vw 40vh #228B22,
            5vw 45vh #F1C40F,
            65vw 45vh #A0522D,
            105vw 40vh #E67E22,
            50vw 50vh #6B8E23,
            30vw 50vh #C0392B,
            10vw 55vh #8B4513,
            20vw 60vh #B7410E,
            40vw 65vh #D35400,
            60vw 60vh #F39C12,
            80vw 65vh #228B22,
            5vw 70vh #F1C40F,
            30vw 75vh #A0522D,
            55vw 85vh #E67E22,
            75vw 80vh #6B8E23,
            105vw 75vh #C0392B,
            20vw 90vh #8B4513,
            -5vw 95vh #B7410E,
            65vw 95vh #D35400,
            100vw 90vh #F39C12,
            -5vw 110vh #228B22,
            30vw 105vh #F1C40F,
            55vw 105vh #A0522D,
            75vw 110vh #E67E22,
            105vw 115vh #6B8E23,
            -10vw 130vh #C0392B,
            40vw 125vh #8B4513,
            60vw 120vh #B7410E,
            90vw 125vh #D35400,
            20vw 140vh #F39C12,
            5vw 145vh #228B22,
            65vw 145vh #F1C40F,
            105vw 140vh #A0522D,
            50vw 150vh #E67E22,
            30vw 150vh #6B8E23,
            10vw 155vh #C0392B,
            20vw 160vh #8B4513,
            40vw 165vh #B7410E,
            60vw 160vh #D35400,
            80vw 165vh #F39C12,
            5vw 170vh #228B22,
            30vw 175vh #F1C40F,
            55vw 185vh #A0522D,
            75vw 180vh #E67E22,
            105vw 175vh #6B8E23,
            20vw 190vh #C0392B,
            -5vw 195vh #8B4513,
            65vw 195vh #B7410E,
            100vw 190vh #D35400;
}

@keyframes leaves-fall-a-b-tk4g26mx7r { from { transform: rotate(8deg)   translateY(-100vh); } to { transform: rotate(8deg)   translateY(0); } }
@keyframes leaves-fall-b-b-tk4g26mx7r { from { transform: rotate(-13deg) translateY(-100vh); } to { transform: rotate(-13deg) translateY(0); } }

/* ── Boot slate (covers MainLayout while OnInitializedAsync is running) ── */
.shop-boot-slate[b-tk4g26mx7r] {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background:
        radial-gradient(1100px 700px at 12% 18%,
            color-mix(in srgb, var(--mud-palette-primary) 22%, transparent) 0%,
            transparent 60%),
        radial-gradient(900px 600px at 88% 82%,
            color-mix(in srgb, var(--mud-palette-info) 18%, transparent) 0%,
            transparent 60%),
        linear-gradient(135deg,
            var(--mud-palette-background) 0%,
            var(--mud-palette-background-grey) 100%);
    animation: shop-boot-fade-in-b-tk4g26mx7r 220ms ease-out both;
}

.shop-boot-orb[b-tk4g26mx7r] {
    position: absolute;
    pointer-events: none;
    will-change: transform;
}

.shop-boot-orb-1[b-tk4g26mx7r] {
    width: 520px;
    height: 520px;
    top: -180px;
    left: -160px;
    background: radial-gradient(circle at center,
        color-mix(in srgb, var(--mud-palette-primary) 55%, transparent) 0%,
        color-mix(in srgb, var(--mud-palette-primary) 18%, transparent) 35%,
        transparent 70%);
    animation: shop-boot-orb-drift-b-tk4g26mx7r 9s ease-in-out infinite alternate;
}

.shop-boot-orb-2[b-tk4g26mx7r] {
    width: 600px;
    height: 600px;
    bottom: -220px;
    right: -200px;
    background: radial-gradient(circle at center,
        color-mix(in srgb, var(--mud-palette-info) 48%, transparent) 0%,
        color-mix(in srgb, var(--mud-palette-info) 16%, transparent) 35%,
        transparent 70%);
    animation: shop-boot-orb-drift-b-tk4g26mx7r 11s ease-in-out -3s infinite alternate;
}

.shop-boot-inner[b-tk4g26mx7r] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 40px 24px;
    text-align: center;
    max-width: 360px;
}

.shop-boot-logo[b-tk4g26mx7r] {
    margin-bottom: 4px;
}

.shop-boot-text[b-tk4g26mx7r] {
    font-size: 0.78rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
    font-weight: 500;
}

.shop-boot-dots[b-tk4g26mx7r] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 24px;
}

.shop-boot-dot[b-tk4g26mx7r] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mud-palette-primary);
    box-shadow: 0 0 12px color-mix(in srgb, var(--mud-palette-primary) 55%, transparent);
    animation: shop-boot-dot-bounce-b-tk4g26mx7r 1.2s cubic-bezier(0.45, 0, 0.55, 1) infinite both;
}

.shop-boot-dot:nth-child(2)[b-tk4g26mx7r] { animation-delay: 0.16s; }
.shop-boot-dot:nth-child(3)[b-tk4g26mx7r] { animation-delay: 0.32s; }

@keyframes shop-boot-fade-in-b-tk4g26mx7r {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes shop-boot-orb-drift-b-tk4g26mx7r {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(40px, 30px, 0) scale(1.08); }
}

@keyframes shop-boot-dot-bounce-b-tk4g26mx7r {
    0%, 80%, 100% {
        transform: translateY(0) scale(0.85);
        opacity: 0.55;
    }
    40% {
        transform: translateY(-10px) scale(1);
        opacity: 1;
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-6uui2dbadv] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-6uui2dbadv] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-6uui2dbadv] {
    font-size: 1.1rem;
}

.oi[b-6uui2dbadv] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.nav-item[b-6uui2dbadv] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-6uui2dbadv] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-6uui2dbadv] {
        padding-bottom: 1rem;
    }

    .nav-item[b-6uui2dbadv]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-6uui2dbadv]  a.active {
    background-color: rgba(255,255,255,0.25);
    color: white;
}

.nav-item[b-6uui2dbadv]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-6uui2dbadv] {
        display: none;
    }

    .collapse[b-6uui2dbadv] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
}
/* /Shared/OlbLayout.razor.rz.scp.css */
.olb-page[b-bq4v2t2yyf] {
    min-height: 100vh;
    background: #0A0F1E;
    background-image:
        radial-gradient(ellipse 80% 60% at 15% -5%, rgba(74,143,212,0.28) 0%, transparent 55%),
        radial-gradient(ellipse 50% 40% at 85% 110%, rgba(6,182,212,0.14) 0%, transparent 55%);
    background-attachment: fixed;
}
/* /Shared/PublicLayout.razor.rz.scp.css */
/* Boot slate — covers public layout while CheckAuthentication is in flight,
   preventing the login/register form from flashing for users with a valid JWT. */
.public-boot-slate[b-qzjx6d0hxv] {
    position: fixed;
    inset: 0;
    z-index: 9998;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    /* Solid fallback ensures the slate is opaque the instant it renders, even
       before --mud-palette-* custom properties resolve. Without this, the
       Login form would briefly show through during the first frame. */
    background-color: #0c0c18;
    background-image:
        radial-gradient(1100px 700px at 12% 18%,
            color-mix(in srgb, var(--mud-palette-primary) 22%, transparent) 0%,
            transparent 60%),
        radial-gradient(900px 600px at 88% 82%,
            color-mix(in srgb, var(--mud-palette-info) 18%, transparent) 0%,
            transparent 60%),
        linear-gradient(135deg,
            var(--mud-palette-background) 0%,
            var(--mud-palette-background-grey) 100%);
}

.public-boot-orb[b-qzjx6d0hxv] {
    position: absolute;
    pointer-events: none;
    will-change: transform;
}

.public-boot-orb-1[b-qzjx6d0hxv] {
    width: 520px;
    height: 520px;
    top: -180px;
    left: -160px;
    background: radial-gradient(circle at center,
        color-mix(in srgb, var(--mud-palette-primary) 55%, transparent) 0%,
        color-mix(in srgb, var(--mud-palette-primary) 18%, transparent) 35%,
        transparent 70%);
    animation: public-boot-orb-drift-b-qzjx6d0hxv 9s ease-in-out infinite alternate;
}

.public-boot-orb-2[b-qzjx6d0hxv] {
    width: 600px;
    height: 600px;
    bottom: -220px;
    right: -200px;
    background: radial-gradient(circle at center,
        color-mix(in srgb, var(--mud-palette-info) 48%, transparent) 0%,
        color-mix(in srgb, var(--mud-palette-info) 16%, transparent) 35%,
        transparent 70%);
    animation: public-boot-orb-drift-b-qzjx6d0hxv 11s ease-in-out -3s infinite alternate;
}

.public-boot-inner[b-qzjx6d0hxv] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    padding: 40px 24px;
    text-align: center;
    max-width: 360px;
}

.public-boot-logo[b-qzjx6d0hxv] {
    margin-bottom: 4px;
}

.public-boot-text[b-qzjx6d0hxv] {
    font-size: 0.78rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--mud-palette-text-secondary);
    font-weight: 500;
}

.public-boot-dots[b-qzjx6d0hxv] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    height: 24px;
}

.public-boot-dot[b-qzjx6d0hxv] {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--mud-palette-primary);
    box-shadow: 0 0 12px color-mix(in srgb, var(--mud-palette-primary) 55%, transparent);
    animation: public-boot-dot-bounce-b-qzjx6d0hxv 1.2s cubic-bezier(0.45, 0, 0.55, 1) infinite both;
}

.public-boot-dot:nth-child(2)[b-qzjx6d0hxv] { animation-delay: 0.16s; }
.public-boot-dot:nth-child(3)[b-qzjx6d0hxv] { animation-delay: 0.32s; }

@keyframes public-boot-orb-drift-b-qzjx6d0hxv {
    from { transform: translate3d(0, 0, 0) scale(1); }
    to   { transform: translate3d(40px, 30px, 0) scale(1.08); }
}

@keyframes public-boot-dot-bounce-b-qzjx6d0hxv {
    0%, 80%, 100% {
        transform: translateY(0) scale(0.85);
        opacity: 0.55;
    }
    40% {
        transform: translateY(-10px) scale(1);
        opacity: 1;
    }
}
