/* _content/OmadaPay.Web/Components/Layout/AdminLayout.razor.rz.scp.css */
/* Global (platform-admin) console shell. Mirrors MainLayout's shell — scoped CSS does not cross
   component boundaries, so the admin console carries its own copy. Tier accent (violet) comes
   from the .tier-global class in app.css re-scoping --orange. */
.app-shell[b-1mvqydjtvm] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-1mvqydjtvm] {
    width: var(--sidebar-w);
    flex-shrink: 0;
    background: var(--navy-800);
    border-right: 1px solid var(--border);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.main-area[b-1mvqydjtvm] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.topbar[b-1mvqydjtvm] {
    height: var(--topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    border-bottom: 1px solid var(--border);
    background: var(--navy-800);
    position: sticky;
    top: 0;
    z-index: 10;
}

.topbar-actions[b-1mvqydjtvm] {
    display: flex;
    align-items: center;
    gap: 18px;
}

.user-chip[b-1mvqydjtvm] {
    display: flex;
    align-items: center;
    gap: 10px;
}
.avatar[b-1mvqydjtvm] {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--orange);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 13px;
}
.user-name[b-1mvqydjtvm] { font-weight: 600; font-size: 13px; }

.content[b-1mvqydjtvm] {
    padding: 28px 32px;
    flex: 1;
}

@media (max-width: 900px) {
    .sidebar[b-1mvqydjtvm] { position: fixed; z-index: 50; transform: translateX(-100%); }
}
/* _content/OmadaPay.Web/Components/Layout/AdminNavMenu.razor.rz.scp.css */
.brand[b-dx36xv1oj7] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 20px;
    height: var(--topbar-h);
    border-bottom: 1px solid var(--border);
}
.brand-mark[b-dx36xv1oj7] {
    width: 30px;
    height: 30px;
    border-radius: 7px;
    object-fit: cover;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.brand-name[b-dx36xv1oj7] {
    font-size: 19px;
    font-weight: 700;
}

/* Tier label under the wordmark — tinted with the tier accent (violet for Global). */
.console-eyebrow[b-dx36xv1oj7] {
    padding: 12px 20px 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--orange);
}

.nav-list[b-dx36xv1oj7] {
    display: flex;
    flex-direction: column;
    padding: 8px 12px;
    gap: 2px;
}

.nav-list[b-dx36xv1oj7]  .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--silver);
    border-radius: 9px;
    padding: 10px 12px;
    font-size: 13.5px;
    font-weight: 500;
}
.nav-list[b-dx36xv1oj7]  .nav-link:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--soft-white);
}
.nav-list[b-dx36xv1oj7]  .nav-link.active {
    background: color-mix(in srgb, var(--orange) 16%, transparent);
    color: var(--orange);
}
.nav-ico[b-dx36xv1oj7] {
    width: 18px;
    display: inline-flex;
    justify-content: center;
}

.promo[b-dx36xv1oj7] {
    margin: 16px 16px 24px;
    padding: 16px;
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.promo-ico[b-dx36xv1oj7] { font-size: 22px; }
.promo-title[b-dx36xv1oj7] { font-weight: 700; font-size: 14px; }
/* _content/OmadaPay.Web/Components/Layout/IsvLayout.razor.rz.scp.css */
/* ISV console shell — mobile-first: single column at every width (the tier has one surface),
   so nothing here fixes a width or forces horizontal scroll on phones. */

.isv-shell[b-txc7po8b1f] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.isv-topbar[b-txc7po8b1f] {
    min-height: var(--topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 10px 16px;
    border-bottom: 1px solid var(--border);
    background: var(--navy-800);
    position: sticky;
    top: 0;
    z-index: 10;
}

.isv-brand[b-txc7po8b1f] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.isv-brand-mark[b-txc7po8b1f] { width: 28px; height: 28px; }
.isv-brand-name[b-txc7po8b1f] { font-weight: 700; font-size: 16px; white-space: nowrap; }

.isv-tier-tag[b-txc7po8b1f] {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--orange);   /* tier accent — teal for ISV */
    background: color-mix(in srgb, var(--orange) 16%, transparent);
    border: 1px solid color-mix(in srgb, var(--orange) 40%, transparent);
    border-radius: 999px;
    padding: 3px 10px;
    white-space: nowrap;
}

.isv-content[b-txc7po8b1f] {
    flex: 1;
    padding: 16px;
}

@media (min-width: 700px) {
    .isv-topbar[b-txc7po8b1f] { padding: 0 24px; }
    .isv-content[b-txc7po8b1f] { padding: 28px 32px; }
}
/* _content/OmadaPay.Web/Components/Layout/MainLayout.razor.rz.scp.css */
.app-shell[b-4uqnkadfup] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-4uqnkadfup] {
    width: var(--sidebar-w);
    flex-shrink: 0;
    background: var(--navy-800);
    border-right: 1px solid var(--border);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.main-area[b-4uqnkadfup] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.topbar[b-4uqnkadfup] {
    height: var(--topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    border-bottom: 1px solid var(--border);
    background: var(--navy-800);
    position: sticky;
    top: 0;
    z-index: 10;
}

/* Topbar sync-health indicators are styled in SyncStatusIndicators.razor.css (own component scope). */

.topbar-actions[b-4uqnkadfup] {
    display: flex;
    align-items: center;
    gap: 18px;
}
.topbar-icon[b-4uqnkadfup] { cursor: pointer; opacity: .8; font-size: 16px; }

.user-chip[b-4uqnkadfup] {
    display: flex;
    align-items: center;
    gap: 10px;
}
.avatar[b-4uqnkadfup] {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--orange);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 13px;
}
.user-name[b-4uqnkadfup] { font-weight: 600; font-size: 13px; }

.content[b-4uqnkadfup] {
    padding: 28px 32px;
    flex: 1;
}

@media (max-width: 900px) {
    .sidebar[b-4uqnkadfup] { position: fixed; z-index: 50; transform: translateX(-100%); }
}
/* _content/OmadaPay.Web/Components/Layout/NavMenu.razor.rz.scp.css */
.brand[b-314jck9608] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 20px;
    height: var(--topbar-h);
    border-bottom: 1px solid var(--border);
}
.brand-mark[b-314jck9608] {
    width: 30px;
    height: 30px;
    border-radius: 7px;
    object-fit: cover;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.brand-name[b-314jck9608] {
    font-size: 19px;
    font-weight: 700;
}

.nav-list[b-314jck9608] {
    display: flex;
    flex-direction: column;
    padding: 12px 12px;
    gap: 1px;
}

/* Each section is a native <details> so it collapses with zero JS — works under static SSR,
   no interactive circuit needed. The active section is opened server-side (see NavMenu.razor). */
.nav-group[b-314jck9608] {
    display: flex;
    flex-direction: column;
}
.nav-group-items[b-314jck9608] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-bottom: 6px;
}

