@import '_content/Planna.Portal.Shared/Planna.Portal.Shared.jtp8bfjxs4.bundle.scp.css';

/* /Layout/MainLayout.razor.rz.scp.css */
/* Customer portal layout — mobile-first PWA shell */

.customer-app[b-g63q7wmqf8] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;          /* ux-allow-vh: overridden by 100dvh below for modern browsers */
    min-height: 100dvh;         /* dynamic viewport height avoids address-bar flicker */
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: clip;
}

.customer-app main[b-g63q7wmqf8] {
    flex: 1;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: clip;
    padding-bottom: calc(56px + env(safe-area-inset-bottom) + 16px);
}

.customer-error-ui[b-g63q7wmqf8] {
    display: none;
    padding: 12px;
    background: #fef2f2;
    border-top: 2px solid #ef4444;
    text-align: center;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: var(--z-toast);
    padding-bottom: calc(12px + env(safe-area-inset-bottom));
}

.customer-error-ui__reload[b-g63q7wmqf8] {
    color: #4f46e5;
}
/* /Pages/Booking/BookingFlow.razor.rz.scp.css */
/* BookingFlow — scoped styles replacing inline styles */

.ln-flow-accent-icon[b-qbifoulfhy] {
    color: var(--accent);
}

.ln-flow-rebook[b-qbifoulfhy] {
    text-decoration: none;
}

.ln-flow-intake-hint[b-qbifoulfhy] {
    font-size: 13px;
    color: var(--text-2);
    margin-bottom: 16px;
    line-height: 1.65;
}

.ln-flow-summary-mb[b-qbifoulfhy] {
    margin-bottom: 16px;
}

.ln-flow-align-right[b-qbifoulfhy] {
    text-align: right;
}

.ln-flow-required[b-qbifoulfhy] {
    color: var(--red);
}

.ln-flow-error[b-qbifoulfhy] {
    color: var(--red);
    font-size: 13px;
    margin: 8px 0;
}

.ln-patch-warn[b-qbifoulfhy] {
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: var(--r-md);
    background: var(--amber-s);
    border: 1px solid var(--amber-border);
}

.ln-patch-warn-text[b-qbifoulfhy] {
    font-size: 13px;
    line-height: 1.5;
    color: var(--amber);
    margin: 0 0 8px;
}

.ln-patch-warn-check[b-qbifoulfhy] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--amber);
    cursor: pointer;
}

.ln-patch-warn-check input[b-qbifoulfhy] {
    accent-color: var(--amber);
}

.ln-flow-btn-link[b-qbifoulfhy] {
    text-decoration: none;
}

.ln-flow-intro-card[b-qbifoulfhy] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 12px 14px;
    margin-bottom: 16px;
    border-radius: var(--r-md);
    background: var(--bg-elev);
    border: 1px solid var(--border-2);
}

.ln-flow-footer-summary[b-qbifoulfhy] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding-right: 12px;
}

.ln-flow-footer-count[b-qbifoulfhy] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--text-3);
    line-height: 1.2;
}

.ln-flow-footer-price[b-qbifoulfhy] {
    font-size: 14px;
    font-weight: 800;
    color: var(--text-1);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ln-flow-trust-strip[b-qbifoulfhy] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 14px 0 18px;
    padding: 12px 14px;
    border-radius: var(--r-md);
    background: var(--bg-card);
    border: 1px solid var(--border-2);
}

.ln-flow-trust-item[b-qbifoulfhy] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    font-weight: 500;
    color: var(--text-2);
}

/* Note quick-pick chips — 44px touch targets */
.bf-note-chips[b-qbifoulfhy] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 8px;
}

.bf-note-chip[b-qbifoulfhy] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 6px 14px;
    font-size: 13px;
    font-weight: 600;
    color: var(--text-2);
    background: var(--bg-card);
    border: 1px solid var(--border-2);
    border-radius: 999px;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}

