/* _content/MLClient/Components/Layout/AnonymousLayout.razor.rz.scp.css */
body[b-xbzxefo7hu] {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--background) / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: hsl(var(--foreground) / var(--tw-text-opacity));
    -webkit-font-feature-settings: "rlig" 1, "calt" 1;
    font-feature-settings: "rlig" 1, "calt" 1;
}

.bg-background[b-xbzxefo7hu] {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--background) / var(--tw-bg-opacity));
}
/* _content/MLClient/Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-lifmgtkjzf] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-lifmgtkjzf] {
    flex: 1;
}

.sidebar[b-lifmgtkjzf] {
    --tw-bg-opacity: 1;
    background-color: rgb(236 249 247);
    width: 17rem;
    height: 100dvh;
    display: flex;
    flex-direction: column;
}

/*.bg-\[\#ECF9F7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(236 249 247 / var(--tw-bg-opacity) 1 );
}*/

.top-row[b-lifmgtkjzf] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-lifmgtkjzf]  a, .top-row .btn-link[b-lifmgtkjzf] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-lifmgtkjzf] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

.bg-background[b-lifmgtkjzf] {
    --tw-bg-opacity: 1;
    background-color: hsl(var(--background) / var(--tw-bg-opacity));
}

.border-main[b-lifmgtkjzf] {
    border-style: solid;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(198 223 231 / var(--tw-border-opacity));
}


@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-lifmgtkjzf] {
        display: none;
    }

    .top-row.auth[b-lifmgtkjzf] {
        justify-content: space-between;
    }

    .top-row a[b-lifmgtkjzf], .top-row .btn-link[b-lifmgtkjzf] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-lifmgtkjzf] {
        flex-direction: row;
    }

    .sidebar[b-lifmgtkjzf] {
        width: 17rem;
        height: 100dvh;
        /*position: sticky;
        top: 0;*/
    }

        .sidebar.sidebar-animate[b-lifmgtkjzf] {
            transition: width 0.2s ease, flex-basis 0.2s ease;
        }

        /* Icon rail (NavMenu's collapse toggle). flex-basis pinned so the w-100 content sibling can't squeeze it. */
        .sidebar.sidebar-collapsed[b-lifmgtkjzf] {
            width: 4.25rem;
            flex: 0 0 4.25rem;
        }

    .top-row[b-lifmgtkjzf] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row[b-lifmgtkjzf] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}


#blazor-error-ui[b-lifmgtkjzf] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-lifmgtkjzf] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }
/* _content/MLClient/Components/Layout/NavMenu.razor.rz.scp.css */

.navbar-toggler[b-yjf6bli1zr] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-yjf6bli1zr] {
    height: 5.5rem;
}

.navbar-brand[b-yjf6bli1zr] {
    font-size: 1.1rem;
}

.oi[b-yjf6bli1zr] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.bi[b-yjf6bli1zr] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-yjf6bli1zr] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-yjf6bli1zr] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-yjf6bli1zr] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-yjf6bli1zr] {
    font-size: 1rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-yjf6bli1zr] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-yjf6bli1zr] {
        padding-bottom: 1rem;
    }

    .nav-item[b-yjf6bli1zr]  a {
        color: #000000;
        height: 2rem;
        display: flex;
        align-items: center;
        line-height: 2rem;
    }

    /* Every row is exactly one line tall in BOTH modes. A label that wrapped ("Training Management",
       "Ask Mission Lens (beta)") spilled out of the fixed 2rem link, so expanded rows were taller and
       uneven while the icon rail's rows were uniform — after a click on the rail the pointer (and the
       hover/focus highlight) landed on a different item than the one clicked. */
    .nav-item .bi[b-yjf6bli1zr] {
        flex-shrink: 0;
    }

    .nav-label[b-yjf6bli1zr] {
        flex: 1 1 auto;
        min-width: 0;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

        .nav-item[b-yjf6bli1zr]  a.active {
            border-left-style: solid;
            --tw-bg-opacity: 1;
            background-color: rgb(46 202 127 / var(--tw-bg-opacity));
            color: white;
            border-left-width: 6px;
            --tw-border-opacity: 1;
            border-color: rgb(26 45 98 / var(--tw-border-opacity));
        }

.border-blue[b-yjf6bli1zr] {
    --tw-border-opacity: 1;
    border-color: rgb(26 45 98 / var(--tw-border-opacity));
}

.border-l[b-yjf6bli1zr] {
    border-left-width: 6px;
}

.nav-item[b-yjf6bli1zr]  a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(46 202 127 / var(--tw-bg-opacity));
    color: white;
}

.arrow-icon[b-yjf6bli1zr] {
    display: inline-block;
    width: 0.6rem;
    height: 0.6rem;
    border-right: 2px solid #333;
    border-bottom: 2px solid #333;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
}

    .arrow-icon.open[b-yjf6bli1zr] {
        transform: rotate(-135deg);
    }


.nav-link span[b-yjf6bli1zr] {
    top: -5px;
}

.sidebar-account[b-yjf6bli1zr] {
    margin-top: auto; /* pushes it to the bottom */
    width: 100%;
    /*display: flex;
    justify-content: start;*/
    padding: 0 10px 1rem 10px; /* add bottom padding for breathing room */
}


.popup-menu-container[b-yjf6bli1zr] {
    position: relative;
    display: inline-block;
}

.notification-list[b-yjf6bli1zr] {
    max-height: 450px;
    overflow-y: auto;
    margin: 0;
    padding: 0;
    list-style: none;
}

.popup-menu[b-yjf6bli1zr] {
    position: absolute;
    bottom: 60px;
    left: 0;
    z-index: 1000;
    display: block;
    min-width: 180px;
    margin: 0.25rem 0 0;
    padding: 0.5rem 0;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.15);
    list-style: none;
}

    .popup-menu li[b-yjf6bli1zr] {
        padding: 0.5rem 1rem;
        cursor: pointer;
    }

        .popup-menu li:hover[b-yjf6bli1zr] {
            background-color: #f1f1f1;
        }

@media (min-width: 641px) {
    .navbar-toggler[b-yjf6bli1zr] {
        display: none;
    }

    .nav-scrollable[b-yjf6bli1zr] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    
}

@media (max-width: 640px) {
    .sidebar-account[b-yjf6bli1zr] {
        display:none;
    }
}
/* ---- Sidebar shell + collapse toggle (all widths) ---- */

/* NavMenu's root: takes over .sidebar's flex-column role so .sidebar-account's margin-top:auto still works. */
.nav-shell[b-yjf6bli1zr] {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
}

/* Expanded brand row: wordmark left, toggle right, ONE row. Bootstrap's .navbar > .container-fluid
   wraps by default, and 220px wordmark + paddings + a 2rem button overflow the 17rem sidebar, so the
   toggle used to drop under the logo. Never wrap; let the wordmark shrink a few px instead. */
.brand-row[b-yjf6bli1zr] {
    flex-wrap: nowrap;
    align-items: center;
    gap: 0.5rem;
}

    .brand-row .navbar-brand[b-yjf6bli1zr] {
        flex: 1 1 auto;
        min-width: 0;
        margin-right: 0;
    }