/* The <summary> is the clickable, keyboard-toggleable section header. */
.nav-section[b-314jck9608] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
    list-style: none;
    border-radius: 8px;
    font-size: 10.5px;
    letter-spacing: .8px;
    text-transform: uppercase;
    color: var(--muted);
    font-weight: 700;
    padding: 12px 12px 6px;
}
.nav-section[b-314jck9608]::-webkit-details-marker { display: none; } /* strip the default disclosure triangle */
.nav-section:hover[b-314jck9608] { color: var(--silver); }
.nav-group[open] > .nav-section[b-314jck9608] { color: var(--silver); }

.nav-caret[b-314jck9608] {
    font-size: 15px;
    line-height: 1;
    color: var(--muted);
    transition: transform .15s ease;
}
.nav-group[open] > .nav-section .nav-caret[b-314jck9608] { transform: rotate(90deg); }

/* Setup group is visually separated from the daily-work sections above it. */
.nav-group--divided[b-314jck9608] {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid var(--border);
}

.nav-list[b-314jck9608]  .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--silver);
    border-radius: 9px;
    padding: 10px 12px;
    font-size: 13.5px;
    font-weight: 500;
}
.nav-list[b-314jck9608]  .nav-link:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--soft-white);
}
.nav-list[b-314jck9608]  .nav-link.active {
    background: color-mix(in srgb, var(--orange) 14%, transparent);
    color: var(--orange);
}
.nav-ico[b-314jck9608] {
    width: 18px;
    display: inline-flex;
    justify-content: center;
}

.promo[b-314jck9608] {
    margin: 16px 16px 24px;
    padding: 16px;
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.promo-ico[b-314jck9608] { font-size: 22px; }
.promo-title[b-314jck9608] { font-weight: 700; font-size: 14px; }
/* _content/OmadaPay.Web/Components/Layout/ResellerLayout.razor.rz.scp.css */
.app-shell[b-52t9vmefby] {
    display: flex;
    min-height: 100vh;
}

.sidebar[b-52t9vmefby] {
    width: var(--sidebar-w);
    flex-shrink: 0;
    background: var(--navy-800);
    border-right: 1px solid var(--border);
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.main-area[b-52t9vmefby] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.topbar[b-52t9vmefby] {
    height: var(--topbar-h);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px;
    border-bottom: 1px solid var(--border);
    background: var(--navy-800);
    position: sticky;
    top: 0;
    z-index: 10;
}

.search[b-52t9vmefby] {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px 14px;
    width: 420px;
    max-width: 40vw;
}
.search input[b-52t9vmefby] {
    background: transparent;
    border: none;
    outline: none;
    color: var(--soft-white);
    width: 100%;
}
.search-icon[b-52t9vmefby] { opacity: .6; }

.topbar-actions[b-52t9vmefby] {
    display: flex;
    align-items: center;
    gap: 18px;
}
.topbar-icon[b-52t9vmefby] { cursor: pointer; opacity: .8; font-size: 16px; }

.user-chip[b-52t9vmefby] {
    display: flex;
    align-items: center;
    gap: 10px;
}
.avatar[b-52t9vmefby] {
    width: 36px; height: 36px;
    border-radius: 50%;
    background: var(--orange);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 700; font-size: 13px;
}
.user-name[b-52t9vmefby] { font-weight: 600; font-size: 13px; }

.content[b-52t9vmefby] {
    padding: 28px 32px;
    flex: 1;
}

@media (max-width: 900px) {
    .sidebar[b-52t9vmefby] { position: fixed; z-index: 50; transform: translateX(-100%); }
    .search[b-52t9vmefby] { width: 100%; max-width: none; }
}
/* _content/OmadaPay.Web/Components/Layout/ResellerNavMenu.razor.rz.scp.css */
.brand[b-p2mu98n1qs] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 18px 20px;
    height: var(--topbar-h);
    border-bottom: 1px solid var(--border);
}
.brand-mark[b-p2mu98n1qs] {
    width: 30px;
    height: 30px;
    border-radius: 7px;
    object-fit: cover;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}
.brand-name[b-p2mu98n1qs] {
    font-size: 19px;
    font-weight: 700;
}

/* Tier label under the wordmark — tinted with the tier accent (blue for ISO). */
.console-eyebrow[b-p2mu98n1qs] {
    padding: 12px 20px 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--orange);
}

