/* AGROLOGIX R4 - USUARIOS Y ROLES MOCKUP AUTHORITY R1
   Approved mockup is visual authority. Existing shared R4 shell/header remain untouched. */
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent{
  overflow:hidden!important;
  padding:0!important;
  margin:0!important;
  min-width:0!important;
  min-height:0!important;
}
#r3bContent .r4-users-authority,
#r3bContent .r4-users-authority *{box-sizing:border-box}
#r3bContent .r4-users-authority{
  --u-green:#069653;--u-blue:#237ff0;--u-purple:#7d2de2;--u-red:#ef3448;--u-orange:#ff8600;
  --u-navy:#092a67;--u-text:#153754;--u-muted:#63809b;--u-line:#d7e3eb;--u-bg:#f3f8fb;
  width:100%;height:100%;min-width:0;min-height:0;padding:12px 18px;background:var(--u-bg);
  display:grid;grid-template-rows:72px 96px minmax(0,1fr);gap:12px;overflow:hidden;
  font-family:Arial,Helvetica,sans-serif;color:var(--u-text)
}
#r3bContent .r4u-icon{display:inline-grid;place-items:center;flex:none;color:currentColor}
#r3bContent .r4u-icon svg{display:block;width:100%;height:100%}
#r3bContent .r4u-head{display:flex;justify-content:space-between;align-items:center;min-width:0}
#r3bContent .r4u-eyebrow{margin:0;color:var(--u-green);font-size:12px;font-weight:900;letter-spacing:1.1px}
#r3bContent .r4u-head h1{margin:3px 0 4px;color:#08276d;font-size:31px;line-height:1}
#r3bContent .r4u-head p{margin:0;color:#57738e;font-size:13px}
#r3bContent .r4u-primary{
  height:44px;padding:0 22px;border:0;border-radius:7px;background:linear-gradient(#0b9b5b,#058447);
  color:#fff;font-size:14px;font-weight:800;display:flex;align-items:center;gap:10px;cursor:pointer
}
#r3bContent .r4u-primary .r4u-icon{width:21px;height:21px}

#r3bContent .r4u-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
#r3bContent .r4u-kpi{
  background:#fff;border:1px solid var(--u-line);border-radius:10px;border-top:2px solid;
  display:grid;grid-template-columns:66px 1fr;align-items:center;padding:10px 15px;min-width:0
}
#r3bContent .r4u-kpi.green{border-top-color:var(--u-green)}
#r3bContent .r4u-kpi.blue{border-top-color:var(--u-blue)}
#r3bContent .r4u-kpi.purple{border-top-color:var(--u-purple)}
#r3bContent .r4u-kpi.red{border-top-color:var(--u-red)}
#r3bContent .r4u-kpi-icon{width:50px;height:50px;border-radius:9px;display:grid;place-items:center;background:#eaf8ef;color:var(--u-green)}
#r3bContent .r4u-kpi.blue .r4u-kpi-icon{background:#e8f3ff;color:var(--u-blue)}
#r3bContent .r4u-kpi.purple .r4u-kpi-icon{background:#f2e9ff;color:var(--u-purple)}
#r3bContent .r4u-kpi.red .r4u-kpi-icon{background:#fff0f2;color:var(--u-red)}
#r3bContent .r4u-kpi-icon svg{width:29px;height:29px;fill:currentColor}
#r3bContent .r4u-kpi span,#r3bContent .r4u-kpi small{display:block;color:#5f7895;font-size:11px}
#r3bContent .r4u-kpi strong{display:block;color:#09265f;font-size:24px;line-height:1;margin:3px 0}