.bf-note-chip:hover[b-qbifoulfhy] {
    border-color: var(--accent);
    color: var(--text-1);
}
/* /Pages/Guest/GuestBookingConfirmed.razor.rz.scp.css */
@keyframes ln-check-pop-b-tg6tvp67ev {
    0%   { transform: scale(0) rotate(-20deg); opacity: 0; }
    60%  { transform: scale(1.15) rotate(4deg); opacity: 1; }
    100% { transform: none;                   opacity: 1; }
}

.ln-check-pop[b-tg6tvp67ev] {
    animation: ln-check-pop-b-tg6tvp67ev 0.5s cubic-bezier(.17,.67,.41,1.3) 0.15s backwards;
}

@keyframes ln-ring-pulse-b-tg6tvp67ev {
    0%,100% { box-shadow: 0 0 0 0 var(--green-s); }
    50%      { box-shadow: 0 0 0 10px transparent; }
}

.ln-ring-pulse[b-tg6tvp67ev] {
    animation: ln-ring-pulse-b-tg6tvp67ev 1.8s ease-out 0.5s both;
}

a[class*="btn"][b-tg6tvp67ev] {
    text-decoration: none;
}

.gc-success-bg[b-tg6tvp67ev] {
    background: var(--green-s);
}

.gc-success-icon[b-tg6tvp67ev] {
    color: var(--green);
}

.gc-title[b-tg6tvp67ev] {
    color: var(--text-1);
}

.gc-text[b-tg6tvp67ev] {
    color: var(--text-3);
}

.gc-icon-bg[b-tg6tvp67ev] {
    background: var(--accent-subtle);
}

.gc-icon-accent[b-tg6tvp67ev] {
    color: var(--accent);
}

.gc-ref[b-tg6tvp67ev] {
    color: var(--text-1);
    font-size: 15px;
}

.gc-border-accent[b-tg6tvp67ev] {
    border-color: var(--accent-ring);
}
/* /Pages/Guest/ManageGuestBooking.razor.rz.scp.css */
/* ManageGuestBooking — scoped styles replacing inline styles */

.mgb-container[b-ghaov9eit7] {
    padding-top: 24px;
    padding-bottom: 24px;
}

.mgb-title[b-ghaov9eit7] {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 20px;
}

.mgb-skeleton[b-ghaov9eit7] {
    height: 120px;
    border-radius: 12px;
}

.mgb-empty[b-ghaov9eit7] {
    color: var(--muted-fg);
    text-align: center;
}

.mgb-card[b-ghaov9eit7] {
    cursor: default;
    flex-direction: column;
    align-items: flex-start;
    margin-bottom: 24px;
}

.mgb-card-gap-sm[b-ghaov9eit7] {
    gap: 8px;
}

.mgb-card-gap-md[b-ghaov9eit7] {
    gap: 12px;
}

.mgb-card-mt[b-ghaov9eit7] {
    margin-top: 24px;
}

.mgb-meta[b-ghaov9eit7] {
    font-size: 13px;
    color: var(--muted-fg);
}

.mgb-value[b-ghaov9eit7] {
    font-weight: 700;
}

.mgb-body[b-ghaov9eit7] {
    font-size: 14px;
    margin-bottom: 12px;
}

.mgb-body-mt[b-ghaov9eit7] {
    margin-top: 8px;
}

.mgb-btn[b-ghaov9eit7] {
    width: 100%;
}

.mgb-btn-error-solid[b-ghaov9eit7] {
    width: 100%;
    margin-bottom: 8px;
    background: var(--error);
    color: white;
}

.mgb-btn-error-outline[b-ghaov9eit7] {
    width: 100%;
    border: 2px solid var(--error);
    color: var(--error);
    background: transparent;
}