.brand-wordmark[b-yjf6bli1zr] {
    max-width: 100%;
    height: auto;
}

.sidebar-toggle[b-yjf6bli1zr] {
    width: 2rem;
    height: 2rem;
    padding: 0;
    border: 0;
    border-radius: 0.5rem;
    /* Same colours as the selected nav item (.nav-item ::deep a.active): green fill, white glyph. */
    background-color: #2eca7f;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    cursor: pointer;
    flex-shrink: 0;
}

    .sidebar-toggle:hover[b-yjf6bli1zr] {
        background-color: #25b571;
    }

    .sidebar-toggle:focus-visible[b-yjf6bli1zr] {
        outline: 2px solid #1a2d62;
        outline-offset: 2px;
    }

    /* Undo the nav-icon sizing/margins the generic .bi rule above applies. */
    .sidebar-toggle .bi[b-yjf6bli1zr] {
        width: auto;
        height: auto;
        margin: 0;
        top: 0;
        font-size: 1rem;
        font-weight: 700;
    }

@media (max-width: 640.98px) {
    .sidebar-toggle[b-yjf6bli1zr] {
        display: none; /* mobile keeps the hamburger; rail mode is desktop-only */
    }
}

/* ---- Icon-rail (collapsed) mode: desktop only ----
   Clicking any nav link in the rail expands the menu for real (NavMenu.ExpandFromNavAsync — same
   as the >> button, preference saved). No hover behaviour on purpose; only << collapses it. */
@media (min-width: 641px) {
    /* Brand row in the rail: no logo at all, just the toggle centred. Bootstrap ps-3 is !important. */
    .nav-collapsed .top-row[b-yjf6bli1zr] {
        padding-left: 0 !important;
    }

    .nav-collapsed .brand-row[b-yjf6bli1zr] {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .nav-collapsed .navbar-brand[b-yjf6bli1zr] {
        display: none;
    }

    /* Location dropdown + notification bell: invisible in the rail, but STILL taking their space so
       every nav row sits at the same height in both modes (display:none shifted the list up, so the
       icon you clicked in the rail was under a different item once the menu expanded). Not
       clickable/focusable while hidden; overflow clipped so the wide select can't poke out of the rail. */
    .nav-collapsed .sidebar-tools[b-yjf6bli1zr] {
        visibility: hidden;
        overflow: hidden;
    }

    /* Nav links: icon only, centred. px-3 / px-2 are Bootstrap !important utilities. */
    .nav-collapsed .nav-item[b-yjf6bli1zr] {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

        .nav-collapsed .nav-item[b-yjf6bli1zr]  a {
            justify-content: center;
            padding-left: 0 !important;
            padding-right: 0 !important;
        }

            .nav-collapsed .nav-item[b-yjf6bli1zr]  a.active {
                border-left-width: 4px; /* keep the navy accent, slimmer so the icon stays centred */
            }

        .nav-collapsed .nav-item .bi[b-yjf6bli1zr] {
            margin-right: 0;
        }

    /* Label stays in the DOM for screen readers; only visually removed. */
    .nav-collapsed .nav-label[b-yjf6bli1zr] {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }

    /* Account block: gear only in the rail. */
    .nav-collapsed .sidebar-account[b-yjf6bli1zr] {
        padding: 0 0.25rem 1rem 0.25rem;
    }

    .nav-collapsed .popup-menu-container[b-yjf6bli1zr] {
        width: 100%;
    }

    .nav-collapsed .account-inner[b-yjf6bli1zr] {
        justify-content: center;
    }

    .nav-collapsed .account-button .bi[b-yjf6bli1zr] {
        margin-right: 0;
    }

    /* The name/email block carries Bootstrap's d-flex (display:flex !important), so a plain
       display:none never won and the text spilled out of the rail beside the gear. */
    .nav-collapsed .account-text[b-yjf6bli1zr] {
        display: none !important;
    }
}
/* _content/MLClient/Components/Pages/Admin/Escalation-Group-Detail.razor.rz.scp.css */
.tag-container[b-qusp4jb8uy] {
    align-items: center;
    min-height: 40px;
    padding: 5px;
    cursor: text;
}

.tag[b-qusp4jb8uy] {
    display: inline-flex;
    align-items: center;
    background-color: rgb(236 249 247);
    border-radius: 5px;
    padding: 4px 8px;
    margin: 2px;
    font-size: 0.9rem;
}

.remove-btn[b-qusp4jb8uy] {
    background: none;
    border: none;
    color: #555;
    margin-left: 6px;
    cursor: pointer;
    font-weight: bold;
}

    .remove-btn:hover[b-qusp4jb8uy] {
        color: #d9534f;
    }

.tag-input[b-qusp4jb8uy] {
    cursor: pointer;
    border: none;
    border-bottom: 1px solid #ccc;
    margin-left: 4px;
    outline: none;
    padding: 2px 4px;
    font-size: 0.9rem;
    min-width: 120px;
    white-space: nowrap;
    overflow: hidden;
}

    .tag-input:focus[b-qusp4jb8uy] {
        border-bottom-color: #007bff;
    }
/* _content/MLClient/Components/Pages/AskMissionLens.razor.rz.scp.css */
.ask-ml-footer[b-omcrefkwlo] {
    flex-direction: column;
    gap: 6px;
}

.ask-ml-escalate-btn[b-omcrefkwlo] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 24px;
    border: 1px solid rgba(46, 202, 127, 0.4);
    border-radius: 999px;
    background: rgba(46, 202, 127, 0.08);
    color: #1a7a4c;
    font-size: 0.88rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    white-space: nowrap;
}

.ask-ml-escalate-btn:hover:not(:disabled)[b-omcrefkwlo] {
    background: rgba(46, 202, 127, 0.18);
    border-color: rgba(46, 202, 127, 0.6);
}

.ask-ml-escalate-btn:disabled[b-omcrefkwlo] {
    opacity: 0.6;
    cursor: not-allowed;
}

.ask-ml-escalate-btn i[b-omcrefkwlo] {
    font-size: 1rem;
}
/* _content/MLClient/Components/Pages/Escalation.razor.rz.scp.css */
.tag-container[b-ff5xjssfx5] {
    
    align-items: center;
    min-height: 40px;
    padding: 5px;
    
    cursor: text;
}

.tag[b-ff5xjssfx5] {
    display: inline-flex;
    align-items: center;
    background-color: rgb(236 249 247);
    border-radius: 5px;
    padding: 4px 8px;
    margin: 2px;
    font-size: 0.9rem;
}

.remove-btn[b-ff5xjssfx5] {
    background: none;
    border: none;
    color: #555;
    margin-left: 6px;
    cursor: pointer;
    font-weight: bold;
}

    .remove-btn:hover[b-ff5xjssfx5] {
        color: #d9534f;
    }

.tag-input[b-ff5xjssfx5] {
    cursor: pointer;
    border: none;
    border-bottom: 1px solid #ccc;
    margin-left: 4px;
    outline: none;
    padding: 2px 4px;
    font-size: 0.9rem;
    min-width: 120px;
    white-space: nowrap;
    overflow:hidden
}

    .tag-input:focus[b-ff5xjssfx5] {
        border-bottom-color: #007bff;
    }

.auto-textarea[b-ff5xjssfx5] {
    overflow: hidden;
    resize: none;
    min-height: 40px;
}

.auto-textarea:focus[b-ff5xjssfx5] {
    height: auto;
}

.auto-textarea[b-ff5xjssfx5] {
    height: auto;
}


table[b-ff5xjssfx5] {
    width: 100%;
}

th[b-ff5xjssfx5], td[b-ff5xjssfx5] {
    padding: 8px;
    vertical-align: top;
}

th[b-ff5xjssfx5] {
    background-color: #f7f7f7;
}
/* _content/MLClient/Components/Pages/Home.razor.rz.scp.css */
/* Toolbar */
.tag-toolbar[b-djuf1h5vk2] {
    border: 1px solid #dee2e6;
}

/* Grid layout: two equal columns */
.tag-grid[b-djuf1h5vk2] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
    align-items: start;
}

