/* /Components/SearchResultCard.razor.rz.scp.css */
/* ========================================
   🎯 بطاقة نتيجة الفحص — نمط بنك حضرموت
   ======================================== */

.result-card[b-95yau4g3rn] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    /* Risk colour on the leading edge, like .info-item in the bank admin pages. */
    border-inline-start: 5px solid #adb5bd;
    padding: 1.15rem 1.35rem;
    box-shadow: 0 4px 14px rgba(0, 61, 122, 0.06);
    transition: all 0.3s ease;
}

.result-card:hover[b-95yau4g3rn] {
    box-shadow: 0 10px 26px rgba(0, 61, 122, 0.12);
    transform: translateY(-2px);
}

.result-card.risk-high[b-95yau4g3rn] { border-inline-start-color: #e50000; }
.result-card.risk-med[b-95yau4g3rn]  { border-inline-start-color: #ffa500; }
.result-card.risk-low[b-95yau4g3rn]  { border-inline-start-color: #adb5bd; }

/* ---- head ---- */

.result-head[b-95yau4g3rn] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.result-identity[b-95yau4g3rn] {
    flex: 1;
    min-width: 0;
}

.entity-name[b-95yau4g3rn] {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
}

.entity-name a[b-95yau4g3rn] {
    color: #003d7a;
    text-decoration: none;
    transition: color 0.2s ease;
}

.entity-name a:hover[b-95yau4g3rn] {
    color: #d4af37;
}

.result-chips[b-95yau4g3rn] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    align-items: center;
}

.chip-list[b-95yau4g3rn] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.22rem 0.6rem;
    border-radius: 6px;
}

.chip-type[b-95yau4g3rn],
.chip-meta[b-95yau4g3rn] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    color: #495057;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    max-width: 340px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.chip-type i[b-95yau4g3rn] { color: #003d7a; }


/* ---- score ---- */

.result-score[b-95yau4g3rn] {
    text-align: center;
    flex-shrink: 0;
    min-width: 76px;
}

.score-value[b-95yau4g3rn] {
    font-size: 1.4rem;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    padding: 0.35rem 0.7rem;
    border-radius: 999px;
    display: inline-block;
    line-height: 1.2;
}

.score-value .pct[b-95yau4g3rn] {
    font-size: 0.7em;
    font-weight: 700;
}

.score-high[b-95yau4g3rn] { background: #f8d7da; color: #842029; }
.score-med[b-95yau4g3rn]  { background: #fff3cd; color: #664d03; }
.score-low[b-95yau4g3rn]  { background: #e9ecef; color: #495057; }

.score-label[b-95yau4g3rn] {
    font-size: 0.72rem;
    color: #6c757d;
    margin-top: 0.3rem;
    font-weight: 600;
}

/* ---- matched name ---- */

.matched-row[b-95yau4g3rn] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    background: #f8f9fa;
    border: 1px solid #eef0f3;
    border-radius: 10px;
    padding: 0.65rem 0.85rem;
    margin-top: 0.9rem;
}

.matched-label[b-95yau4g3rn] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.78rem;
    color: #6c757d;
    font-weight: 600;
}

.matched-label i[b-95yau4g3rn] { color: #d4af37; }

.matched-value[b-95yau4g3rn] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #212529;
    overflow-wrap: anywhere;
}

.matched-value.is-arabic[b-95yau4g3rn] {
    font-size: 1rem;
}

/* ---- remarks / ai note ---- */

.result-remarks[b-95yau4g3rn] {
    font-size: 0.82rem;
    color: #6c757d;
    line-height: 1.75;
    margin: 0.75rem 0 0;
}



/* ---- actions ---- */

.result-actions[b-95yau4g3rn] {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-start;
}

.btn-details[b-95yau4g3rn] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    color: #003d7a;
    border: 2px solid #003d7a;
    padding: 0.45rem 1.1rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-details:hover[b-95yau4g3rn] {
    background: #003d7a;
    color: #fff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 61, 122, 0.3);
}

/* ---- responsive ---- */

@media (max-width: 576px) {
    .result-card[b-95yau4g3rn] {
        padding: 1rem;
    }

    .result-head[b-95yau4g3rn] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .result-score[b-95yau4g3rn] {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        text-align: start;
        min-width: 0;
    }

    .score-label[b-95yau4g3rn] {
        margin-top: 0;
    }

    .chip-type[b-95yau4g3rn],
    .chip-meta[b-95yau4g3rn] {
        max-width: 100%;
    }
}
/* /Components/Shared/HBHeader.razor.rz.scp.css */
/* ========================================
   🎨 Header Component - Fixed Sizes
   ======================================== */

/* 📌 Main Header */
.hb-header[b-nu9re25jhx] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: white;
    padding: 0.75rem 0;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
    position: sticky;
    top: 0;
    z-index: 1000;
    /* visible so mobile nav can expand without clipping */
    overflow: visible;
}

.hb-header[b-nu9re25jhx]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('/Images/main-pattern-sAiPHf0c.svg');
    background-size: cover;
    background-position: center;
    opacity: 0.1;
    z-index: 0;
    pointer-events: none;
}

.header-content[b-nu9re25jhx] {
    max-width: 1800px;
    margin: 0 auto;
    padding: 0 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    position: relative;
    z-index: 1;
    min-height: 70px;
}

/* 🏢 Logo Section */
.logo-section[b-nu9re25jhx] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 1rem;
}

.logo[b-nu9re25jhx] {
    width: 60px;
    height: 60px;
    background: white;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
    flex-shrink: 0;
    text-decoration: none;
    cursor: pointer;
}

.logo:hover[b-nu9re25jhx] {
    transform: scale(1.08);
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.4);
}

.logo img[b-nu9re25jhx] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.bank-name[b-nu9re25jhx] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.bank-name h1[b-nu9re25jhx] {
    font-size: 1.2rem;
    margin: 0;
    font-weight: 700;
    color: white;
    line-height: 1.2;
}

.bank-name-en[b-nu9re25jhx] {
    font-size: 0.75rem;
    opacity: 0.9;
    font-weight: 400;
    letter-spacing: 0.3px;
    color: white;
    line-height: 1;
}

/* 📱 App Download Link in Navigation */
.app-download-link[b-nu9re25jhx] {
    background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%) !important;
    color: #003d7a !important;
    border: none;
    border-radius: 6px;
    font-weight: 600 !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 10px rgba(212, 175, 55, 0.3);
    cursor: pointer;
    text-decoration: none;
}

.app-download-link:hover[b-nu9re25jhx] {
    background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(212, 175, 55, 0.4);
    color: #003d7a !important;
    text-decoration: none;
}

.app-download-link:active[b-nu9re25jhx] {
    background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%) !important;
    transform: translateY(0);
    color: #003d7a !important;
}

.app-download-link i[b-nu9re25jhx] {
    font-size: 1.1rem;
}

/* 🧭 Navigation Links */
.nav-links[b-nu9re25jhx] {
    display: flex;
    flex-wrap: nowrap;
    flex: 1;
    justify-content: flex-end;
    min-width: 0;
    gap: 0.5rem;
    align-items: center;
}

.nav-link[b-nu9re25jhx] {
    flex-shrink: 0;
    color: white;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    padding: 0.5rem 1rem;
    border-radius: 6px;
    transition: all 0.3s ease;
    white-space: nowrap;
    background: transparent;
    border: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.nav-link:hover[b-nu9re25jhx] {
    background: rgba(255,255,255,0.1);
    transform: translateY(-1px);
}

.nav-link.active[b-nu9re25jhx] {
    background: rgba(212, 175, 55, 0.25);
    border-bottom: 2px solid #d4af37;
}

/* Dropdown navigation group */
.nav-dropdown[b-nu9re25jhx] {
    position: relative;
}

.nav-dropdown-toggle[b-nu9re25jhx] {
    gap: 0.35rem;
}

.dropdown-chevron[b-nu9re25jhx] {
    font-size: 0.75rem;
    transition: transform 0.25s ease;
}

.nav-dropdown.show .dropdown-chevron[b-nu9re25jhx],
.nav-dropdown.open .dropdown-chevron[b-nu9re25jhx] {
    transform: rotate(180deg);
}

.dropdown-panel[b-nu9re25jhx] {
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    min-width: 200px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.18);
    padding: 0.35rem 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: all 0.2s ease;
    z-index: 1001;
    display: flex;
    flex-direction: column;
}

