﻿/* Side menu width for fixed bars: left: var(--sidebar-w). 0 on mobile (drawer overlays). */
:root { --sidebar-w: 0px; }
@media (min-width: 768px) and (min-height: 500.02px), (min-width: 768px) and (hover: hover), (min-width: 768px) and (pointer: fine) {
    :root { --sidebar-w: 260px; }
    html.pm-rail-on { --sidebar-w: 72px; }
}
/* Site.Master shell: collapsible side menu (icon rail), top bar with global search, Create New panel. */

/* ---- Create New button (top of the side menu) ---- */
#sidebar .pm-create-wrap { padding: 0.25rem 1.25rem 0.5rem; flex-shrink: 0; }
#sidebar .pm-create-btn {
    display: flex; align-items: center; justify-content: flex-start; gap: 12px; width: 100%;
    height: 44px; background: #4a5568; border: 0; color: #ffffff; font-weight: 600; font-size: 0.92rem; line-height: 1;
    border-radius: 8px; padding: 0 1rem; cursor: pointer; touch-action: manipulation; box-shadow: none;
}
@media (hover: hover) and (pointer: fine) {
    #sidebar .pm-create-btn:hover { background: #2d3748; color: #ffffff; }
    #sidebar .pm-create-btn:active { background: #1a202c; color: #ffffff; }
}
#sidebar .pm-create-btn:focus { outline: none; }
#sidebar .pm-create-btn:focus-visible { background: #2d3748; color: #ffffff; outline: 2px solid #a0aec0; outline-offset: 2px; }
#sidebar .pm-create-btn i { font-size: 1.2rem; width: 24px; text-align: center; color: #ffffff; }