/* Column */
.tag-column[b-djuf1h5vk2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-height: 100px;
}

/* Block */
.tag-block[b-djuf1h5vk2] {
    background: #f0faf4;
    border: 2px solid #b8e6c8;
    border-radius: 0.75rem;
    padding: 1.1rem 1.25rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    position: relative;
}

.tag-block:hover[b-djuf1h5vk2] {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Private block — pink background */
.tag-block-private[b-djuf1h5vk2] {
    background: #fdf0f3;
    border-color: #e6b8c8;
}

.tag-block-private .tag-block-title[b-djuf1h5vk2] {
    color: #3a2d32;
    border-bottom-color: #e6c8d0;
}

/* Rearranging mode styles */
.tag-block-rearranging[b-djuf1h5vk2] {
    border: 2px dashed #6c757d;
    background: #f8f9fa;
}

/* Editable block — click to edit mode */
.tag-block-editable[b-djuf1h5vk2] {
    cursor: pointer;
    border: 2px solid #7ecf96;
    background: #e8f7ed;
}

.tag-block-editable:hover[b-djuf1h5vk2] {
    border-color: #3db06a;
    box-shadow: 0 0 0 2px rgba(61, 176, 106, 0.18);
}

.tag-block-private.tag-block-editable[b-djuf1h5vk2] {
    border-color: #d98ea6;
    background: #fce8ee;
}

.tag-block-private.tag-block-editable:hover[b-djuf1h5vk2] {
    border-color: #c46a86;
    box-shadow: 0 0 0 2px rgba(196, 106, 134, 0.18);
}

/* Edit/delete icons on block */
.tag-edit-icons[b-djuf1h5vk2] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: flex;
    gap: 0.4rem;
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.tag-block-editable:hover .tag-edit-icons[b-djuf1h5vk2] {
    opacity: 1;
}

.tag-edit-icon-btn[b-djuf1h5vk2],
.tag-delete-icon-btn[b-djuf1h5vk2] {
    font-size: 1rem;
    cursor: pointer;
    transition: color 0.15s ease;
}

.tag-edit-icon-btn[b-djuf1h5vk2] {
    color: #3db06a;
}

.tag-edit-icon-btn:hover[b-djuf1h5vk2] {
    color: #2e8b50;
}

.tag-delete-icon-btn[b-djuf1h5vk2] {
    color: #dc3545;
}

.tag-delete-icon-btn:hover[b-djuf1h5vk2] {
    color: #a71d2a;
}

/* Share actions */
.tag-share-actions[b-djuf1h5vk2] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    opacity: 0.55;
    transition: opacity 0.2s ease;
}

.tag-block:hover .tag-share-actions[b-djuf1h5vk2] {
    opacity: 1;
}

.tag-share-btn[b-djuf1h5vk2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.7rem;
    height: 1.7rem;
    border: none;
    border-radius: 0.35rem;
    background: rgba(255, 255, 255, 0.82);
    color: #2e7d4f;
    font-size: 0.9rem;
    transition: background 0.15s ease, color 0.15s ease;
}

.tag-share-btn:hover:not(:disabled)[b-djuf1h5vk2] {
    background: #3db06a;
    color: #fff;
}

.tag-share-btn:disabled[b-djuf1h5vk2] {
    cursor: not-allowed;
    color: #adb5bd;
}

.tag-share-btn[b-djuf1h5vk2]::after {
    display: none;
}

/* Rearrange buttons */
.tag-rearrange-btns[b-djuf1h5vk2] {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    display: flex;
    gap: 0.3rem;
}

.tag-rearrange-btn[b-djuf1h5vk2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border-radius: 0.35rem;
    font-size: 0.85rem;
    cursor: pointer;
    background: #e9ecef;
    color: #2e7d4f;
    transition: background 0.15s ease, color 0.15s ease;
}

.tag-rearrange-btn:hover[b-djuf1h5vk2] {
    background: #3db06a;
    color: #fff;
}

.tag-rearrange-btn-cross:hover[b-djuf1h5vk2] {
    background: #0d6efd;
    color: #fff;
}

/* Block content — white inner area */
.tag-block-content[b-djuf1h5vk2] {
    width: 100%;
    background: #fff;
    border-radius: 0.5rem;
    padding: 0.75rem 0.85rem;
}


/* Block title — sits on the green background above white content */
.tag-block-title[b-djuf1h5vk2] {
    font-weight: 800;
    font-size: 0.85rem;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #2d3a32;
    margin-bottom: 0.6rem;
}

/* TextGridBlock — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-text-block {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

[b-djuf1h5vk2] .tag-text-line {
    padding: 0.4rem 0.5rem;
    border-bottom: 1px solid #eef3f0;
    font-size: 0.95rem;
    color: #2d3a32;
}

[b-djuf1h5vk2] .tag-text-line:last-child {
    border-bottom: none;
}

/* WhenWhatWhoBlock — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-www-block {
    display: flex;
    flex-direction: column;
    gap: 0;
}

[b-djuf1h5vk2] .tag-www-record {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 1.25rem;
    row-gap: 0.1rem;
    padding: 0.5rem 0.5rem;
    border-bottom: 1px solid #eef3f0;
    margin-bottom: 0.35rem;
}

[b-djuf1h5vk2] .tag-www-record:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

[b-djuf1h5vk2] .tag-www-when {
    font-weight: 700;
    font-size: 0.95rem;
    color: #2d3a32;
    white-space: nowrap;
}

/* The optional time chip sits inside the When text; the chip style itself is the Facilities one. */
[b-djuf1h5vk2] .tag-www-when .tag-fac-chip {
    margin-left: 0.35rem;
    font-weight: 600;
}

[b-djuf1h5vk2] .tag-www-sep {
    color: #8fa898;
    font-size: 0.9rem;
    padding: 0 0.15rem;
}

[b-djuf1h5vk2] .tag-www-what {
    font-size: 0.95rem;
    color: #2d3a32;
}

[b-djuf1h5vk2] .tag-www-who {
    font-size: 0.95rem;
    color: #3d4f43;
}

/* Branch Hours in the toolbar: one "Branch hours: … | More | Set up" line beside the page title (the block has no card). */
.tag-hours-header[b-djuf1h5vk2] {
    min-width: 0;
}