.nav-dropdown:hover .dropdown-panel[b-nu9re25jhx],
.nav-dropdown.show .dropdown-panel[b-nu9re25jhx],
.dropdown-panel.show[b-nu9re25jhx] {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.dropdown-item[b-nu9re25jhx] {
    color: #003d7a;
    text-decoration: none;
    font-size: 0.92rem;
    font-weight: 500;
    padding: 0.55rem 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: background 0.18s ease;
    white-space: nowrap;
}

.dropdown-item:hover[b-nu9re25jhx] {
    background: #f0f4f8;
}

.dropdown-item.active[b-nu9re25jhx] {
    background: rgba(212, 175, 55, 0.18);
    color: #003d7a;
    font-weight: 600;
}

/* 👤 User Section & Logout Button */
.user-section[b-nu9re25jhx] {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0.8rem;
    background: rgba(255,255,255,0.08);
    border-radius: 8px;
    margin-left: 0.5rem;
}

/* Now a link to /profile. Underlined on hover only: a permanently underlined name in the header reads
   as body copy rather than a control, but with no hover state at all nobody discovers it is clickable. */
.user-name[b-nu9re25jhx] {
    color: #d4af37;
    font-size: 0.9rem;
    font-weight: 600;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    text-decoration: none;
    padding: 0.2rem 0.45rem;
    border-radius: 6px;
    transition: background 0.18s ease, color 0.18s ease;
}

.user-name:hover[b-nu9re25jhx],
.user-name:focus-visible[b-nu9re25jhx] {
    color: #f0c952;
    background: rgba(255, 255, 255, 0.1);
    text-decoration: underline;
}

.user-name:focus-visible[b-nu9re25jhx] {
    outline: 2px solid #d4af37;
    outline-offset: 2px;
}

/* The .user-role chip was removed at the owner's request — the header no longer tells an employee
   their permission level. Deleted rather than hidden, so nothing is shipped that a future change
   could reveal by accident. */

.logout-btn[b-nu9re25jhx] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: linear-gradient(135deg, rgba(220,53,69,0.9), rgba(200,35,51,0.95));
    color: white;
    border: none;
    padding: 0.45rem 0.9rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.logout-btn:hover:not(:disabled)[b-nu9re25jhx] {
    background: linear-gradient(135deg, rgba(200,35,51,1), rgba(180,25,41,1));
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(220,53,69,0.4);
}

.logout-btn:active:not(:disabled)[b-nu9re25jhx] {
    transform: translateY(0);
}

.logout-btn:disabled[b-nu9re25jhx] {
    opacity: 0.7;
    cursor: default;
    background: linear-gradient(135deg, rgba(220,53,69,0.6), rgba(200,35,51,0.65));
}

.logout-icon[b-nu9re25jhx] {
    font-size: 1.1rem;
    font-weight: bold;
}

/* 📱 Mobile Menu Toggle */
.menu-toggle[b-nu9re25jhx] {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    padding: 0.6rem;
    background: rgba(255,255,255,0.1);
    border-radius: 6px;
    border: none;
    transition: all 0.3s ease;
    gap: 4px;
    min-width: 44px;
    min-height: 44px;
}

.menu-toggle:hover[b-nu9re25jhx] {
    background: rgba(255,255,255,0.2);
}

.menu-toggle span[b-nu9re25jhx] {
    width: 26px;
    height: 3px;
    background: white;
    border-radius: 2px;
    transition: all 0.3s ease;
    display: block;
}

.menu-toggle.active span:nth-child(1)[b-nu9re25jhx] {
    transform: rotate(45deg) translate(6px, 6px);
}

.menu-toggle.active span:nth-child(2)[b-nu9re25jhx] {
    opacity: 0;
}

.menu-toggle.active span:nth-child(3)[b-nu9re25jhx] {
    transform: rotate(-45deg) translate(7px, -7px);
}

/* Keep every desktop tab on one row, including the SuperAdmin-only links. */
@media (min-width: 1200px) and (max-width: 1799px) {
    .header-content[b-nu9re25jhx] {
        gap: 0.5rem;
    }

    .logo-section[b-nu9re25jhx] {
        gap: 0.5rem;
    }

    .logo[b-nu9re25jhx] {
        width: 48px;
        height: 48px;
    }

    .bank-name h1[b-nu9re25jhx] {
        font-size: 1rem;
    }

    .bank-name-en[b-nu9re25jhx] {
        font-size: 0.6rem;
    }

    .nav-links[b-nu9re25jhx] {
        gap: 0.1rem;
    }

    .nav-link[b-nu9re25jhx] {
        font-size: 0.78rem;
        padding: 0.5rem 0.2rem;
        gap: 0.2rem;
    }

    .user-section[b-nu9re25jhx] {
        gap: 0.2rem;
        padding: 0.2rem;
        margin-left: 0;
    }

    .user-name[b-nu9re25jhx] {
        font-size: 0.8rem;
        padding-inline: 0.2rem;
        max-width: 6rem;
        overflow: hidden;
    }

    .user-name i[b-nu9re25jhx] {
        flex-shrink: 0;
    }

    .user-display-name[b-nu9re25jhx] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .logout-btn[b-nu9re25jhx] {
        font-size: 0.75rem;
        padding: 0.45rem 0.35rem;
    }
}

@media (max-width: 992px) {
    .logo[b-nu9re25jhx] {
        width: 55px;
        height: 55px;
    }

    .bank-name h1[b-nu9re25jhx] {
        font-size: 1.1rem;
    }

    .bank-name-en[b-nu9re25jhx] {
        font-size: 0.7rem;
    }
}

/* 📱 Responsive Design - Mobile */
@media (max-width: 1199px) {
    .hb-header[b-nu9re25jhx] {
        padding: 0.45rem 0;
        /* solid backdrop when menu opens over page content */
        background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    }

    .header-content[b-nu9re25jhx] {
        flex-wrap: wrap;
        gap: 0.5rem;
        padding: 0 max(0.85rem, env(safe-area-inset-right)) 0 max(0.85rem, env(safe-area-inset-left));
        min-height: 56px;
    }

    .logo-section[b-nu9re25jhx] {
        width: 100%;
        justify-content: space-between;
        gap: 0.75rem;
    }

    .menu-toggle[b-nu9re25jhx] {
        display: flex;
        margin-left: auto;
        min-width: 44px;
        min-height: 44px;
        align-items: center;
        justify-content: center;
        border-radius: 10px;
        background: rgba(255, 255, 255, 0.1);
        flex-shrink: 0;
    }

    .logo[b-nu9re25jhx] {
        width: 46px;
        height: 46px;
        flex-shrink: 0;
    }

    .bank-name[b-nu9re25jhx] {
        flex: 1;
        min-width: 0;
    }

    .bank-name h1[b-nu9re25jhx] {
        font-size: 0.95rem;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .bank-name-en[b-nu9re25jhx] {
        font-size: 0.62rem;
    }

    .nav-links[b-nu9re25jhx] {
        flex: 0 0 100%;
        justify-content: flex-start;
        flex-direction: column;
        width: 100%;
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease, padding 0.25s ease;
        gap: 0.2rem;
        order: 3;
        background: rgba(0, 40, 80, 0.35);
        border-radius: 12px;
    }

    .nav-links.active[b-nu9re25jhx] {
        /* room for all admin links + logout */
        max-height: min(80vh, 560px);
        padding: 0.65rem 0.5rem 0.85rem;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        margin-bottom: 0.25rem;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    }

    .nav-link[b-nu9re25jhx] {
        width: 100%;
        text-align: right;
        font-size: 0.95rem;
        padding: 0.75rem 1rem;
        opacity: 0;
        transform: translateY(-6px);
        transition: all 0.25s ease;
        border-radius: 10px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 0.5rem;
    }

    .nav-links.active .nav-link[b-nu9re25jhx] {
        opacity: 1;
        transform: translateY(0);
        background: rgba(255, 255, 255, 0.06);
    }

    .nav-links.active .nav-link.active[b-nu9re25jhx],
    .nav-links.active .nav-link:active[b-nu9re25jhx] {
        background: rgba(212, 175, 55, 0.22);
    }

    /* Mobile dropdowns become stacked items */
    .nav-dropdown[b-nu9re25jhx] {
        width: 100%;
        display: flex;
        flex-direction: column;
    }

    .dropdown-panel[b-nu9re25jhx] {
        position: static;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        background: rgba(0, 0, 0, 0.12);
        border-radius: 8px;
        margin-top: 0.2rem;
        min-width: 0;
        display: none;
        padding: 0.35rem 0.35rem;
        gap: 0.15rem;
    }

    .nav-dropdown.show .dropdown-panel[b-nu9re25jhx],
    .nav-dropdown.open .dropdown-panel[b-nu9re25jhx],
    .dropdown-panel.show[b-nu9re25jhx] {
        display: flex;
    }

    .dropdown-item[b-nu9re25jhx] {
        color: white;
        border-radius: 8px;
        padding: 0.6rem 0.8rem;
        font-size: 0.9rem;
    }

    .dropdown-item:hover[b-nu9re25jhx] {
        background: rgba(255, 255, 255, 0.08);
    }

    .dropdown-item.active[b-nu9re25jhx] {
        background: rgba(212, 175, 55, 0.22);
        color: white;
    }

    .dropdown-chevron[b-nu9re25jhx] {
        margin-right: auto;
    }

    /* User Section Mobile */
    .user-section[b-nu9re25jhx] {
        flex-direction: column;
        width: 100%;
        gap: 0.5rem;
        padding: 0.75rem;
        margin: 0.35rem 0 0 0;
        opacity: 0;
        transform: translateY(-6px);
        transition: all 0.25s ease;
        background: rgba(0, 0, 0, 0.15);
        border-radius: 10px;
    }

    .nav-links.active .user-section[b-nu9re25jhx] {
        opacity: 1;
        transform: translateY(0);
    }

    .user-name[b-nu9re25jhx] {
        font-size: 0.9rem;
        text-align: center;
        width: 100%;
        word-break: break-word;
    }

    .logout-btn[b-nu9re25jhx] {
        width: 100%;
        justify-content: center;
        padding: 0.7rem;
        min-height: 44px;
        border-radius: 10px;
    }
}

/* 📱 Small Mobile */
@media (max-width: 480px) {
    .header-content[b-nu9re25jhx] {
        padding: 0 0.75rem;
    }

    .logo[b-nu9re25jhx] {
        width: 45px;
        height: 45px;
        padding: 6px;
    }

    .bank-name h1[b-nu9re25jhx] {
        font-size: 0.95rem;
    }

    .bank-name-en[b-nu9re25jhx] {
        font-size: 0.6rem;
    }

    .nav-link[b-nu9re25jhx] {
        font-size: 0.85rem;
        padding: 0.55rem 0.85rem;
    }
}
/* /Pages/Audit.razor.rz.scp.css */
/* ========================================
   🕘 سجل عمليات البحث — نمط بنك حضرموت
   ======================================== */

.header-actions[b-fd5qugt4gr] { display: flex; gap: 0.65rem; flex-wrap: wrap; }

/* ---- stats ---- */

.stats-grid[b-fd5qugt4gr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stat-card[b-fd5qugt4gr] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    background: #fff;
    border-radius: 12px;
    padding: 1.05rem 1.2rem;
    box-shadow: 0 4px 14px rgba(0, 61, 122, 0.07);
    border: 1px solid #eef0f3;
}

.stat-icon[b-fd5qugt4gr] {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    color: #fff;
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    flex-shrink: 0;
}

.stat-icon.today[b-fd5qugt4gr] { background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%); color: #003d7a; }
.stat-icon.users[b-fd5qugt4gr] { background: linear-gradient(135deg, #6f42c1 0%, #8b5cf6 100%); }
.stat-icon.hits[b-fd5qugt4gr]  { background: linear-gradient(135deg, #dc3545 0%, #e4606d 100%); }

.stat-value[b-fd5qugt4gr] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #003d7a;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.stat-label[b-fd5qugt4gr] { font-size: 0.78rem; color: #6c757d; font-weight: 600; }

/* ---- filters ---- */

.filter-card[b-fd5qugt4gr] {
    padding: 1.15rem 1.35rem;
    margin-bottom: 1.5rem;
}

.filter-row[b-fd5qugt4gr] {
    display: flex;
    align-items: flex-end;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.filter-field[b-fd5qugt4gr] {
    flex: 1 1 190px;
    min-width: 0;
}

.filter-field.filter-narrow[b-fd5qugt4gr] { flex: 0 1 165px; }

.filter-field .hb-form-label[b-fd5qugt4gr] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.8rem;
    margin-bottom: 0.35rem;
}

.filter-field .hb-form-label i[b-fd5qugt4gr] { color: #d4af37; }

.filter-check[b-fd5qugt4gr] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding-bottom: 0.6rem;
}

/* Undo the global 44px touch-target minimum for this checkbox. */
.filter-check .form-check-input[b-fd5qugt4gr] {
    min-width: 1.15rem !important;
    min-height: 1.15rem !important;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.filter-check .form-check-label[b-fd5qugt4gr] {
    font-size: 0.85rem;
    color: #495057;
    cursor: pointer;
    margin: 0;
    white-space: nowrap;
}

.btn-clear-filter[b-fd5qugt4gr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: transparent;
    border: none;
    color: #dc3545;
    font-size: 0.82rem;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    padding: 0.5rem 0.6rem;
    margin-bottom: 0.4rem;
    border-radius: 6px;
    transition: background 0.2s ease;
}

.btn-clear-filter:hover[b-fd5qugt4gr] { background: rgba(220, 53, 69, 0.08); }

/* ---- table ---- */

.table-card[b-fd5qugt4gr] { padding: 0; overflow: hidden; }
.table-responsive[b-fd5qugt4gr] { overflow-x: auto; }

.audit-table[b-fd5qugt4gr] {
    width: 100%;
    min-width: 900px;
    border-collapse: collapse;
}

.audit-table thead[b-fd5qugt4gr] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
}

.audit-table thead th[b-fd5qugt4gr] {
    padding: 0.9rem 1rem;
    font-weight: 700;
    font-size: 0.85rem;
    text-align: right;
    white-space: nowrap;
}

.audit-table tbody tr[b-fd5qugt4gr] {
    border-bottom: 1px solid #eef0f3;
    transition: background 0.2s ease;
}

.audit-table tbody tr:last-child[b-fd5qugt4gr] { border-bottom: 0; }
.audit-table tbody tr:hover[b-fd5qugt4gr] { background: rgba(0, 61, 122, 0.04); }

.audit-table tbody td[b-fd5qugt4gr] {
    padding: 0.8rem 1rem;
    vertical-align: middle;
    font-size: 0.87rem;
}

.muted-cell[b-fd5qugt4gr] { color: #8a94a0; }

/* who performed the search */
.who[b-fd5qugt4gr] { display: flex; align-items: center; gap: 0.6rem; }

.who-avatar[b-fd5qugt4gr] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.78rem;
    flex-shrink: 0;
}

.who-name[b-fd5qugt4gr] { font-weight: 700; color: #212529; }
.who-username[b-fd5qugt4gr] { font-size: 0.73rem; color: #8a94a0; direction: ltr; }

/* the searched name */
.query-text[b-fd5qugt4gr] {
    font-weight: 700;
    color: #003d7a;
    overflow-wrap: anywhere;
}

.audit-source[b-fd5qugt4gr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.24rem 0.58rem;
    border-radius: 999px;
    font-size: 0.73rem;
    font-weight: 700;
    white-space: nowrap;
}

.source-international[b-fd5qugt4gr] {
    background: #e7f1ff;
    color: #003d7a;
}

.source-local[b-fd5qugt4gr] {
    background: #e8f5e9;
    color: #1b5e20;
}

.source-pep[b-fd5qugt4gr] {
    background: #f3e8ff;
    color: #6f2da8;
}


.count-pill[b-fd5qugt4gr] {
    display: inline-block;
    background: #fff3cd;
    border: 1px solid #ffe08a;
    color: #664d03;
    font-weight: 700;
    font-size: 0.8rem;
    min-width: 30px;
    text-align: center;
    padding: 0.18rem 0.5rem;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
}

/* top match */
.top-match[b-fd5qugt4gr] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    flex-wrap: wrap;
}

.score-pill[b-fd5qugt4gr] {
    font-weight: 800;
    font-size: 0.78rem;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.score-high[b-fd5qugt4gr] { background: #f8d7da; color: #842029; }
.score-med[b-fd5qugt4gr]  { background: #fff3cd; color: #664d03; }
.score-low[b-fd5qugt4gr]  { background: #e9ecef; color: #495057; }

.top-name[b-fd5qugt4gr] {
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #333;
    font-weight: 600;
    font-size: 0.83rem;
}

.chip-list[b-fd5qugt4gr] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.12rem 0.45rem;
    border-radius: 5px;
    flex-shrink: 0;
}

.time-cell[b-fd5qugt4gr] { white-space: nowrap; font-variant-numeric: tabular-nums; }
.time-hm[b-fd5qugt4gr] { font-size: 0.76rem; color: #adb5bd; }

.actions-col[b-fd5qugt4gr] { width: 80px; }

.btn-view-entity[b-fd5qugt4gr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #00589e;
    color: #fff;
    text-decoration: none;
    transition: all 0.2s ease;
}

.btn-view-entity:hover[b-fd5qugt4gr] {
    background: #003d7a;
    transform: translateY(-2px);
    color: #fff;
}

/* ---- pagination ----
   Lives in admin-shared.css now, so every table shares one control. Deliberately NOT duplicated here:
   admin-shared.css loads before the scoped bundle and scoped selectors carry an extra attribute, so a
   copy left in this file would silently win and the two would drift apart. */

/* ---- empty ---- */

.audit-empty[b-fd5qugt4gr] {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.audit-empty i[b-fd5qugt4gr] {
    font-size: 2.75rem;
    color: #ced4da;
    display: block;
    margin-bottom: 0.85rem;
}

.audit-empty h3[b-fd5qugt4gr] {
    color: #003d7a;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.3rem;
}

.audit-empty p[b-fd5qugt4gr] { color: #6c757d; font-size: 0.88rem; margin: 0; }

/* ---- responsive ---- */

@media (max-width: 768px) {
    .filter-row[b-fd5qugt4gr] { flex-direction: column; align-items: stretch; }
    .filter-field[b-fd5qugt4gr], .filter-field.filter-narrow[b-fd5qugt4gr] { flex: 1 1 auto; }
    .stat-value[b-fd5qugt4gr] { font-size: 1.3rem; }

    /* ---- table becomes cards ----
       A six-column log is unreadable in a 390px viewport: horizontal scrolling hides the columns that
       matter (who searched, and whether it was refused). Each row becomes a card with the header text
       repeated as an inline label, taken from each cell's data-label attribute. */
    .table-responsive[b-fd5qugt4gr] { overflow-x: visible; }

    .audit-table thead[b-fd5qugt4gr] { display: none; }

    /* min-width: 900px above is what the desktop table needs to keep six columns legible, and it
       survives `display: block` — leaving 900px-wide "cards" spilling out of a 390px screen. Both the
       table and its cells have to be released from it, and max-width caps them at the viewport even if
       a long unbroken value tries to push wider. */
    .audit-table[b-fd5qugt4gr],
    .audit-table tbody[b-fd5qugt4gr],
    .audit-table tr[b-fd5qugt4gr],
    .audit-table td[b-fd5qugt4gr] {
        display: block;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .audit-table tbody tr[b-fd5qugt4gr] {
        background: #fff;
        border: 2px solid #e9ecef;
        border-radius: 12px;
        margin-bottom: 1rem;
        padding: 0.85rem 1rem;
        box-shadow: 0 2px 8px rgba(0, 61, 122, 0.08);
    }

    .audit-table tbody tr:hover[b-fd5qugt4gr] { background: #fff; }

    .audit-table tbody td[b-fd5qugt4gr] {
        display: block;
        position: relative;
        text-align: left;
        padding: 0.5rem 45% 0.5rem 0;
        border: none;
        min-height: 2.1rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .audit-table tbody td[b-fd5qugt4gr]::before {
        content: attr(data-label);
        position: absolute;
        right: 0;
        width: 42%;
        text-align: right;
        font-weight: 700;
        color: #003d7a;
        white-space: nowrap;
    }

    .audit-table tbody td:first-child[b-fd5qugt4gr] { padding-top: 0; }
    .audit-table tbody td:last-child[b-fd5qugt4gr] { padding-bottom: 0; }

    /* The query is the point of the row, so it gets its own line rather than being squeezed
       into the 55% left to it. */
    .audit-table tbody td[data-label="الاسم المفحوص"][b-fd5qugt4gr] {
        padding-right: 0;
        border-top: 1px dashed #e9ecef;
        margin-top: 0.35rem;
        padding-top: 0.6rem;
    }

    .audit-table tbody td[data-label="الاسم المفحوص"][b-fd5qugt4gr]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.2rem;
    }
}

/* On a narrow phone the 42% label leaves ~200px for the value, which truncates a matched entity name
   or a timestamp. Below this width the label goes on its own line and the value gets the full card. */
@media (max-width: 480px) {
    .audit-table tbody td[b-fd5qugt4gr] {
        padding-right: 0;
        min-height: 0;
    }

    .audit-table tbody td[b-fd5qugt4gr]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.15rem;
        font-size: 0.75rem;
        text-align: right;
    }

    .audit-table tbody td[b-fd5qugt4gr] { text-align: right; }
    .audit-table tbody tr[b-fd5qugt4gr] { padding: 0.75rem 0.85rem; }
}
/* /Pages/EntityDetail.razor.rz.scp.css */
/* ========================================
   📄 صفحة تفاصيل الكيان — نمط بنك حضرموت
   (info-grid / info-item مستنسخة من صفحات إدارة HB)
   ======================================== */

/* ---- page header ---- */

/* The export button sits opposite the title. A row rather than a block, so the two align at the top and
   the button does not push the chips down. */
.page-header-details[b-49856818ov] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-bottom: 1.5rem;
}

.page-header-details .header-main[b-49856818ov] {
    flex: 1 1 320px;
    min-width: 0;
}

.page-header-details .header-actions[b-49856818ov] {
    display: flex;
    gap: 0.6rem;
    flex-shrink: 0;
}

.page-header-details .header-actions .btn-hb-primary[b-49856818ov] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    text-decoration: none;
    white-space: nowrap;
}

@media (max-width: 560px) {
    .page-header-details .header-actions[b-49856818ov] { width: 100%; }
    .page-header-details .header-actions .btn-hb-primary[b-49856818ov] {
        flex: 1 1 auto;
        justify-content: center;
    }
}

.back-link[b-49856818ov] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    color: #00589e;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    margin-bottom: 0.6rem;
    transition: color 0.2s ease;
}

.back-link:hover[b-49856818ov] { color: #d4af37; }

.entity-title[b-49856818ov] {
    color: #003d7a;
    font-size: 1.65rem;
    font-weight: 800;
    margin: 0 0 0.7rem;
    line-height: 1.35;
    overflow-wrap: anywhere;
    padding-bottom: 0.7rem;
    border-bottom: 3px solid #d4af37;
}

.entity-chips[b-49856818ov] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem;
    align-items: center;
}

.chip-list[b-49856818ov] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    padding: 0.25rem 0.65rem;
    border-radius: 6px;
}

.chip-type[b-49856818ov],
.chip-meta[b-49856818ov] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    color: #495057;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.22rem 0.6rem;
    border-radius: 6px;
}

.chip-type i[b-49856818ov] { color: #003d7a; }
.chip-meta i[b-49856818ov] { color: #d4af37; }

/* Sanction measures (asset freeze, travel ban, ...) */
.chip-measure[b-49856818ov] {
    background: #fff3cd;
    border: 1px solid #ffe08a;
    color: #664d03;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.22rem 0.6rem;
    border-radius: 6px;
}

/* ---- two-column layout ---- */

.details-grid[b-49856818ov] {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
}

.details-col-main[b-49856818ov],
.details-col-side[b-49856818ov] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    min-width: 0;
}

/* ---- card headers ---- */

.hb-card-header[b-49856818ov] {
    border-bottom: 3px solid #d4af37;
    padding-bottom: 0.85rem;
    margin-bottom: 1.15rem;
}

.card-header-row[b-49856818ov] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.hb-card-title-sm[b-49856818ov] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #003d7a;
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0;
}

.hb-card-title-sm i[b-49856818ov] { color: #d4af37; }

.count-badge[b-49856818ov] {
    background: #003d7a;
    color: #fff;
    font-size: 0.78rem;
    font-weight: 700;
    min-width: 28px;
    text-align: center;
    padding: 0.18rem 0.55rem;
    border-radius: 999px;
    font-variant-numeric: tabular-nums;
}

/* ---- name groups ---- */

.name-group[b-49856818ov] {
    margin-bottom: 1.25rem;
}

.name-group:last-child[b-49856818ov] { margin-bottom: 0; }

.group-title[b-49856818ov] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    color: #6c757d;
    text-transform: uppercase;
    padding-bottom: 0.4rem;
    border-bottom: 1px dashed #e9ecef;
    margin-bottom: 0.5rem;
}

.group-count[b-49856818ov] {
    background: #f1f3f5;
    color: #495057;
    font-size: 0.7rem;
    font-weight: 700;
    padding: 0.1rem 0.4rem;
    border-radius: 999px;
}

.name-row[b-49856818ov] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    transition: background 0.2s ease;
}

.name-row:hover[b-49856818ov] { background: #f8f9fa; }

.name-latin[b-49856818ov] {
    font-size: 0.95rem;
    color: #212529;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.name-arabic[b-49856818ov] {
    font-size: 1.05rem;
    color: #212529;
    font-weight: 600;
    overflow-wrap: anywhere;
}

.script-chip[b-49856818ov] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    color: #6c757d;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    flex-shrink: 0;
}

/* ---- addresses ---- */

.address-list[b-49856818ov] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 24rem;
    overflow-y: auto;
}

.address-item[b-49856818ov] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    background: #f8f9fa;
    border-inline-start: 4px solid #003d7a;
    border-radius: 8px;
    padding: 0.65rem 0.85rem;
    font-size: 0.88rem;
    color: #333;
    line-height: 1.65;
}

.address-item i[b-49856818ov] {
    color: #d4af37;
    margin-top: 3px;
    flex-shrink: 0;
}

/* ---- info grid (bank admin pattern) ---- */

.info-grid[b-49856818ov] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr));
    gap: 0.85rem;
}

.info-item[b-49856818ov] {
    background: #f8f9fa;
    border-radius: 10px;
    padding: 0.8rem 1rem;
    border-inline-start: 4px solid #003d7a;
    min-width: 0;
}

.info-item.full-width[b-49856818ov] {
    grid-column: 1 / -1;
}

.info-label[b-49856818ov] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.75rem;
    color: #6c757d;
    margin-bottom: 0.35rem;
    font-weight: 600;
}

.info-label i[b-49856818ov] { color: #003d7a; }

.info-value[b-49856818ov] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #333;
    overflow-wrap: anywhere;
    line-height: 1.7;
}

ul.value-list[b-49856818ov] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 16rem;
    overflow-y: auto;
}

ul.value-list li[b-49856818ov] {
    padding: 0.3rem 0;
    border-bottom: 1px dashed #e9ecef;
    font-weight: 500;
}

ul.value-list li:last-child[b-49856818ov] { border-bottom: 0; }

/* ---- empty / loading ---- */

.detail-empty[b-49856818ov] {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.detail-empty i[b-49856818ov] {
    font-size: 2.75rem;
    color: #ffa500;
    display: block;
    margin-bottom: 0.85rem;
}

.detail-empty h3[b-49856818ov] {
    color: #003d7a;
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 0.35rem;
}

.detail-empty p[b-49856818ov] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0 0 1.25rem;
    /* Server messages can be long; keep them inside the card. */
    overflow-wrap: anywhere;
}

/* A load failure is recoverable, so it offers a retry next to the way back. */
.detail-empty-actions[b-49856818ov] {
    display: flex;
    gap: 0.6rem;
    justify-content: center;
    flex-wrap: wrap;
}

.detail-empty i.text-danger[b-49856818ov] {
    color: #dc3545;
}

/* ---- responsive ---- */

@media (max-width: 992px) {
    .details-grid[b-49856818ov] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 576px) {
    .entity-title[b-49856818ov] {
        font-size: 1.3rem;
    }

    .name-row[b-49856818ov] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.3rem;
    }
}
/* /Pages/Peps.razor.rz.scp.css */
/* Only the PEP search card and its controls mirror the international-list search card. */