.mgb-success-center[b-ghaov9eit7] {
    color: var(--success, #10b981);
    text-align: center;
    margin-top: 16px;
    font-weight: 600;
}

.mgb-success-inline[b-ghaov9eit7] {
    color: var(--success, #10b981);
    font-size: 14px;
    font-weight: 600;
}

.mgb-error-inline[b-ghaov9eit7] {
    color: var(--error);
    font-size: 14px;
}

a[class*="customer-btn"][b-ghaov9eit7] {
    text-decoration: none;
}

.mgb-btn-center[b-ghaov9eit7] {
    width: 100%;
    text-align: center;
}
/* /Pages/Home.razor.rz.scp.css */
/* Home — scoped styles replacing inline styles */

.hm-error-center[b-p7ll3fuvjm] {
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
/* /Pages/Landing/LandingFooter.razor.rz.scp.css */
/* LandingFooter — scoped styles replacing inline styles */

.lf-cta-center[b-uict26xuoh] {
    justify-content: center;
}
/* /Pages/Landing/LandingHero.razor.rz.scp.css */
/* LandingHero — scoped styles replacing inline styles */

.lh-chevron[b-44pqspb4g8] {
    color: var(--text-1);
}

.lh-express-card[b-44pqspb4g8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    width: 100%;
    max-width: 520px;
    margin: 1rem auto 0;
    padding: 0.875rem 1.125rem;
    border-radius: 16px;
    background: var(--bg-card, rgba(255, 255, 255, 0.88));
    border: 1px solid var(--border-2, rgba(109, 74, 255, 0.22));
    box-shadow: 0 10px 30px -10px rgba(17, 17, 16, 0.08);
    backdrop-filter: blur(12px);
    text-align: left;
}

.lh-express-info[b-44pqspb4g8] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 180px;
    flex: 1;
}

.lh-express-badge[b-44pqspb4g8] {
    font-size: 0.6875rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--accent, #6D4AFF);
}

.lh-express-title[b-44pqspb4g8] {
    font-size: 0.9375rem;
    font-weight: 700;
    color: var(--text-1, #111110);
}

.lh-express-sub[b-44pqspb4g8] {
    font-size: 0.8125rem;
    color: var(--text-2, #4A4A4A);
}

.lh-express-cta[b-44pqspb4g8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    padding: 0.5rem 1rem;
    border-radius: 9999px;
    background: var(--accent, #6D4AFF);
    color: #FFFFFF;
    font-size: 0.8125rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    white-space: nowrap;
    transition: transform 120ms ease, opacity 150ms ease;
}

.lh-express-cta:hover[b-44pqspb4g8] {
    transform: translateY(-1px);
    opacity: 0.95;
}
/* /Pages/Landing/LandingNavbar.razor.rz.scp.css */
/* LandingNavbar — scoped styles replacing inline styles */

.ln-nav-group[b-5cygmmw73x] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ln-nav-relative[b-5cygmmw73x] {
    position: relative;
}
/* /Pages/MyBookings/BookingDetail.razor.rz.scp.css */
/* BookingDetail — scoped styles replacing inline styles */

.bd-icon-bg[b-j46dnyby45] {
    background: var(--accent-subtle);
}

.bd-icon-accent[b-j46dnyby45] {
    color: var(--accent);
}

.bd-value[b-j46dnyby45] {
    color: var(--text-1);
}

.bd-note[b-j46dnyby45] {
    color: var(--text-2);
}

.bd-meta[b-j46dnyby45] {
    color: var(--text-3);
}

.bd-border-accent[b-j46dnyby45] {
    border-color: var(--accent-ring);
}

.bd-border-error[b-j46dnyby45] {
    border-color: var(--error-ring, var(--error));
}

.bd-input[b-j46dnyby45] {
    border-color: var(--border-1);
    background: var(--bg-inset);
    color: var(--text-1);
}

.bd-btn-accent-outline[b-j46dnyby45] {
    border: 2px solid var(--accent);
    color: var(--accent);
    background: transparent;
}

.bd-btn-error-solid[b-j46dnyby45] {
    background: var(--error);
    color: #fff;
    border-color: var(--error);
}

.bd-btn-error-outline[b-j46dnyby45] {
    border: 2px solid var(--error);
    color: var(--error);
    background: transparent;
}

.bd-success[b-j46dnyby45] {
    color: var(--success, #10b981);
}

a[class*="btn"][b-j46dnyby45] {
    text-decoration: none;
}
/* /Pages/MyBookings/BookingHistory.razor.rz.scp.css */
/* BookingHistory — scoped styles replacing inline styles */

.bh-retention[b-3u912bx9f5] {
    border-color: var(--accent-ring);
}

.bh-retention-text[b-3u912bx9f5] {
    color: var(--text-3);
}

.bh-link[b-3u912bx9f5] {
    text-decoration: none;
}

.bh-card-h[b-3u912bx9f5] {
    margin-bottom: 10px;
}
/* /Pages/NotFound.razor.rz.scp.css */
/* NotFound — scoped styles replacing inline styles */

.nf-title[b-ze8d5g59ok] {
    color: var(--text-1);
}

.nf-text[b-ze8d5g59ok] {
    color: var(--text-3);
}

.nf-link[b-ze8d5g59ok] {
    text-decoration: none;
}
/* /Pages/Profile/CustomerProfile.razor.rz.scp.css */
/* CustomerProfile — scoped styles replacing inline styles */

a[class*="btn"][b-kt61e9timq] {
    text-decoration: none;
}

.cp-delete-link[b-kt61e9timq] {
    color: var(--error);
    border-color: var(--error);
    text-decoration: none;
    background: transparent;
}
/* /Pages/Profile/NotificationSettings.razor.rz.scp.css */
/* NotificationSettings — scoped styles replacing inline styles */

.ns-link[b-u17plvlg3r] {
    text-decoration: none;
}
/* /Shared/BookingCard.razor.rz.scp.css */
/* BookingCard — scoped styles replacing inline styles */

.bc-link[b-xlphnkquoc] {
    text-decoration: none;
}

.bc-h[b-xlphnkquoc] {
    margin-bottom: 10px;
}

.bc-service[b-xlphnkquoc] {
    font-weight: 500;
}

.bc-staff[b-xlphnkquoc] {
    margin-top: 2px;
}

.bc-price[b-xlphnkquoc] {
    margin-top: 4px;
}

.bc-cancel[b-xlphnkquoc] {
    background: var(--red-s);
    color: var(--red);
    border: 1px solid var(--red);
    touch-action: manipulation;
}
/* /Shared/ReschedulePicker.razor.rz.scp.css */
/* ReschedulePicker — customer-facing slot picker. Mirrors the internal
   RebookPicker layout on customer theme tokens. */

.rp[b-vpuzvp5aab] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* ── Quick-picks ── */
.rp-quick[b-vpuzvp5aab] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.rp-quick-card[b-vpuzvp5aab] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 10px 8px;
    min-height: 64px;
    border: 1px solid var(--border-1);
    border-radius: var(--r-md, 12px);
    background: var(--bg-card);
    color: var(--text-1);
    cursor: pointer;
    font-family: inherit;
    transition: border-color 0.15s, background 0.15s, transform 0.1s;
}

.rp-quick-card:active[b-vpuzvp5aab] { transform: scale(0.97); }
.rp-quick-card:not(:disabled):hover[b-vpuzvp5aab] {
    border-color: var(--accent);
    background: var(--accent-subtle);
}
.rp-quick-card:disabled[b-vpuzvp5aab] { opacity: 0.55; cursor: default; }
.rp-quick-card--sel[b-vpuzvp5aab] {
    border-color: var(--accent);
    background: var(--accent-subtle);
}

.rp-quick-label[b-vpuzvp5aab] { font-size: 12px; font-weight: 700; }
.rp-quick-day[b-vpuzvp5aab] { font-size: 11px; color: var(--text-3); }
.rp-quick-time[b-vpuzvp5aab] { font-size: 13px; font-weight: 600; }
.rp-quick-time--none[b-vpuzvp5aab] { color: var(--text-3); font-weight: 500; }

/* ── Week strip ── */
.rp-week-head[b-vpuzvp5aab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}
.rp-week-title[b-vpuzvp5aab] { font-size: 13px; font-weight: 700; color: var(--text-1); text-transform: capitalize; }
.rp-week-nav[b-vpuzvp5aab] { display: flex; gap: 4px; }
.rp-nav[b-vpuzvp5aab] {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-1);
    border-radius: 10px;
    background: var(--bg-card);
    color: var(--text-2);
    cursor: pointer;
}
.rp-nav:not(:disabled):hover[b-vpuzvp5aab] { border-color: var(--accent); color: var(--text-1); }
.rp-nav:disabled[b-vpuzvp5aab] { opacity: 0.4; cursor: default; }

.rp-days[b-vpuzvp5aab] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}
.rp-day-lbl[b-vpuzvp5aab] {
    text-align: center;
    font-size: 10px;
    font-weight: 700;
    color: var(--text-3);
    text-transform: uppercase;
    padding-bottom: 2px;
}
.rp-day[b-vpuzvp5aab] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 7px 2px;
    min-height: 44px;
    border: 1px solid var(--border-1);
    border-radius: 10px;
    background: var(--bg-card);
    color: var(--text-1);
    cursor: pointer;
    font-family: inherit;
}
.rp-day:not(:disabled):hover[b-vpuzvp5aab] { border-color: var(--accent); }
.rp-day:disabled[b-vpuzvp5aab] { opacity: 0.45; cursor: default; }
.rp-day--today[b-vpuzvp5aab] { border-color: var(--accent); }
.rp-day--sel[b-vpuzvp5aab] {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--text-on-accent);
}
.rp-day--sel .rp-day-meta[b-vpuzvp5aab] { color: var(--text-on-accent); opacity: 0.85; }
.rp-day-num[b-vpuzvp5aab] { font-size: 14px; font-weight: 700; line-height: 1; }
.rp-day-meta[b-vpuzvp5aab] { font-size: 9px; font-weight: 600; color: var(--text-3); text-transform: uppercase; }

/* ── Slots ── */
.rp-daypart[b-vpuzvp5aab] {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--text-3);
    margin: 8px 0 6px;
}
.rp-slot-grid[b-vpuzvp5aab] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
    gap: 6px;
}
.rp-slot[b-vpuzvp5aab] {
    min-height: 44px;
    padding: 8px 4px;
    border: 1px solid var(--border-1);
    border-radius: 10px;
    background: var(--bg-card);
    color: var(--text-1);
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s;
}
.rp-slot:not(:disabled):hover[b-vpuzvp5aab] { border-color: var(--accent); }
.rp-slot--sel[b-vpuzvp5aab] {
    background: var(--accent);
    border-color: var(--accent);
    color: var(--text-on-accent);
}
.rp-empty[b-vpuzvp5aab] {
    font-size: 13px;
    color: var(--text-2);
    text-align: center;
    padding: 14px 0;
}