/* FacilitiesGridBlock — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-fac-block {
    display: flex;
    flex-direction: column;
    gap: 0;
}

[b-djuf1h5vk2] .tag-fac-record {
    padding: 0.6rem 0.5rem;
    border-bottom: 1px solid #eef3f0;
}

[b-djuf1h5vk2] .tag-fac-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 0.55rem;
    row-gap: 0.25rem;
}

[b-djuf1h5vk2] .tag-fac-record:last-child {
    border-bottom: none;
}

[b-djuf1h5vk2] .tag-fac-name {
    font-weight: 600;
    font-size: 0.95rem;
    color: #2d3a32;
}

[b-djuf1h5vk2] .tag-fac-sep {
    color: #8fa898;
    font-size: 0.9rem;
    padding: 0 0.15rem;
}

[b-djuf1h5vk2] .tag-fac-status {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.15rem 0.6rem;
    border-radius: 0.75rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

[b-djuf1h5vk2] .tag-fac-status-open {
    background: #d4edda;
    color: #155724;
}

[b-djuf1h5vk2] .tag-fac-status-closed {
    background: #f8d7da;
    color: #721c24;
}

/* Open right now, but a closure starts later today — neither green nor red is honest. */
[b-djuf1h5vk2] .tag-fac-status-modified {
    background: #fff3cd;
    color: #7a5c00;
}

[b-djuf1h5vk2] .tag-fac-now {
    font-size: 0.92rem;
    color: #6c757d;
}

/* One closure still ahead, indented under the facility it belongs to. */
[b-djuf1h5vk2] .tag-fac-sub {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 0.55rem;
    row-gap: 0.2rem;
    margin: 0.4rem 0 0 0.85rem;
    padding-left: 0.8rem;
    border-left: 3px solid #e4ece7;
    font-size: 0.9rem;
}

[b-djuf1h5vk2] .tag-fac-when {
    color: #4a5a50;
    min-width: 5.5rem;
}

[b-djuf1h5vk2] .tag-fac-reason {
    color: #7b8b81;
}

[b-djuf1h5vk2] .tag-fac-chip {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 0.45rem;
    white-space: nowrap;
}

/* Pink = the space is unavailable. The amber chip beside it only says WHEN, so it never
   appears on its own — an amber chip alone would read as "open during these hours". */
