/* ==========================================================
   UCD USERS — RECORD LIST / FASPEX STYLE
   Conserva la tabla HTML y acciones Rails internamente,
   pero visualmente se comporta como una lista administrativa.
   ========================================================== */

body.ucd-controller-users .ucd-settings-content {
  padding-top: 30px !important;
}

/* ----------------------------------------------------------
   CONTENEDOR
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content table {
  display: block !important;

  width: 100% !important;
  margin: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  background: transparent !important;

  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  overflow: visible !important;
}

/* ----------------------------------------------------------
   HEADER
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content thead {
  display: block !important;

  width: 100% !important;

  background: transparent !important;
}

body.ucd-controller-users .ucd-settings-content thead tr {
  display: grid !important;

  grid-template-columns:
    minmax(250px, 1.7fr)
    minmax(125px, .7fr)
    minmax(140px, .8fr)
    minmax(165px, .9fr)
    72px !important;

  align-items: center !important;

  width: 100% !important;
  min-height: 46px !important;

  border: 0 !important;
  border-bottom: 1px solid rgba(71,85,105,.26) !important;

  background: transparent !important;
}

body.ucd-controller-users .ucd-settings-content thead th {
  display: block !important;

  height: auto !important;

  padding: 0 16px !important;

  border: 0 !important;

  color: #475569 !important;
  background: transparent !important;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Arial,
    sans-serif !important;

  font-size: 11px !important;
  font-weight: 650 !important;

  line-height: 1 !important;

  text-align: left !important;
  text-transform: uppercase !important;

  letter-spacing: .035em !important;

  opacity: 1 !important;
}

/* Email se integra visualmente con Name */
body.ucd-controller-users .ucd-settings-content thead th:nth-child(2) {
  display: none !important;
}

/* ----------------------------------------------------------
   BODY
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content tbody {
  display: block !important;

  width: 100% !important;

  background: transparent !important;
}

body.ucd-controller-users .ucd-settings-content tbody tr {
  position: relative !important;

  display: grid !important;

  grid-template-columns:
    minmax(250px, 1.7fr)
    minmax(125px, .7fr)
    minmax(140px, .8fr)
    minmax(165px, .9fr)
    72px !important;

  align-items: center !important;

  width: 100% !important;
  min-height: 78px !important;

  margin: 0 !important;

  border: 0 !important;
  border-bottom: 1px solid rgba(71,85,105,.17) !important;

  background: transparent !important;

  transition: background-color .13s ease !important;
}

body.ucd-controller-users .ucd-settings-content tbody tr:hover {
  background: rgba(255,255,255,.18) !important;
}

body.ucd-controller-users .ucd-settings-content tbody td {
  display: flex !important;
  align-items: center !important;

  min-width: 0 !important;
  height: auto !important;

  padding: 12px 16px !important;

  border: 0 !important;

  color: #1f2937 !important;
  background: transparent !important;

  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Arial,
    sans-serif !important;

  font-size: 13px !important;
  font-weight: 450 !important;

  line-height: 1.35 !important;

  opacity: 1 !important;
}

/* ----------------------------------------------------------
   NAME + EMAIL EN UNA SOLA COLUMNA
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content tbody td:nth-child(1) {
  display: grid !important;

  grid-template-columns: 44px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;

  column-gap: 13px !important;

  align-items: center !important;
}

/* Avatar generado por JS */
body.ucd-controller-users .ucd-user-avatar {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 40px !important;
  height: 40px !important;

  border-radius: 50% !important;

  color: #0f5fa8 !important;
  background: rgba(191,219,254,.92) !important;

  font-size: 12px !important;
  font-weight: 700 !important;

  letter-spacing: .02em !important;
}