.pep-search-layout[b-ivklxieu0x] {
    width: 100%;
}

.search-card[b-ivklxieu0x] {
    width: 100%;
    padding: 1.5rem 1.75rem;
}

.search-row[b-ivklxieu0x] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
}

.search-field-group[b-ivklxieu0x] {
    flex: 1;
    min-width: 0;
}

.search-input-wrapper[b-ivklxieu0x] {
    position: relative;
}

.search-icon[b-ivklxieu0x] {
    position: absolute;
    inset-inline-start: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    font-size: 1.1rem;
    pointer-events: none;
}

.search-input[b-ivklxieu0x] {
    width: 100%;
    height: 52px;
    padding-inline-start: 3rem !important;
    font-size: 1.05rem;
}

.search-btn[b-ivklxieu0x] {
    height: 52px;
    min-width: 170px;
    flex-shrink: 0;
    white-space: nowrap;
}

.hb-spinner-inline[b-ivklxieu0x] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: hb-spin-b-ivklxieu0x 0.7s linear infinite;
    display: inline-block;
}

@keyframes hb-spin-b-ivklxieu0x {
    to { transform: rotate(360deg); }
}

.pep-results-list[b-ivklxieu0x] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pep-result-card[b-ivklxieu0x] {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #e9ecef;
    border-inline-start: 5px solid #adb5bd;
    padding: 1rem 1.25rem;
    box-shadow: 0 4px 14px rgba(0, 61, 122, 0.06);
    transition: all 0.3s ease;
}