[b-djuf1h5vk2] .tag-fac-chip-closed {
    background: #fbe3e5;
    color: #8b2b34;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

/* Green = a day of limited hours: the space IS available, only for the stated window. */
[b-djuf1h5vk2] .tag-fac-chip-open {
    background: #d4edda;
    color: #155724;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

[b-djuf1h5vk2] .tag-fac-chip-hours {
    background: #fdf2cf;
    color: #7a5c00;
}

/* A reading, not a status — deliberately neither green/amber/pink so it can't be misread as one. */
[b-djuf1h5vk2] .tag-fac-chip-temp {
    background: #e2f0f7;
    color: #1d5670;
    font-weight: 700;
}

[b-djuf1h5vk2] .tag-fac-stale {
    color: #b02a37;
    border-left-color: #f1c9cd;
}

[b-djuf1h5vk2] .tag-fac-expired {
    color: #dc3545;
    font-weight: 600;
}

/* LinksBlock — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-links-block {
    display: flex;
    flex-direction: column;
    gap: 0;
}

[b-djuf1h5vk2] .tag-link-record {
    display: flex;
    align-items: center;
    column-gap: 0.5rem;
    padding: 0.45rem 0.5rem;
    border-bottom: 1px solid #eef3f0;
}

[b-djuf1h5vk2] .tag-link-record:last-child {
    border-bottom: none;
}

[b-djuf1h5vk2] .tag-link-icon {
    font-size: 1rem;
    color: #3db06a;
}

[b-djuf1h5vk2] .tag-link-sep {
    color: #8fa898;
    font-size: 0.9rem;
    padding: 0 0.15rem;
}

[b-djuf1h5vk2] .tag-link-anchor {
    font-size: 0.95rem;
    color: #0d6efd;
    text-decoration: none;
    font-weight: 500;
}

[b-djuf1h5vk2] .tag-link-anchor:hover {
    text-decoration: underline;
    color: #0a58ca;
}

/* ProgramCapacityBlock — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-cap-block {
    display: flex;
    flex-direction: column;
    gap: 0;
}

[b-djuf1h5vk2] .tag-cap-record {
    padding: 0.6rem 0.5rem;
    border-bottom: 1px solid #eef3f0;
}

[b-djuf1h5vk2] .tag-cap-record:last-child {
    border-bottom: none;
}

[b-djuf1h5vk2] .tag-cap-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 0.35rem;
}

[b-djuf1h5vk2] .tag-cap-name {
    font-weight: 700;
    font-size: 0.95rem;
    color: #2d3a32;
}

[b-djuf1h5vk2] .tag-cap-fraction {
    font-size: 0.9rem;
    color: #3d4f43;
    font-weight: 500;
}

[b-djuf1h5vk2] .tag-cap-status {
    font-size: 0.85rem;
    color: #63736a;
    font-weight: 600;
    text-align: right;
}

[b-djuf1h5vk2] .tag-cap-taken-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
    border: 1px solid #d6e0db;
    border-radius: 999px;
    padding: 0.12rem 0.55rem;
    font-size: 0.82rem;
    color: #53655b;
    background: #f4f7f5;
    font-weight: 600;
}

[b-djuf1h5vk2] .tag-cap-meta {
    font-size: 0.82rem;
    color: #63736a;
    margin-bottom: 0.35rem;
}

[b-djuf1h5vk2] .tag-cap-note {
    font-size: 0.82rem;
    color: #63736a;
    margin-top: 0.3rem;
}

[b-djuf1h5vk2] .tag-cap-bar-track {
    width: 100%;
    height: 10px;
    background: #dde3df;
    border-radius: 5px;
    overflow: hidden;
}

[b-djuf1h5vk2] .tag-cap-bar-fill {
    height: 100%;
    background: #2e7d4f;
    border-radius: 5px;
    transition: width 0.3s ease;
}

/* A session with several payment options — the header toggles the list open. */
[b-djuf1h5vk2] .tag-cap-group-header {
    cursor: pointer;
    user-select: none;
}

[b-djuf1h5vk2] .tag-cap-group-header:hover .tag-cap-name {
    color: #2e7d4f;
}

[b-djuf1h5vk2] .tag-cap-chevron {
    font-size: 0.7rem;
    margin-right: 0.35rem;
    color: #63736a;
}

[b-djuf1h5vk2] .tag-cap-options {
    margin-top: 0.4rem;
    border-left: 2px solid #e3eae6;
    padding-left: 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

/* "More" / "Less" pill under a live-data list longer than 4 records (Daxko schedule, Daxko
   capacity, GroupEx Pro, YMCA360). A sibling of the list, so its :last-child border rule holds.
   Its TOP edge sits on the white box's bottom edge, its top half fills the pink strip between the
   box and the card's border, and its bottom half hangs OUTSIDE the card (owner's call, 10 Sep
   2026). So: pill height = 2 × (card bottom padding 1.1rem + 2px border); the row is pulled up by
   the box's bottom padding + the pill height so the box ends exactly where the pill starts; and
   the card carries .tag-block-with-pill (Home.razor, HasMoreLessPill) for a margin equal to the
   hanging half, so the next card is pushed down rather than overlapped. If the card or box padding
   changes, these three numbers change with it. The pill wears the CARD's colours (background fill,
   border outline, title text) and follows the card's private / Edit-mode shades below.
   ::deep because the pill comes from RenderTreeBuilder. */
[b-djuf1h5vk2] .tag-more-row {
    --tag-more-pill-h: calc(2.2rem + 4px);
    display: flex;
    justify-content: center;
    margin-bottom: calc(-0.75rem - var(--tag-more-pill-h));
    position: relative;
    z-index: 1;
}

[b-djuf1h5vk2] .tag-more-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    height: var(--tag-more-pill-h);
    min-width: min(12rem, 92%); /* about twice the width the text alone would give it */
    border: 2px solid #b8e6c8;
    border-radius: 999px;
    background: #f0faf4;
    color: #2d3a32;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    line-height: 1;
    padding: 0 1rem;
    cursor: pointer;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
    transition: background 0.15s ease, border-color 0.15s ease;
}

[b-djuf1h5vk2] .tag-more-pill:hover {
    background: #b8e6c8;
}

[b-djuf1h5vk2] .tag-more-pill:focus-visible {
    outline: 2px solid #3db06a;
    outline-offset: 2px;
}

/* Room for the pill's hanging half (card bottom padding + border) before the next card. */
.tag-block-with-pill[b-djuf1h5vk2] {
    margin-bottom: calc(1.1rem + 2px);
}

[b-djuf1h5vk2] .tag-more-pill .bi {
    font-size: 0.75rem;
}

/* The four collapsible blocks are always private (pink), and every card shifts shade in Edit
   mode — the pill takes the same background + border as the card it hangs off. */
.tag-block-private[b-djuf1h5vk2]  .tag-more-pill {
    background: #fdf0f3;
    border-color: #e6b8c8;
    color: #3a2d32;
}

.tag-block-private[b-djuf1h5vk2]  .tag-more-pill:hover {
    background: #e6b8c8;
}

.tag-block-editable[b-djuf1h5vk2]  .tag-more-pill {
    background: #e8f7ed;
    border-color: #7ecf96;
}

.tag-block-editable[b-djuf1h5vk2]  .tag-more-pill:hover {
    background: #7ecf96;
}

.tag-block-private.tag-block-editable[b-djuf1h5vk2]  .tag-more-pill {
    background: #fce8ee;
    border-color: #d98ea6;
}

.tag-block-private.tag-block-editable[b-djuf1h5vk2]  .tag-more-pill:hover {
    background: #d98ea6;
}

[b-djuf1h5vk2] .tag-cap-option {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 0.75rem;
}

[b-djuf1h5vk2] .tag-cap-option-name {
    font-size: 0.85rem;
    color: #3d4f43;
}

.tag-daxko-program-picker[b-djuf1h5vk2] {
    max-height: 260px;
    overflow-y: auto;
    border: 1px solid #dee6e1;
    border-radius: 6px;
}

.tag-daxko-program-option[b-djuf1h5vk2] {
    padding: 0.55rem 0.75rem 0.55rem 2.25rem;
    border-bottom: 1px solid #eef3f0;
}

.tag-daxko-program-option:last-child[b-djuf1h5vk2] {
    border-bottom: none;
}

.tag-daxko-program-name[b-djuf1h5vk2] {
    display: block;
    font-weight: 600;
    color: #2d3a32;
}

.tag-daxko-program-count[b-djuf1h5vk2],
.tag-daxko-program-description[b-djuf1h5vk2] {
    display: block;
    font-size: 0.82rem;
    color: #63736a;
}

/* APIBlock loading placeholder — ::deep needed because RenderTreeBuilder elements lack scoping attribute */
[b-djuf1h5vk2] .tag-api-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    padding: 1.5rem 1rem;
    color: #6c757d;
}

[b-djuf1h5vk2] .tag-api-spinner {
    width: 1.25rem;
    height: 1.25rem;
    border: 3px solid #dee2e6;
    border-top-color: #3db06a;
    border-radius: 50%;
    animation: tag-spin-b-djuf1h5vk2 0.8s linear infinite;
}

@keyframes tag-spin-b-djuf1h5vk2 {
    to { transform: rotate(360deg); }
}

[b-djuf1h5vk2] .tag-api-loading-text {
    font-size: 0.9rem;
    font-weight: 500;
    color: #8fa898;
}

/* FlagStatusBlock — flag-on-pole icon + status text (::deep: RenderTreeBuilder markup) */
[b-djuf1h5vk2] .tag-flag-block {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    padding: 0.75rem 0.5rem;
}

[b-djuf1h5vk2] .tag-flag-icon-wrap {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
}

[b-djuf1h5vk2] .tag-flag-icon {
    width: 2rem;
    height: 2.65rem;
}

[b-djuf1h5vk2] .tag-flag-pole {
    fill: #6c757d;
}

[b-djuf1h5vk2] .tag-flag-icon-full .tag-flag-cloth {
    fill: #3db06a;
}

[b-djuf1h5vk2] .tag-flag-icon-half .tag-flag-cloth {
    fill: #b23b3b;
}

[b-djuf1h5vk2] .tag-flag-warning {
    color: #d9a406;
    font-size: 1.6rem;
}

[b-djuf1h5vk2] .tag-flag-status-label {
    font-weight: 600;
    font-size: 1rem;
}

[b-djuf1h5vk2] .tag-flag-reason {
    font-size: 0.9rem;
    color: #495057;
    margin-top: 0.15rem;
}

[b-djuf1h5vk2] .tag-flag-scope {
    font-size: 0.8rem;
    color: #8fa898;
    margin-top: 0.2rem;
}

/* Document picker list item. A <button> so it is Tab-reachable and Enter/Space-operable; the resets
   strip the button chrome, and width + text-align keep it reading as a list row. */
.tag-doc-picker-item[b-djuf1h5vk2] {
    display: flex;
    align-items: center;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    padding: 0.4rem 0.5rem;
    border-radius: 0.35rem;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.12s ease;
}

.tag-doc-picker-item:hover[b-djuf1h5vk2] {
    background: #e8f7ed;
}

/* Mirrors DocumentPicker.razor.css .doc-picker-shared (CSS isolation keeps that one out of reach). */
.tag-doc-picker-shared[b-djuf1h5vk2] {
    margin-left: auto;
    padding-left: 0.5rem;
    flex: none;
    font-size: 0.6875rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

/* Keyboard focus must be visible — the whole point of making these buttons. */
.tag-doc-picker-item:focus-visible[b-djuf1h5vk2] {
    outline: 2px solid #198754;
    outline-offset: -2px;
    background: #e8f7ed;
}

/* Responsive: stack columns on small screens */
@media (max-width: 768px) {
    .tag-grid[b-djuf1h5vk2] {
        grid-template-columns: 1fr;
    }

    /* The hours labels drop onto their own line under the title so the buttons stay reachable. */
    .tag-toolbar[b-djuf1h5vk2] {
        flex-wrap: wrap;
    }

    .tag-hours-header[b-djuf1h5vk2] {
        flex-basis: 100%;
        order: 10;
        margin-left: 0 !important;
    }
}

/* Editor: the Facilities dialog carries seven columns, three of them paired controls (date + time,
   date + time, number + unit), which modal-xl's 1140px squeezes into unusable widths. Wider than any
   Bootstrap size, but capped at the viewport so it still fits a laptop screen. */
/* Editor: the guided setup, step pills like the Schedule Rules wizard. */
.tag-fac-wizard .nav-pills .nav-link[b-djuf1h5vk2] {
    padding: 0.25rem 0.6rem;
    font-size: 0.85rem;
}

.tag-fac-wizard .form-check.border[b-djuf1h5vk2] {
    cursor: pointer;
}

/* Editor: the Add Facility form, tinted so it reads as a pending entry rather than a saved row. */
.tag-fac-addform[b-djuf1h5vk2] {
    background-color: #f6faf7;
    border-color: #cfe6d7;
}

/* Editor: the GroupEx Pro / YMCA360 filter pickers — a scrollable tick list per filter, and the
   chips of everything ticked so the whole selection is readable without scrolling four boxes. */
.tag-api-filter-box[b-djuf1h5vk2] {
    border: 1px solid #ccd6d0;
    border-radius: 0.25rem;
    padding: 0.35rem 0.5rem;
    max-height: 9rem;
    overflow-y: auto;
    background: #fff;
    font-size: 0.88rem;
}

.tag-api-filter-box .form-check[b-djuf1h5vk2] {
    margin-bottom: 0.1rem;
}

/* "Type to find" sits flush on top of its list; the rule separates pinned ticked rows from the rest. */
.tag-api-filter-search[b-djuf1h5vk2] {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    font-size: 0.88rem;
}

.tag-api-filter-search + .tag-api-filter-box[b-djuf1h5vk2] {
    border-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.tag-api-filter-divider[b-djuf1h5vk2] {
    margin: 0.3rem 0;
    opacity: 0.35;
}

.tag-api-filter-chip[b-djuf1h5vk2] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 0.45rem;
    background: #e2f0f7;
    color: #1d5670;
    margin: 0.15rem 0.3rem 0 0;
}

.tag-api-filter-chip .tag-api-filter-kind[b-djuf1h5vk2] {
    font-weight: 400;
    color: #5a7c8c;
    margin-left: 0.3rem;
}

/* ---- Edit dialog: one row at a time ----
   The dialog's row list reuses the card's own row fragments (and the ::deep rules above), wrapped
   in a flex row that adds the action icons on the right and, under the row being changed, the
   inline editor. Rows the card hides today are shaded and labelled rather than left out. */
.tag-row-list[b-djuf1h5vk2] {
    border: 1px solid #dee2e6;
}

/* Every row sits in a wrapper with its editor; the wrapper carries the separator line. */
.tag-row-wrap[b-djuf1h5vk2] {
    border-bottom: 1px solid #eef3f0;
}

.tag-row-wrap:last-of-type[b-djuf1h5vk2] {
    border-bottom: none;
}

.tag-row-item[b-djuf1h5vk2] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

/* The wrapper of the row being edited: one frame around the row AND its editor, so the two read
   as a single control. Inside it the editor gives up its own border and keeps only a divider
   line above the fields. The Facilities entry frame is the same look one level down. */
.tag-row-frame[b-djuf1h5vk2],
.tag-fac-entry-frame[b-djuf1h5vk2] {
    border: 1px solid #b8e6c8;
    border-radius: 0.5rem;
    background: #f3f8f5;
    margin: 0.25rem 0 0.6rem;
}

.tag-row-frame[b-djuf1h5vk2] {
    padding: 0 0.5rem 0.5rem;
}

.tag-fac-entry-frame[b-djuf1h5vk2] {
    padding: 0.15rem 0.5rem 0.5rem;
}

.tag-row-frame .tag-row-editing[b-djuf1h5vk2],
.tag-fac-entry-frame .tag-fac-entry-editing[b-djuf1h5vk2] {
    background: transparent;
}

.tag-row-frame .tag-row-editor[b-djuf1h5vk2],
.tag-fac-entry-frame .tag-row-editor[b-djuf1h5vk2],
.tag-text-table tr.tag-text-editor-row .tag-row-editor[b-djuf1h5vk2] {
    border: 0;
    border-top: 1px solid #d3ecdb;
    border-radius: 0;
    background: transparent;
    padding: 0.6rem 0 0;
    margin: 0.2rem 0 0;
}

.tag-row-body[b-djuf1h5vk2] {
    flex: 1 1 auto;
    min-width: 0;
}

/* Each card row is the only child of its body, so the card's own :last-child "no border" rule
   fires on every one of them — the separator comes from .tag-row-item instead. Same rhythm. */
.tag-row-body[b-djuf1h5vk2]  .tag-text-line,
.tag-row-body[b-djuf1h5vk2]  .tag-www-record,
.tag-row-body[b-djuf1h5vk2]  .tag-fac-record,
.tag-row-body[b-djuf1h5vk2]  .tag-link-record,
.tag-row-body[b-djuf1h5vk2]  .tag-cap-record {
    border-bottom: none;
}

.tag-row-actions[b-djuf1h5vk2] {
    display: flex;
    gap: 0.25rem;
    padding: 0.4rem 0.25rem 0 0;
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.tag-row-item:hover .tag-row-actions[b-djuf1h5vk2],
.tag-row-editing .tag-row-actions[b-djuf1h5vk2] {
    opacity: 1;
}

.tag-row-actions-disabled[b-djuf1h5vk2] {
    pointer-events: none;
    opacity: 0.35;
}

.tag-row-action-btn[b-djuf1h5vk2] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.6rem;
    height: 1.6rem;
    border: none;
    border-radius: 0.35rem;
    font-size: 0.85rem;
    cursor: pointer;
    background: #e9ecef;
    color: #2e7d4f;
    transition: background 0.15s ease, color 0.15s ease;
}

.tag-row-action-btn:hover[b-djuf1h5vk2] {
    background: #3db06a;
    color: #fff;
}

.tag-row-action-btn.tag-row-action-danger:hover[b-djuf1h5vk2] {
    background: #dc3545;
    color: #fff;
}

/* Shaded, not faded: opacity would dim the label that explains why the row is not on the card. */
.tag-row-hidden[b-djuf1h5vk2] {
    background: #f8f9fa;
}

.tag-row-hidden .tag-row-body[b-djuf1h5vk2]  .tag-text-line {
    color: #8a949c;
}

/* A facility's ended closure / past limited-hours day, in the card's sub-line shape. */
.tag-row-body[b-djuf1h5vk2]  .tag-row-hidden-sub {
    background: #f8f9fa;
    color: #8a949c;
    border-radius: 0.3rem;
}

/* Built by RenderTreeBuilder, hence ::deep. Small enough to sit in a sub-line. */
.tag-row-body[b-djuf1h5vk2]  .tag-fac-expired-badge {
    font-size: 0.7rem;
    font-weight: 500;
}

/* Facilities dialog (9 Sep 2026): a facility opens collapsed to its card line; clicking it shows
   every stored entry as its own line under the headline, with edit / delete icons on the right.
   The line itself is the card's sub-line fragment. */
.tag-fac-toggle[b-djuf1h5vk2] {
    cursor: pointer;
}

.tag-fac-entry-row[b-djuf1h5vk2] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
}

.tag-fac-entry-body[b-djuf1h5vk2] {
    flex: 1 1 auto;
    min-width: 0;
}

/* The sub-line carries a 0.4rem top margin; the icons sit on the same baseline. */
.tag-fac-entry-row .tag-row-actions[b-djuf1h5vk2] {
    padding-top: 0.45rem;
}

/* The entry whose editor is open — the same tint as a row being edited. */
.tag-fac-entry-editing[b-djuf1h5vk2] {
    background: #f3f8f5;
    border-radius: 0.3rem;
}

/* .tag-fac-entry-frame — see .tag-row-frame above; the entry line and its editor share one box. */

/* The links under a facility's entries: Add New State / Change facility name / Set temperature. */
.tag-fac-links[b-djuf1h5vk2] {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    margin: 0.35rem 0 0.2rem 1.65rem;
    font-size: 0.85rem;
}

/* The entry in effect right now — what the facility's line is saying. */
.tag-row-body[b-djuf1h5vk2]  .tag-fac-star {
    font-weight: 700;
    color: #2d3a32;
    margin-right: -0.2rem;
}

.tag-row-editing[b-djuf1h5vk2] {
    background: #f3f8f5;
}

/* The Text block's table (9 Sep 2026): a locked row shows its text as a plain label, muted when
   the line is not on the card today — the schedule chip's own colour says why. The row whose
   panel is open is tinted. */
.tag-text-table td.tag-text-cell[b-djuf1h5vk2] {
    padding-left: 0.6rem;
    white-space: pre-wrap;
    word-break: break-word;
}

.tag-text-table tr.tag-row-hidden td.tag-text-cell[b-djuf1h5vk2] {
    color: #8a949c;
}

.tag-text-table tr.tag-row-editing td[b-djuf1h5vk2] {
    background: #f3f8f5;
}

/* The edited row and the panel row under it draw ONE green frame together (a table cannot wrap
   two rows in a box, so the frame is the outer cell borders — 2px so they win over the table's
   own 1px grey lines in the collapsed-border model). The panel cell has no padding of its own. */
.tag-text-table tr.tag-row-editing > td[b-djuf1h5vk2] {
    border-top: 2px solid #b8e6c8;
    border-bottom-style: hidden;
}

.tag-text-table tr.tag-row-editing > td:first-child[b-djuf1h5vk2],
.tag-text-table tr.tag-text-editor-row > td[b-djuf1h5vk2] {
    border-left: 2px solid #b8e6c8;
}

.tag-text-table tr.tag-row-editing > td:last-child[b-djuf1h5vk2],
.tag-text-table tr.tag-text-editor-row > td[b-djuf1h5vk2] {
    border-right: 2px solid #b8e6c8;
}

.tag-text-table td.tag-text-editor-cell[b-djuf1h5vk2] {
    padding: 0 0.5rem 0.5rem;
    border-top: 0;
    border-bottom: 2px solid #b8e6c8;
    background: #f3f8f5;
}

/* The inline editor under the selected row. No overflow:hidden — the schedule chip's popover is
   absolutely positioned and must be free to spill past this panel's edge. */
.tag-row-editor[b-djuf1h5vk2] {
    border: 1px solid #b8e6c8;
    border-radius: 0.5rem;
    background: #f8fcf9;
    padding: 0.75rem;
    margin: 0.25rem 0 0.6rem;
}

.tag-row-editor-actions[b-djuf1h5vk2] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    margin-top: 0.6rem;
}