.nav-list[b-p2mu98n1qs] {
    display: flex;
    flex-direction: column;
    padding: 12px 12px;
    gap: 2px;
}

.nav-list[b-p2mu98n1qs]  .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--silver);
    border-radius: 9px;
    padding: 10px 12px;
    font-size: 13.5px;
    font-weight: 500;
}
.nav-list[b-p2mu98n1qs]  .nav-link:hover {
    background: rgba(255, 255, 255, 0.05);
    color: var(--soft-white);
}
.nav-list[b-p2mu98n1qs]  .nav-link.active {
    background: color-mix(in srgb, var(--orange) 16%, transparent);
    color: var(--orange);
}
.nav-ico[b-p2mu98n1qs] {
    width: 18px;
    display: inline-flex;
    justify-content: center;
}

.promo[b-p2mu98n1qs] {
    margin: 16px 16px 24px;
    padding: 16px;
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 12px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.promo-ico[b-p2mu98n1qs] { font-size: 22px; }
.promo-title[b-p2mu98n1qs] { font-weight: 700; font-size: 14px; }
/* _content/OmadaPay.Web/Components/Layout/SyncStatusIndicators.razor.rz.scp.css */
/* Sync-health indicators in the topbar (green = running, gray = stopped, red = blocked/stale). */
.sync-badges[b-iv7g2ojvpl] {
    display: flex;
    align-items: center;
    gap: 18px;
}
.sync-badge[b-iv7g2ojvpl] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 8px 14px;
    font-size: 13px;
}
.sync-badge .sync-dot[b-iv7g2ojvpl] {
    width: 9px; height: 9px;
    border-radius: 50%;
    background: var(--muted);
    flex-shrink: 0;
}
.sync-badge .sync-name[b-iv7g2ojvpl] { font-weight: 600; color: var(--soft-white); }
/* The concrete system filling the role (QuickBooks, MAAS, Fiserv, Clover). */
.sync-badge .sync-prov[b-iv7g2ojvpl] {
    font-size: 12px;
    color: var(--muted);
    border-left: 1px solid var(--border);
    padding-left: 8px;
}
.sync-badge .sync-state[b-iv7g2ojvpl] { font-size: 12px; color: var(--muted); }

/* Running = green (with a gentle pulse so "live" reads at a glance). */
.sync-badge.is-running .sync-dot[b-iv7g2ojvpl] {
    background: var(--green);
    box-shadow: 0 0 0 0 rgba(34, 197, 94, .55);
    animation: sync-pulse-b-iv7g2ojvpl 2s ease-out infinite;
}
.sync-badge.is-running .sync-state[b-iv7g2ojvpl] { color: var(--green); }

/* Stopped = gray (deliberately off / not set up). */
.sync-badge.is-stopped[b-iv7g2ojvpl] { opacity: .85; }
.sync-badge.is-stopped .sync-dot[b-iv7g2ojvpl] { background: var(--muted); }

/* Blocked / stale = red (error or a running sync that went silent). */
.sync-badge.is-blocked[b-iv7g2ojvpl] {
    border-color: rgba(239, 68, 68, .45);
    background: rgba(239, 68, 68, .08);
}
.sync-badge.is-blocked .sync-dot[b-iv7g2ojvpl] { background: var(--red); }
.sync-badge.is-blocked .sync-state[b-iv7g2ojvpl] { color: var(--red); }