.pep-result-card:hover[b-ivklxieu0x] {
    box-shadow: 0 10px 26px rgba(0, 61, 122, 0.12);
    transform: translateY(-2px);
}

.pep-result-head[b-ivklxieu0x] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.pep-result-identity[b-ivklxieu0x] {
    flex: 1;
    min-width: 0;
}

.pep-result-name[b-ivklxieu0x] {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 0.35rem;
    line-height: 1.4;
    overflow-wrap: anywhere;
    color: #003d7a;
}

.pep-result-native[b-ivklxieu0x] {
    font-size: 0.9rem;
    color: #6c757d;
    overflow-wrap: anywhere;
}

.pep-result-score[b-ivklxieu0x] {
    flex-shrink: 0;
    min-width: 76px;
    text-align: center;
}

.pep-result-meta[b-ivklxieu0x] {
    margin-top: 0.75rem;
}

@media (max-width: 768px) {
    .search-card[b-ivklxieu0x] {
        padding: 1.25rem 1rem;
    }

    .search-row[b-ivklxieu0x] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.85rem;
    }

    .search-btn[b-ivklxieu0x] {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 576px) {
    .pep-result-head[b-ivklxieu0x] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .pep-result-score[b-ivklxieu0x] {
        text-align: start;
    }
}
/* /Pages/Profile.razor.rz.scp.css */
.profile-page[b-4llajsii8x] {
    max-width: 1100px;
    margin: 0 auto;
}

.page-title-section[b-4llajsii8x] { margin-bottom: 1.25rem; }