.tag-row-empty[b-djuf1h5vk2] {
    padding: 0.5rem;
    font-size: 0.9rem;
    color: #6c757d;
    font-style: italic;
}


/* Placeholders in the facility editors ("e.g. Lightning") were reading as entered text next to the
   empty date boxes — Bootstrap's default grey is the same one the hints use. Lighter and italic. */
.tag-row-editor [b-djuf1h5vk2]::placeholder,
.tag-fac-addform [b-djuf1h5vk2]::placeholder {
    color: #adb5bd;
    font-style: italic;
    opacity: 1;
}
/* _content/MLClient/Components/Shared/ChatWindow.razor.rz.scp.css */
.cw-footer[b-8bizphvlm9] {
    gap: 10px;
}

/* Date separator */
.cw-date-separator[b-8bizphvlm9] {
    text-align: center;
    color: #8e99a4;
    font-size: 0.8rem;
    padding: 12px 0;
    font-weight: 500;
}

/* Feedback buttons */
.cw-feedback-buttons[b-8bizphvlm9] {
    display: flex;
    gap: 2px;
}

.cw-share-buttons[b-8bizphvlm9] {
    display: flex;
}

.cw-feedback-btn[b-8bizphvlm9],
.cw-action-btn[b-8bizphvlm9] {
    background: none;
    border: none;
    padding: 2px 6px;
    cursor: pointer;
    color: #8e99a4;
    font-size: 0.85rem;
    border-radius: 4px;
    transition: color 0.2s, background 0.2s;
}

