/* public/css/utilizadores.css — Gestão de utilizadores + permissões */

/* Tabs */
.u-tabs{ display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1.25rem; border-bottom:2px solid var(--gray-200); }
.u-tabs button{
  border:0; background:transparent; color:var(--gray-700);
  padding:.7rem 1.4rem; font-weight:600; font-size:.95rem; cursor:pointer;
  border-bottom:3px solid transparent; margin-bottom:-2px; transition:all .15s;
}
.u-tabs button:hover{ color:var(--blue-700); }
.u-tabs button.on{
  color:var(--blue-700); border-bottom-color:var(--blue-700);
}
.u-section{ display:none; }
.u-section.on{ display:block; animation:fadeIn .2s ease; }
@keyframes fadeIn{ from{opacity:0;transform:translateY(4px)} to{opacity:1;transform:none} }

/* Lista de utilizadores */
.role-badge{ padding:.2rem .55rem; border-radius:.35rem; font-size:.7rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.role-admin{ background:linear-gradient(135deg,#dc2626,#b91c1c); color:#fff; }
.role-operador{ background:linear-gradient(135deg,#125f96,#0e4b7a); color:#fff; }
.role-caixa{ background:linear-gradient(135deg,#16a34a,#15803d); color:#fff; }
.user-avatar{
  width:38px; height:38px; border-radius:50%; display:inline-grid; place-items:center;
  background:linear-gradient(135deg,#1976b6,#125f96); color:#fff; font-weight:800; font-size:.95rem;
  flex-shrink:0;
}
.user-cell{ display:flex; align-items:center; gap:.7rem; }
.user-cell .det .nome{ font-weight:700; color:var(--gray-900); }
.user-cell .det .meta{ font-size:.75rem; color:var(--gray-500); }
.ativo-pill{ padding:.18rem .55rem; border-radius:.35rem; font-size:.7rem; font-weight:700; text-transform:uppercase; }
.ativo-true{ background:#dcfce7; color:#166534; }
.ativo-false{ background:#fee2e2; color:#b91c1c; }

/* Modal */
#modalUser .modal-dialog{ max-width: 760px; }
#modalUser .modal-header{ background:linear-gradient(135deg,#125f96,#0a3a5e); color:#fff; border:0; }
#modalUser .modal-header .modal-title{ color:#fff; font-weight:700; }
#modalUser .modal-header .btn-close{ filter:brightness(0) invert(1); opacity:.8; }
#modalUser .modal-body{ background:#f8fafc; }
.user-card{
  background:#fff; border:1px solid var(--gray-200); border-radius:10px;
  padding:1rem 1.1rem; margin-bottom:1rem;
}
.user-card-header{
  display:flex; align-items:center; gap:.55rem; font-size:.75rem; text-transform:uppercase;
  letter-spacing:.06em; font-weight:700; color:var(--blue-700);
  padding-bottom:.55rem; margin-bottom:.85rem; border-bottom:2px solid var(--blue-100);
}
.user-card-header .ic{
  width:26px; height:26px; border-radius:6px; background:var(--blue-100); color:var(--blue-700);
  display:grid; place-items:center; font-size:.9rem;
}

/* ─── Painel de permissões dedicado ──────────────────────────────── */
.perm-panel{
  background:#fff; border:1px solid var(--gray-200); border-radius:var(--radius);
  padding:1.5rem; box-shadow:var(--shadow-sm);
}
.perm-picker{
  display:flex; align-items:end; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem;
  padding-bottom:1.25rem; border-bottom:1px solid var(--gray-100);
}
.perm-picker label{ font-weight:600; color:var(--gray-700); font-size:.85rem; margin-bottom:.35rem; }
.perm-picker select{ min-width:340px; padding:.55rem .9rem; font-size:.95rem; border:1.5px solid var(--gray-200); border-radius:8px; }
.perm-picker select:focus{ outline:none; border-color:var(--blue-500); box-shadow:0 0 0 3px rgba(38,145,209,.15); }

.perm-actions{ display:flex; gap:.5rem; flex-wrap:wrap; margin-left:auto; }
.perm-actions button{
  border:1px solid var(--gray-200); background:#fff; color:var(--gray-700);
  padding:.5rem 1rem; border-radius:8px; font-weight:600; font-size:.85rem; cursor:pointer;
  display:inline-flex; align-items:center; gap:.35rem;
}
.perm-actions button:hover{ background:var(--blue-50); border-color:var(--blue-500); color:var(--blue-700); }
.perm-actions button.primary{ background:var(--blue-700); color:#fff; border-color:var(--blue-700); }
.perm-actions button.primary:hover{ background:var(--blue-800); }

/* Matriz dedicada */
.perm-table{ width:100%; border-collapse:separate; border-spacing:0; }
.perm-table thead th{
  background:var(--gray-50); padding:.85rem 1rem;
  font-size:.72rem; text-transform:uppercase; color:var(--gray-500); font-weight:700;
  letter-spacing:.05em; border-bottom:2px solid var(--gray-200);
}
.perm-table thead th:first-child{ text-align:left; }
.perm-table thead th:not(:first-child){ text-align:center; width:130px; }
.perm-table tbody td{
  padding:.75rem 1rem; border-bottom:1px solid var(--gray-100); vertical-align:middle;
}
.perm-table tbody tr:hover td{ background:var(--gray-50); }
.perm-table .modulo{ font-weight:600; color:var(--gray-900); font-size:.92rem; }
.perm-table .modulo .ic{
  width:30px; height:30px; border-radius:8px; display:inline-grid; place-items:center;
  background:var(--blue-100); color:var(--blue-700); margin-right:.7rem; font-size:.95rem;
  vertical-align:middle;
}
.perm-table .cell-acc{ text-align:center; }
.perm-table input[type=checkbox]{
  width:1.25rem; height:1.25rem; cursor:pointer; accent-color:var(--blue-700);
}
.perm-table tr.dirty td{ background:#fef9c3 !important; }

.perm-info{
  background:linear-gradient(135deg,#eff6ff,#dbeafe); border:1px solid #93c5fd;
  border-radius:8px; padding:.8rem 1rem; margin-bottom:1rem; font-size:.85rem; color:#1e40af;
}

.perm-saving-bar{
  position:sticky; bottom:0; background:#fff; border-top:1px solid var(--gray-200);
  padding:.85rem 1rem; margin:1.5rem -1.5rem -1.5rem; display:flex;
  justify-content:space-between; align-items:center; box-shadow:0 -4px 12px rgba(0,0,0,.05);
}