#tab-roles{--roles-blue:#1267e8;--roles-ink:#071b3a;--roles-muted:#647899;--roles-line:#d9e5f3;--roles-soft:#f5f9fe;color:var(--roles-ink);min-width:0}
.rolesManagementHeader{display:flex;align-items:center;justify-content:space-between;margin:0 0 22px}.rolesManagementHeader h2{font-size:32px;line-height:1.1;margin:0 0 5px}.rolesManagementHeader p{color:var(--roles-muted);font-size:16px;margin:0}.rolesBreadcrumb{color:#7283a0;font-weight:700}.rolesBreadcrumb strong{color:#1a5ecb;margin-left:12px}
.rolesManagementWorkspace{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1fr);gap:18px;align-items:stretch}.rolesListCard,.rolesEditorCard{background:#fff;border:1px solid #e0e9f4;border-radius:14px;box-shadow:0 7px 24px rgba(40,77,122,.07);min-width:0;overflow:hidden}.rolesListTitle{align-items:center;display:flex;justify-content:space-between;padding:20px 22px 14px}.rolesListTitle h3{font-size:24px;margin:0}.rolesListTitle .btn{font-size:15px;padding:12px 22px}
.rolesFilters{display:grid;grid-template-columns:minmax(220px,1fr) 180px 170px;gap:12px;padding:0 22px 17px}.rolesFilters select,.rolesSearch{border:1px solid #ccdaea;border-radius:9px;background:#fff;min-height:44px}.rolesFilters select{color:#203454;font:inherit;padding:0 12px}.rolesSearch{align-items:center;display:flex;padding:0 13px}.rolesSearch span{color:#6a80a0;font-size:25px;margin-right:9px}.rolesSearch input{border:0;box-shadow:none;min-width:0;outline:0;padding:0;width:100%}
.rolesTableScroll{overflow-x:auto}.rolesTable{border-collapse:collapse;min-width:640px;table-layout:fixed;width:100%}.rolesTable th{background:#f5f8fc;color:#233a5d;font-size:12px;padding:15px 9px;text-align:left;white-space:nowrap}.rolesTable td{border-top:1px solid #e3ebf5;color:#415573;font-size:13px;overflow:hidden;padding:15px 9px;text-overflow:ellipsis;white-space:nowrap}.rolesTable th:nth-child(1){width:24%}.rolesTable th:nth-child(2){width:20%}.rolesTable th:nth-child(3){width:17%}.rolesTable th:nth-child(4){width:14%}.rolesTable th:nth-child(5){width:10%}.rolesTable th:nth-child(6){width:15%}.rolesTable tbody tr{cursor:pointer}.rolesTable tbody tr:hover,.rolesTable tbody tr[aria-selected="true"]{background:#e9f3ff}.rolesTable td:first-child{align-items:center;display:flex;gap:8px;color:#142b4c}.rolesRowIcon{color:#315886;font-size:17px;width:18px}.rolesTableName{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rolesTypeBadge,.rolesStatusBadge{border-radius:9px;display:inline-flex;font-size:11px;font-weight:800;padding:6px 8px;white-space:nowrap}.rolesTypeBadge.system{background:#e6f1ff;color:#3078df}.rolesTypeBadge.custom{background:#eee7ff;color:#7451db}.rolesStatusBadge.active{background:#dff8ea;color:#12965a}.rolesStatusBadge.inactive{background:#ffe8eb;color:#cf3850}.rolesCount{color:#6d809c;font-size:14px;margin:0;padding:22px}
.rolesEditorCard{padding:16px 20px 18px}.rolesEditorHero{align-items:center;background:linear-gradient(110deg,#f3f8ff,#eaf4ff);border-radius:10px;display:flex;gap:18px;padding:17px 20px}.rolesEditorHero>span{color:#1267e8;font-size:32px}.rolesEditorHero h3{font-size:25px;margin:0 0 6px}.rolesEditorHero h3 em{background:#dff8ea;border-radius:9px;color:#168f59;font-size:12px;font-style:normal;margin-left:12px;padding:6px 12px;vertical-align:middle}.rolesEditorHero p{color:#526987;margin:0}.rolesEditorSectionTitle{align-items:center;display:flex;gap:10px;margin:20px 0 13px}.rolesEditorSectionTitle span{color:#1267e8}.rolesEditorSectionTitle h4{font-size:18px;margin:0}
.rolesEditorForm{display:grid;grid-template-columns:1fr 1fr;gap:15px 22px}.rolesEditorForm label{display:grid;gap:7px}.rolesEditorForm label.wide{grid-column:1/-1}.rolesEditorForm label>span{font-size:13px;font-weight:800}.rolesEditorForm b{color:#e8404c}.rolesEditorForm input,.rolesEditorForm select,.rolesEditorForm textarea{background:#fff;border:1px solid #cfdae8;border-radius:8px;color:#243959;font:inherit;min-height:44px;padding:10px 12px;width:100%}.rolesEditorForm textarea{min-height:70px;resize:vertical}.rolesEditorForm [readonly],.rolesEditorForm [disabled]{background:#f7f9fc;color:#566a86}.rolesEditorForm .rolesBooleanField{align-items:center;display:flex;min-height:46px;grid-template-columns:auto 1fr;gap:10px;padding:10px 12px;border:1px solid #cfdae8;border-radius:8px;background:#f8fbff}.rolesEditorForm .rolesBooleanField input{accent-color:#1267e8;height:19px;min-height:0;padding:0;width:19px}.rolesEditorForm .rolesBooleanField span{color:#203454;font-size:14px;font-weight:800}
.rolesPermissionsHeading{align-items:center;border-top:1px solid #e7edf5;display:flex;justify-content:space-between;margin-top:20px;padding:20px 0 10px}.rolesPermissionsHeading>div{align-items:center;display:flex;gap:10px}.rolesPermissionsHeading h4{font-size:18px;margin:0}.rolesPermissionsHeading span{color:#1267e8}.rolesPermissionsHeading p{color:#71829a;font-size:12px;margin:0}.rolePermissionGroups{display:grid;gap:9px}.rolePermissionGroup{border:1px solid #dce6f2;border-radius:9px;background:#fff;overflow:hidden}.rolePermissionGroup summary{align-items:center;cursor:pointer;display:grid;grid-template-columns:45px 1fr auto;gap:11px;list-style:none;padding:12px}.rolePermissionGroup summary::-webkit-details-marker{display:none}.rolePermissionIcon{align-items:center;background:#eff6ff;border-radius:9px;color:#1267e8;display:flex;font-size:20px;height:42px;justify-content:center;width:42px}.rolePermissionGroup summary strong{display:block;font-size:15px}.rolePermissionGroup summary em{background:#e4f1ff;border-radius:8px;color:#2f7de5;font-size:11px;font-style:normal;margin-left:8px;padding:5px 9px}.rolePermissionGroup summary small{color:#74859d;display:block;font-size:12px;margin-top:4px}.rolePermissionGroup summary>b{color:#15345c}.rolePermissionBody{border-top:1px solid #e6edf6;padding:12px}.rolePermissionChecks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.rolePermissionChecks label{align-items:flex-start;border:1px solid #e1e8f2;border-radius:8px;display:flex;gap:8px;padding:10px}.rolePermissionChecks label.isUnavailable{background:#f7f9fc}.rolePermissionChecks input{accent-color:#1267e8;flex:0 0 auto;height:17px;margin-top:2px;width:17px}.rolePermissionChecks .rolePermissionOptionText{display:grid;font-size:13px;gap:2px;min-width:0}.rolePermissionOptionText strong{color:#10284b;font-size:13px}.rolePermissionOptionText small{color:#647899;font-size:11px;line-height:1.35}.rolePermissionOptionText .rolePermissionRequirement{color:#9a5b00;font-weight:700}.rolesEmptyPermissions{color:#74859d;margin:0}.rolesEditorActions{align-items:center;display:flex;justify-content:flex-end;gap:10px;padding-top:18px}.rolesEditorActions .btn{min-height:46px;padding:0 24px}
.rolesTableScroll{overflow-x:hidden}
@media(max-width:1100px){.rolesManagementWorkspace{grid-template-columns:1fr}.rolesFilters{grid-template-columns:minmax(220px,1fr) 180px 170px}}
@media(max-width:680px){.rolesTableScroll{overflow-x:auto}.rolesManagementHeader{align-items:flex-start;display:block}.rolesManagementHeader h2{font-size:25px}.rolesBreadcrumb{display:none}.rolesListTitle{padding:16px}.rolesListTitle h3{font-size:21px}.rolesFilters{grid-template-columns:1fr;padding:0 16px 14px}.rolesEditorCard{padding:12px}.rolesEditorHero{padding:14px}.rolesEditorHero h3{font-size:20px}.rolesEditorForm{grid-template-columns:1fr;gap:12px}.rolesEditorForm label.wide{grid-column:auto}.rolesPermissionsHeading{align-items:flex-start;display:block}.rolesPermissionsHeading p{margin-top:6px}.rolePermissionChecks{grid-template-columns:1fr}.rolesEditorActions{align-items:stretch;flex-direction:column-reverse}.rolesEditorActions .btn{width:100%}}

/* Roles is an administrative light workspace. Tenant/global dark mode must not
   recolor its white cards or their content. Scoped specificity intentionally
   outranks the generic corrective runtime selectors loaded after this file. */
body #tab-roles{background:#f4f8fd!important;color:#071b3a!important;-webkit-text-fill-color:initial;color-scheme:light}
body #tab-roles :is(.rolesListCard,.rolesEditorCard,.rolePermissionGroup,.rolePermissionBody){background:#fff!important;border-color:#d9e5f3!important}
body #tab-roles :is(
  .rolesManagementHeader h2,.rolesListTitle h3,.rolesEditorHero h3,
  .rolesEditorSectionTitle h4,.rolesPermissionsHeading h4,
  .rolesTable th,.rolesTable td,.rolesTableName,
  .rolesEditorForm label>span,.rolePermissionGroup summary strong,
  .rolePermissionChecks span
){color:#071b3a!important;-webkit-text-fill-color:#071b3a!important}
body #tab-roles :is(.rolesManagementHeader p,.rolesCount,.rolesEditorHero p,.rolesPermissionsHeading p,.rolePermissionGroup summary small,.rolesEmptyPermissions){color:#647899!important;-webkit-text-fill-color:#647899!important}
body #tab-roles .rolesBooleanField span{color:#203454!important;-webkit-text-fill-color:#203454!important}
body #tab-roles :is(.rolesSearch,.rolesSearch input,.rolesFilters select,.rolesEditorForm input,.rolesEditorForm select,.rolesEditorForm textarea){background:#fff!important;color:#203454!important;-webkit-text-fill-color:#203454!important;border-color:#ccdaea!important}
body #tab-roles .rolesTable{background:#fff!important}
body #tab-roles .rolesTable thead,
body #tab-roles .rolesTable th{background:#f5f8fc!important}
body #tab-roles .rolesTable tbody,
body #tab-roles .rolesTable tbody tr{background:#fff!important}
body #tab-roles .rolesTable td{background:transparent!important}
body #tab-roles .rolesTable tbody tr:hover,
body #tab-roles .rolesTable tbody tr[aria-selected="true"]{background:#e9f3ff!important}
body #tab-roles .rolesBreadcrumb{color:#7283a0!important;-webkit-text-fill-color:#7283a0!important}
body #tab-roles .rolesBreadcrumb strong{color:#1a5ecb!important;-webkit-text-fill-color:#1a5ecb!important}
body #tab-roles .rolesEditorForm :is([readonly],[disabled]){background:#f7f9fc!important;color:#566a86!important;-webkit-text-fill-color:#566a86!important}
body #tab-roles .rolePermissionGroup summary>b{color:#15345c!important;-webkit-text-fill-color:#15345c!important}
body #tab-roles .btn:not(.primary){background:#fff!important;color:#15345c!important;-webkit-text-fill-color:#15345c!important}
body #tab-roles .btn.danger{color:#d13d51!important;-webkit-text-fill-color:#d13d51!important}
body #tab-roles .btn.primary,body #tab-roles .btn.primary *{background:#1267e8!important;color:#fff!important;-webkit-text-fill-color:#fff!important}