#r3bContent .r4u-main{
  min-width:0;min-height:0;display:grid;grid-template-columns:minmax(0,2.35fr) minmax(330px,.92fr);
  grid-template-rows:minmax(330px,1.45fr) minmax(250px,1fr);
  grid-template-areas:"users create" "roles perms";gap:12px;overflow:hidden
}
#r3bContent .r4u-card{background:#fff;border:1px solid var(--u-line);border-radius:9px;padding:12px;min-width:0;min-height:0;overflow:hidden}
#r3bContent .r4u-users{grid-area:users}
#r3bContent .r4u-create{grid-area:create}
#r3bContent .r4u-roles{grid-area:roles}
#r3bContent .r4u-perms{grid-area:perms}
#r3bContent .r4u-card-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:9px;gap:10px}
#r3bContent .r4u-card-title{display:flex;align-items:flex-start;gap:9px;min-width:0}
#r3bContent .r4u-card-title>.r4u-icon{width:25px;height:25px;color:var(--u-green);margin-top:1px}
#r3bContent .r4u-card-title h2{margin:0;color:#08275f;font-size:17px;line-height:1.15}
#r3bContent .r4u-card-title p{margin:3px 0 0;color:#71879c;font-size:10px}

#r3bContent .r4u-search{
  width:315px;height:35px;border:1px solid #cddce7;border-radius:6px;display:flex;align-items:center;gap:9px;padding:0 11px;color:#1b6fd3
}
#r3bContent .r4u-search .r4u-icon{width:17px;height:17px}
#r3bContent .r4u-search input{border:0;outline:0;width:100%;font-size:11px;color:#425f7a;background:transparent}

#r3bContent .r4u-table-wrap{height:215px;border:1px solid #dce6ed;border-radius:6px;overflow:hidden}
#r3bContent .r4u-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:10px}
#r3bContent .r4u-table th{height:34px;background:#edf3f6;color:#506a83;text-align:left;padding:7px 10px;font-weight:700}
#r3bContent .r4u-table td{height:45px;border-top:1px solid #e5edf2;padding:6px 10px;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#r3bContent .r4u-table th:nth-child(1){width:20%}
#r3bContent .r4u-table th:nth-child(2){width:22%}
#r3bContent .r4u-table th:nth-child(3){width:15%}
#r3bContent .r4u-table th:nth-child(4){width:14%}
#r3bContent .r4u-table th:nth-child(5){width:18%}
#r3bContent .r4u-table th:nth-child(6){width:11%}
#r3bContent .r4u-usercell{display:flex;align-items:center;gap:9px;min-width:0}
#r3bContent .r4u-avatar{width:33px;height:33px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--u-green);font-size:10px;font-weight:800;flex:none}
#r3bContent .r4u-avatar.blue{background:#187be8}#r3bContent .r4u-avatar.orange{background:#ff8200}#r3bContent .r4u-avatar.purple{background:#7428e5}
#r3bContent .r4u-usertext strong,#r3bContent .r4u-usertext small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#r3bContent .r4u-usertext strong{font-size:10px;color:#102a58}
#r3bContent .r4u-usertext small{font-size:8.5px;color:#6b8298;margin-top:1px}
#r3bContent .r4u-role{display:inline-flex;padding:5px 9px;border-radius:5px;font-weight:700;background:#def5e6;color:#06854b}
#r3bContent .r4u-role.investor{background:#e9f3ff;color:#1675db}
#r3bContent .r4u-role.rancher{background:#fff0df;color:#e16b00}
#r3bContent .r4u-state{display:flex;align-items:center;gap:7px}
#r3bContent .r4u-dot{width:9px;height:9px;border-radius:50%;background:#08a75c;flex:none}
#r3bContent .r4u-dot.off{background:#f32843}
#r3bContent .r4u-actions{display:flex;gap:6px}
#r3bContent .r4u-action{
  width:33px;height:31px;border:1px solid #cfdde7;background:#fff;border-radius:5px;color:#0b6fe5;
  display:grid;place-items:center;cursor:pointer;position:relative
}
#r3bContent .r4u-action.danger{color:#ef3448}
#r3bContent .r4u-action .r4u-icon{width:16px;height:16px}
#r3bContent .r4u-action-menu{
  position:fixed;z-index:1600;background:#fff;border:1px solid #cfdde7;border-radius:7px;box-shadow:0 8px 25px rgba(15,40,65,.18);
  padding:5px;display:grid;gap:3px;min-width:165px
}
#r3bContent .r4u-action-menu button{border:0;background:#fff;text-align:left;padding:7px 9px;border-radius:5px;color:#23435f;font-size:10px;cursor:pointer}
#r3bContent .r4u-action-menu button:hover{background:#edf7f1}
#r3bContent .r4u-pager{height:37px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;color:#5a7590;font-size:10px}
#r3bContent .r4u-pager-mid{display:flex;gap:5px}
#r3bContent .r4u-pager button{width:31px;height:29px;border:1px solid #d3e0e8;background:#fff;border-radius:5px}
#r3bContent .r4u-pager button.active{background:#e5f0f4;color:#08784a}
#r3bContent .r4u-pager label{justify-self:end}
#r3bContent .r4u-pager select{height:29px;border:1px solid #d3e0e8;border-radius:5px;background:#fff}

