#customerSecurityScreen{padding:0;box-sizing:border-box;}
#customerSecurityScreen .customer-security-shell{max-width:1180px;margin:0 auto;padding:22px 20px 40px;}
.customer-security-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px;}
.customer-security-title{display:flex;align-items:center;gap:14px;min-width:0;}
.customer-security-title>.material-icons{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:26px;background:#eef4ff;color:#2457a6;}
.customer-security-title h2{margin:0;font-size:24px;line-height:1.2;font-weight:700;color:#172033;}
.customer-security-title p{margin:6px 0 0;color:#687386;font-size:13px;}
.customer-security-refresh{border:1px solid #d9e0ea;background:#fff;color:#26364d;border-radius:10px;padding:10px 14px;display:inline-flex;align-items:center;gap:7px;font-weight:600;cursor:pointer;box-shadow:0 2px 8px rgba(20,40,80,.05);}
.customer-security-refresh:hover{background:#f7f9fc;}
.customer-security-refresh .material-icons{font-size:18px;}
.customer-security-note{display:flex;align-items:center;gap:9px;background:#f6f9fd;border:1px solid #e2e9f3;color:#536175;border-radius:12px;padding:11px 13px;margin-bottom:18px;font-size:13px;}
.customer-security-note .material-icons{font-size:19px;color:#28704c;}
.customer-security-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.customer-security-card{display:flex;align-items:center;justify-content:space-between;gap:14px;background:#fff;border:1px solid #e3e8ef;border-radius:15px;padding:16px 17px;box-shadow:0 5px 18px rgba(25,45,75,.06);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;}
.customer-security-card:hover{transform:translateY(-1px);box-shadow:0 8px 22px rgba(25,45,75,.09);border-color:#cfd8e5;}
.customer-security-card-main{display:flex;align-items:center;gap:12px;min-width:0;flex:1;}
.customer-security-avatar{width:42px;height:42px;flex:0 0 42px;border-radius:12px;display:grid;place-items:center;background:#edf3ff;color:#2457a6;font-size:17px;font-weight:700;}
.customer-security-card-info{min-width:0;display:flex;flex-direction:column;gap:4px;}
.customer-security-card-info strong{color:#182235;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.customer-security-card-info small{color:#7a8595;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.customer-security-badge{display:inline-flex;align-items:center;width:max-content;padding:3px 7px;border-radius:999px;background:#eaf7ef;color:#28704c;font-size:10px;font-weight:700;letter-spacing:.3px;}
.customer-security-arrow{width:38px;height:38px;border:0;border-radius:10px;background:#f1f5fb;color:#2457a6;display:grid;place-items:center;font-size:22px;cursor:pointer;flex:0 0 38px;}
.customer-security-arrow:hover{background:#e5edf9;}
.customer-security-loading,.customer-security-empty,.customer-security-error{grid-column:1/-1;text-align:center;padding:35px 20px;border:1px dashed #d7dee9;border-radius:14px;color:#697586;background:#fff;}
.customer-security-error{color:#a33a3a;background:#fff8f8;border-color:#efcaca;}
.customer-security-status{margin-top:12px;font-size:12px;color:#758092;}
.security-detail-overlay{position:fixed;inset:0;z-index:99999;background:rgba(11,20,35,.58);display:flex;align-items:center;justify-content:center;padding:18px;box-sizing:border-box;}
.security-detail-modal{position:relative;width:min(720px,100%);max-height:min(86vh,760px);overflow:auto;background:#fff;border-radius:18px;box-shadow:0 22px 70px rgba(0,0,0,.25);padding:24px;}
.security-detail-close{position:absolute;right:13px;top:11px;width:36px;height:36px;border:0;border-radius:10px;background:#f1f4f8;color:#4d596a;font-size:24px;cursor:pointer;}
.security-detail-modal h3{margin:0 45px 20px 0;color:#172033;font-size:21px;}
.security-detail-grid{display:grid;grid-template-columns:180px 1fr;border:1px solid #e4e9f0;border-radius:12px;overflow:hidden;}
.security-detail-grid>*{margin:0;padding:11px 13px;border-bottom:1px solid #edf0f4;font-size:13px;}
.security-detail-grid b{background:#f7f9fc;color:#5d6878;font-weight:600;}
.security-detail-grid span{color:#1d2939;word-break:break-word;}
.security-no-password{font-weight:600;color:#536175!important;}
@media(max-width:760px){#customerSecurityScreen .customer-security-shell{padding:16px 12px 30px}.customer-security-head{align-items:flex-start;flex-direction:column}.customer-security-title h2{font-size:20px}.customer-security-refresh{align-self:stretch;justify-content:center}.customer-security-list{grid-template-columns:1fr}.customer-security-card{padding:13px}.security-detail-modal{padding:19px;border-radius:15px}.security-detail-grid{grid-template-columns:1fr}.security-detail-grid b{border-bottom:0;padding-bottom:4px;background:#f7f9fc}.security-detail-grid span{padding-top:4px}.security-detail-grid>*{padding-left:11px;padding-right:11px}.security-detail-overlay{padding:10px}}

/* =========================================================
   STEP 39 — SECURITY DETAIL MODAL / MANAGER CONTENT BOUNDS
   Keep the modal inside the Business Manager content area so it
   never sits underneath the persistent navigation rail.
========================================================= */
.security-detail-overlay{
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:var(--ard-manager-sidebar,226px)!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:18px!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:auto!important;
    z-index:99999!important;
}
.security-detail-modal{
    width:min(720px,100%)!important;
    max-width:100%!important;
    max-height:calc(100vh - 36px)!important;
    margin:0 auto!important;
}
body.sbp-manager-sidebar-collapsed .security-detail-overlay{
    left:54px!important;
    top:54px!important;
}

@media(max-width:700px){
    .security-detail-overlay{
        left:54px!important;
        top:52px!important;
        right:0!important;
        bottom:0!important;
        padding:10px!important;
        align-items:flex-start!important;
        justify-content:center!important;
        overflow-y:auto!important;
        overflow-x:hidden!important;
    }
    .security-detail-modal{
        width:100%!important;
        max-width:100%!important;
        max-height:calc(100vh - 72px)!important;
        margin:0 auto!important;
        border-radius:14px!important;
        padding:15px!important;
    }
    .security-detail-modal h3{
        margin-right:38px!important;
        font-size:17px!important;
        line-height:1.25!important;
    }
    .security-detail-close{
        right:9px!important;
        top:9px!important;
        width:32px!important;
        height:32px!important;
        font-size:21px!important;
    }
    .security-detail-grid>*{
        min-width:0!important;
        overflow-wrap:anywhere!important;
        word-break:break-word!important;
    }
    body.sbp-manager-mobile-sidebar-open .security-detail-overlay{
        left:min(82vw,226px)!important;
    }
    body.sbp-manager-mobile-sidebar-open .security-detail-modal{
        width:100%!important;
    }
}