@keyframes sync-pulse-b-iv7g2ojvpl {
    0%   { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); }
    70%  { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
    100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

@media (max-width: 900px) {
    .sync-badge .sync-name[b-iv7g2ojvpl] { display: none; }
    .sync-badge .sync-prov[b-iv7g2ojvpl] { border-left: none; padding-left: 0; }
}
/* _content/OmadaPay.Web/Components/Pages/Admin/MerchantList.razor.rz.scp.css */
/* Merchant name = a "view as" (context-switch) link — a plain underlined text link, not a button.
   The button-chrome reset (background/border/padding) and base colour live INLINE on the element
   in MerchantList.razor, so the link looks correct even before this scoped stylesheet bundle is
   rebuilt. These rules only *enhance* it: brighten to the orange link colour on hover/focus.
   !important is required to win over the inline `color:inherit`. */
.viewas-link:hover[b-0m0k6h60i0] { color: var(--orange) !important; }
.viewas-link:focus-visible[b-0m0k6h60i0] {
    outline: 2px solid var(--orange);
    outline-offset: 2px;
    border-radius: 3px;
}
/* _content/OmadaPay.Web/Components/Pages/Home.razor.rz.scp.css */
/* Section headers between rows */
.row-head[b-so1qmv6nuu] {
    display: flex; align-items: baseline; gap: 10px;
    margin: 22px 2px 12px;
}
.row-title[b-so1qmv6nuu] { font-size: 15px; font-weight: 700; }

/* "Collections that settled" header: match the sentence-case muted labels on the other
   dashboard cards, not the shared all-caps ".ledger-eyebrow" (which stays uppercase on
   Daily Close). Scoped rule → overrides only this instance. Also stops the nested help
   popover from inheriting the uppercase transform. */
.ledger-eyebrow[b-so1qmv6nuu] {
    text-transform: none;
    letter-spacing: normal;
    font-size: 13px;
}

/* KPI cards (shared across exception / receivable / recurring rows) */
.kpi[b-so1qmv6nuu] { padding: 18px; }
.kpi-top[b-so1qmv6nuu] { display: flex; justify-content: space-between; align-items: center; }
.kpi-ico[b-so1qmv6nuu] {
    width: 34px; height: 34px; border-radius: 9px;
    background: rgba(249, 115, 22, 0.14);
    display: inline-flex; align-items: center; justify-content: center;
}
.kpi-value[b-so1qmv6nuu] { font-size: 24px; font-weight: 700; margin: 10px 0 4px; }
.kpi-alert[b-so1qmv6nuu] { box-shadow: inset 3px 0 0 var(--red); }
.dso-unit[b-so1qmv6nuu] { font-size: 14px; font-weight: 600; color: var(--muted); }

.grid-3[b-so1qmv6nuu] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.panel-head[b-so1qmv6nuu] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 14px;
}

/* ── Row 1: tie-out ledger + net highlight ─────────────────────────────── */
.tieout-row[b-so1qmv6nuu] {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 16px;
    margin-bottom: 4px;
}
.link-row[b-so1qmv6nuu] { cursor: pointer; border-radius: 8px; transition: background 0.15s ease; }
.link-row:hover[b-so1qmv6nuu] { background: rgba(249, 115, 22, 0.06); }

.net-highlight[b-so1qmv6nuu] { padding: 20px; display: flex; flex-direction: column; gap: 6px; }
.net-big[b-so1qmv6nuu] { font-size: 30px; font-weight: 800; letter-spacing: -0.5px; }
.net-mini[b-so1qmv6nuu] {
    margin-top: auto; padding-top: 14px; display: flex; gap: 24px;
    border-top: 1px solid var(--border);
}
.net-mini > div[b-so1qmv6nuu] { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }

/* ── Row 3: receivables ────────────────────────────────────────────────── */
.recv-row[b-so1qmv6nuu] {
    display: grid;
    grid-template-columns: repeat(3, 1fr) 1.4fr;
    gap: 16px;
}
/* Receivables-first (non-processing) merchants: the AR hero already carries Outstanding/Overdue/DSO,
   so this row shows only the aging panel — let it span the full width instead of a lone 1fr cell. */