#r3bContent .r4u-form{display:flex;flex-direction:column;gap:9px}
#r3bContent .r4u-form label{font-size:10px;color:#456582}
#r3bContent .r4u-form input,#r3bContent .r4u-form select{
  width:100%;height:39px;border:1px solid #cbdbe7;border-radius:6px;padding:0 11px;color:#244a6d;background:#fff;font-size:11px
}
#r3bContent .r4u-form .two{display:grid;grid-template-columns:1fr 1fr;gap:10px}
#r3bContent .r4u-partner-row[hidden]{display:none!important}
#r3bContent .r4u-create-submit{
  height:48px;margin-top:7px;border:0;border-radius:6px;background:linear-gradient(#0b9e5d,#07894e);color:#fff;font-weight:800;
  display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer;font-size:14px
}
#r3bContent .r4u-create-submit .r4u-icon{width:22px;height:22px}
#r3bContent .r4u-feedback{margin-top:6px;min-height:16px;font-size:9px;color:#0a8450}
#r3bContent .r4u-feedback.error{color:#c8323c}

#r3bContent .r4u-role-table{width:100%;border-collapse:collapse;font-size:10px}
#r3bContent .r4u-role-table th{background:#edf3f6;color:#506a83;text-align:left;padding:7px}
#r3bContent .r4u-role-table td{border-top:1px solid #e6edf2;padding:7px}
#r3bContent .r4u-role-name{display:flex;align-items:center;gap:8px;font-weight:700;color:#122d5d}
#r3bContent .r4u-role-name .r4u-icon{width:21px;height:21px;color:var(--u-green)}
#r3bContent .r4u-mini-actions{display:flex;gap:6px;justify-content:flex-end}
#r3bContent .r4u-mini-actions button{width:31px;height:28px;border:1px solid #d1dfe9;background:#fff;border-radius:5px;color:#0873e5;display:grid;place-items:center}
#r3bContent .r4u-mini-actions button:last-child{color:#ef3448}
#r3bContent .r4u-mini-actions .r4u-icon{width:15px;height:15px}

#r3bContent .r4u-perm-banner{border:1px solid #cbead9;background:#edfbf3;border-radius:6px;padding:7px 10px;margin-bottom:8px;display:flex;align-items:center;gap:8px}
#r3bContent .r4u-perm-banner .r4u-icon{width:22px;height:22px;color:var(--u-green)}
#r3bContent .r4u-perm-banner strong,#r3bContent .r4u-perm-banner small{display:block}
#r3bContent .r4u-perm-banner small{color:#53836c;font-size:9px;margin-top:1px}
#r3bContent .r4u-perm-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 10px;max-height:125px;overflow:auto;padding-right:3px}
#r3bContent .r4u-perm-row{display:grid;grid-template-columns:18px 1fr 90px;align-items:center;gap:5px;min-width:0;font-size:9px;color:#506a82}
#r3bContent .r4u-perm-row input{accent-color:#079451}
#r3bContent .r4u-perm-row span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#r3bContent .r4u-perm-row select{height:27px;border:1px solid #cfdee8;border-radius:4px;background:#fff;color:#345876;font-size:9px}
#r3bContent .r4u-save-perms{
  width:100%;height:34px;margin-top:8px;border:1px solid #0a9b5b;border-radius:5px;background:#f1fcf6;color:#09804b;font-weight:800;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px
}
#r3bContent .r4u-save-perms .r4u-icon{width:16px;height:16px}
#r3bContent .r4u-empty{padding:18px;text-align:center;color:#71879c;font-size:10px}