.cw-feedback-btn:hover:not(:disabled)[b-8bizphvlm9],
.cw-action-btn:hover:not(:disabled)[b-8bizphvlm9] {
    color: #4a5568;
    background: rgba(0,0,0,0.04);
}

.cw-feedback-btn:disabled[b-8bizphvlm9],
.cw-action-btn:disabled[b-8bizphvlm9] {
    cursor: default;
}

.cw-action-btn[b-8bizphvlm9]::after {
    display: none;
}

/* Send-answer-to-member capture action — distinct green accent so staff spot it on can't-answer replies */
.cw-capture-btn[b-8bizphvlm9] {
    color: #2eca7f;
    font-weight: 600;
    border: 1px solid rgba(46, 202, 127, 0.4);
}

.cw-capture-btn:hover:not(:disabled)[b-8bizphvlm9] {
    color: #ffffff;
    background: #2eca7f;
}

.cw-captured-chip[b-8bizphvlm9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #2eca7f;
    font-weight: 500;
}

.cw-capture-error[b-8bizphvlm9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #e53e3e;
    font-weight: 500;
}

/* "Create a ticket?" confirmation card under a can't-answer reply — same green accent family
   as the capture action so the two escalation affordances read as one feature. */
.cw-ticket-suggestion[b-8bizphvlm9] {
    margin-top: 0.4rem;
    padding: 0.6rem 0.75rem;
    border: 1px solid rgba(46, 202, 127, 0.4);
    border-radius: 8px;
    background: rgba(46, 202, 127, 0.06);
    max-width: 560px;
}

.cw-ticket-suggestion-title[b-8bizphvlm9] {
    font-size: 0.85rem;
    color: #3d4852;
    margin-bottom: 0.4rem;
}

