/* New role-permission page; Chats/Tickets keep their existing layout. */
.roles-main{padding:0!important}
.roles-layout{height:100%;display:grid;grid-template-columns:209px minmax(0,1fr);min-height:0;background:#fff}
.roles-list{background:#fff;border-right:1px solid #eee;padding:12px 16px;overflow:auto;scrollbar-width:thin;min-height:0}
.role-list-row{height:40px;position:relative;border-radius:4px;display:flex;align-items:center;margin-bottom:0;min-width:0}
.role-list-row.active{background:#fff7e6;color:#f60}
.role-select{border:0;background:transparent;display:flex;align-items:center;gap:10px;min-width:0;width:100%;height:32px;padding:0 12px;font-size:14px;color:inherit;text-align:left}
.role-select>.ticket-icon{width:14px;height:14px;flex-shrink:0}
.role-select>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}
.role-row-tool{display:none;position:absolute;right:22px;border:0;background:#fff7e6;color:#f60;font-size:14px;line-height:24px;padding:0 3px;width:22px;height:26px}
.role-delete{right:0;font-size:20px}
.role-list-row:hover .role-row-tool,.role-row-tool:focus-visible{display:block}
.role-list-row:hover .role-select{padding-right:44px}
.role-name-editor{position:absolute;inset:4px 0;display:flex;gap:9px;align-items:center;background:#f5f5f5;padding:0 12px;z-index:2;color:#222}
.role-name-editor>.ticket-icon{width:14px;height:14px}
.role-name-editor input{min-width:0;width:100%;padding:0;border:0;background:transparent;height:30px;font-size:14px;box-shadow:none!important}
.role-name-editor input::placeholder{color:#bfbfbf}
.role-add{display:block;align-items:center;border:0;background:white;color:#718dff;font-size:14px;height:40px;padding:0 12px;margin-top:0}
.role-permission-content{display:flex;flex-direction:column;min-height:0;min-width:0;background:#fff}
.role-permission-scroll{padding:16px 22px 0 16px;overflow:auto;flex:1;min-height:0;scrollbar-width:thin;scrollbar-color:#ddd transparent}
.role-permission-card{background:#fafafc;border-radius:8px;padding:24px 32px 32px;margin-bottom:16px;color:#001529;min-width:0;scroll-margin-top:0}
.role-permission-card h2{font-size:16px;line-height:24px;font-weight:500;margin:0 0 8px}
.role-permission-row{display:flex;align-items:center;flex-wrap:wrap;column-gap:32px;row-gap:0;min-height:41px}
.role-level-1{padding-left:24px}.role-level-2{padding-left:48px}.role-level-3{padding-left:72px}
.role-checkbox{display:inline-flex;align-items:center;gap:8px;font-size:14px;line-height:22px;min-height:41px;white-space:nowrap;cursor:pointer}
.role-checkbox input{appearance:none;display:inline-block;width:16px;height:16px;flex-shrink:0;border:1px solid #d9d9d9;border-radius:4px;margin:0;background:#fff;position:relative;cursor:inherit;transition:border-color .1s}
.role-checkbox input:checked{background:#f60;border-color:#f60}
.role-checkbox input:checked:after{content:'';position:absolute;left:4px;top:1px;width:5px;height:9px;border:solid white;border-width:0 2px 2px 0;transform:rotate(45deg)}
.role-checkbox input:disabled{background:#f5f5f5;border-color:#d9d9d9;cursor:not-allowed}
.role-checkbox input:disabled:checked:after{border-color:#bfbfbf}
.role-check-disabled{color:#bfbfbf;cursor:not-allowed}
.role-checkbox input:hover:not(:disabled){border-color:#f60}
.role-checkbox input:focus-visible{outline:2px solid #ffb184;outline-offset:2px}
.role-scope{margin:18px 0 6px;font-size:14px}
.role-scope h3{font-weight:400;margin:0 0 6px;font-size:14px;line-height:22px}
.role-scope p{margin:0;color:#a2a8b2;font-size:12px;line-height:22px}
.role-scope>div{display:flex;align-items:center;gap:16px;flex-wrap:wrap;min-height:35px}
.role-scope label{display:flex;align-items:center;gap:8px;white-space:nowrap}
.role-scope input{appearance:none;width:16px;height:16px;margin:0;border:1px solid #d9d9d9;border-radius:50%;background:#fff;position:relative}
.role-scope input:checked{border-color:#f60}.role-scope input:checked:after{content:'';position:absolute;inset:3px;border-radius:50%;background:#f60}
.role-scope input:disabled{opacity:.5}
.role-save-footer{height:76px;min-height:76px;display:flex;align-items:flex-start;padding:14px 16px;background:white;gap:12px}
.role-save-footer .button{border-radius:4px;min-width:65px;height:32px;font-size:14px}
.role-delete-dialog{width:420px}.role-delete-dialog h3{font-size:16px;font-weight:500;margin:0 0 18px}
@media(max-width:1500px){.role-permission-scroll{padding-right:16px}.role-permission-card{padding-left:24px;padding-right:24px}.role-permission-row{column-gap:22px}}
@media(max-width:1300px){.roles-layout{grid-template-columns:190px minmax(0,1fr)}.roles-list{padding-left:12px;padding-right:12px}.role-permission-card{padding-left:20px;padding-right:20px}.role-permission-row{column-gap:18px}.role-level-3{padding-left:60px}.role-permission-scroll{padding-right:12px;padding-left:12px}}