.recv-row.aging-only[b-so1qmv6nuu] { grid-template-columns: 1fr; }
.aging-panel[b-so1qmv6nuu] { padding: 18px; }
.aging-bar[b-so1qmv6nuu] {
    display: flex; height: 14px; border-radius: 7px; overflow: hidden;
    background: var(--border); margin-bottom: 14px;
}
.aging-bar > span[b-so1qmv6nuu] { height: 100%; }
.aging-legend[b-so1qmv6nuu] { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.aging-legend li[b-so1qmv6nuu] { display: flex; align-items: center; gap: 8px; font-size: 12.5px; }
.aging-legend li b[b-so1qmv6nuu] { margin-left: auto; }
.age-dot[b-so1qmv6nuu] { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

.age-current[b-so1qmv6nuu] { background: var(--green); }
.age-30[b-so1qmv6nuu]      { background: #eab308; }
.age-60[b-so1qmv6nuu]      { background: var(--orange); }
.age-90[b-so1qmv6nuu]      { background: #F97316; }
.age-90plus[b-so1qmv6nuu]  { background: var(--red); }
.age-empty[b-so1qmv6nuu]   { background: var(--border); }

/* ── Trend chart ───────────────────────────────────────────────────────── */
.dash-chart[b-so1qmv6nuu] {
    display: block;
    width: 100%;
    height: 140px;
    margin-top: 8px;
    overflow: visible;
}

/* Feed lists (transactions) */
.feed[b-so1qmv6nuu] { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.feed li[b-so1qmv6nuu] { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.feed-ico[b-so1qmv6nuu] {
    width: 30px; height: 30px; border-radius: 8px;
    background: var(--navy-700);
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.feed-body[b-so1qmv6nuu] { flex: 1; }

@media (max-width: 1200px) {
    .tieout-row[b-so1qmv6nuu] { grid-template-columns: 1fr; }
    .recv-row[b-so1qmv6nuu] { grid-template-columns: repeat(2, 1fr); }
    .grid-3[b-so1qmv6nuu] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
    .recv-row[b-so1qmv6nuu], .grid-3[b-so1qmv6nuu] { grid-template-columns: 1fr; }
}
/* _content/OmadaPay.Web/Components/Pages/Integrations/QuickBooksSetupWizard.razor.rz.scp.css */
.wz-step[b-70wr36mry0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    font-size: 13px;
}

.wz-num[b-70wr36mry0] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid currentColor;
    font-size: 12px;
    font-weight: 700;
}

.wz-label[b-70wr36mry0] {
    font-weight: 600;
}

.wz-active[b-70wr36mry0] {
    color: var(--accent);
    border-color: var(--accent);
    background: rgba(249, 115, 22, 0.08);
}

.wz-done[b-70wr36mry0] {
    color: var(--text-up, #22c55e);
    border-color: rgba(34, 197, 94, 0.4);
}

.wz-done .wz-num[b-70wr36mry0] {
    background: rgba(34, 197, 94, 0.12);
}
/* _content/OmadaPay.Web/Components/Pages/Misc/Team.razor.rz.scp.css */
/* Team page — scoped styles (modal overlay + inline role select). */

.tm-modal-backdrop[b-srnnddywuh] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
    padding: 20px;
}

.tm-modal[b-srnnddywuh] {
    width: 100%;
    max-width: 460px;
    padding: 22px;
}

.tm-modal-head[b-srnnddywuh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.tm-modal-foot[b-srnnddywuh] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.tm-note[b-srnnddywuh] {
    font-size: 11px;
    margin-top: 14px;
    line-height: 1.5;
}

/* Compact inline role picker inside the grid rows. */
.tm-role-select[b-srnnddywuh] {
    height: 32px;
    padding: 2px 8px;
    font-size: 12px;
    width: auto;
    min-width: 130px;
}
/* _content/OmadaPay.Web/Components/Pages/Payments/Transactions.razor.rz.scp.css */
.txn-modal-backdrop[b-dun1ccss73] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .45);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 48px 16px;
    z-index: 1000;
    overflow-y: auto;
}

.txn-modal[b-dun1ccss73] {
    width: 100%;
    max-width: 560px;
    margin: 0;
}

.txn-modal-head[b-dun1ccss73] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.txn-grid[b-dun1ccss73] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
}

.txn-grid > div > .dc-label[b-dun1ccss73] {
    margin-bottom: 2px;
}

.txn-amounts[b-dun1ccss73] {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.txn-amounts > div[b-dun1ccss73] {
    display: flex;
    justify-content: space-between;
}

.txn-actions[b-dun1ccss73] {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

@media (max-width: 560px) {
    .txn-grid[b-dun1ccss73] {
        grid-template-columns: 1fr;
    }
}
/* _content/OmadaPay.Web/Components/Pages/Reseller/ResellerDashboard.razor.rz.scp.css */
/* Reseller dashboard layout.
   ResellerDashboard.razor reuses the class names from the main Home dashboard
   (kpi-row / grid-3 / feed / kpi …), but those rules live in Home.razor's
   *scoped* stylesheet, so they never reach this component. Without them the
   KPI cards and panels collapse to full-width stacked rows. These scoped rules
   restore the intended column layout and match the Home dashboard styling. */

/* KPI cards laid out as columns across the top (five cards, wraps gracefully). */
.kpi-row[b-jbm915psu7] {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 16px;
    margin-bottom: 16px;
}

.kpi[b-jbm915psu7] { padding: 18px; }
.kpi-top[b-jbm915psu7] { display: flex; justify-content: space-between; align-items: center; }
.kpi-ico[b-jbm915psu7] {
    width: 34px; height: 34px; border-radius: 9px;
    background: rgba(249, 115, 22, 0.14);
    display: inline-flex; align-items: center; justify-content: center;
}
.kpi-value[b-jbm915psu7] { font-size: 24px; font-weight: 700; margin: 10px 0 4px; }

/* Three information panels side-by-side. */
.grid-3[b-jbm915psu7] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.panel-head[b-jbm915psu7] {
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 14px;
}

.big-value[b-jbm915psu7] {
    font-size: 28px; font-weight: 800; letter-spacing: -0.5px;
    display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px;
}

/* Feed lists (portfolio / quick actions / month comparison). */
.feed[b-jbm915psu7] { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 14px; }
.feed li[b-jbm915psu7] { display: flex; align-items: center; gap: 12px; font-size: 13px; }
.feed-ico[b-jbm915psu7] {
    width: 30px; height: 30px; border-radius: 8px;
    background: var(--navy-700);
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.feed-body[b-jbm915psu7] { flex: 1; }

/* Responsive: collapse columns on narrower viewports. */
@media (max-width: 1200px) {
    .kpi-row[b-jbm915psu7] { grid-template-columns: repeat(3, 1fr); }
    .grid-3[b-jbm915psu7] { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 700px) {
    .kpi-row[b-jbm915psu7] { grid-template-columns: repeat(2, 1fr); }
    .grid-3[b-jbm915psu7] { grid-template-columns: 1fr; }
}
/* _content/OmadaPay.Web/Components/Pages/Scheduling/Calendar.razor.rz.scp.css */
/* ============================================================
   Calendar.razor.css — scoped styles for the scheduling calendar.
   Covers: Day/Week view toggle, time-grid (shared by both views),
   appointment blocks, stylist legend, drill-down modal.
   grid-template-columns is set via inline style per view so both
   Day (N stylist cols) and Week (7 day cols) share one .wk-grid rule.
   ============================================================ */

/* ── View toggle ─────────────────────────────────────────────── */
.sched-view-toggle[b-v2hf8vslao] {
    display: inline-flex;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

.sched-view-btn[b-v2hf8vslao] {
    background: transparent;
    color: var(--muted);
    border: none;
    padding: 8px 16px;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease;
    white-space: nowrap;
}

.sched-view-btn:hover[b-v2hf8vslao] {
    background: var(--navy-700);
    color: var(--soft-white);
}

.sched-view-btn.active[b-v2hf8vslao] {
    background: var(--orange);
    color: #fff;
}

.sched-week-label[b-v2hf8vslao] {
    font-size: 14px;
    font-weight: 600;
    color: var(--soft-white);
    white-space: nowrap;
    padding: 8px 4px;
}

/* ── Staff legend ─────────────────────────────────────────────── */
.wk-legend[b-v2hf8vslao] {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 18px;
    align-items: center;
    padding: 10px 16px;
}

.wk-legend-item[b-v2hf8vslao] {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    color: var(--silver);
}

.wk-legend-swatch[b-v2hf8vslao] {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 3px;
    flex-shrink: 0;
}

/* ── Grid outer wrapper (enables horizontal scroll on narrow screens) ── */
.wk-outer[b-v2hf8vslao] {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* ── Grid layout: time-axis + N columns (columns set inline per view) ── */
.wk-grid[b-v2hf8vslao] {
    display: grid;
    /* grid-template-columns provided inline: Day = 52px + N*140px, Week = 52px + 7*120px */
    min-width: 700px;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    background: var(--panel);
}

/* ── Time axis ───────────────────────────────────────────────── */
.wk-time-axis[b-v2hf8vslao] {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--border);
}

.wk-header-spacer[b-v2hf8vslao] {
    height: 52px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
}

.wk-hour-label[b-v2hf8vslao] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    padding: 4px 8px 0 0;
    font-size: 10.5px;
    color: var(--muted);
    flex-shrink: 0;
    border-bottom: 1px solid var(--border);
    box-sizing: border-box;
}

/* ── Shared column shell ─────────────────────────────────────── */
.wk-day-col[b-v2hf8vslao] {
    display: flex;
    flex-direction: column;
    border-right: 1px solid var(--border);
}

.wk-day-col:last-child[b-v2hf8vslao] {
    border-right: none;
}

/* ── Week view: day header (clickable, stacks day-name + day-number) ── */
.wk-day-header[b-v2hf8vslao] {
    height: 52px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    transition: background 0.12s ease;
    flex-shrink: 0;
}

.wk-day-header:hover[b-v2hf8vslao] {
    background: var(--navy-700);
}

.wk-day-name[b-v2hf8vslao] {
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--muted);
}

.wk-day-num[b-v2hf8vslao] {
    font-size: 18px;
    font-weight: 700;
    color: var(--soft-white);
    line-height: 1;
}

/* Today column highlight (week view) */
.wk-today[b-v2hf8vslao] {
    background: rgba(249, 115, 22, 0.04);
}

.wk-today-header[b-v2hf8vslao] {
    background: rgba(249, 115, 22, 0.08);
}

.wk-today-header .wk-day-name[b-v2hf8vslao] {
    color: var(--orange);
}

.wk-today-header .wk-day-num[b-v2hf8vslao] {
    color: var(--orange);
}

/* ── Day view: stylist column header ────────────────────────────
   Same 52px height as .wk-header-spacer / .wk-day-header so the
   time axis labels stay row-aligned across both views. Single row:
   color swatch + stylist name, vertically centred. */
.wk-staff-header[b-v2hf8vslao] {
    height: 52px;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 0 10px;
    border-bottom: 1px solid var(--border);
    flex-shrink: 0;
    overflow: hidden;
}

.wk-staff-name[b-v2hf8vslao] {
    font-size: 12px;
    font-weight: 700;
    color: var(--soft-white);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Day body: the timed area ────────────────────────────────── */
.wk-day-body[b-v2hf8vslao] {
    position: relative;
    overflow: hidden;
}

/* Hour gridlines */
.wk-gridline[b-v2hf8vslao] {
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background: var(--border);
    pointer-events: none;
}

/* ── Appointment blocks ──────────────────────────────────────── */
.wk-appt[b-v2hf8vslao] {
    position: absolute;
    border-left: 3px solid;   /* color set inline per staff member */
    background: rgba(255, 255, 255, 0.06);
    border-radius: 0 5px 5px 0;
    padding: 3px 5px;
    overflow: hidden;
    cursor: pointer;
    transition: background 0.12s ease, box-shadow 0.12s ease;
    box-sizing: border-box;
    min-height: 24px;
}

.wk-appt:hover[b-v2hf8vslao] {
    background: rgba(255, 255, 255, 0.12);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
    z-index: 10;
}

.wk-appt-dim[b-v2hf8vslao] {
    opacity: 0.45;
}

.wk-appt-time[b-v2hf8vslao] {
    font-size: 10px;
    color: var(--muted);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wk-appt-title[b-v2hf8vslao] {
    font-size: 11.5px;
    font-weight: 700;
    color: var(--soft-white);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.wk-appt-strikethrough[b-v2hf8vslao] {
    text-decoration: line-through;
}

.wk-appt-service[b-v2hf8vslao] {
    font-size: 10.5px;
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Modal overlay ───────────────────────────────────────────── */
.wk-modal-backdrop[b-v2hf8vslao] {
    position: fixed;
    inset: 0;
    background: rgba(6, 21, 46, 0.72);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 500;
    padding: 20px;
}

.wk-modal[b-v2hf8vslao] {
    width: 100%;
    max-width: 480px;
    border-radius: 12px;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
}

.wk-modal-header[b-v2hf8vslao] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 18px 18px 12px;
    border-bottom: 1px solid var(--border);
    gap: 12px;
}

.wk-modal-customer[b-v2hf8vslao] {
    font-size: 17px;
    font-weight: 700;
    color: var(--soft-white);
}

.wk-modal-service[b-v2hf8vslao] {
    font-size: 13px;
    color: var(--muted);
    margin-top: 2px;
}

.wk-modal-close[b-v2hf8vslao] {
    flex-shrink: 0;
    font-size: 14px;
}

.wk-modal-body[b-v2hf8vslao] {
    padding: 14px 18px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.wk-modal-row[b-v2hf8vslao] {
    display: flex;
    gap: 12px;
    align-items: baseline;
    font-size: 13px;
}

.wk-modal-label[b-v2hf8vslao] {
    width: 72px;
    flex-shrink: 0;
    font-size: 11.5px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--muted);
}

.wk-modal-notes[b-v2hf8vslao] {
    align-items: flex-start;
}

.wk-modal-notes span:last-child[b-v2hf8vslao] {
    color: var(--silver);
    line-height: 1.5;
}

.wk-modal-actions[b-v2hf8vslao] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 14px 18px 18px;
    border-top: 1px solid var(--border);
}
/* _content/OmadaPay.Web/Components/Shared/CustomerLookup.razor.rz.scp.css */
.cust-lookup[b-5drjg8fu9w] {
    position: relative;
}

.cust-search[b-5drjg8fu9w] {
    display: flex;
    gap: 8px;
    align-items: center;
}

    .cust-search .dc-input[b-5drjg8fu9w] {
        flex: 1;
    }

.cust-mini[b-5drjg8fu9w] {
    font-size: 12px;
    padding: 4px 10px;
    white-space: nowrap;
}

/* ── Results dropdown ─────────────────────────────────────────────────────── */
.cust-results[b-5drjg8fu9w] {
    position: absolute;
    z-index: 20;
    left: 0;
    right: 0;
    margin-top: 4px;
    background: var(--panel, #14161c);
    border: 1px solid var(--border, rgba(255,255,255,0.12));
    border-radius: 8px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.45);
    max-height: 320px;
    overflow-y: auto;
}

.cust-result[b-5drjg8fu9w] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    border-bottom: 1px solid var(--border, rgba(255,255,255,0.06));
    padding: 8px 12px;
    cursor: pointer;
    color: inherit;
}

    .cust-result:last-child[b-5drjg8fu9w] {
        border-bottom: none;
    }

    .cust-result:hover[b-5drjg8fu9w] {
        background: rgba(255,255,255,0.05);
    }

.cust-result-name[b-5drjg8fu9w] {
    font-weight: 600;
    font-size: 13px;
}

.cust-result-sub[b-5drjg8fu9w] {
    font-size: 12px;
    color: var(--text-muted, #8b90a0);
    display: flex;
    align-items: center;
    gap: 6px;
}

.cust-result-empty[b-5drjg8fu9w] {
    padding: 10px 12px;
    font-size: 13px;
    color: var(--text-muted, #8b90a0);
}

.cust-inline-link[b-5drjg8fu9w] {
    background: none;
    border: none;
    color: var(--accent, #6ea8fe);
    cursor: pointer;
    padding: 0;
    font: inherit;
}

/* ── Selected customer chip ───────────────────────────────────────────────── */
.cust-selected[b-5drjg8fu9w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    border: 1px solid var(--border, rgba(255,255,255,0.12));
    border-radius: 8px;
    padding: 10px 12px;
    background: rgba(255,255,255,0.02);
}

.cust-selected-main[b-5drjg8fu9w] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 14px;
}

.cust-selected-sub[b-5drjg8fu9w] {
    font-size: 12px;
    color: var(--text-muted, #8b90a0);
}

.cust-selected-actions[b-5drjg8fu9w] {
    display: flex;
    gap: 6px;
}

.cust-badge[b-5drjg8fu9w] {
    font-size: 11px;
    padding: 1px 7px;
    border-radius: 4px;
}

.cust-badge-off[b-5drjg8fu9w] {
    color: var(--muted, #9aa0ae);
    background: rgba(255,255,255,0.06);
}

/* Modal styles (.cust-modal*) are global in wwwroot/app.css — shared with Member Billing. */
/* _content/OmadaPay.Web/Components/Shared/MetricHelp.razor.rz.scp.css */
/* Anchor for the absolutely-positioned explainer card. Inline-flex so the "?" sits
   beside a KPI label or ledger row without disturbing its flow. */
.mh-root[b-0mff6bpi37] {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
    margin-left: 6px;
}

/* Smaller than the page-level PageHelp "?" — this one repeats across many figures,
   so it has to whisper. */
.mh-btn[b-0mff6bpi37] {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    opacity: 0.65;
}

.mh-btn:hover[b-0mff6bpi37],
.mh-btn:focus-visible[b-0mff6bpi37] {
    color: var(--orange);
    border-color: var(--orange);
    opacity: 1;
    outline: none;
}

/* Overlay card. Above KPI panels, grids, and the ledger accent bar. */
.mh-panel[b-0mff6bpi37] {
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    z-index: 70;
    width: min(340px, 78vw);
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 10px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
    text-align: left;
    font-weight: 400;
    /* Reset inherited text styling so the popover is never affected by an ancestor's
       casing/spacing (e.g. an all-caps ".ledger-eyebrow" header it's nested inside). */
    text-transform: none;
    letter-spacing: normal;
    cursor: default;
}

/* Hang from the right edge instead — for figures near the viewport's right side. */
.mh-panel.mh-right[b-0mff6bpi37] {
    left: auto;
    right: 0;
}

.mh-head[b-0mff6bpi37] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border);
}

.mh-title[b-0mff6bpi37] {
    font-size: 13px;
    font-weight: 700;
    color: var(--soft-white);
}

.mh-close[b-0mff6bpi37] {
    background: none;
    border: none;
    color: var(--muted);
    font-size: 12px;
    cursor: pointer;
    padding: 2px 4px;
    line-height: 1;
}

.mh-close:hover[b-0mff6bpi37] {
    color: var(--orange);
}

.mh-body[b-0mff6bpi37] {
    padding: 11px 14px 13px;
}

.mh-eyebrow[b-0mff6bpi37] {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orange);
    margin: 10px 0 4px;
}

.mh-eyebrow:first-child[b-0mff6bpi37] {
    margin-top: 0;
}

.mh-text[b-0mff6bpi37] {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.5;
    color: var(--muted);
    white-space: normal;
}
/* _content/OmadaPay.Web/Components/Shared/PageHelp.razor.rz.scp.css */
/* Anchor for the absolutely-positioned help card. Inline-flex so the "?" sits
   naturally beside the page <h1> text without breaking the heading's flow. */
.ph-root[b-314qqzllvh] {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
    margin-left: 10px;
}

.ph-btn[b-314qqzllvh] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid var(--border);
    background: var(--navy-700);
    color: var(--muted);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.ph-btn:hover[b-314qqzllvh],
.ph-btn:focus-visible[b-314qqzllvh] {
    color: var(--orange);
    border-color: var(--orange);
    outline: none;
}

/* Overlay card. High z-index so it floats over KPI panels and grids. */
.ph-panel[b-314qqzllvh] {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    z-index: 60;
    width: min(420px, 82vw);
    background: var(--navy-700);
    border: 1px solid var(--border);
    border-radius: 12px;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.5);
    text-align: left;
    font-weight: 400;
}

.ph-head[b-314qqzllvh] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
}

.ph-title[b-314qqzllvh] {
    font-size: 14.5px;
    font-weight: 700;
}

.ph-close[b-314qqzllvh] {
    background: none;
    border: none;
    color: var(--muted);
    font-size: 13px;
    cursor: pointer;
    padding: 2px 4px;
    line-height: 1;
}

.ph-close:hover[b-314qqzllvh] {
    color: var(--orange);
}

.ph-body[b-314qqzllvh] {
    padding: 14px 16px 16px;
    max-height: 62vh;
    overflow-y: auto;
}

.ph-eyebrow[b-314qqzllvh] {
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--orange);
    margin: 12px 0 5px;
}

.ph-eyebrow:first-child[b-314qqzllvh] {
    margin-top: 0;
}

.ph-text[b-314qqzllvh] {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--muted);
}

.ph-steps[b-314qqzllvh] {
    margin: 0;
    padding-left: 20px;
    font-size: 13px;
    line-height: 1.55;
    color: var(--muted);
}

.ph-steps li[b-314qqzllvh] {
    margin-bottom: 5px;
}

.ph-steps li:last-child[b-314qqzllvh] {
    margin-bottom: 0;
}