.profile-grid[b-4llajsii8x] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.25rem;
    align-items: start;
}

.profile-card[b-4llajsii8x] { overflow: hidden; }

.card-head[b-4llajsii8x] {
    padding: 1rem 1.35rem;
    border-bottom: 1px solid #eef0f3;
    background: #fbfcfd;
}

.card-head .hb-section-title[b-4llajsii8x] {
    margin: 0;
    font-size: 1rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.card-body-hb[b-4llajsii8x] { padding: 1.35rem; }

/* ---- identity ---- */

.identity[b-4llajsii8x] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding-bottom: 1.1rem;
    margin-bottom: 1.1rem;
    border-bottom: 1px dashed #e9ecef;
}

.identity-avatar[b-4llajsii8x] {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    font-weight: 700;
    font-size: 1.1rem;
}

.identity-name[b-4llajsii8x] {
    font-weight: 700;
    color: #003d7a;
    font-size: 1.05rem;
}

.identity-user[b-4llajsii8x] {
    font-size: 0.82rem;
    color: #8a94a0;
    display: flex;
    align-items: center;
    gap: 0.15rem;
}

.info-grid[b-4llajsii8x] { display: grid; gap: 0.85rem; }

.info-item[b-4llajsii8x] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
}

.info-label[b-4llajsii8x] {
    font-size: 0.82rem;
    color: #8a94a0;
    flex: 0 0 auto;
}

.info-value[b-4llajsii8x] {
    font-weight: 600;
    color: #2c3e50;
    text-align: left;
}