@media(max-height:820px){
 #r3bContent .r4-users-authority{padding:9px 14px;grid-template-rows:64px 86px minmax(0,1fr);gap:9px}
 #r3bContent .r4u-head h1{font-size:27px}
 #r3bContent .r4u-kpi{padding:7px 11px}.r4u-kpi-icon{width:44px!important;height:44px!important}
 #r3bContent .r4u-main{grid-template-rows:minmax(300px,1.42fr) minmax(225px,1fr);gap:9px}
 #r3bContent .r4u-table-wrap{height:190px}
 #r3bContent .r4u-table td{height:39px}
}

/* AGROLOGIX R4 - USUARIOS Y ROLES VERTICAL FIT R2
   Preserve approved R1 visual language. Reallocate unused white space from top cards
   to fully expose Roles y Permisos + Permisos del Rol inside the same viewport. */
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4-users-authority{
  grid-template-rows:66px 88px minmax(0,1fr)!important;
  gap:9px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-main{
  grid-template-rows:minmax(292px,.98fr) minmax(270px,1.02fr)!important;
  gap:9px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-users,
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-create{
  min-height:0!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-table-wrap{
  height:185px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-table td{
  height:38px!important;
  padding-top:4px!important;
  padding-bottom:4px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-pager{
  height:31px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-card{
  padding:10px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-card-head{
  margin-bottom:6px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-form{
  gap:6px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-form input,
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-form select{
  height:35px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-create-submit{
  height:40px!important;
  margin-top:3px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-roles,
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-perms{
  overflow:hidden!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-role-table th,
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-role-table td{
  padding-top:6px!important;
  padding-bottom:6px!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-perm-grid{
  max-height:145px!important;
}

/* AGROLOGIX R4 - USUARIOS ACTIONS + PERMISSIONS FIT R3
   Preserve approved R1/R2 composition. Give the permissions card enough room for its save action. */
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-perm-grid{
  max-height:108px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-save-perms{
  position:sticky!important;
  bottom:0!important;
  z-index:3!important;
  margin-top:6px!important;
  height:32px!important;
  background:#f1fcf6!important;
}
body.r4-shell.auth-authenticated[data-r4-view="users"] #r3bContent .r4u-perms{
  padding-bottom:8px!important;
}

/* AGROLOGIX R4 - USUARIOS ACCESS PASSWORD MENU FIX R5
   The access/password action menu is appended to document.body, so it must not
   depend on the #r3bContent ancestor selector. */
.r4u-action-menu{
  position:fixed!important;
  z-index:2200!important;
  background:#fff!important;
  border:1px solid #cfdde7!important;
  border-radius:7px!important;
  box-shadow:0 8px 25px rgba(15,40,65,.18)!important;
  padding:5px!important;
  display:grid!important;
  gap:3px!important;
  min-width:185px!important;
  visibility:visible!important;
  opacity:1!important;
}
.r4u-action-menu button{
  border:0!important;
  background:#fff!important;
  text-align:left!important;
  padding:8px 10px!important;
  border-radius:5px!important;
  color:#23435f!important;
  font-size:11px!important;
  cursor:pointer!important;
  white-space:nowrap!important;
}
.r4u-action-menu button:hover{
  background:#edf7f1!important;
}