/* Nombre */
body.ucd-controller-users .ucd-user-primary {
  grid-column: 2 !important;
  grid-row: 1 !important;

  min-width: 0 !important;

  color: #111827 !important;

  font-size: 14px !important;
  font-weight: 620 !important;

  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Email inyectado visualmente */
body.ucd-controller-users .ucd-user-secondary {
  grid-column: 2 !important;
  grid-row: 2 !important;

  min-width: 0 !important;

  margin-top: 3px !important;

  color: #64748b !important;

  font-size: 12px !important;
  font-weight: 430 !important;

  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Ocultamos la columna Email original visualmente.
   El contenido se copia bajo el nombre mediante JS. */
body.ucd-controller-users .ucd-settings-content tbody td:nth-child(2) {
  display: none !important;
}

/* ----------------------------------------------------------
   ROLE
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content tbody td:nth-child(3) {
  color: #334155 !important;
}

body.ucd-controller-users .ucd-settings-content .badge {
  display: inline-flex !important;
  align-items: center !important;

  min-height: 24px !important;

  padding: 2px 9px !important;

  border: 1px solid rgba(37,99,235,.50) !important;
  border-radius: 999px !important;

  color: #1769aa !important;
  background: rgba(255,255,255,.28) !important;

  font-size: 11px !important;
  font-weight: 600 !important;

  opacity: 1 !important;

  box-shadow: none !important;
}

/* ----------------------------------------------------------
   ACCESS / LAST SESSION
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content tbody td:nth-child(4),
body.ucd-controller-users .ucd-settings-content tbody td:nth-child(5) {
  color: #334155 !important;

  white-space: nowrap !important;
}

/* ----------------------------------------------------------
   ACTIONS
   ---------------------------------------------------------- */

body.ucd-controller-users .ucd-settings-content tbody td:last-child {
  position: relative !important;

  justify-content: flex-end !important;

  padding-right: 8px !important;
}

/* Contenedor creado por JS */
body.ucd-controller-users .ucd-user-actions {
  position: relative !important;

  display: inline-flex !important;

  justify-content: flex-end !important;
}

/* Botón ⋮ */
body.ucd-controller-users .ucd-user-menu-trigger {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  width: 34px !important;
  height: 34px !important;

  padding: 0 !important;

  border: 0 !important;
  border-radius: 5px !important;

  color: #334155 !important;
  background: transparent !important;

  font-family: Arial, sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  cursor: pointer !important;

  box-shadow: none !important;
}

body.ucd-controller-users .ucd-user-menu-trigger:hover {
  background: rgba(15,23,42,.07) !important;
}

/* Dropdown */
body.ucd-controller-users .ucd-user-menu-panel {
  position: absolute !important;

  top: 38px !important;
  right: 0 !important;

  z-index: 1000 !important;

  display: none !important;

  width: 150px !important;

  padding: 5px !important;

  border: 1px solid rgba(15,23,42,.14) !important;
  border-radius: 6px !important;

  background: #ffffff !important;

  box-shadow:
    0 12px 30px rgba(15,23,42,.16) !important;
}

body.ucd-controller-users .ucd-user-actions.is-open
.ucd-user-menu-panel {
  display: block !important;
}

/* Acciones originales dentro del menú */
body.ucd-controller-users .ucd-user-menu-panel > * {
  width: 100% !important;
}

body.ucd-controller-users .ucd-user-menu-panel a,
body.ucd-controller-users .ucd-user-menu-panel button,
body.ucd-controller-users .ucd-user-menu-panel input[type="submit"] {
  display: flex !important;
  align-items: center !important;

  box-sizing: border-box !important;

  width: 100% !important;
  min-width: 0 !important;
  min-height: 35px !important;

  margin: 0 !important;
  padding: 0 10px !important;

  border: 0 !important;
  border-radius: 4px !important;

  color: #334155 !important;
  background: transparent !important;

  font-size: 12px !important;
  font-weight: 500 !important;

  text-align: left !important;

  box-shadow: none !important;
}

body.ucd-controller-users .ucd-user-menu-panel a:hover,
body.ucd-controller-users .ucd-user-menu-panel button:hover,
body.ucd-controller-users .ucd-user-menu-panel input[type="submit"]:hover {
  background: #f1f5f9 !important;
}

/* ----------------------------------------------------------
   NEW USER
   ---------------------------------------------------------- */

body.ucd-controller-users a[href="/users/new"],
body.ucd-controller-users a[href$="/users/new"] {
  border-radius: 5px !important;

  background: #1769d2 !important;
  border-color: #1769d2 !important;

  box-shadow: none !important;
}

/* ----------------------------------------------------------
   MOBILE
   ---------------------------------------------------------- */

@media (max-width: 1050px) {
  body.ucd-controller-users .ucd-settings-content thead {
    display: none !important;
  }

  body.ucd-controller-users .ucd-settings-content tbody tr {
    grid-template-columns:
      minmax(220px, 1fr)
      110px
      62px !important;
  }

  body.ucd-controller-users .ucd-settings-content tbody td:nth-child(4) {
    display: none !important;
  }

  body.ucd-controller-users .ucd-settings-content tbody td:nth-child(5) {
    display: none !important;
  }
}
