[hidden]{
    display:none !important;
}
.acl142-page{
    display:grid;
    gap:12px;
    color:#162139;
}
.acl142-header,
.acl142-section{
    border:1px solid #dfe6ef;
    border-radius:18px;
    background:#fff;
    box-shadow:0 11px 30px rgba(31,42,76,.055);
}
.acl142-header{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:20px;
    align-items:center;
    padding:15px 18px;
}
.acl142-eyebrow,
.acl142-audit-header span,
.acl142-role-permissions>header span{
    color:#6428bd;
    font-size:10px;
    font-weight:950;
    letter-spacing:.06em;
}
.acl142-header h2{
    margin:3px 0;
    font-size:26px;
    line-height:1.15;
}
.acl142-header p{
    margin:0;
    color:#68758b;
    font-size:12px;
    line-height:1.45;
}
.acl142-summary{
    display:flex;
    gap:7px;
    align-items:center;
}
.acl142-summary article{
    display:grid;
    min-width:78px;
    padding:8px 10px;
    border-radius:11px;
    background:#f7f9fc;
    text-align:center;
}
.acl142-summary article strong{
    color:#6428bd;
    font-size:19px;
}
.acl142-summary article span{
    color:#748096;
    font-size:8px;
    white-space:nowrap;
}
.acl142-summary>span{
    display:inline-flex;
    min-height:32px;
    align-items:center;
    padding:0 11px;
    border-radius:999px;
    font-size:10px;
    font-weight:900;
    white-space:nowrap;
}
.acl142-summary .is-ready{
    background:#e7f7ef;
    color:#08795b;
}
.acl142-summary .is-pending{
    background:#fff4df;
    color:#865800;
}
.acl142-message{
    padding:11px 13px;
    border-radius:12px;
    font-size:11px;
    font-weight:850;
}
.acl142-message.is-success{
    background:#e8f8f0;
    color:#08785a;
}
.acl142-message.is-error{
    background:#fff0f2;
    color:#bd2942;
}
.acl142-message.is-warning{
    background:#fff8e8;
    color:#7d590b;
}
.acl142-tabs{
    display:flex;
    gap:4px;
    width:max-content;
    max-width:100%;
    padding:4px;
    border:1px solid #dde4ed;
    border-radius:13px;
    background:#fff;
}
.acl142-tabs button{
    min-height:37px;
    border:0;
    border-radius:9px;
    background:transparent;
    padding:0 15px;
    color:#68758b;
    font:inherit;
    font-size:11px;
    font-weight:900;
    cursor:pointer;
}
.acl142-tabs button.is-active{
    background:#6428bd;
    color:#fff;
    box-shadow:0 6px 16px rgba(100,40,189,.2);
}
.acl142-section{
    display:none;
    padding:14px;
}
.acl142-section.is-active{
    display:block;
}
.acl142-users-layout,
.acl142-roles-layout{
    display:grid;
    grid-template-columns:285px minmax(0,1fr);
    min-height:510px;
    overflow:hidden;
    border:1px solid #dfe5ee;
    border-radius:15px;
}
.acl142-user-directory,
.acl142-role-directory{
    display:grid;
    grid-template-rows:auto minmax(0,1fr) auto;
    min-width:0;
    border-inline-end:1px solid #e1e7ef;
    background:#f8faff;
}
.acl142-user-directory>header,
.acl142-role-directory>header{
    display:grid;
    gap:9px;
    padding:12px;
    border-bottom:1px solid #e1e7ef;
}
.acl142-user-directory>header>div,
.acl142-role-directory>header>div{
    display:flex;
    justify-content:space-between;
    gap:9px;
    align-items:center;
}
.acl142-user-directory>header span,
.acl142-role-directory>header span{
    color:#68758b;
    font-size:9px;
    font-weight:950;
}
.acl142-user-directory>header strong,
.acl142-role-directory>header strong{
    color:#6428bd;
    font-size:15px;
}
.acl142-user-directory input{
    width:100%;
    min-height:39px;
    border:1px solid #d5deea;
    border-radius:10px;
    background:#fff;
    padding:0 10px;
    color:#162139;
    font:inherit;
    font-size:11px;
}
.acl142-role-directory>header button{
    min-height:38px;
    border:1px solid #d7cbf4;
    border-radius:10px;
    background:#fff;
    color:#6428bd;
    font:inherit;
    font-size:10px;
    font-weight:950;
    cursor:pointer;
}
.acl142-role-directory>header button:disabled{
    opacity:.5;
    cursor:not-allowed;
}
.acl142-user-list,
.acl142-role-list{
    display:grid;
    align-content:start;
    gap:4px;
    max-height:455px;
    overflow:auto;
    padding:8px;
}
.acl142-user-list button,
.acl142-role-list button{
    display:grid;
    grid-template-columns:35px minmax(0,1fr) 7px;
    gap:8px;
    align-items:center;
    width:100%;
    min-height:53px;
    border:1px solid transparent;
    border-radius:11px;
    background:transparent;
    padding:7px 8px;
    color:#17233d;
    font:inherit;
    text-align:start;
    cursor:pointer;
}
.acl142-user-list button:hover,
.acl142-role-list button:hover{
    border-color:#e0e5ee;
    background:#fff;
}
.acl142-user-list button.is-active,
.acl142-role-list button.is-active{
    border-color:#c7b5ef;
    background:#fff;
    box-shadow:0 6px 18px rgba(50,40,94,.08);
}
.acl142-avatar,
.acl142-role-icon{
    display:grid;
    place-items:center;
    width:34px;
    height:34px;
    border-radius:10px;
    background:#ece7ff;
    color:#6428bd;
    font-size:11px;
    font-weight:950;
}
.acl142-user-list button>span:nth-child(2),
.acl142-role-list button>span:nth-child(2){
    min-width:0;
}
.acl142-user-list strong,
.acl142-user-list small,
.acl142-role-list strong,
.acl142-role-list small{
    display:block;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
.acl142-user-list strong,
.acl142-role-list strong{
    font-size:11px;
}
.acl142-user-list small,
.acl142-role-list small{
    margin-top:3px;
    color:#758197;
    font-size:9px;
}
.acl142-user-list em,
.acl142-role-list em{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#99a5b8;
}
.acl142-user-list em.is-assigned,
.acl142-role-list em.is-active{
    background:#0b9b75;
}
.acl142-role-list em.is-inactive{
    background:#cf405a;
}
.acl142-empty-list{
    margin:0;
    padding:12px;
    color:#6f7c91;
    font-size:10px;
    text-align:center;
}
.acl142-user-editor,
.acl142-role-editor{
    min-width:0;
    padding:15px;
    background:#fff;
}
.acl142-empty-editor{
    display:grid;
    place-items:center;
    align-content:center;
    min-height:440px;
    color:#758197;
    text-align:center;
}
.acl142-empty-editor>span{
    display:grid;
    place-items:center;
    width:48px;
    height:48px;
    border-radius:15px;
    background:#f1edff;
    color:#6428bd;
    font-size:21px;
}
.acl142-empty-editor h3{
    margin:10px 0 3px;
    color:#1a253d;
    font-size:19px;
}
.acl142-empty-editor p{
    margin:0;
    font-size:11px;
}
.acl142-editor-content{
    display:grid;
    gap:13px;
}
.acl142-editor-header,
.acl142-role-editor-header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
    padding-bottom:10px;
    border-bottom:1px solid #e5eaf0;
}
.acl142-editor-header span:first-child,
.acl142-role-editor-header>div>span{
    color:#6d7990;
    font-size:8px;
    font-weight:950;
}
.acl142-editor-header h3,
.acl142-role-editor-header h3{
    margin:3px 0 0;
    font-size:21px;
}
.acl142-current-role,
.acl142-role-protection{
    display:inline-flex;
    padding:5px 8px;
    border-radius:999px;
    background:#f1edff;
    color:#5d2ab0;
    font-size:9px;
    font-weight:900;
}
.acl142-role-editor-header small{
    display:block;
    margin-top:3px;
    color:#758197;
    font-size:9px;
}
.acl142-form-grid{
    display:grid;
    grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
    gap:12px;
    align-items:start;
}
.acl142-field{
    display:grid;
    gap:5px;
}
.acl142-field>span,
.acl142-branch-block>span{
    color:#47546c;
    font-size:10px;
    font-weight:900;
}
.acl142-field input,
.acl142-field select,
.acl142-field textarea{
    width:100%;
    min-height:41px;
    border:1px solid #d5deea;
    border-radius:10px;
    background:#fff;
    padding:0 10px;
    color:#17233d;
    font:inherit;
    font-size:11px;
}
.acl142-field textarea{
    min-height:65px;
    padding:9px 10px;
    resize:vertical;
}
.acl142-field small{
    color:#778399;
    font-size:9px;
    line-height:1.4;
}
.acl142-branch-block{
    display:grid;
    gap:8px;
    padding:10px;
    border:1px solid #e0e6ee;
    border-radius:12px;
    background:#fafbfd;
}
.acl142-branch-block.is-disabled{
    opacity:.55;
}
.acl142-branch-mode,
.acl142-branch-checks{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px;
}
.acl142-branch-mode label,
.acl142-branch-checks label{
    display:flex;
    gap:7px;
    align-items:center;
    min-height:39px;
    padding:0 9px;
    border:1px solid #dfe5ed;
    border-radius:10px;
    background:#fff;
    font-size:10px;
    font-weight:850;
}
.acl142-branch-mode input,
.acl142-branch-checks input{
    accent-color:#6428bd;
}
.acl142-branch-checks{
    display:none;
}
.acl142-branch-checks.is-active{
    display:grid;
}
.acl142-access-preview{
    display:flex;
    justify-content:space-between;
    gap:14px;
    align-items:center;
    padding:11px 13px;
    border-radius:12px;
    background:#f1edff;
}
.acl142-access-preview span,
.acl142-access-preview strong{
    display:block;
}
.acl142-access-preview span{
    color:#6a5b92;
    font-size:8px;
    font-weight:950;
}
.acl142-access-preview strong{
    margin-top:3px;
    color:#5b28ad;
    font-size:13px;
}
.acl142-access-preview small{
    color:#6b6680;
    font-size:10px;
}
.acl142-primary,
.acl142-secondary{
    min-height:42px;
    border-radius:11px;
    padding:0 15px;
    font:inherit;
    font-size:10px;
    font-weight:950;
    cursor:pointer;
}
.acl142-primary{
    justify-self:end;
    border:0;
    background:linear-gradient(135deg,#6428bd,#219bc3);
    color:#fff;
}
.acl142-secondary{
    border:1px solid #d8dfea;
    background:#fff;
    color:#58667c;
}
.acl142-primary:disabled{
    opacity:.5;
    cursor:not-allowed;
}
.acl142-role-editor{
    display:grid;
    gap:13px;
}
.acl142-role-fields{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
}
.acl142-role-fields .is-wide{
    grid-column:span 3;
}
.acl142-role-settings{
    display:grid;
    grid-template-columns:minmax(0,1fr) repeat(2,minmax(210px,.7fr));
    gap:9px;
}
.acl142-toggle-row{
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px;
    gap:10px;
    align-items:center;
    min-height:68px;
    padding:9px 10px;
    border:1px solid #e0e6ee;
    border-radius:11px;
    background:#fafbfd;
    cursor:pointer;
}
.acl142-toggle-row strong,
.acl142-toggle-row small{
    display:block;
}
.acl142-toggle-row strong{
    font-size:10px;
}
.acl142-toggle-row small{
    margin-top:3px;
    color:#778399;
    font-size:8px;
    line-height:1.35;
}
.acl142-toggle-row input,
.acl142-permission-card input{
    position:absolute;
    opacity:0;
    pointer-events:none;
}
.acl142-toggle-row i,
.acl142-permission-card i{
    position:relative;
    display:block;
    width:42px;
    height:24px;
    border-radius:999px;
    background:#cbd3df;
    transition:.18s ease;
}
.acl142-toggle-row i::after,
.acl142-permission-card i::after{
    content:"";
    position:absolute;
    top:3px;
    inset-inline-start:3px;
    width:18px;
    height:18px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 2px 5px rgba(0,0,0,.18);
    transition:.18s ease;
}
.acl142-toggle-row input:checked+i,
.acl142-permission-card input:checked+i{
    background:#0b9b75;
}
.acl142-toggle-row input:checked+i::after,
.acl142-permission-card input:checked+i::after{
    transform:translateX(18px);
}
html[dir="rtl"] .acl142-toggle-row input:checked+i::after,
html[dir="rtl"] .acl142-permission-card input:checked+i::after{
    transform:translateX(-18px);
}
.acl142-role-permissions{
    display:grid;
    gap:11px;
    padding:12px;
    border:1px solid #e0e6ee;
    border-radius:13px;
}
.acl142-role-permissions>header{
    display:flex;
    justify-content:space-between;
    gap:12px;
    align-items:center;
}
.acl142-role-permissions h4{
    margin:3px 0 0;
    font-size:17px;
}
.acl142-role-permissions>header>div:last-child{
    display:grid;
    min-width:65px;
    text-align:center;
}
.acl142-role-permissions>header>div:last-child strong{
    color:#6428bd;
    font-size:20px;
}
.acl142-role-permissions>header>div:last-child small{
    color:#758197;
    font-size:8px;
}
.acl142-permission-group{
    display:grid;
    gap:7px;
}
.acl142-permission-group h5{
    margin:0;
    color:#59667d;
    font-size:10px;
    text-transform:uppercase;
}
.acl142-permission-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
}
.acl142-permission-card{
    display:grid;
    grid-template-columns:minmax(0,1fr) 42px;
    gap:9px;
    align-items:center;
    min-height:57px;
    padding:8px 9px;
    border:1px solid #e0e6ee;
    border-radius:10px;
    background:#fafbfc;
    cursor:pointer;
}
.acl142-permission-card.is-allowed{
    border-color:#cfe9de;
    background:#fbfffd;
}
.acl142-permission-card strong,
.acl142-permission-card small{
    display:block;
}
.acl142-permission-card strong{
    font-size:10px;
}
.acl142-permission-card small{
    margin-top:3px;
    color:#7a879a;
    font-size:8px;
}
.acl142-role-actions{
    position:sticky;
    bottom:8px;
    display:flex;
    justify-content:flex-end;
    gap:7px;
    padding:9px;
    border:1px solid #dfe5ed;
    border-radius:12px;
    background:rgba(255,255,255,.95);
    box-shadow:0 10px 30px rgba(32,41,71,.11);
    backdrop-filter:blur(9px);
}
.acl142-audit-header{
    padding-bottom:10px;
    border-bottom:1px solid #e5eaf0;
}
.acl142-audit-header h3{
    margin:3px 0 0;
    font-size:21px;
}
.acl142-audit-list{
    display:grid;
    gap:6px;
    margin-top:10px;
}
.acl142-audit-list article{
    display:grid;
    grid-template-columns:35px minmax(0,1fr) auto;
    gap:9px;
    align-items:center;
    padding:9px 11px;
    border:1px solid #e2e7ef;
    border-radius:10px;
}
.acl142-audit-icon{
    display:grid;
    place-items:center;
    width:32px;
    height:32px;
    border-radius:9px;
    background:#e8f8f0;
    color:#08795b;
    font-weight:950;
}
.acl142-audit-list strong,
.acl142-audit-list small,
.acl142-audit-list article>div:last-child>span{
    display:block;
}
.acl142-audit-list strong{
    font-size:10px;
}
.acl142-audit-list small{
    margin-top:3px;
    color:#7c889b;
    font-size:8px;
}
.acl142-audit-list article>div:last-child{
    text-align:end;
}
.acl142-audit-list article>div:last-child>span{
    color:#526079;
    font-size:9px;
    font-weight:850;
}
@media(max-width:1180px){
    .acl142-header{
        grid-template-columns:1fr;
    }
    .acl142-summary{
        justify-content:flex-start;
        flex-wrap:wrap;
    }
    .acl142-role-fields{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
    .acl142-role-fields .is-wide{
        grid-column:span 2;
    }
    .acl142-role-settings{
        grid-template-columns:1fr 1fr;
    }
    .acl142-role-settings>.acl142-field{
        grid-column:span 2;
    }
    .acl142-permission-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:860px){
    .acl142-users-layout,
    .acl142-roles-layout{
        grid-template-columns:1fr;
    }
    .acl142-user-directory,
    .acl142-role-directory{
        border-inline-end:0;
        border-bottom:1px solid #e1e7ef;
    }
    .acl142-user-list,
    .acl142-role-list{
        max-height:245px;
    }
    .acl142-form-grid{
        grid-template-columns:1fr;
    }
}
@media(max-width:620px){
    .acl142-header,
    .acl142-section{
        padding:12px;
    }
    .acl142-tabs{
        width:100%;
        overflow:auto;
    }
    .acl142-tabs button{
        flex:0 0 auto;
    }
    .acl142-summary article{
        min-width:72px;
    }
    .acl142-role-fields,
    .acl142-role-settings,
    .acl142-permission-grid,
    .acl142-branch-mode,
    .acl142-branch-checks{
        grid-template-columns:1fr;
    }
    .acl142-role-fields .is-wide,
    .acl142-role-settings>.acl142-field{
        grid-column:auto;
    }
    .acl142-editor-header,
    .acl142-role-editor-header{
        display:grid;
    }
    .acl142-access-preview{
        display:grid;
    }
    .acl142-primary{
        justify-self:stretch;
    }
    .acl142-role-actions{
        display:grid;
        grid-template-columns:1fr;
    }
    .acl142-audit-list article{
        grid-template-columns:35px minmax(0,1fr);
    }
    .acl142-audit-list article>div:last-child{
        grid-column:2;
        text-align:start;
    }
}