.info-value .muted[b-4llajsii8x] { color: #8a94a0; font-weight: 400; }

/* Role badges deleted with the row they styled — an employee is not shown their permission level. */

/* ---- form ---- */

.req[b-4llajsii8x] { color: #dc3545; }

.field-hint[b-4llajsii8x] {
    font-size: 0.75rem;
    color: #8a94a0;
    margin-top: 0.4rem;
    display: flex;
    align-items: center;
    gap: 0.25rem;
}

.field-hint.danger[b-4llajsii8x] { color: #dc3545; font-weight: 600; }
.field-hint.ok[b-4llajsii8x]     { color: #26914a; font-weight: 600; }

/* Physical `left`, not `inline-start`: this wrapper inherits the page's RTL direction while the input
   is forced LTR for Latin passwords, so the logical property would resolve to opposite sides for the
   padding and the button — putting the eye on top of the text. Matches HB.OpenAcct. */
.password-field[b-4llajsii8x] {
    position: relative;
    display: block;
}

.password-field .hb-form-control[b-4llajsii8x] { padding-left: 3rem; }

.password-field input[b-4llajsii8x] {
    direction: ltr;
    text-align: left;
}

.password-field .password-toggle[b-4llajsii8x] {
    position: absolute;
    left: 0.35rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.18s ease, background 0.18s ease;
}

.password-field .password-toggle:hover[b-4llajsii8x] {
    color: #003d7a;
    background: #eef4ff;
}

.form-actions[b-4llajsii8x] {
    display: flex;
    justify-content: flex-start;
    margin-top: 1.35rem;
    padding-top: 1.1rem;
    border-top: 1px dashed #e9ecef;
}

.loading-state[b-4llajsii8x] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 3rem 1rem;
    color: #6c757d;
}

@media (max-width: 768px) {
    .profile-grid[b-4llajsii8x] { grid-template-columns: 1fr; }

    /* Label above value: side by side, a long full name and its label crowd each other out. */
    .info-item[b-4llajsii8x] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.15rem;
    }

    .info-value[b-4llajsii8x] { text-align: right; }
    .form-actions > *[b-4llajsii8x] { flex: 1 1 auto; justify-content: center; }
}
/* /Pages/Reports.razor.rz.scp.css */
/* Reports page.

   The page frame (page-title-section, section-title, the pagination bar) and every hb-* class come from
   the global sheets. Everything below is scoped, which is also why the cell and filter styles are
   repeated here rather than imported from Audit.razor.css — scoped CSS is per-component by design. */

.reports-page[b-bqwk4c5uhj] { padding-bottom: 2rem; }

.header-actions[b-bqwk4c5uhj] { display: flex; gap: 0.65rem; flex-wrap: wrap; }

/* ---- tabs ---- */

.report-tabs[b-bqwk4c5uhj] {
    display: flex;
    gap: 0.4rem;
    margin-bottom: 1.15rem;
    border-bottom: 2px solid #e9ecef;
}

.report-tab[b-bqwk4c5uhj] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.65rem 1.15rem;
    background: transparent;
    border: 0;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    font-family: inherit;
    font-size: 0.92rem;
    font-weight: 700;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.15s, border-color 0.15s;
}

.report-tab i[b-bqwk4c5uhj] { font-size: 1rem; }
.report-tab:hover[b-bqwk4c5uhj] { color: #003d7a; }

.report-tab.active[b-bqwk4c5uhj] {
    color: #003d7a;
    border-bottom-color: #d4af37;
}

/* ---- filters ---- */

.filter-card[b-bqwk4c5uhj] {
    margin-bottom: 1.15rem;
    padding: 1rem 1.15rem;
}

.quick-ranges[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    padding-bottom: 0.85rem;
    margin-bottom: 0.85rem;
    border-bottom: 1px dashed #e9ecef;
}

.quick-label[b-bqwk4c5uhj] {
    font-size: 0.8rem;
    font-weight: 700;
    color: #495057;
    margin-inline-end: 0.25rem;
}

.quick-label i[b-bqwk4c5uhj] { color: #d4af37; }

.quick-btn[b-bqwk4c5uhj] {
    padding: 0.35rem 0.85rem;
    background: #f8f9fa;
    border: 1.5px solid #e9ecef;
    border-radius: 999px;
    font-family: inherit;
    font-size: 0.8rem;
    font-weight: 600;
    color: #495057;
    cursor: pointer;
    transition: all 0.15s;
}

.quick-btn:hover[b-bqwk4c5uhj] { border-color: #d4af37; color: #003d7a; }

.quick-btn.active[b-bqwk4c5uhj] {
    background: #003d7a;
    border-color: #003d7a;
    color: #fff;
}

.filter-row[b-bqwk4c5uhj] {
    display: flex;
    gap: 0.85rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

.filter-field[b-bqwk4c5uhj] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    flex: 1 1 180px;
    min-width: 0;
}

.filter-field.filter-narrow[b-bqwk4c5uhj] { flex: 0 1 165px; }

.filter-field .hb-form-label[b-bqwk4c5uhj] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #495057;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.filter-field .hb-form-label i[b-bqwk4c5uhj] { color: #d4af37; }

.filter-check[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    padding-bottom: 0.55rem;
}

/* admin-shared.css enforces a 44x44 touch target on every checkbox, and min-width beats width — which is
   why setting width alone left a 44px box on the desktop filter bar. Both minimums have to be released. */
.filter-check .form-check-input[b-bqwk4c5uhj] {
    width: 1.15rem;
    height: 1.15rem;
    min-width: 1.15rem;
    min-height: 1.15rem;
    flex: 0 0 auto;
    margin: 0;
    cursor: pointer;
    border: 1.5px solid #adb5bd;
}

/* On a touch device the 44px target is restored: a 18px checkbox is a real accessibility problem with a
   fingertip, and the rule it overrides above exists for that reason. The label is clickable either way. */
@media (hover: none) and (pointer: coarse) {
    .filter-check .form-check-input[b-bqwk4c5uhj] {
        min-width: 44px;
        min-height: 44px;
        width: 44px;
        height: 44px;
    }
}

.filter-check .form-check-label[b-bqwk4c5uhj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #495057;
    cursor: pointer;
    margin: 0;
}

.export-row[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.85rem;
    flex-wrap: wrap;
    margin-top: 0.95rem;
    padding-top: 0.85rem;
    border-top: 1px dashed #e9ecef;
}

.range-caption[b-bqwk4c5uhj] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #6c757d;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.range-caption i[b-bqwk4c5uhj] { color: #d4af37; }

.btn-export[b-bqwk4c5uhj] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    text-decoration: none;
    white-space: nowrap;
}

/* ---- summary cards ---- */

.stats-grid[b-bqwk4c5uhj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 0.85rem;
    margin-bottom: 1.15rem;
}

.stat-card[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
    padding: 0.95rem 1.1rem;
    box-shadow: 0 2px 8px rgba(0, 61, 122, 0.06);
}

/* A non-zero "not screened" count is a to-do list, not a statistic: each row is a customer checked
   against nothing. The card is always rendered so a zero can be read as a positive statement, and
   coloured only when there is something to act on. */
.stat-card.stat-alert[b-bqwk4c5uhj] {
    border-color: #f5c2c7;
    background: #fff8f8;
}

.stat-icon[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    border-radius: 10px;
    font-size: 1.15rem;
    color: #fff;
    background: linear-gradient(135deg, #003d7a 0%, #0056b3 100%);
}

.stat-icon.today[b-bqwk4c5uhj] { background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%); color: #003d7a; }
.stat-icon.hits[b-bqwk4c5uhj] { background: linear-gradient(135deg, #dc3545 0%, #e4606d 100%); }

.stat-value[b-bqwk4c5uhj] {
    font-size: 1.5rem;
    font-weight: 800;
    color: #003d7a;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.stat-label[b-bqwk4c5uhj] { font-size: 0.78rem; color: #6c757d; font-weight: 600; }

.source-summary[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin: -0.25rem 0 1.15rem;
    padding: 0.8rem 1rem;
    background: #fff;
    border: 1px solid #e9ecef;
    border-radius: 12px;
}

.source-summary-title[b-bqwk4c5uhj] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    color: #495057;
    font-size: 0.82rem;
    font-weight: 700;
}

.source-summary-title i[b-bqwk4c5uhj] { color: #d4af37; }

.source-summary-items[b-bqwk4c5uhj] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

.source-summary-item[b-bqwk4c5uhj],
.audit-source[b-bqwk4c5uhj] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    white-space: nowrap;
}

.source-summary-item[b-bqwk4c5uhj] { padding: 0.35rem 0.65rem; }
.source-summary-item strong[b-bqwk4c5uhj] { font-size: 0.85rem; font-variant-numeric: tabular-nums; }
.audit-source[b-bqwk4c5uhj] { padding: 0.22rem 0.55rem; }

.source-international[b-bqwk4c5uhj] { background: #e7f1ff; color: #003d7a; }
.source-local[b-bqwk4c5uhj] { background: #e8f5e9; color: #1b5e20; }
.source-pep[b-bqwk4c5uhj] { background: #f3e8ff; color: #6f2da8; }

.report-scope-note[b-bqwk4c5uhj] { margin-bottom: 1rem; }

/* ---- table ---- */

.table-card[b-bqwk4c5uhj] { padding: 0; overflow: hidden; }
.table-responsive[b-bqwk4c5uhj] { overflow-x: auto; }

.report-table[b-bqwk4c5uhj] {
    width: 100%;
    min-width: 1260px;
    border-collapse: collapse;
}

.report-table thead[b-bqwk4c5uhj] {
    background: linear-gradient(135deg, #003d7a 0%, #0056b3 100%);
    color: #fff;
}

.report-table thead th[b-bqwk4c5uhj] {
    padding: 0.8rem 0.9rem;
    text-align: right;
    font-size: 0.8rem;
    font-weight: 700;
    white-space: nowrap;
}

.report-table tbody tr[b-bqwk4c5uhj] { border-bottom: 1px solid #f1f3f5; }
.report-table tbody tr:last-child[b-bqwk4c5uhj] { border-bottom: 0; }
.report-table tbody tr:hover[b-bqwk4c5uhj] { background: rgba(0, 61, 122, 0.04); }

.report-table tbody td[b-bqwk4c5uhj] {
    padding: 0.7rem 0.9rem;
    font-size: 0.85rem;
    vertical-align: middle;
}

.report-table tbody tr.totals-row[b-bqwk4c5uhj] {
    background: #f8f9fa;
    border-top: 2px solid #e9ecef;
}

.report-table tbody tr.totals-row:hover[b-bqwk4c5uhj] { background: #f8f9fa; }
.report-table tbody tr.totals-row td[b-bqwk4c5uhj] { font-size: 0.82rem; }

.muted-cell[b-bqwk4c5uhj] { color: #8a94a0; }

.who-name[b-bqwk4c5uhj] { font-weight: 700; color: #212529; }
.who-username[b-bqwk4c5uhj] { font-size: 0.73rem; color: #8a94a0; direction: ltr; }

.query-text[b-bqwk4c5uhj] {
    font-weight: 600;
    color: #212529;
    overflow-wrap: break-word;
    word-break: break-word;
}

.top-match-name[b-bqwk4c5uhj] {
    display: inline-block;
    max-width: 220px;
    color: #495057;
    font-size: 0.8rem;
    overflow-wrap: break-word;
}

.list-name[b-bqwk4c5uhj] { font-size: 0.78rem; color: #6c757d; margin-inline-start: 0.4rem; }

.count-pill[b-bqwk4c5uhj] {
    display: inline-block;
    min-width: 2rem;
    padding: 0.15rem 0.5rem;
    background: #e7f1ff;
    color: #003d7a;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.score-pill[b-bqwk4c5uhj] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    font-size: 0.78rem;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    direction: ltr;
}

.score-high[b-bqwk4c5uhj] { background: #f8d7da; color: #842029; }
.score-med[b-bqwk4c5uhj] { background: #fff3cd; color: #664d03; }
.score-low[b-bqwk4c5uhj] { background: #e9ecef; color: #495057; }

/* ---- the verdict column ----
   Three states, three colours. "Not screened" is amber rather than green precisely because it is not a
   clean result: it is a name that was checked against nothing and has to be screened again. */

.verdict-badge[b-bqwk4c5uhj] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    white-space: nowrap;
}

.verdict-matched[b-bqwk4c5uhj] { background: #f8d7da; color: #842029; }
.verdict-nomatch[b-bqwk4c5uhj] { background: #d1e7dd; color: #0f5132; }
.verdict-notscreened[b-bqwk4c5uhj] { background: #fff3cd; color: #664d03; }

.chip-list[b-bqwk4c5uhj] {
    display: inline-block;
    padding: 0.12rem 0.45rem;
    background: #003d7a;
    color: #fff;
    border-radius: 5px;
    font-size: 0.72rem;
    font-weight: 700;
    direction: ltr;
}

.partial-mark[b-bqwk4c5uhj] {
    margin-inline-start: 0.3rem;
    color: #b8860b;
    font-size: 0.85rem;
    cursor: help;
}

.time-cell[b-bqwk4c5uhj] { white-space: nowrap; font-variant-numeric: tabular-nums; }
.time-hm[b-bqwk4c5uhj] { font-size: 0.76rem; color: #adb5bd; }

.report-empty[b-bqwk4c5uhj] {
    text-align: center;
    padding: 2.75rem 1rem;
}

.report-empty i[b-bqwk4c5uhj] { font-size: 2.75rem; color: #dee2e6; display: block; margin-bottom: 0.85rem; }

.report-empty h3[b-bqwk4c5uhj] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #495057;
    margin: 0 0 0.35rem;
}

.report-empty p[b-bqwk4c5uhj] { color: #6c757d; font-size: 0.88rem; margin: 0; }

/* ---- mobile: tables become cards ----
   An eight-column report is unusable at 390px, and horizontal scrolling hides exactly the columns that
   matter — the branch and whether the name was screened at all. */

@media (max-width: 768px) {
    .filter-row[b-bqwk4c5uhj] { flex-direction: column; align-items: stretch; }
    .filter-field[b-bqwk4c5uhj], .filter-field.filter-narrow[b-bqwk4c5uhj] { flex: 1 1 auto; }
    .stat-value[b-bqwk4c5uhj] { font-size: 1.3rem; }
    .source-summary[b-bqwk4c5uhj] { align-items: stretch; }
    .source-summary-items[b-bqwk4c5uhj] { width: 100%; }
    .source-summary-item[b-bqwk4c5uhj] { flex: 1 1 140px; justify-content: center; }
    .export-row[b-bqwk4c5uhj] { flex-direction: column; align-items: stretch; }
    .btn-export[b-bqwk4c5uhj] { justify-content: center; }
    .report-tab[b-bqwk4c5uhj] { padding: 0.6rem 0.8rem; font-size: 0.85rem; }

    .table-responsive[b-bqwk4c5uhj] { overflow-x: visible; }
    .report-table thead[b-bqwk4c5uhj] { display: none; }

    /* The desktop min-width above survives `display: block`, which is what once produced 900px-wide
       "cards" inside a 390px screen. The table and every cell have to be released from it, and
       max-width caps them at the viewport even when a long unbroken value pushes outward. */
    .report-table[b-bqwk4c5uhj],
    .report-table tbody[b-bqwk4c5uhj],
    .report-table tr[b-bqwk4c5uhj],
    .report-table td[b-bqwk4c5uhj] {
        display: block;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .report-table tbody tr[b-bqwk4c5uhj] {
        background: #fff;
        border: 2px solid #e9ecef;
        border-radius: 12px;
        margin-bottom: 1rem;
        padding: 0.85rem 1rem;
        box-shadow: 0 2px 8px rgba(0, 61, 122, 0.08);
    }

    .report-table tbody tr:hover[b-bqwk4c5uhj] { background: #fff; }
    .report-table tbody tr.totals-row[b-bqwk4c5uhj] { background: #f8f9fa; }

    .report-table tbody td[b-bqwk4c5uhj] {
        display: block;
        position: relative;
        text-align: left;
        padding: 0.5rem 45% 0.5rem 0;
        border: none;
        min-height: 2.1rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .report-table tbody td[b-bqwk4c5uhj]::before {
        content: attr(data-label);
        position: absolute;
        right: 0;
        width: 42%;
        text-align: right;
        font-weight: 700;
        color: #003d7a;
        white-space: nowrap;
    }

    .report-table tbody td:first-child[b-bqwk4c5uhj] { padding-top: 0; }
    .report-table tbody td:last-child[b-bqwk4c5uhj] { padding-bottom: 0; }

    /* The screened name is the point of the row, so it gets a full line instead of the 55% left over. */
    .report-table tbody td[data-label="الاسم المفحوص"][b-bqwk4c5uhj] {
        padding-right: 0;
        border-top: 1px dashed #e9ecef;
        margin-top: 0.35rem;
        padding-top: 0.6rem;
    }

    .report-table tbody td[data-label="الاسم المفحوص"][b-bqwk4c5uhj]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.2rem;
    }

    /* The lists-report footnote spans columns on desktop; as a card it is a plain paragraph. */
    .report-table tbody tr.totals-row td[colspan][b-bqwk4c5uhj] { padding-right: 0; }
    .report-table tbody tr.totals-row td[colspan][b-bqwk4c5uhj]::before { content: none; }
}

@media (max-width: 420px) {
    .report-table tbody td[b-bqwk4c5uhj] {
        padding-right: 0;
        text-align: right;
    }

    .report-table tbody td[b-bqwk4c5uhj]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.15rem;
    }

    .report-table tbody tr[b-bqwk4c5uhj] { padding: 0.75rem 0.85rem; }
    .quick-btn[b-bqwk4c5uhj] { flex: 1 1 auto; text-align: center; }
}
/* /Pages/Search.razor.rz.scp.css */
/* ========================================
   🔍 صفحة فحص الأسماء — نمط بنك حضرموت
   ======================================== */

.search-card[b-3eamclmua7] {
    padding: 1.5rem 1.75rem;
}

.search-row[b-3eamclmua7] {
    display: flex;
    align-items: flex-end;
    gap: 1rem;
}

.search-field-group[b-3eamclmua7] {
    flex: 1;
    min-width: 0;
}

.search-input-wrapper[b-3eamclmua7] {
    position: relative;
}

.search-icon[b-3eamclmua7] {
    position: absolute;
    inset-inline-start: 1rem;
    top: 50%;
    transform: translateY(-50%);
    color: #adb5bd;
    font-size: 1.1rem;
    pointer-events: none;
}

.search-input[b-3eamclmua7] {
    padding-inline-start: 3rem !important;
    height: 52px;
    font-size: 1.05rem;
}

.search-btn[b-3eamclmua7] {
    height: 52px;
    min-width: 170px;
    flex-shrink: 0;
    white-space: nowrap;
}

/* Small inline spinner that works inside a gradient button. */
.hb-spinner-inline[b-3eamclmua7] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: hb-spin-b-3eamclmua7 0.7s linear infinite;
    display: inline-block;
}

@keyframes hb-spin-b-3eamclmua7 {
    to { transform: rotate(360deg); }
}

/* ---- meta row under the input ---- */

.search-meta[b-3eamclmua7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin-top: 1.15rem;
    padding-top: 1.15rem;
    border-top: 1px solid #eef0f3;
}

.ai-toggle[b-3eamclmua7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* admin-shared.css enforces a 44px minimum on inputs for touch targets, which
   blows up a checkbox. Restore normal size for this control. */
.ai-toggle .form-check-input[b-3eamclmua7] {
    min-width: 1.15rem !important;
    min-height: 1.15rem !important;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.ai-toggle .form-check-label[b-3eamclmua7] {
    font-size: 0.88rem;
    color: #495057;
    cursor: pointer;
    margin: 0;
}

.result-meta[b-3eamclmua7] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #6c757d;
}

.result-meta .dot[b-3eamclmua7] {
    color: #d4af37;
}

/* ---- results header ---- */

.results-header[b-3eamclmua7] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
    margin: 2rem 0 1.15rem;
}

.results-header .hb-section-title[b-3eamclmua7] {
    margin: 0;
}

/* The title and the export button share a line; the legend wraps below them on a narrow screen rather than
   squeezing the button down to an icon. */
.results-title-row[b-3eamclmua7] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.btn-export-results[b-3eamclmua7] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    white-space: nowrap;
}

/* Sized in em, so the row does not jump when the label is replaced by the spinner mid-export. */
.spinner-inline[b-3eamclmua7] {
    display: inline-block;
    width: 0.9em;
    height: 0.9em;
    border: 2px solid currentColor;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin-inline-b-3eamclmua7 0.6s linear infinite;
}

@keyframes spin-inline-b-3eamclmua7 {
    to { transform: rotate(360deg); }
}

@media (max-width: 560px) {
    .results-title-row[b-3eamclmua7] { width: 100%; justify-content: space-between; }
    .btn-export-results[b-3eamclmua7] { flex: 1 1 auto; justify-content: center; }
}

.score-legend[b-3eamclmua7] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.legend-item[b-3eamclmua7] {
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.25rem 0.6rem;
    border-radius: 999px;
}

.legend-high[b-3eamclmua7] { background: #f8d7da; color: #842029; }
.legend-med[b-3eamclmua7]  { background: #fff3cd; color: #664d03; }
.legend-low[b-3eamclmua7]  { background: #e9ecef; color: #495057; }

.results-list[b-3eamclmua7] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ---- empty state ---- */

.empty-state-hb[b-3eamclmua7] {
    text-align: center;
    padding: 2.5rem 1.5rem;
}

.empty-state-hb i[b-3eamclmua7] {
    font-size: 3rem;
    color: #ced4da;
    display: block;
    margin-bottom: 0.85rem;
}

.empty-state-hb i.text-success[b-3eamclmua7] {
    color: #26b050;
}

.empty-state-hb h3[b-3eamclmua7] {
    color: #003d7a;
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0 0 0.35rem;
}

.empty-state-hb p[b-3eamclmua7] {
    color: #6c757d;
    font-size: 0.9rem;
    margin: 0;
}

/* ---- responsive ---- */

@media (max-width: 768px) {
    .search-card[b-3eamclmua7] {
        padding: 1.25rem 1rem;
    }

    .search-row[b-3eamclmua7] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.85rem;
    }

    .search-btn[b-3eamclmua7] {
        width: 100%;
        min-width: 0;
    }

    .search-meta[b-3eamclmua7] {
        flex-direction: column;
        align-items: flex-start;
    }

    .results-header[b-3eamclmua7] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.65rem;
    }
}
/* /Pages/Users.razor.rz.scp.css */
/* ========================================
   👥 إدارة المستخدمين — نمط بنك حضرموت
   ======================================== */

.header-actions[b-d7w1ct4mhq] {
    display: flex;
    gap: 0.65rem;
    flex-wrap: wrap;
}

/* ---- stat cards ---- */

.stats-grid[b-d7w1ct4mhq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stat-card[b-d7w1ct4mhq] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #fff;
    border-radius: 12px;
    padding: 1.1rem 1.25rem;
    box-shadow: 0 4px 14px rgba(0, 61, 122, 0.07);
    border: 1px solid #eef0f3;
}

.stat-icon[b-d7w1ct4mhq] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    color: #fff;
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    flex-shrink: 0;
}

.stat-icon.active[b-d7w1ct4mhq]   { background: linear-gradient(135deg, #26b050 0%, #34ce57 100%); }
.stat-icon.inactive[b-d7w1ct4mhq] { background: linear-gradient(135deg, #dc3545 0%, #e4606d 100%); }

.stat-value[b-d7w1ct4mhq] {
    font-size: 1.6rem;
    font-weight: 800;
    color: #003d7a;
    line-height: 1.1;
    font-variant-numeric: tabular-nums;
}

.stat-label[b-d7w1ct4mhq] {
    font-size: 0.8rem;
    color: #6c757d;
    font-weight: 600;
}

/* ---- table ---- */

.table-card[b-d7w1ct4mhq] {
    padding: 0;
    overflow: hidden;
}

.table-responsive[b-d7w1ct4mhq] { overflow-x: auto; }

.users-table[b-d7w1ct4mhq] {
    width: 100%;
    min-width: 860px;
    border-collapse: collapse;
}

.users-table thead[b-d7w1ct4mhq] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
}

.users-table thead th[b-d7w1ct4mhq] {
    padding: 0.9rem 1rem;
    font-weight: 700;
    font-size: 0.85rem;
    text-align: right;
    white-space: nowrap;
}

.users-table tbody tr[b-d7w1ct4mhq] {
    border-bottom: 1px solid #eef0f3;
    transition: background 0.2s ease;
}

.users-table tbody tr:last-child[b-d7w1ct4mhq] { border-bottom: 0; }
.users-table tbody tr:hover[b-d7w1ct4mhq] { background: rgba(0, 61, 122, 0.04); }

.users-table tbody tr.disabled-row[b-d7w1ct4mhq] {
    background: #fbfbfc;
    opacity: 0.72;
}

.users-table tbody td[b-d7w1ct4mhq] {
    padding: 0.85rem 1rem;
    vertical-align: middle;
    font-size: 0.88rem;
}

.muted-cell[b-d7w1ct4mhq] { color: #6c757d; font-size: 0.82rem; }

/* ---- user cell ---- */

.user-info[b-d7w1ct4mhq] {
    display: flex;
    align-items: center;
    gap: 0.7rem;
}

.user-avatar[b-d7w1ct4mhq] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: linear-gradient(135deg, #d4af37 0%, #c9a332 100%);
    color: #003d7a;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.user-fullname[b-d7w1ct4mhq] {
    font-weight: 700;
    color: #212529;
}

.user-email[b-d7w1ct4mhq] {
    font-size: 0.76rem;
    color: #8a94a0;
}

.username-chip[b-d7w1ct4mhq] {
    background: #f1f3f5;
    border: 1px solid #e9ecef;
    color: #495057;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    font-family: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;
    direction: ltr;
    display: inline-block;
}

/* ---- role badges ---- */

.role-badge[b-d7w1ct4mhq] {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.22rem 0.6rem;
    border-radius: 999px;
    margin-inline-end: 0.25rem;
}

.role-superadmin[b-d7w1ct4mhq] { background: #003d7a; color: #fff; }
.role-admin[b-d7w1ct4mhq]      { background: #d4af37; color: #003d7a; }
.role-supervisor[b-d7w1ct4mhq] { background: #e7f5ff; color: #0b5f8a; border: 1px solid #a5d8ff; }
.role-user[b-d7w1ct4mhq]       { background: #f1f3f5; color: #495057; border: 1px solid #e9ecef; }

/* ---- actions ---- */

.actions-col[b-d7w1ct4mhq] { width: 150px; }

.action-buttons[b-d7w1ct4mhq] {
    display: flex;
    gap: 0.35rem;
}

/* admin-shared.css applies a global 44px touch-target minimum to every <button>, but excludes
   .btn-action-delete — which left delete visibly smaller than its neighbours. Pin all three to
   one size here. The `button` element in the selector matches that rule's specificity, and this
   scoped sheet loads after admin-shared.css, so the pin wins without !important. */
.action-buttons button.btn-action[b-d7w1ct4mhq] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    min-height: 38px;
    border: none;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s ease;
    color: #fff;
    padding: 0;
}

.btn-action:hover:not(:disabled)[b-d7w1ct4mhq] { transform: translateY(-2px); }
.btn-action:disabled[b-d7w1ct4mhq] { opacity: 0.55; cursor: default; }

.btn-action-edit[b-d7w1ct4mhq]     { background: #00589e; }
.btn-action-password[b-d7w1ct4mhq] { background: #6c5ce7; }
.btn-action-disable[b-d7w1ct4mhq]  { background: #ffa500; }
.btn-action-enable[b-d7w1ct4mhq]   { background: #26b050; }
.btn-action-delete[b-d7w1ct4mhq]   { background: #dc3545; }

.table-empty[b-d7w1ct4mhq] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 2.5rem 1rem;
    color: #6c757d;
    font-size: 0.9rem;
}

.table-empty i[b-d7w1ct4mhq] { font-size: 1.5rem; color: #ced4da; }

/* ---- dialog ---- */

.modal-overlay[b-d7w1ct4mhq] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.65);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    padding: 1rem;
    animation: dlg-fade-b-d7w1ct4mhq 0.25s ease;
}

@keyframes dlg-fade-b-d7w1ct4mhq { from { opacity: 0; } to { opacity: 1; } }

.user-dialog[b-d7w1ct4mhq] {
    background: #fff;
    border-radius: 16px;
    width: 100%;
    max-width: 520px;
    max-height: 92vh;
    overflow-y: auto;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
    animation: dlg-rise-b-d7w1ct4mhq 0.28s ease;
}

@keyframes dlg-rise-b-d7w1ct4mhq {
    from { transform: translateY(28px); opacity: 0; }
    to   { transform: translateY(0); opacity: 1; }
}

.dialog-header[b-d7w1ct4mhq] {
    background: linear-gradient(135deg, #003d7a 0%, #00589e 100%);
    color: #fff;
    padding: 1.1rem 1.5rem;
    border-radius: 16px 16px 0 0;
}

.dialog-header.danger[b-d7w1ct4mhq] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

.dialog-header h3[b-d7w1ct4mhq] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
}

.dialog-body[b-d7w1ct4mhq] { padding: 1.5rem; }

.dialog-footer[b-d7w1ct4mhq] {
    padding: 1.15rem 1.5rem;
    border-top: 1px solid #eef0f3;
    display: flex;
    gap: 0.75rem;
    justify-content: flex-end;
}

.req[b-d7w1ct4mhq] { color: #dc3545; }

.field-hint[b-d7w1ct4mhq] {
    font-size: 0.75rem;
    color: #8a94a0;
    margin-top: 0.3rem;
}

.field-hint.danger[b-d7w1ct4mhq] { color: #dc3545; font-weight: 600; }
.field-hint.ok[b-d7w1ct4mhq]     { color: #26914a; font-weight: 600; }
.field-hint i[b-d7w1ct4mhq]      { margin-inline-end: 0.2rem; }

/* ---- password field with a reveal toggle ----
   The eye sits inside the input's padding rather than beside it, so the field keeps its full width and
   the control cannot be mistaken for a second input. */
.password-field[b-d7w1ct4mhq] {
    position: relative;
    display: block;
}

/* Physical `left`, not the logical `inline-start`. The wrapper inherits the page's RTL direction while
   the input below is forced LTR, so the two resolved `inline-start` to opposite sides: the padding
   opened space on the left and the button sat on the right, over the text. Matches HB.OpenAcct. */
.password-field .hb-form-control[b-d7w1ct4mhq] {
    padding-left: 3rem;
}

/* Latin passwords in an RTL field would otherwise render right-aligned with the caret jumping
   around as the user types. */
.password-field input[b-d7w1ct4mhq] {
    direction: ltr;
    text-align: left;
}

.password-field .password-toggle[b-d7w1ct4mhq] {
    position: absolute;
    left: 0.35rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 2rem;
    height: 2rem;
    min-width: 2rem;
    min-height: 2rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: #6c757d;
    cursor: pointer;
    transition: color 0.18s ease, background 0.18s ease;
}

.password-field .password-toggle:hover[b-d7w1ct4mhq] {
    color: #003d7a;
    background: #eef4ff;
}

/* Identifies whose password is being changed, so the dialog cannot be applied to the wrong person
   after the list scrolls behind it. */
.dialog-subject[b-d7w1ct4mhq] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    padding: 0.7rem 0.85rem;
    margin-bottom: 1rem;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    background: #f8f9fb;
}

.dialog-subject i[b-d7w1ct4mhq] { font-size: 1.1rem; color: #003d7a; }
.dialog-subject .muted-cell[b-d7w1ct4mhq] { font-size: 0.78rem; color: #8a94a0; }

.confirm-dialog[b-d7w1ct4mhq] { max-width: 460px; }

.confirm-text[b-d7w1ct4mhq] {
    font-size: 0.95rem;
    color: #495057;
    line-height: 1.8;
    margin: 0 0 1rem;
}

.warning-note[b-d7w1ct4mhq] {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    background: #fff3cd;
    border: 1px solid #ffe08a;
    border-radius: 8px;
    padding: 0.75rem 0.9rem;
}

.warning-note i[b-d7w1ct4mhq] { color: #856404; margin-top: 2px; }
.warning-note p[b-d7w1ct4mhq] { margin: 0; color: #664d03; font-size: 0.85rem; }

.btn-danger-hb[b-d7w1ct4mhq] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
    color: #fff;
    border: none;
    padding: 0.7rem 1.5rem;
    border-radius: 6px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-danger-hb:hover:not(:disabled)[b-d7w1ct4mhq] {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(220, 53, 69, 0.4);
}

.hb-spinner-inline[b-d7w1ct4mhq] {
    width: 1rem;
    height: 1rem;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    animation: sp-b-d7w1ct4mhq 0.7s linear infinite;
    display: inline-block;
}

@keyframes sp-b-d7w1ct4mhq { to { transform: rotate(360deg); } }

/* ---- responsive ---- */

@media (max-width: 768px) {
    .header-actions[b-d7w1ct4mhq] { width: 100%; }
    .header-actions > *[b-d7w1ct4mhq] { flex: 1 1 auto; justify-content: center; }
    .stat-value[b-d7w1ct4mhq] { font-size: 1.35rem; }

    /* ---- table becomes cards ---- same pattern as the audit log, see Audit.razor.css ---- */
    .table-responsive[b-d7w1ct4mhq] { overflow-x: visible; }

    .users-table thead[b-d7w1ct4mhq] { display: none; }

    /* min-width: 860px above survives `display: block`, which is what made the cards spill far past
       the viewport. Released here on the table and its cells, and capped so a long value cannot
       re-widen them. */
    .users-table[b-d7w1ct4mhq],
    .users-table tbody[b-d7w1ct4mhq],
    .users-table tr[b-d7w1ct4mhq],
    .users-table td[b-d7w1ct4mhq] {
        display: block;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .users-table tbody tr[b-d7w1ct4mhq] {
        background: #fff;
        border: 2px solid #e9ecef;
        border-radius: 12px;
        margin-bottom: 1rem;
        padding: 0.85rem 1rem;
        box-shadow: 0 2px 8px rgba(0, 61, 122, 0.08);
    }

    .users-table tbody tr:hover[b-d7w1ct4mhq] { background: #fff; }

    /* A suspended account must stay obvious as a card; the row tint alone reads as a rendering
       quirk once the table grid is gone. */
    .users-table tbody tr.disabled-row[b-d7w1ct4mhq] {
        border-color: #f1c9c9;
        background: #fffafa;
    }

    .users-table tbody td[b-d7w1ct4mhq] {
        display: block;
        position: relative;
        text-align: left;
        padding: 0.5rem 45% 0.5rem 0;
        border: none;
        min-height: 2.1rem;
        overflow-wrap: break-word;
        word-break: break-word;
    }

    .users-table tbody td[b-d7w1ct4mhq]::before {
        content: attr(data-label);
        position: absolute;
        right: 0;
        width: 42%;
        text-align: right;
        font-weight: 700;
        color: #003d7a;
        white-space: nowrap;
    }

    /* The person is the card's heading: full width, no inline label. */
    .users-table tbody td[data-label="الموظف"][b-d7w1ct4mhq] {
        padding: 0 0 0.6rem 0;
        margin-bottom: 0.35rem;
        border-bottom: 1px dashed #e9ecef;
    }

    .users-table tbody td[data-label="الموظف"][b-d7w1ct4mhq]::before { content: none; }

    /* Four icon buttons in a 55%-wide column would wrap one per line. */
    .users-table tbody td[data-label="الإجراءات"][b-d7w1ct4mhq] {
        padding: 0.7rem 0 0 0;
        margin-top: 0.35rem;
        border-top: 1px dashed #e9ecef;
    }

    .users-table tbody td[data-label="الإجراءات"][b-d7w1ct4mhq]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.4rem;
    }

    .users-table tbody td[data-label="الإجراءات"] .action-buttons[b-d7w1ct4mhq] { justify-content: flex-start; }
}

/* Narrow phone: label above value, as in Audit.razor.css. */
@media (max-width: 480px) {
    .users-table tbody td[b-d7w1ct4mhq] {
        padding-right: 0;
        min-height: 0;
        text-align: right;
    }

    .users-table tbody td[b-d7w1ct4mhq]::before {
        position: static;
        display: block;
        width: auto;
        margin-bottom: 0.15rem;
        font-size: 0.75rem;
        text-align: right;
    }

    .users-table tbody tr[b-d7w1ct4mhq] { padding: 0.75rem 0.85rem; }

    /* Restored: the person row is the heading and must not gain a label at this width. */
    .users-table tbody td[data-label="الموظف"][b-d7w1ct4mhq]::before { content: none; }
}

/* ---- list-management grant ----
   Styled unlike .role-badge on purpose: this is a permission, not a job title, and a matching filled
   pill would read as a second role. Outlined, and it sits after the role badge. */
.grant-badge[b-d7w1ct4mhq] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.15rem 0.55rem;
    margin-inline-start: 0.3rem;
    border: 1px solid #6c5ce7;
    border-radius: 6px;
    background: #f3f1ff;
    color: #4b3fbb;
    font-size: 0.72rem;
    font-weight: 700;
    white-space: nowrap;
}

.permission-group[b-d7w1ct4mhq] {
    padding: 0.85rem 1rem;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    background: #f8f9fb;
}

.permission-group .form-check-label[b-d7w1ct4mhq] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 600;
    color: #2c3e50;
    cursor: pointer;
    margin: 0;
}

.permission-group .form-check-label i[b-d7w1ct4mhq] { color: #6c5ce7; }
.permission-group .field-hint[b-d7w1ct4mhq] { margin-top: 0.5rem; line-height: 1.55; }

/* The global 44px touch-target minimum in admin-shared.css would blow this checkbox up into a square. */
.permission-group .form-check-input[b-d7w1ct4mhq] {
    min-width: 1.15rem !important;
    min-height: 1.15rem !important;
    width: 1.15rem;
    height: 1.15rem;
    margin: 0;
    flex-shrink: 0;
    cursor: pointer;
}

.permission-group .form-check-input:disabled[b-d7w1ct4mhq] { cursor: not-allowed; opacity: 0.5; }