/* ---- Rail toggle (desktop only) ---- */
#sidebar .pm-rail-toggle {
    display: none; align-items: center; justify-content: center; width: 32px; height: 32px;
    background: #00334d; border: 0; color: #cbd5e0; border-radius: 8px; cursor: pointer; flex-shrink: 0;
}
@media (hover: hover) and (pointer: fine) { #sidebar .pm-rail-toggle:hover { background: #004466; color: #fff; } }
#sidebar .pm-rail-icon { display: none; }

/* ---- Top bar (content area) ---- */
.pm-topbar {
    position: fixed; top: 0; right: 0; left: var(--sidebar-w); z-index: 1040; height: 60px;
    display: flex; align-items: center; gap: 0.75rem;
    background: var(--pm-bg-ffffff, #ffffff); border-bottom: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); padding: 0.6rem 1.5rem; min-height: 58px;
}
.pm-search { position: relative; flex: 1 1 auto; max-width: 560px; }
.pm-search > i.bi-search { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--pm-fg-6b7280, #6b7280); pointer-events: none; }
.pm-search input {
    width: 100%; height: 40px; border: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 8px; background: var(--pm-bg-f9fafb, #f9fafb);
    padding: 0 2.25rem 0 2.25rem; font-size: 0.95rem; color: var(--pm-fg-111827, #111827); outline: none;
}
.pm-search input:focus { border-color: #4a5568; background: var(--pm-bg-fff, #fff); box-shadow: 0 0 0 3px rgba(74,85,104,0.15); }
.pm-search .pm-search-clear {
    position: absolute; right: 6px; top: 50%; transform: translateY(-50%); border: 0; background: transparent;
    color: var(--pm-fg-6b7280, #6b7280); width: 30px; height: 30px; border-radius: 6px; display: none; cursor: pointer;
}
.pm-search.has-text .pm-search-clear { display: block; }
.pm-search-results {
    position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 1100;
    background: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,0.15);
    max-height: min(70vh, 520px); overflow-y: auto; -webkit-overflow-scrolling: touch; display: none; color: var(--pm-fg-111827, #111827);
}
.pm-search-results.open { display: block; }
.pm-sr-group { font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; color: var(--pm-fg-6b7280, #6b7280); text-transform: uppercase; padding: 0.7rem 1rem 0.3rem; }
.pm-sr-item, .pm-sr-item:link, .pm-sr-item:visited {
    display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 1rem; color: var(--pm-fg-111827, #111827); text-decoration: none; cursor: pointer;
}
.pm-sr-item.active { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); }

@media (hover: hover) and (pointer: fine) { .pm-sr-item:hover { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); } }
.pm-sr-icon { width: 34px; height: 34px; border-radius: 8px; background: var(--pm-bg-eef2f7, #eef2f7); color: var(--pm-fg-4a5568, #4a5568); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.pm-sr-text { min-width: 0; }
.pm-sr-title { font-weight: 600; font-size: 0.92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-sr-sub { font-size: 0.8rem; color: var(--pm-fg-6b7280, #6b7280); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-sr-tag { font-size: 0.7rem; background: var(--pm-bg-e5e7eb, #e5e7eb); color: var(--pm-fg-374151, #374151); border-radius: 999px; padding: 0 0.45rem; margin-left: 0.35rem; font-weight: 600; }
.pm-sr-msg { padding: 0.9rem 1rem; color: var(--pm-fg-6b7280, #6b7280); font-size: 0.9rem; }
.pm-sr-msg.err { color: #b91c1c; }

@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-topbar { padding: 0.5rem 0.75rem; position: sticky; left: 0; height: auto; }
    #page-content-wrapper.pm-has-topbar { padding-top: 0; }
    .pm-acct-text, .pm-acct-chev { display: none !important; }
    .pm-acct-btn { padding: 2px !important; }
    .pm-acct-menu { position: fixed !important; top: 64px !important; right: 8px !important; left: auto !important; }
    .pm-search { max-width: none; }
    .pm-search input { font-size: 16px !important; }
    .pm-search-results { position: fixed; left: 8px; right: 8px; top: auto; margin-top: 6px; max-height: 65vh; }
}

/* ---- Desktop icon rail ---- */
@media (min-width: 768px) and (min-height: 500.02px), (min-width: 768px) and (hover: hover), (min-width: 768px) and (pointer: fine) {
    #sidebar .pm-rail-toggle { display: inline-flex; }
    #sidebar { transition: width 0.2s ease, min-width 0.2s ease, max-width 0.2s ease !important; }
    #page-content-wrapper { transition: margin-left 0.2s ease, width 0.2s ease !important; }

    /* css/StyleSheet.css pins #sidebar min-width/max-width 250px; override all three. */
    #sidebar { min-width: 0 !important; max-width: none !important; margin-left: 0 !important; }
    #wrapper.pm-rail #sidebar { width: 72px !important; min-width: 72px !important; max-width: 72px !important; overflow-x: visible !important; }
    #wrapper.pm-rail #page-content-wrapper { margin-left: 72px !important; width: calc(100% - 72px) !important; }

    #wrapper.pm-rail #pmSideHead { flex-direction: column; gap: 0.6rem; padding: 1rem 0.5rem !important; }
    #wrapper.pm-rail #pmSideHead .brand-text { display: none !important; }
    #wrapper.pm-rail #pmSideHead .logo-icon-box { margin-right: 0 !important; }
    #wrapper.pm-rail #pmRailToggle i { transform: rotate(180deg); }

    #wrapper.pm-rail #sidebar .pm-create-wrap { padding: 0.25rem 0.6rem 0.5rem; }
    #wrapper.pm-rail #sidebar .pm-create-btn { width: 44px; height: 44px; padding: 0; margin: 0 auto; justify-content: center; gap: 0; }
    #wrapper.pm-rail #sidebar .pm-create-btn span { display: none; }

    #wrapper.pm-rail #sidebarNav { padding-left: 0 !important; padding-right: 0 !important; overflow-x: hidden !important; }
    #wrapper.pm-rail #sidebar .sidebar-link {
        font-size: 0 !important; justify-content: center !important; padding: 0.6rem 0 !important; margin: 0.12rem 0.6rem !important;
    }
    #wrapper.pm-rail #sidebar .sidebar-link i { margin-right: 0 !important; font-size: 1.2rem !important; }
    #wrapper.pm-rail #sidebar .nav-group-label:not(.pm-sys-toggle) { display: none !important; }
    #wrapper.pm-rail #sidebar .pm-sys-toggle { justify-content: center !important; padding: 0.6rem 0 !important; color: #cbd5e0 !important; }
    #wrapper.pm-rail #sidebar .pm-sys-toggle > span, #wrapper.pm-rail #sidebar .pm-sys-chevron { display: none !important; }
    #wrapper.pm-rail #sidebar .pm-rail-icon { display: inline-block; font-size: 1.2rem; }
    #wrapper.pm-rail #sidebar .pm-sys-actions { background: rgba(255,255,255,0.04); border-radius: 8px; margin: 0 0.4rem; }
    #wrapper.pm-rail #sidebar .account-trigger { justify-content: center !important; padding: 1rem 0 !important; }
    #wrapper.pm-rail #sidebar .account-trigger i { margin-right: 0 !important; font-size: 1.25rem !important; }
    #wrapper.pm-rail #sidebar .account-trigger .bi-caret-right-fill { display: none; }
    #wrapper.pm-rail #sidebar .account-popout .sidebar-link { font-size: 0.875rem !important; justify-content: flex-start !important; padding: 0.55rem 1rem !important; }
    #wrapper.pm-rail #sidebar .account-popout .sidebar-link i { margin-right: 12px !important; }
    /* Expandable parents (Payments, Money, Manage) and their children: same centered column as plain links. */
    #wrapper.pm-rail #sidebar .pm-pay-toggle { width: auto !important; display: flex !important; justify-content: center !important; text-align: center !important; }
    #wrapper.pm-rail #sidebar .pm-pay-toggle .pm-pay-label, #wrapper.pm-rail #sidebar .pm-pay-chevron { display: none !important; }
    #wrapper.pm-rail #sidebar .pm-pay-group .sidebar-link { margin: 0.12rem 0.6rem !important; padding: 0.6rem 0 !important; justify-content: center !important; }
}

/* ---- Create New panel ---- */
.pm-create-backdrop { display: none; position: fixed; inset: 0; background: rgba(0,26,44,0.45); z-index: 1075; }
.pm-create-panel {
    display: none; position: fixed; z-index: 1080; top: 12px; left: 272px; width: min(640px, calc(100vw - 284px));
    max-height: calc(100vh - 24px); max-height: calc(100dvh - 24px);
    background: var(--pm-bg-fff, #fff); border-radius: 10px; box-shadow: 0 20px 48px rgba(0,0,0,0.3); flex-direction: column; overflow: hidden; color: var(--pm-fg-111827, #111827);
}
html.pm-rail-on .pm-create-panel { left: 84px; width: min(640px, calc(100vw - 96px)); }
html.pm-create-open .pm-create-backdrop { display: block; }
html.pm-create-open .pm-create-panel { display: flex; }
.pm-create-head { background: #4a5568; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 0.8rem 1rem; flex-shrink: 0; }
.pm-create-head h2 { font-size: 1.05rem; font-weight: 600; margin: 0; color: #fff; }
.pm-create-head .btn-close { filter: invert(1) grayscale(100%) brightness(200%); opacity: 0.85; }
.pm-create-body { overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 0.75rem 1.25rem 1rem; flex: 1 1 auto; min-height: 0; }
.pm-create-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.25rem 2rem; }
.pm-create-sec h3 { font-size: 0.8rem; font-weight: 700; color: var(--pm-fg-4a5568, #4a5568); text-transform: uppercase; letter-spacing: 0.05em; border-bottom: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); padding: 0.75rem 0 0.4rem; margin: 0 0 0.25rem; }
.pm-create-item, .pm-create-item:link, .pm-create-item:visited {
    display: flex; align-items: center; gap: 0.7rem; width: 100%; padding: 0.55rem 0.5rem; border-radius: 8px; border: 0; background: transparent;
    color: var(--pm-fg-1f2937, #1f2937); text-decoration: none; font-size: 0.95rem; text-align: left; cursor: pointer;
}
.pm-create-item:focus-visible { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); }

@media (hover: hover) and (pointer: fine) { .pm-create-item:hover { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); } }
.pm-create-item i { font-size: 1.1rem; color: var(--pm-fg-4a5568, #4a5568); width: 22px; text-align: center; }
.pm-create-item small { display: block; color: var(--pm-fg-6b7280, #6b7280); font-size: 0.78rem; }
.pm-create-foot { border-top: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); padding: 0.7rem 1rem; display: flex; justify-content: flex-end; gap: 0.5rem; flex-shrink: 0; }
.pm-btn-solid-gray { background: var(--pm-bg-e5e7eb, #e5e7eb); border: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); color: var(--pm-fg-1f2937, #1f2937); border-radius: 8px; padding: 0.45rem 1rem; font-weight: 600; }
.pm-btn-solid-gray:hover { background: var(--pm-bg-d1d5db, #d1d5db); border-color: var(--pm-bd-d1d5db, #d1d5db); color: var(--pm-fg-1f2937, #1f2937); }
.pm-btn-solid-light { background: var(--pm-bg-f3f4f6, #f3f4f6); border: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); color: var(--pm-fg-1f2937, #1f2937); border-radius: 8px; padding: 0.45rem 1rem; font-weight: 600; }
.pm-btn-solid-light:hover { background: var(--pm-bg-e5e7eb, #e5e7eb); }
.pm-pick { display: none; }
.pm-create-panel.picking .pm-create-grid { display: none; }
.pm-create-panel.picking .pm-pick { display: block; }
.pm-pick p { margin: 0.5rem 0 0.75rem; color: var(--pm-fg-374151, #374151); }
.pm-pick .pm-search { max-width: none; }
.pm-pick .pm-search-results { position: static; display: block; box-shadow: none; border: 0; max-height: none; margin-top: 0.5rem; }

@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-create-panel, html.pm-rail-on .pm-create-panel { left: 8px; right: 8px; top: 8px; width: auto; max-height: calc(100dvh - 16px); }
    .pm-create-grid { grid-template-columns: 1fr; }
    .pm-create-item { padding: 0.7rem 0.5rem; font-size: 1rem; }
}

/* ---- Fixed top bar offset ---- */
@media (min-width: 768px) and (min-height: 500.02px), (min-width: 768px) and (hover: hover), (min-width: 768px) and (pointer: fine) {
    #page-content-wrapper.pm-has-topbar { padding-top: 60px; }
    .pm-topbar { transition: left 0.2s ease; }
}

/* ---- Top-bar account menu ---- */
.pm-acct { position: relative; margin-left: auto; flex-shrink: 0; }
.pm-acct-btn {
    display: flex; align-items: center; gap: 0.6rem; background: transparent; border: 0; border-radius: 10px;
    padding: 4px 8px; cursor: pointer; color: var(--pm-fg-111827, #111827); text-align: left; max-width: 300px;
}
.pm-acct-btn:hover, .pm-acct.open .pm-acct-btn { background: var(--pm-bg-f3f4f6, #f3f4f6); }
.pm-avatar {
    width: 38px; height: 38px; border-radius: 50%; background: #4a5568; color: #fff; font-weight: 700; font-size: 0.9rem;
    display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; letter-spacing: 0.02em;
}
.pm-acct-text { display: flex; flex-direction: column; min-width: 0; line-height: 1.2; }
.pm-acct-name { font-weight: 700; font-size: 0.92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-acct-sub { font-size: 0.78rem; color: var(--pm-fg-6b7280, #6b7280); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pm-acct-chev { color: var(--pm-fg-6b7280, #6b7280); font-size: 0.85rem; transition: transform 0.15s ease; }
.pm-acct.open .pm-acct-chev { transform: rotate(180deg); }
.pm-acct-menu {
    display: none; position: absolute; right: 0; top: calc(100% + 6px); min-width: 250px; z-index: 1100;
    background: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,0.15); padding: 0.4rem; color: var(--pm-fg-111827, #111827);
}
.pm-acct.open .pm-acct-menu { display: block; }
.pm-acct-head { display: flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.6rem 0.7rem; border-bottom: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); margin-bottom: 0.3rem; }
.pm-acct-head strong { display: block; font-size: 0.92rem; }
.pm-acct-head small { display: block; color: var(--pm-fg-6b7280, #6b7280); font-size: 0.78rem; }
.pm-acct-menu ul { list-style: none; margin: 0; padding: 0; }
.pm-acct-sep { border-top: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); margin-top: 0.3rem; padding-top: 0.3rem; }
.pm-acct-link, .pm-acct-link:link, .pm-acct-link:visited {
    display: flex; align-items: center; padding: 0.55rem 0.6rem; border-radius: 8px; color: var(--pm-fg-1f2937, #1f2937); text-decoration: none; font-size: 0.92rem;
}
.pm-acct-link:hover { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); }
.pm-acct-link i { color: var(--pm-fg-4a5568, #4a5568); }
.pm-acct-danger, .pm-acct-danger:link, .pm-acct-danger:visited, .pm-acct-danger i { color: #b91c1c !important; }

/* ---- Search result rows: name line, then muted address line; wrap instead of jamming ---- */
.pm-sr-title, .pm-sr-sub { display: block; }
.pm-sr-text { flex: 1 1 auto; }
.pm-sr-tag { display: inline-block; vertical-align: 1px; }
.pm-tb-spacer { flex: 1 1 auto; }
.pm-tb-icon { display: none; }
@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-sr-title { white-space: normal; overflow-wrap: anywhere; line-height: 1.3; }
    .pm-sr-sub { white-space: normal; overflow-wrap: anywhere; }
    .pm-sr-item { align-items: flex-start; padding: 0.65rem 0.9rem; }
}

/* ---- Collapsed-rail hover labels (custom; native titles removed) ---- */
.pm-rail-tip {
    position: fixed; z-index: 2000; pointer-events: none; left: 0; top: 0;
    background: #111827; color: #fff; font-size: 13px; font-weight: 500; line-height: 1.2; white-space: nowrap;
    padding: 6px 10px; border-radius: 6px; box-shadow: 0 4px 14px rgba(0,0,0,0.25);
    opacity: 0; transform: translate(-4px, -50%); transition: opacity 0.12s ease, transform 0.12s ease;
}
.pm-rail-tip::before {
    content: ""; position: absolute; left: -5px; top: 50%; margin-top: -5px;
    border-style: solid; border-width: 5px 5px 5px 0; border-color: transparent #111827 transparent transparent;
}
.pm-rail-tip.show { opacity: 1; transform: translate(0, -50%); }

/* ---- Mobile: one dark fixed header (hamburger, search, + New, avatar) ---- */
.pm-drawer-close {
    display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
    background: #00334d; border: 0; border-radius: 8px; color: #e2e8f0; font-size: 1rem;
}
@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    #page-content-wrapper.pm-has-topbar .mobile-topbar { display: none !important; }
    #page-content-wrapper.pm-has-topbar { padding-top: calc(56px + env(safe-area-inset-top, 0px)); }
    .pm-topbar {
        position: fixed !important; top: 0; left: 0 !important; right: 0; height: auto !important;
        min-height: calc(56px + env(safe-area-inset-top, 0px));
        padding: env(safe-area-inset-top, 0px) calc(10px + env(safe-area-inset-right, 0px)) 0 calc(6px + env(safe-area-inset-left, 0px)) !important;
        background: #001a2c; border-bottom: 1px solid #002d4d; gap: 4px; z-index: 1050;
    }
    .pm-tb-icon {
        display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex-shrink: 0;
        background: transparent; border: 0; border-radius: 8px; color: #fff; font-size: 1.35rem;
    }
    .pm-tb-icon:active { background: rgba(255,255,255,0.12); }
    .pm-topbar > .pm-search { display: none; }
    html.pm-msearch .pm-topbar > .pm-search {
        display: flex; align-items: center; position: absolute; left: 0; right: 0; bottom: 0; height: 56px; max-width: none;
        padding: 0 calc(10px + env(safe-area-inset-right, 0px)) 0 calc(4px + env(safe-area-inset-left, 0px)); background: #001a2c; z-index: 2;
    }
    html.pm-msearch .pm-topbar > .pm-search > i.bi-search { left: 58px; }
    html.pm-msearch .pm-topbar > .pm-search input { flex: 1 1 auto; height: 40px; padding-left: 2.1rem; background: var(--pm-bg-fff, #fff); border-color: #fff; }
    html.pm-msearch .pm-topbar > .pm-search .pm-search-clear { right: 14px; }
    .pm-search-back { display: inline-flex; }
    .pm-topbar .pm-search-results {
        position: fixed; left: 8px; right: 8px; top: calc(62px + env(safe-area-inset-top, 0px)); max-height: calc(100dvh - 80px - env(safe-area-inset-top, 0px));
    }
    .pm-acct { margin-left: 0; }
    .pm-acct-btn:hover, .pm-acct.open .pm-acct-btn { background: transparent; }
    .pm-avatar { width: 36px; height: 36px; background: var(--pm-bg-e5e7eb, #e5e7eb); color: var(--pm-fg-1f2937, #1f2937); }
    .pm-acct-menu .pm-avatar { background: #4a5568; color: #fff; }
    .pm-acct-menu { top: calc(60px + env(safe-area-inset-top, 0px)) !important; }
    /* Drawer header: logo + << close; drawer sits above the fixed header. */
    #sidebar { padding-top: env(safe-area-inset-top, 0px); }
    #pmSideHead { padding: 0.9rem 1rem !important; }
}

/* Search inputs: our gray X only (no native clear button). */
input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; display: none; }
input[type=search]::-ms-clear { display: none; width: 0; height: 0; }

/* ---- Notifications bell (top bar, staff only) ---- */
.pm-bell { position: relative; flex-shrink: 0; margin-left: auto; }
.pm-bell + .pm-acct { margin-left: 0.25rem; }
.pm-bell-btn { position: relative; }
.pm-bell-btn .bi { font-size: 1.2rem; }
/* Small red pill at the bell's top-right; overlaps the icon by only a few px so the bell stays visible (staff + tenant bars). */
.pm-bell .pm-bell-btn { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; padding: 0; }
.pm-bell-count {
    position: absolute; top: 3px; left: 24px; right: auto; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
    background: #dc2626; color: #fff; font-size: 10.5px; font-weight: 700; line-height: 16px; text-align: center; box-sizing: border-box;
    box-shadow: 0 0 0 1.5px #fff; pointer-events: none;
}
/* Unread count pill on side menu links (Chats). Same sizing as the bell badge. */
#sidebar .sidebar-link .pm-nav-count {
    display: inline-block; flex-shrink: 0; margin-left: 8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px;
    background: #dc2626; color: #fff; font-size: 11px; font-weight: 700; line-height: 18px; text-align: center; box-sizing: border-box;
}
#wrapper.pm-rail #sidebar .sidebar-link { position: relative; }
#wrapper.pm-rail #sidebar .sidebar-link .pm-nav-count {
    position: absolute; top: 2px; left: calc(50% + 4px); margin-left: 0; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
    font-size: 10.5px; line-height: 16px; box-shadow: 0 0 0 1.5px #1a202c;
}
/* Money parent: red dot only while collapsed and Bank Register has items for review. */
#sidebar .pm-pay-toggle .pm-nav-dot { display: inline-block; flex-shrink: 0; width: 8px; height: 8px; margin-left: 8px; border-radius: 50%; background: #dc2626; }
#sidebar .pm-pay-toggle.open .pm-nav-dot { display: none; }
#wrapper.pm-rail #sidebar .pm-pay-toggle { position: relative; }
#wrapper.pm-rail #sidebar .pm-pay-toggle .pm-nav-dot { position: absolute; top: 6px; left: calc(50% + 6px); margin-left: 0; box-shadow: 0 0 0 1.5px #1a202c; }
.pm-bell-menu {
    display: none; position: absolute; right: 0; top: calc(100% + 6px); width: 340px; max-height: 70vh; overflow-y: auto; z-index: 1100;
    background: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); border-radius: 10px; box-shadow: 0 12px 32px rgba(0,0,0,0.15); padding: 0.4rem; color: var(--pm-fg-111827, #111827);
}
.pm-bell.open .pm-bell-menu { display: block; }
.pm-bell-head { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; padding: 0.4rem 0.5rem 0.6rem; border-bottom: 1px solid var(--pm-bd-e5e7eb, #e5e7eb); margin-bottom: 0.3rem; }
.pm-bell-empty { padding: 1rem 0.6rem; color: var(--pm-fg-6b7280, #6b7280); font-size: 0.9rem; text-align: center; }
.pm-bell-err { color: #b91c1c; font-size: 0.85rem; padding: 0.3rem 0.5rem; }
.pm-bell-item, .pm-bell-item:link, .pm-bell-item:visited {
    display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.55rem 0.6rem; border-radius: 8px; color: var(--pm-fg-4b5563, #4b5563); text-decoration: none; font-size: 0.9rem;
}
@media (hover: hover) and (pointer: fine) { .pm-bell-item:hover { background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-111827, #111827); } }
.pm-bell-item .bi { color: var(--pm-fg-6b7280, #6b7280); margin-top: 2px; }
.pm-bell-item.unread { color: var(--pm-fg-111827, #111827); font-weight: 600; background: var(--pm-bg-f9fafb, #f9fafb); }
.pm-bell-item.unread .bi { color: var(--pm-fg-1f2937, #1f2937); }
.pm-bell-t { display: block; word-break: break-word; }
.pm-bell-item small { display: block; color: var(--pm-fg-6b7280, #6b7280); font-weight: 400; font-size: 0.76rem; }
.pm-bell-hbtns { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.35rem; }
.pm-bell-item, .pm-bell-x { -webkit-tap-highlight-color: transparent; }
.pm-bell-row { position: relative; overflow: hidden; border-radius: 8px; }
.pm-bell-row .pm-bell-item { position: relative; z-index: 1; background: var(--pm-bg-fff, #fff); transition: transform 0.22s ease; touch-action: pan-y; will-change: transform; }
.pm-bell-row .pm-bell-item.unread { background: var(--pm-bg-f9fafb, #f9fafb); }
.pm-bell-row.dragging .pm-bell-item { transition: none; }
.pm-bell-body { display: flex; flex-direction: column; min-width: 0; }
.pm-bell-t { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.pm-bell-ctx { font-weight: 400; font-size: 0.78rem; color: var(--pm-fg-6b7280, #6b7280); white-space: nowrap; display: flex; min-width: 0; }
.pm-bell-cm { overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
.pm-bell-cd { flex: 0 0 auto; white-space: nowrap; }
.pm-bell-item { position: relative; }
.pm-bell-item.od .pm-bell-t { padding-right: 64px; }
.pm-bell-od { position: absolute; top: 6px; right: 8px; background: #ef4444; color: #fff; font-size: 0.62rem; font-weight: 700; line-height: 1; padding: 3px 7px; border-radius: 12px; text-transform: uppercase; box-shadow: 0 1px 3px rgba(0,0,0,0.2); pointer-events: none; }
.pm-bell-item .pm-bell-od { margin: 0; }
.pm-bell-acts { position: absolute; top: 0; right: 0; bottom: 0; display: flex; }
.pm-bell-x { width: 76px; border: 0; padding: 0; background: #4a5568; color: #fff;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 0.78rem; font-weight: 600; cursor: pointer; }
.pm-bell-x.pm-bell-rd { background: #2563eb; }
.pm-bell-x .bi { font-size: 1rem; color: #fff; margin: 0; }
@media (hover: hover) and (pointer: fine) {
    .pm-bell-row .pm-bell-item { padding-right: 4.2rem; }
    .pm-bell-acts { z-index: 2; top: 50%; bottom: auto; right: 6px; gap: 4px; transform: translateY(-50%); opacity: 0; transition: opacity 0.12s; }
    .pm-bell-x { width: 28px; height: 28px; border-radius: 6px; }
    .pm-bell-x span { display: none; }
    .pm-bell-x .bi { font-size: 0.85rem; }
    .pm-bell-row:hover .pm-bell-acts, .pm-bell-acts:focus-within { opacity: 1; }
}
@media (min-width: 768px) and (min-height: 500.02px), (min-width: 768px) and (hover: hover), (min-width: 768px) and (pointer: fine) {
    .pm-bell .pm-bell-btn {
        display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px;
        background: transparent; border: 0; border-radius: 10px; color: var(--pm-fg-374151, #374151); cursor: pointer;
    }
}
/* Plain icon on every layout: no UA button box, focus ring for keyboard only, subtle hover on mouse devices. */
.pm-bell .pm-bell-btn { -webkit-appearance: none; appearance: none; background: transparent; border: 0; box-shadow: none; outline: none; -webkit-tap-highlight-color: transparent; }
.pm-bell .pm-bell-btn:focus { outline: none; box-shadow: none; }
.pm-bell .pm-bell-btn:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) and (min-width: 768px) {
    .pm-bell .pm-bell-btn:hover, .pm-bell.open .pm-bell-btn { background: rgba(0,0,0,0.05); }
}
@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-bell { margin-left: 0; }
    .pm-bell-count { box-shadow: 0 0 0 1.5px #001a2c; }
    .pm-bell-menu { position: fixed; top: calc(60px + env(safe-area-inset-top, 0px)); left: 8px; right: 8px; width: auto; }
}

/* ---- Tenant portal top bar (bell only) ---- */
.pm-topbar-tenant .pm-bell { margin-left: auto; }
.pm-tb-brand, .pm-tb-brand:link, .pm-tb-brand:visited, .pm-tb-brand:hover { color: #fff !important; text-decoration: none !important; font-weight: 700; font-size: 1.05rem; margin-left: 2px; white-space: nowrap; }
@media (min-width: 768px) and (min-height: 500.02px), (min-width: 768px) and (hover: hover), (min-width: 768px) and (pointer: fine) {
    .pm-topbar-tenant .pm-bell .pm-bell-btn { color: var(--pm-fg-1f2937, #1f2937); }
}
@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-topbar-tenant .pm-bell .pm-bell-btn { color: #fff; }
}

/* ---- Small solid page link in the top bar (SiteMaster.SetTopLink), e.g. tenant layout switch ---- */
.pm-tb-link, .pm-tb-link:link, .pm-tb-link:visited { display: inline-flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; white-space: nowrap;
    background: #4a5568; color: #fff !important; border: 1px solid #4a5568; border-radius: 6px; padding: 0.25rem 0.6rem; margin-right: 0.5rem;
    font-size: 12.5px; font-weight: 600; line-height: 1.2; text-decoration: none; }
.pm-tb-link:hover, .pm-tb-link:focus { background: #2d3748; border-color: #2d3748; color: #fff !important; }
.pm-tb-link-short { display: none; }
@media (max-width: 767.98px), (max-height: 500px) and (hover: none) and (pointer: coarse) {
    .pm-tb-link { padding: 0.25rem 0.5rem; margin-right: 0.35rem; font-size: 12px; }
    .pm-tb-link-full { display: none; }
    .pm-tb-link-short { display: inline; }
}

/* ---- Slide toggle for plain checkboxes (label.pm-slide > input[type=checkbox], asp:CheckBox inside works too) ---- */
.pm-slide { display: inline-flex; align-items: center; gap: .5rem; cursor: pointer; }
.pm-slide input[type="checkbox"] { -webkit-appearance: none; appearance: none; flex: 0 0 auto; width: 2.5em !important; height: 1.35em !important; margin: 0;
    border-radius: 2em !important; border: 1px solid #cbd5e0; background: #cbd5e0 url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") left center / contain no-repeat;
    cursor: pointer; transition: background-position .15s ease-in-out, background-color .15s ease-in-out; vertical-align: middle; accent-color: auto; }
.pm-slide input[type="checkbox"]:checked { background-color: #4a5568; border-color: #4a5568; background-position: right center; }
.pm-slide input[type="checkbox"]:focus-visible { outline: 2px solid #a0aec0; outline-offset: 2px; }
/* Gap between every Bootstrap switch and its label (e.g. Month-to-month, Documents) */
.form-switch .form-check-input ~ .form-check-label, .form-switch .form-check-input ~ label, .form-switch input[type="checkbox"] + label { margin-left: .5rem; }

/* Menu items and card links never underline (Billing "More" menu, TenantDetailsNew Overview tiles/cards) */
.dropdown-menu a.dropdown-item, .dropdown-menu a.dropdown-item:link, .dropdown-menu a.dropdown-item:visited, .dropdown-menu a.dropdown-item:hover, .dropdown-menu a.dropdown-item:focus,
a.tdx-tile, a.tdx-tile:link, a.tdx-tile:visited, a.tdx-tile:hover, a.tdx-tile:focus, a.tdx-tile *, .tdx-card a.tdx-card-link, .tdx-card a.tdx-card-link:hover { text-decoration: none !important; }

/* Radios and checkboxes use the slate accent */
input[type="radio"], input[type="checkbox"] { accent-color: #4a5568; }
.form-check-input:checked { background-color: #4a5568; border-color: #4a5568; }

/* Site-wide rule: rows, list items, options, menu items and cards never turn gray on touch or while scrolling on a phone. */
html { -webkit-tap-highlight-color: transparent; }
@media (hover: none), (pointer: coarse) {
    .dropdown-item:hover, .dropdown-item:active, .list-group-item-action:hover, .list-group-item-action:active,
    .dropdown-item:focus:not(:focus-visible), .list-group-item-action:focus:not(:focus-visible) { background-color: transparent; color: inherit; }
    .table-hover > tbody > tr:hover > * { --bs-table-accent-bg: transparent; --bs-table-bg-state: transparent; --bs-table-hover-bg: transparent; }
}

/* ---- Short landscape phones (e.g. iPhone sideways, ~1024x470) use the mobile shell. Bootstrap .d-md-none
   hides the mobile controls at >=768px wide, so bring them back here. Desktop (mouse or tall screen) unchanged. ---- */
@media (min-width: 768px) and (max-height: 500px) and (hover: none) and (pointer: coarse) {
    #pmBurger.d-md-none, #pmSearchOpen.d-md-none, #pmSearchClose.d-md-none, #sidebarClose.d-md-none { display: inline-flex !important; }
    .pm-tb-brand.d-md-none { display: inline-flex !important; align-items: center; }
    #wrapper.toggled ~ #sidebarBackdrop.d-md-none { display: block !important; }
}

/* ---- Modals: always centered in the full viewport, above the side menu and topbar, never taller than the screen. ---- */
.modal-backdrop { z-index: 2040 !important; }
.modal { z-index: 2050 !important; }
@media (max-height: 500px) {
    .modal-dialog { margin-top: 0.5rem; margin-bottom: 0.5rem; }
    .modal-dialog-centered { min-height: calc(100% - 1rem); }
    .modal-dialog-scrollable { height: calc(100% - 1rem); }
    .modal-dialog-scrollable .modal-content { max-height: 100%; }
}
.pm-bell-hbtns { display: inline-flex; gap: 2px; }
.pm-bell-hb { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--pm-fg-4b5563, #4b5563); font-size: 1.1rem; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.pm-bell-hb[hidden] { display: none; }
@media (hover: hover) and (pointer: fine) { .pm-bell-hb:hover { background: var(--pm-bg-e5e7eb, #e5e7eb); color: var(--pm-fg-111827, #111827); } }
.pm-bell-hb.on { background: var(--pm-bg-dbeafe, #dbeafe); color: var(--pm-fg-1d4ed8, #1d4ed8); }

/* ==========================================================================
   st-sheet: modern popup (reusable). Phones (<=576px): bottom sheet with grab handle, slides up,
   swipe the handle down or tap the backdrop to close (js/site.js). Larger screens: centered dialog.
   Markup: .st-sheet > .st-sheet-grab, .st-sheet-head (.st-sheet-title, .st-sheet-x), .st-sheet-body
   (.st-grid > .st-field.st-spanN with .st-label + .st-input), .st-sheet-foot (.st-btn.st-btn-primary).
   ========================================================================== */
html body .st-sheet {
    background: var(--pm-bg-fff, #fff); color: var(--pm-fg-1f2937, #1f2937); border: 0; border-radius: 16px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, .22), 0 2px 8px rgba(15, 23, 42, .08);
    width: 560px; max-width: calc(100vw - 32px);
    max-height: 90vh; max-height: 90dvh;
    flex-direction: column; overflow: hidden !important; padding: 0;
}
html body .st-sheet:not([style*="display: none"]):not([style*="display:none"]) { display: flex !important; }
.st-sheet-grab { display: none; }
.st-sheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 20px 8px; background: var(--pm-bg-fff, #fff); flex: 0 0 auto; }
html body .st-sheet .st-sheet-title { margin: 0; font-size: 1.15rem; font-weight: 700; color: var(--pm-fg-111827, #111827) !important; }
.st-sheet-x {
    flex: 0 0 auto; width: 34px; height: 34px; border: 0; border-radius: 50%; background: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-6b7280, #6b7280);
    font-size: 1.35rem; line-height: 1; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
.st-sheet-body { flex: 1 1 auto; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 8px 20px 16px; }
.st-sheet-foot {
    flex: 0 0 auto; display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px;
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px)); border-top: 1px solid var(--pm-bd-eef0f3, #eef0f3); background: var(--pm-bg-fff, #fff);
}
.st-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px 12px; }
.st-field { min-width: 0; }
.st-span1 { grid-column: span 1; } .st-span2 { grid-column: span 2; } .st-span3 { grid-column: span 3; } .st-span6 { grid-column: span 6; }
html body .st-sheet .st-label { display: block; margin: 0 0 5px; font-size: .875rem; font-weight: 500; color: var(--pm-fg-374151, #374151); text-transform: none; letter-spacing: 0; }
.st-section { border-top: 1px solid var(--pm-bd-eef0f3, #eef0f3); padding-top: 14px; }
.st-section-title { font-weight: 700; color: var(--pm-fg-111827, #111827); font-size: .95rem; }
html body .st-input {
    display: block; width: 100%; min-height: 44px; padding: 10px 12px; font-size: 16px; color: var(--pm-fg-111827, #111827); background: var(--pm-bg-fff, #fff);
    border: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 10px; box-shadow: none; outline: 0; -webkit-appearance: none; appearance: none;
    transition: border-color .15s, box-shadow .15s;
}
html body textarea.st-input { min-height: 88px; resize: vertical; }
/* Auto-growing description box: ~2 lines, grows with text, caps ~6 lines then scrolls (js/site.js stAutoGrow). */
html body textarea.st-autogrow { height: auto; min-height: calc(2 * 1.4em + 22px); line-height: 1.4; overflow-y: hidden; max-height: calc(6 * 1.4em + 22px); resize: vertical; overflow-wrap: anywhere; }
@media (max-width: 767.98px) {
    .st-grid { gap: 10px 10px; }
    html body .st-sheet .st-label { margin-bottom: 3px; font-size: .82rem; }
    html body .st-input { min-height: 40px; padding: 7px 11px; }
    html body textarea.st-autogrow { min-height: calc(2 * 1.4em + 16px); max-height: calc(6 * 1.4em + 16px); resize: none; }
    html body .st-sheet .st-sheet-title { font-size: 1.05rem; }
    .st-sheet-x { width: 30px; height: 30px; font-size: 1.2rem; }
    .st-sheet-head { padding: 8px 14px 4px !important; }
    .st-sheet-body { padding: 4px 14px 12px !important; overflow-x: hidden; }
    .st-sheet-foot { padding: 8px 14px calc(8px + env(safe-area-inset-bottom, 0px)) !important; }
    .st-sheet-foot .st-btn { min-height: 42px; padding: 8px 20px; }
}
html body .st-select {
    padding-right: 32px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236b7280' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat; background-position: right 12px center; background-size: 12px;
}
html body .st-input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .2); }
.st-btn {
    min-height: 44px; padding: 10px 24px; border: 0; border-radius: 10px; font-weight: 600; font-size: 1rem; cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}
html body .st-btn-primary { background: #2563eb; color: #fff; }
html body .st-btn-danger { background: #dc2626; color: #fff; }
@media (hover: hover) { html body .st-btn-danger:hover { background: #b91c1c; } }
@media (max-width: 576px) { .st-sheet-foot .st-btn-danger { width: 100%; } }
.st-confirm-row { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3); }
.st-confirm-row span { color: var(--pm-fg-6b7280, #6b7280); flex: 0 0 auto; }
.st-confirm-row b { font-weight: 600; color: var(--pm-fg-111827, #111827); text-align: right; min-width: 0; overflow-wrap: anywhere; }
@media (hover: hover) {
    html body .st-btn-primary:hover { background: #1d4ed8; }
    .st-sheet-x:hover { background: var(--pm-bg-e5e7eb, #e5e7eb); color: var(--pm-fg-111827, #111827); }
}
/* Open/close motion is driven by js/site.js: .st-in = shown, .st-anim = transition on. */
html body .st-sheet { opacity: 0; transform: translateY(12px) scale(.97); }
html body .st-sheet.st-in { opacity: 1; transform: none; }
html body .st-sheet.st-anim { transition: opacity .2s ease-out, transform .2s ease-out; }
.st-sheet-backdrop { opacity: 0 !important; }
.st-sheet-backdrop.st-in { opacity: .5 !important; }
.st-sheet-backdrop.st-anim { transition: opacity .25s ease-out; }
@media (max-width: 576px) {
    html body .st-sheet {
        position: fixed !important; left: 0 !important; right: 0 !important; top: auto !important; bottom: 0 !important;
        width: 100% !important; max-width: 100% !important; border-radius: 16px 16px 0 0;
        max-height: 90vh !important; max-height: 90dvh !important;
        opacity: 1; transform: translateY(100%);
    }
    html body .st-sheet.st-in { transform: translateY(0); }
    html body .st-sheet.st-anim { transition: transform .25s ease-out; }
    .st-sheet-grab { -webkit-tap-highlight-color: transparent; display: flex; justify-content: center; padding: 8px 0 0; flex: 0 0 auto; touch-action: none; cursor: grab; }
    .st-sheet-grab span { width: 40px; height: 5px; border-radius: 3px; background: var(--pm-bg-d1d5db, #d1d5db); }
    .st-sheet-head { padding: 10px 16px 6px; touch-action: none; }
    .st-sheet-body { padding: 6px 16px 16px; }
    .st-sheet-foot { padding-left: 16px; padding-right: 16px; }
    .st-sheet-foot .st-btn-primary { width: 100%; }
    .st-ph6 { grid-column: span 6; } .st-ph3 { grid-column: span 3; }
}
/* Wider screens: right-side drawer, full height, slides in from the right edge. */
@media (min-width: 577px) {
    html body .st-sheet {
        position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: auto !important;
        width: 560px !important; max-width: 92vw !important; height: 100vh !important; height: 100dvh !important;
        max-height: none !important; border-radius: 0; opacity: 1; transform: translateX(100%);
        box-shadow: -12px 0 40px rgba(15, 23, 42, .18);
    }
    html body .st-sheet.st-in { transform: translateX(0); }
    html body .st-sheet.st-anim { transition: transform .25s ease-out; }
    .st-sheet-head { border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3); padding-bottom: 14px; }
}
@media (prefers-reduced-motion: reduce) {
    html body .st-sheet.st-anim, .st-sheet-backdrop.st-anim { transition: none !important; }
}
/* Client-opened sheets (stSheetOpen): no grey tap flash on the opener. */
.pd-edit-btn { -webkit-tap-highlight-color: transparent; }

/* ==========================================================================
   st-auto: every ModalPopupExtender popup is turned into a sheet by js/site.js (stAutoSheet).
   Layout per popup comes from a per-id rule (beats page #id rules); this is the shared look.
   ========================================================================== */
html body .st-sheet.st-auto { -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 0 !important; z-index: 10001 !important; }
html body .st-sheet.st-auto > * { flex-shrink: 0; }
html body .st-sheet.st-auto > div:has(.card-body, .modal-body, .modal-scrollable-body):not(.st-load) { display: flex; flex-direction: column; flex: 1 0 auto; }
html body .st-sheet.st-auto .card-body, html body .st-sheet.st-auto .modal-scrollable-body { flex: 1 0 auto; }
html body .st-sheet.st-auto.card, html body .st-sheet.st-auto > .card { border: 0 !important; }
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header {
    background: var(--pm-bg-fff, #fff) !important; color: var(--pm-fg-111827, #111827) !important; border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3) !important;
    position: sticky; top: 0; z-index: 5; padding: 14px 20px !important; border-radius: 0 !important;
}
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header .pm-modal-title,
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header .pm-modal-title *:not(.badge):not(.btn),
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h1, html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h2,
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h3, html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h4,
html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h5, html body .st-sheet.st-auto .pm-modal-header.pm-modal-header > h6 {
    color: var(--pm-fg-111827, #111827) !important; font-size: 1.1rem !important; font-weight: 700 !important;
}
html body .st-sheet.st-auto .pm-modal-header .pm-modal-title i.bi { display: none; }
html body .st-sheet.st-auto .pm-modal-header .btn-close.pm-modal-x { filter: none !important; opacity: .6; background-color: var(--pm-bg-f3f4f6, #f3f4f6); border-radius: 50%; }
html body .st-sheet.st-auto .pm-modal-header a.pm-modal-x:not(.btn-close),
html body .st-sheet.st-auto .pm-modal-header a.pm-modal-x:not(.btn-close):link,
html body .st-sheet.st-auto .pm-modal-header a.pm-modal-x:not(.btn-close):visited { color: var(--pm-fg-6b7280, #6b7280) !important; }
html body .st-sheet.st-auto .card-header:not(.pm-modal-header) { background: var(--pm-bg-fff, #fff) !important; }
/* Labels: normal case, no shouting. */
html body .st-sheet.st-auto .form-label.form-label,
html body .st-sheet.st-auto label.text-uppercase.text-uppercase {
    text-transform: none !important; letter-spacing: 0 !important; font-weight: 500 !important; color: var(--pm-fg-374151, #374151) !important; font-size: .875rem !important;
}
/* Softer inputs (16px text: no iPhone zoom). */
html body .st-sheet.st-auto .form-control:not(.form-control-color):not([type=file]),
html body .st-sheet.st-auto .form-select {
    border-radius: 10px; border-color: var(--pm-bd-d1d5db, #d1d5db); min-height: 44px; font-size: 16px; box-shadow: none;
}
html body .st-sheet.st-auto textarea.form-control { min-height: 88px; }
html body .st-sheet.st-auto .form-control:focus, html body .st-sheet.st-auto .form-select:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, .2); }
/* Bottom bar: pinned, one solid blue Save. */
html body .st-sheet.st-auto .card-footer, html body .st-sheet.st-auto .pm-modal-foot {
    position: sticky; bottom: 0; z-index: 4; background: var(--pm-bg-fff, #fff) !important; border-top: 1px solid var(--pm-bd-eef0f3, #eef0f3);
    padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
}
html body .st-sheet.st-auto .card-footer .btn-primary, html body .st-sheet.st-auto .card-footer .btn-success,
html body .st-sheet.st-auto .pm-modal-foot .btn-primary, html body .st-sheet.st-auto .pm-modal-foot .btn-success {
    background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; border-radius: 10px; min-height: 44px; font-weight: 600;
}
@media (hover: hover) {
    html body .st-sheet.st-auto .card-footer .btn-primary:hover, html body .st-sheet.st-auto .card-footer .btn-success:hover,
    html body .st-sheet.st-auto .pm-modal-foot .btn-primary:hover, html body .st-sheet.st-auto .pm-modal-foot .btn-success:hover { background: #1d4ed8 !important; }
}
@media (max-width: 576px) {
    html body .st-sheet.st-auto .pm-modal-header.pm-modal-header { padding: 8px 16px 10px !important; touch-action: none; }
    html body .st-sheet.st-auto > .st-sheet-grab { position: sticky; top: 0; z-index: 6; background: var(--pm-bg-fff, #fff); padding-bottom: 2px; }
    html body .st-sheet.st-auto > .st-sheet-grab ~ * .pm-modal-header.pm-modal-header,
    html body .st-sheet.st-auto > .st-sheet-grab ~ .pm-modal-header.pm-modal-header { top: 15px; }
}
/* Loading state while the server fills a popup that opened on the tap. */
html body .st-sheet .st-load { display: none; }
html body .st-sheet.st-loading > .st-load {
    display: flex; position: absolute; left: 0; right: 0; top: 0; bottom: 0; align-items: center; justify-content: center;
    gap: 10px; color: var(--pm-fg-6b7280, #6b7280); background: var(--pm-bg-fff, #fff); z-index: 20; min-height: 200px;
}
html body .st-sheet.st-loading { min-height: 40vh; }

/* Bootstrap modals as sheets (.modal.st-bs, tagged by js/site.js). */
html body .modal.st-bs .modal-content { border: 0; box-shadow: -12px 0 40px rgba(15, 23, 42, .18); }
html body .modal.st-bs .modal-header { background: var(--pm-bg-fff, #fff); border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3); }
html body .modal.st-bs .modal-body { overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
html body .modal.st-bs .form-label.form-label { text-transform: none !important; letter-spacing: 0 !important; font-weight: 500 !important; color: var(--pm-fg-374151, #374151) !important; }
html body .modal.st-bs .modal-footer .btn-primary, html body .modal.st-bs .modal-footer .btn-success { background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; }
html body .modal.st-bs .modal-dialog { position: fixed; margin: 0 !important; transition: transform .25s ease-out !important; }
@media (max-width: 576px) {
    html body .modal.st-bs .modal-dialog { left: 0; right: 0; bottom: 0; top: auto; width: 100%; max-width: 100%; transform: translateY(100%) !important; }
    html body .modal.st-bs .modal-content { border-radius: 16px 16px 0 0; max-height: 90vh; max-height: 90dvh; overflow-y: auto; }
    html body .modal.st-bs .modal-content::before { content: ""; display: block; width: 40px; height: 5px; border-radius: 3px; background: var(--pm-bg-d1d5db, #d1d5db); margin: 8px auto 0; flex: 0 0 auto; }
    html body .modal.st-bs .modal-header { touch-action: none; }
}
@media (min-width: 577px) {
    html body .modal.st-bs .modal-dialog { top: 0; right: 0; bottom: 0; left: auto; width: 560px; max-width: 92vw; height: 100vh; height: 100dvh; transform: translateX(100%) !important; }
    html body .modal.st-bs .modal-dialog.modal-dialog { max-height: none !important; }
    html body .modal.st-bs .modal-content.modal-content { height: 100% !important; max-height: none !important; border-radius: 0; overflow: hidden !important; display: flex !important; flex-direction: column !important; }
    html body .modal.st-bs .modal-content > * { flex: 0 0 auto; }
    html body .modal.st-bs .modal-content > form, html body .modal.st-bs .modal-content > div:has(> .modal-body) { flex: 1 1 auto !important; min-height: 0 !important; display: flex !important; flex-direction: column !important; }
    html body .modal.st-bs .modal-body.modal-body { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; height: auto !important; overflow-y: auto !important; }
}
html body .modal.st-bs.show .modal-dialog { transform: none !important; }
@media (prefers-reduced-motion: reduce) { html body .modal.st-bs .modal-dialog { transition: none !important; } }
/* Phones: every Bootstrap sheet sits flush on the bottom edge. modal-dialog-centered / -scrollable give the dialog
   a full-height box (flex, centered), which left the content floating mid-screen with a dark gap below; size to content instead. */
@media (max-width: 576px) {
    html body .modal.st-bs .modal-dialog.modal-dialog { height: auto !important; min-height: 0 !important; max-height: none !important; display: block !important; }
    html body .modal.st-bs .modal-content.modal-content { max-height: 92vh; max-height: calc(var(--pm-vh, 100dvh) - 24px); display: flex !important; flex-direction: column !important; overflow: hidden !important; }
    html body .modal.st-bs .modal-content > * { flex: 0 0 auto; }
    html body .modal.st-bs .modal-content > form, html body .modal.st-bs .modal-content > div:has(> .modal-body) { flex: 1 1 auto !important; min-height: 0 !important; display: flex !important; flex-direction: column !important; }
    html body .modal.st-bs .modal-body.modal-body { flex: 1 1 auto !important; min-height: 0 !important; max-height: none !important; overflow-y: auto !important; overflow-x: hidden; }
    html body .modal.st-bs .modal-footer { padding-bottom: calc(.75rem + env(safe-area-inset-bottom, 0px)) !important; }
    html body .modal.st-bs .modal-body.modal-body:last-child, html body .modal.st-bs .modal-body.modal-body:has(+ .modal-footer:not(:has(:is(button, a, input[type=submit]):not(.pm-btn-cancel):not([data-bs-dismiss])))) { padding-bottom: calc(1rem + env(safe-area-inset-bottom, 0px)) !important; }
}
/* Footer whose only button is Close/Cancel: the X and swipe-down already close, so drop the whole bar (all sizes). */
html body :is(.modal.st-bs, .st-sheet, .st-ov-d):has(.pm-modal-x, .st-sheet-x, .btn-close) :is(.modal-footer, .st-sheet-foot, .st-ov-f):not(:has(:is(button, a, input[type=submit]):not(.pm-btn-cancel):not([data-bs-dismiss]))) { display: none !important; }

/* Sheets: scrolling stays inside the sheet body (no scroll chaining to the page). Close by dragging the header only. */
html body .st-sheet, html body .st-sheet .st-sheet-body, html body .st-sheet .card-body, html body .st-sheet .modal-body, html body .modal.st-bs .modal-body { overscroll-behavior: contain; }

/* ---- Page-built overlay dialogs as sheets (js/site.js tags them .st-ov / .st-ov-d) ---- */
html body .st-ov { padding: 0 !important; overflow: hidden !important; }
html body .st-ov .st-ov-d { position: fixed !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: auto !important; margin: 0 !important; width: 560px !important; max-width: 92vw !important; height: 100% !important; max-height: none !important; border-radius: 0 !important; display: flex !important; flex-direction: column !important; background: var(--pm-bg-fff, #fff) !important; box-shadow: -8px 0 30px rgba(15,23,42,.18) !important; transform: translateX(100%); transition: transform .28s cubic-bezier(.2,.8,.2,1); overflow: hidden !important; }
html body .st-ov .st-ov-d.st-in { transform: none; }
html body .st-ov .st-ov-h { background: var(--pm-bg-fff, #fff) !important; color: var(--pm-fg-111827, #111827) !important; border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3) !important; border-radius: 0 !important; padding: 16px 20px !important; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; position: static !important; }
html body .st-ov .st-ov-h h5, html body .st-ov .st-ov-h span, html body .st-ov .st-ov-h strong { color: var(--pm-fg-111827, #111827) !important; font-weight: 700; font-size: 1.05rem; }
html body .st-ov .st-ov-h .btn-close-white { filter: none !important; }
html body .st-ov .st-ov-h .lgx-x { color: var(--pm-fg-6b7280, #6b7280) !important; }
html body .st-ov .st-ov-b { flex: 1 1 auto !important; min-height: 0; max-height: none !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior-y: none; padding: 16px 20px !important; }
html body .st-ov .st-ov-f { flex-shrink: 0; background: var(--pm-bg-fff, #fff) !important; border-top: 1px solid var(--pm-bd-eef0f3, #eef0f3) !important; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)) !important; display: flex; justify-content: flex-end; gap: 8px; }
html body .st-ov .st-ov-d .form-label, html body .st-ov .st-ov-d label.text-uppercase { text-transform: none !important; letter-spacing: 0 !important; color: var(--pm-fg-374151, #374151); font-weight: 600; }
html body .st-ov .st-ov-d .form-control, html body .st-ov .st-ov-d .form-select { min-height: 44px; font-size: 16px; border-radius: 10px; border-color: var(--pm-bd-d1d5db, #d1d5db); }
html body .st-ov .st-ov-d .form-control:focus, html body .st-ov .st-ov-d .form-select:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37,99,235,.15); }
html body .st-ov .st-ov-f .lg-btn, html body .st-ov .st-ov-f .btn-primary, html body .st-ov .st-ov-f .btn-success { background: #2563eb !important; border-color: #2563eb !important; color: #fff !important; }
.st-ov-grab { display: none; }
@media (max-width: 576px) {
    html body .st-ov .st-ov-d { top: auto !important; left: 0 !important; width: 100% !important; max-width: 100% !important; height: auto !important; max-height: 90dvh !important; border-radius: 16px 16px 0 0 !important; transform: translateY(100%); box-shadow: 0 -8px 30px rgba(15,23,42,.18) !important; }
    html body .st-ov .st-ov-d.st-in { transform: none; }
    .st-ov-grab { display: block; flex-shrink: 0; width: 100%; height: 18px; position: relative; touch-action: none; }
    .st-ov-grab::after { content: ""; position: absolute; left: 50%; top: 7px; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px; background: var(--pm-bg-d1d5db, #d1d5db); }
    html body .st-ov .st-ov-h { padding-top: 6px !important; }
    html body .st-ov .st-ov-f .btn { flex: 1; min-height: 44px; }
}

/* Rows never change color on mouse-over or touch (site-wide). Zebra stripes (--bs-table-bg-type) stay. */
html body .table-hover > tbody > tr:hover > *, html body .table > tbody > tr:hover > *, html body .table > tbody > tr:active > * { --bs-table-bg-state: transparent !important; --bs-table-hover-bg: transparent !important; }

/* Phones / touch: rows are plain white. Zebra stripes (table-striped) read as a stuck gray highlight on iOS,
   and the striped selector flips while scrolling/dragging, so stripes are off on touch and under 768px. */
@media (pointer: coarse), (max-width: 767.98px) {
    html body .table-striped > tbody > tr > *, html body .table-striped > tbody > tr:nth-of-type(odd) > *,
    html body .table > tbody > tr > *, html body .table > tbody > tr:hover > *, html body .table > tbody > tr:active > * {
        --bs-table-bg-type: transparent !important; --bs-table-accent-bg: transparent !important;
        --bs-table-bg-state: transparent !important; --bs-table-hover-bg: transparent !important;
    }
    html body tr, html body td { -webkit-tap-highlight-color: transparent; }
}

/* Plaid Link: above every layer, and only as tall as the visible screen. With viewport-fit=cover a full-height
   fixed iframe runs under iOS Safari's bottom toolbar, so Plaid's Continue button sat behind it and taps
   went to Safari. 100svh is the height with the toolbars showing. */
html body iframe[id^="plaid-link-iframe"] { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; bottom: auto !important;
    width: 100% !important; height: min(var(--pm-vh, 100svh), 100svh) !important; z-index: 2147483647 !important; pointer-events: auto !important; }
html.st-plaid-open .st-sheet, html.st-plaid-open .st-sheet-backdrop, html.st-plaid-open .modal-backdrop, html.st-plaid-open .modalBackground { pointer-events: none !important; }

/* stSearchSelect (js/site.js): select[data-st-search] -> type-to-filter picker. Native select hidden, still posts. */
html body select.st-ss-native { display: none !important; }
.st-ss { position: relative; min-width: 0; width: 100%; }
html body .st-ss-btn {
    text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; font-weight: 400;
    -webkit-tap-highlight-color: transparent; touch-action: manipulation;
}
html body .st-ss-btn.st-ss-ph { color: var(--pm-fg-6b7280, #6b7280); }
html body .st-ss-btn:disabled { background-color: var(--pm-bg-f3f4f6, #f3f4f6); color: var(--pm-fg-9ca3af, #9ca3af); cursor: default; }
.st-ss-open .st-ss-btn { border-color: #2563eb; }
.st-ss-pop {
    margin-top: 6px; background: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 10px; padding: 8px;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
}
html body .st-ss-q { min-height: 40px; padding: 8px 10px; font-size: 16px; }
.st-ss-list { max-height: 240px; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; margin-top: 6px; }
.st-ss-opt {
    padding: 11px 10px; border-radius: 8px; font-size: 16px; color: var(--pm-fg-111827, #111827); cursor: pointer; line-height: 1.3;
    -webkit-tap-highlight-color: transparent; overflow-wrap: anywhere;
}
.st-ss-opt.st-ss-ph { color: var(--pm-fg-6b7280, #6b7280); }
/* The empty choice ("Select a ...") stays pinned at the top of the list so a set value can always be cleared. */
.st-ss-list .st-ss-opt.st-ss-ph { position: sticky; top: 0; z-index: 1; background: var(--pm-bg-fff, #fff); color: var(--pm-fg-111827, #111827); border-bottom: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 8px 8px 0 0; }
.st-ss-list .st-ss-opt.st-ss-ph.st-ss-act { background: var(--pm-bg-eff6ff, #eff6ff); }
@media (hover: hover) { .st-ss-list .st-ss-opt.st-ss-ph:hover { background: var(--pm-bg-eff6ff, #eff6ff); } }
.st-ss-opt.st-ss-on { font-weight: 600; color: var(--pm-fg-1d4ed8, #1d4ed8); }
.st-ss-opt.st-ss-act { background: var(--pm-bg-eff6ff, #eff6ff); }
@media (hover: hover) { .st-ss-opt:hover { background: var(--pm-bg-eff6ff, #eff6ff); } }
.st-ss-none { padding: 11px 10px; color: var(--pm-fg-6b7280, #6b7280); font-size: .95rem; }

/* ==========================================================================
   Legacy popup headers -> new style everywhere (2026-10-31).
   Any header inside a sheet (st-sheet / st-auto, Bootstrap .modal.st-bs, page overlay .st-ov-d) is light:
   white bar, dark title, grey round X, no title icon. The :is(#st-n#st-n, ...) trick lifts specificity
   above page rules such as "#insuranceModal .modal-header, .bg-slate { background: slate !important }".
   ========================================================================== */
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(.modal-header, .card-header, .pm-modal-header, .st-ov-h) {
    background: var(--pm-bg-fff, #fff) !important; background-image: none !important; color: var(--pm-fg-111827, #111827) !important;
    border-bottom: 1px solid var(--pm-bd-eef0f3, #eef0f3) !important; border-radius: 0 !important;
}
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(.modal-header, .card-header, .pm-modal-header, .st-ov-h) :is(h1, h2, h3, h4, h5, h6, .modal-title, .pm-modal-title, span, label, small, i):not(.badge):not(.btn):not(.btn *):not(.badge *) {
    color: var(--pm-fg-111827, #111827) !important;
}
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(.modal-header, .card-header, .pm-modal-header, .st-ov-h) :is(h1, h2, h3, h4, h5, h6, .modal-title, .pm-modal-title) {
    font-size: 1.1rem !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important;
}
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(.modal-header, .card-header, .pm-modal-header, .st-ov-h) :is(h1, h2, h3, h4, h5, h6, .modal-title, .pm-modal-title) > i.bi { display: none !important; }
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(.modal-header, .card-header, .pm-modal-header, .st-ov-h) .btn-close {
    filter: none !important; opacity: .6; background-color: var(--pm-bg-f3f4f6, #f3f4f6); border-radius: 50%;
}
/* Labels: normal case in every sheet. */
html body :is(#st-n#st-n, .st-sheet, .modal.st-bs, .st-ov-d) :is(label.text-uppercase, .form-label.text-uppercase, .micro-label, .form-label) {
    text-transform: none !important; letter-spacing: 0 !important;
}
/* Footer with a Save/Delete action: the X closes, so Cancel/Close buttons go (one action button). */
html body :is(.st-sheet, .modal.st-bs, .st-ov-d):has(.pm-modal-x, .st-sheet-x, .btn-close) :is(.modal-footer, .pm-modal-foot, .card-footer, .st-ov-f):has(.btn-primary, .btn-success, .btn-danger) .pm-btn-cancel:not(.btn-primary):not(.btn-success):not(.btn-danger) {
    display: none !important;
}
/* modal-fullscreen-sm-down dialogs are sheets too: on phones size to content, rounded top. */
@media (max-width: 576px) {
    html body .modal.st-bs .modal-dialog.modal-fullscreen-sm-down { height: auto !important; width: 100% !important; max-width: 100% !important; }
    html body .modal.st-bs .modal-fullscreen-sm-down .modal-content { height: auto !important; max-height: 90dvh; border-radius: 16px 16px 0 0 !important; }
}

/* No sideways scroll in any st-sheet popup (iPhone): the body only scrolls up/down, and wide content
   (long select text, iOS date inputs with their own min width, bootstrap .row gutters) is held to the column. */
html body .st-sheet .st-sheet-body { overflow-x: hidden; }
html body .st-sheet .st-sheet-body .row { margin-left: 0; margin-right: 0; }
html body .st-sheet .st-sheet-body [class*="col"], html body .st-sheet .st-field { min-width: 0; }
html body .st-sheet input, html body .st-sheet select, html body .st-sheet textarea { min-width: 0; max-width: 100%; box-sizing: border-box; }
html body .st-sheet select { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
html body .st-sheet input[type="date"] { -webkit-min-logical-width: 0; min-width: 0; width: 100%; }
html body .st-sheet input[type="date"]::-webkit-date-and-time-value { text-align: left; }

/* Multiselect dropdown (js/site.js stMultiSelectInit) */
.st-ms-btn { display: block; width: 100%; text-align: left; background-color: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 10px; min-height: 40px; padding: .45rem 2.25rem .45rem .75rem; font-size: .95rem; color: var(--pm-fg-1f2937, #1f2937); -webkit-tap-highlight-color: transparent; }
.st-ms-btn span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.st-ms-btn.st-ms-empty { color: var(--pm-fg-6b7280, #6b7280); }
.st-ms-btn:active, .st-ms-btn:hover { background-color: var(--pm-bg-fff, #fff); }
html body .st-ms-list { display: none !important; }
html body .st-ms-list.st-ms-open { display: block !important; position: fixed; z-index: 10050; background: var(--pm-bg-fff, #fff); border: 1px solid var(--pm-bd-d1d5db, #d1d5db); border-radius: 10px; box-shadow: 0 10px 30px rgba(15,23,42,.18); overflow-y: auto; padding: 4px 0; -webkit-overflow-scrolling: touch; }
html body .st-ms-list.st-ms-open input[type=checkbox] { position: static !important; opacity: 1 !important; width: 18px !important; height: 18px !important; margin: 0 10px 0 12px !important; vertical-align: middle; flex: none; accent-color: #0d6efd; }
html body .st-ms-list.st-ms-open label { display: inline-flex !important; align-items: center; width: calc(100% - 44px); border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--pm-fg-1f2937, #1f2937) !important; padding: 9px 12px 9px 0 !important; margin: 0 !important; font-size: .95rem !important; cursor: pointer; vertical-align: middle; -webkit-tap-highlight-color: transparent; }
html body .st-ms-list.st-ms-open label:has(input) { width: 100%; padding-left: 0 !important; }
html body .st-ms-list.st-ms-open br { display: none; }

/* Keyboard open on a phone (js/site.js viewportVars adds html.pm-kb-open and --pm-kb): sheets keep their height and
   stay flush at the bottom; their scroll area gets the keyboard height as extra bottom room so the focused field
   can be scrolled above the keyboard. */
@media (max-width: 767.98px) {
    html.pm-kb-open body .st-sheet .st-sheet-body,
    html.pm-kb-open body .modal.show .modal-body,
    html.pm-kb-open body [data-pm-fit="1"] { padding-bottom: calc(16px + var(--pm-kb, 0px)) !important; }
}
