/* ── Extensiones específicas de páginas ─────────────────────── */
/* Este archivo es para estilos de features específicas que no van
   en main.css. Usar variables de tema (--txt0, --bg1, etc.). */

/* ── Página: Módulos ────────────────────────────────────────── */
.mod-info {
  padding: 14px;
  margin-bottom: 14px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.mod-info-icon { font-size: 20px; color: var(--blue); }
.mod-info-text { font-size: 13px; color: var(--txt1); line-height: 1.6; }

.mod-card { padding: 16px; margin-bottom: 12px; }
.mod-card-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
}
.mod-card-body { flex: 1; }
.mod-card-actions { min-width: 120px; text-align: right; }

.mod-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
  flex-wrap: wrap;
}
.mod-name { font-size: 16px; font-weight: 600; color: var(--txt0); }
.mod-code {
  font-size: 11px;
  color: var(--txt1);
  background: var(--bg2);
  padding: 3px 8px;
  border-radius: 4px;
  border: 1px solid var(--border2);
  font-family: var(--mono);
}
.mod-desc {
  font-size: 13px;
  color: var(--txt1);
  margin-bottom: 12px;
  line-height: 1.5;
}

.mod-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 12px;
}
.mod-meta-label {
  font-weight: 700;
  color: var(--txt1);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px;
  margin-bottom: 6px;
}
.mod-meta-value-empty {
  color: var(--txt1);
  font-size: 12px;
  font-style: italic;
}
.mod-badges-row > * { margin-right: 4px; }

.mod-permisos-label {
  font-weight: 700;
  color: var(--txt1);
  text-transform: uppercase;
  letter-spacing: .08em;
  font-size: 11px;
  margin-bottom: 6px;
}
.mod-permisos-list {
  color: var(--txt1);
  font-size: 11px;
  font-family: var(--mono);
  line-height: 1.7;
  word-break: break-word;
}

.btn-disabled { opacity: 0.5; cursor: not-allowed; }