.cw-ticket-suggestion-title i[b-8bizphvlm9] {
    color: #2eca7f;
    margin-right: 4px;
}

.cw-ticket-suggestion-text[b-8bizphvlm9] {
    width: 100%;
    font-size: 0.85rem;
    border: 1px solid #e8eaed;
    border-radius: 6px;
    padding: 0.4rem 0.5rem;
    resize: vertical;
}

.cw-ticket-suggestion-text:focus[b-8bizphvlm9] {
    outline: none;
    border-color: rgba(46, 202, 127, 0.6);
}

.cw-ticket-suggestion-error[b-8bizphvlm9] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.8rem;
    color: #e53e3e;
    font-weight: 500;
    margin-top: 0.25rem;
}

.cw-ticket-suggestion-actions[b-8bizphvlm9] {
    display: flex;
    gap: 0.5rem;
    margin-top: 0.4rem;
}

.cw-ticket-dismiss-btn[b-8bizphvlm9] {
    color: #8e99a4;
    border: 1px solid #e8eaed;
}

.cw-ticket-dismiss-btn:hover:not(:disabled)[b-8bizphvlm9] {
    color: #3d4852;
    background: #f1f3f5;
}

.cw-ticket-link[b-8bizphvlm9] {
    text-decoration: none;
    cursor: pointer;
}

.cw-ticket-link:hover[b-8bizphvlm9] {
    text-decoration: underline;
}

[b-8bizphvlm9] .cw-feedback-liked {
    color: #2eca7f !important;
}

[b-8bizphvlm9] .cw-feedback-disliked {
    color: #e53e3e !important;
}

/* Agent label */
.cw-agent-label[b-8bizphvlm9] {
    font-size: 0.75rem;
    color: #8e99a4;
    font-weight: 500;
    border-top: 1px solid #e8eaed;
    padding-top: 0.4rem;
    margin-top: 0.4rem;
}
/* _content/MLClient/Components/Shared/DocumentPicker.razor.rz.scp.css */
/* Scoped to DocumentPicker.razor. The row styling deliberately mirrors the Links picker's
   .tag-doc-picker-item in Home.razor.css so the two feel like the same control; this file exists so
   every OTHER host page gets it without copying that rule into its own stylesheet. */

.doc-picker-list[b-vznd5x6jbe] {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #e9ecef;
    border-radius: 0.25rem;
}

/* A <button> so it is reachable by Tab and operable by Enter/Space, like the <select> this replaced.
   The resets below strip the button chrome; width + text-align keep it reading as a list row. */
.doc-picker-item[b-vznd5x6jbe] {
    display: flex;
    align-items: center;
    width: 100%;
    text-align: left;
    background: none;
    border: none;
    color: inherit;
    font: inherit;
    padding: 0.35rem 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    border-bottom: 1px solid #f1f3f5;
}

/* Keyboard focus must be visible — the whole point of making these buttons. */
.doc-picker-item:focus-visible[b-vznd5x6jbe] {
    outline: 2px solid #198754;
    outline-offset: -2px;
    background-color: #f1f8f4;
}

/* Marks a row that belongs to another branch (documents.available_to_sub_entities). Pushed right so
   the names still read as one column, and muted because it is provenance, not a warning. */
.doc-picker-shared[b-vznd5x6jbe] {
    margin-left: auto;
    padding-left: 0.5rem;
    flex: none;
    font-size: 0.6875rem;
    color: #6c757d;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.doc-picker-item:last-child[b-vznd5x6jbe] {
    border-bottom: none;
}

.doc-picker-item:hover[b-vznd5x6jbe] {
    background-color: #f1f8f4;
}

/* The one already chosen, so re-opening the list shows where you are rather than making you
   remember. */
.doc-picker-item.is-current[b-vznd5x6jbe] {
    background-color: #e7f5ec;
    font-weight: 600;
}

/* Pager under the list. Only rendered when there is more than one page, so the buttons are never
   decoration. max-height above keeps the list a fixed size, which is what makes a pager read better
   here than an ever-growing scroll. */
.doc-picker-pager[b-vznd5x6jbe] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
/* _content/MLClient/Components/Shared/LineScheduleEditor.razor.rz.scp.css */
.line-sched-container[b-9nyao3im6g] {
    position: relative;
    display: inline-block;
}

.line-sched-chip[b-9nyao3im6g] {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.15rem 0.6rem;
    border-radius: 0.75rem;
    border: 1px solid transparent;
    white-space: nowrap;
    cursor: pointer;
    line-height: 1.4;
}

.line-sched-chip-readonly[b-9nyao3im6g] {
    cursor: default;
}

/* Palettes mirror the facilities editor: green = tag-fac-status-open, amber = tag-fac-row-expired. */
.line-sched-chip-always[b-9nyao3im6g] {
    background: transparent;
    border-color: #ced4da;
    color: #6c757d;
}

.line-sched-chip-active[b-9nyao3im6g] {
    background: #d4edda;
    color: #155724;
}

.line-sched-chip-upcoming[b-9nyao3im6g] {
    background: #fff3cd;
    color: #856404;
}

.line-sched-chip-expired[b-9nyao3im6g] {
    background: #e9ecef;
    color: #6c757d;
    opacity: 0.75;
}

.line-sched-popover[b-9nyao3im6g] {
    position: absolute;
    top: calc(100% + 4px);
    right: 0;
    z-index: 1060; /* above the edit modal */
    width: 300px;
    background: #fff;
    border: 1px solid #ced4da;
    border-radius: 0.5rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    padding: 0.75rem;
    text-align: left;
    cursor: default;
}

/* The Inline face: the same body as the popover, laid out in the page (the Text block's row panel). */
.line-sched-inline[b-9nyao3im6g] {
    text-align: left;
    max-width: 420px;
}

.line-sched-row[b-9nyao3im6g] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.line-sched-row-top[b-9nyao3im6g] {
    align-items: flex-start;
}

.line-sched-row > label[b-9nyao3im6g] {
    flex: 0 0 52px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #6c757d;
    margin: 0;
}

.line-sched-dow[b-9nyao3im6g],
.line-sched-dom[b-9nyao3im6g] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.2rem;
}

.line-sched-day[b-9nyao3im6g] {
    min-width: 1.7rem;
    height: 1.7rem;
    padding: 0 0.2rem;
    border-radius: 0.35rem;
    border: 1px solid #ced4da;
    background: #fff;
    color: #495057;
    font-size: 0.7rem;
    font-weight: 600;
    cursor: pointer;
}

.line-sched-dow .line-sched-day[b-9nyao3im6g] {
    border-radius: 50%;
}

.line-sched-day-on[b-9nyao3im6g] {
    background: #0d6efd;
    border-color: #0d6efd;
    color: #fff;
}

.line-sched-hint[b-9nyao3im6g] {
    font-size: 0.72rem;
    color: #6c757d;
    margin-bottom: 0.5rem;
}

.line-sched-preview[b-9nyao3im6g] {
    font-size: 0.78rem;
    color: #495057;
    border-top: 1px dashed #dee2e6;
    padding-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.line-sched-actions[b-9nyao3im6g] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}