/* ── Skeletons ── */
.rp-skel[b-vpuzvp5aab] {
    position: relative;
    overflow: hidden;
    background: var(--bg-elev);
    border-radius: 10px;
}
.rp-skel[b-vpuzvp5aab]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.35), transparent);
    animation: rp-shimmer-b-vpuzvp5aab 1.4s infinite;
}
.rp-quick-card.rp-skel[b-vpuzvp5aab] { min-height: 64px; }
.rp-slot-skel[b-vpuzvp5aab] { height: 44px; }

@keyframes rp-shimmer-b-vpuzvp5aab {
    from { transform: translateX(-100%); }
    to { transform: translateX(100%); }
}

@media (prefers-reduced-motion: reduce) {
    .rp-quick-card[b-vpuzvp5aab], .rp-slot[b-vpuzvp5aab] { transition: none; }
    .rp-skel[b-vpuzvp5aab]::after { animation: none; }
}

/* Landscape phones: compress quick-picks */
@media (orientation: landscape) and (max-height: 500px) {
    .rp-quick-card[b-vpuzvp5aab] { min-height: 52px; padding: 6px 8px; }
    .rp-day[b-vpuzvp5aab] { min-height: 40px; }
    .rp-slot[b-vpuzvp5aab] { min-height: 40px; }
}