/* style/admin_documentos.css */

/* --- 1. Barra de Filtros y Control --- */
.control-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 24px;
  gap: 20px;
  flex-wrap: wrap;
}

.search-wrapper {
  flex: 1;
  max-width: 400px;
  position: relative;
}

.search-wrapper input {
  width: 100%;
  padding: 12px 15px 12px 45px;
  border-radius: 8px;
  border: 1px solid var(--color-borde);
  background-color: #fff;
  font-size: 14px;
  transition: all 0.2s;
}

.search-wrapper input:focus {
  outline: none;
  border-color: var(--color-primario);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.1);
}

.search-wrapper i {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-secundario);
}

.filter-group {
  display: flex;
  gap: 10px;
}

.form-select {
  padding: 10px 30px 10px 12px;
  border-radius: 8px;
  border: 1px solid var(--color-borde);
  background-color: #fff;
  font-size: 14px;
  color: var(--color-texto-principal);
  cursor: pointer;
}

/* --- 2. Tabla de Documentos Global --- */
.table-container {
  background: var(--color-fondo-tarjeta);
  border-radius: 12px;
  box-shadow: var(--sombra-tarjeta);
  border: 1px solid var(--color-borde);
  overflow: hidden;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
}

.admin-table thead {
  background-color: #f8f9fa;
  border-bottom: 2px solid var(--color-borde);
}

.admin-table th {
  padding: 16px;
  text-align: left;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-texto-secundario);
  text-transform: uppercase;
}

.admin-table td {
  padding: 16px;
  border-bottom: 1px solid var(--color-borde);
  vertical-align: middle;
  font-size: 14px;
}

.admin-table tr:hover { background-color: #fcfcfc; }
.admin-table tr:last-child td { border-bottom: none; }

/* Columna de Usuario (Mini Perfil) */
.user-cell {
  display: flex;
  align-items: center;
  gap: 12px;
}

.user-cell img {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #e9ecef;
}

.user-info-mini h4 {
  font-size: 14px;
  margin: 0;
  font-weight: 600;
  color: var(--color-texto-principal);
}

.user-info-mini span {
  font-size: 11px;
  color: var(--color-texto-secundario);
  display: block;
}

/* Columna de Documento */
.doc-cell {
  display: flex;
  align-items: center;
  gap: 10px;
}
.doc-cell i { font-size: 20px; }
.doc-name { font-weight: 500; color: var(--color-texto-principal); }

/* Iconos de archivo */
.icon-pdf { color: #dc3545; }
.icon-word { color: #0d6efd; }
.icon-img { color: #198754; }
.icon-def { color: #6c757d; }

/* Estados */
.status-badge {
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  display: inline-block;
}
.status-validado { background: #d1e7dd; color: #0f5132; }
.status-pendiente { background: #fff3cd; color: #664d03; }
.status-rechazado { background: #f8d7da; color: #842029; }

/* Acciones */
.btn-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--color-secundario);
  transition: all 0.2s;
  text-decoration: none;
}
.btn-icon:hover { background: #f1f3f5; color: var(--color-primario); }
.btn-icon.delete:hover { background: #fee2e2; color: var(--color-peligro); }

/* --- Responsive --- */
@media (max-width: 992px) {
  .table-container { overflow-x: auto; }
  .control-bar { flex-direction: column; align-items: stretch; }
  .search-wrapper { max-width: 100%; }
}