/* CSS custom */

/* ── Compra: popup importar factura / pedido ───────────────── */
.importcompra-drop {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 2px dashed #dee2e6;
  border-radius: 8px;
  padding: 40px 20px;
  cursor: pointer;
  position: relative;
  transition: border-color .2s, background .2s;
  background: #f8f9fa;
  text-align: center;
}
.importcompra-drop:hover          { border-color: #ffc107; background: #fffdf0; }
.importcompra-drop--ok            { border-color: #ffc107; background: #fffdf0; }
.importcompra-drop--error         { border-color: #dc3545; background: #fff5f5; }
.importcompra-drop__icon          { font-size: 48px; color: #adb5bd; }
.importcompra-drop--ok .importcompra-drop__icon    { color: #ffc107; }
.importcompra-drop--error .importcompra-drop__icon { color: #dc3545; }
.importcompra-drop__text          { font-size: 14px; font-weight: 500; color: #495057; }
.importcompra-drop__hint          { font-size: 12px; color: #adb5bd; }
.importcompra-drop__input         { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }

.importcompra-error {
  display: flex; align-items: center; gap: 6px;
  color: #dc3545; font-size: 13px; margin: 10px 0 0;
}
.importcompra-error .material-symbols-outlined { font-size: 18px; }

.importcompra-tipos { display: flex; gap: 6px; }
.importcompra-tipo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0;
  padding: 5px 12px;
  border: 1px solid #dee2e6;
  border-radius: 6px;
  cursor: pointer;
  font-size: 14px;
}
.importcompra-tipo input { margin: 0; cursor: pointer; }
.importcompra-tipo--activo { border-color: #0d6efd; background: #f0f5ff; }
.importcompra-tipo__ia {
  padding: 0 5px;
  border-radius: 4px;
  font-size: 10px;
  font-weight: 600;
  background: #fff3cd;
  color: #997404;
}

/* ── Compra: columnas pedido / factura (campo Filespedido) ─── */
.filespedido-tags { display: flex; flex-wrap: wrap; gap: 4px; }
.filespedido-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  border: 1px solid transparent;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
  text-decoration: none;
}
.filespedido-tag .material-symbols-outlined { font-size: 16px; }
.filespedido-tag--pedido  { background: #e7f0ff; border-color: #9ec5fe; color: #0a58ca; }
.filespedido-tag--factura { background: #e6f4ea; border-color: #a3cfbb; color: #146c43; }
.filespedido-tag--otro    { background: #f1f3f5; border-color: #dee2e6; color: #495057; }
.filespedido-tag--pedido:hover  { background: #0d6efd; border-color: #0d6efd; color: #fff; }
.filespedido-tag--factura:hover { background: #198754; border-color: #198754; color: #fff; }
.filespedido-tag--otro:hover    { background: #6c757d; border-color: #6c757d; color: #fff; }
.filespedido-tag--vacio {
  background: transparent;
  border: 1px dashed #ced4da;
  color: #adb5bd;
  font-weight: 400;
}

/* ── Compra: resumen_llm (concordancia pedido / factura) ───── */
.resumen-llm {
  --llm-color: #6c757d;
  --llm-bg: #f8f9fa;
  list-style: none;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid #dee2e6;
  border-left: 4px solid var(--llm-color);
  border-radius: 6px;
  background: #fff;
  font-size: 13px;
  line-height: 1.45;
}
.resumen-llm--total   { --llm-color: #198754; --llm-bg: #e6f4ea; }
.resumen-llm--parcial { --llm-color: #fd7e14; --llm-bg: #fff3e6; }
.resumen-llm--ninguna { --llm-color: #dc3545; --llm-bg: #fdecee; }

.resumen-llm > li { margin: 0 0 6px; padding: 0; }
.resumen-llm > li:last-child { margin-bottom: 0; }

.resumen-llm__estado {
  display: inline-block;
  padding: 1px 10px;
  border-radius: 999px;
  background: var(--llm-bg);
  color: var(--llm-color);
  font-weight: 600;
  font-size: 12px;
}
.resumen-llm__resumen { color: #343a40; }

.resumen-llm__alertas { font-weight: 600; color: #495057; }
.resumen-llm__alertas > ul {
  margin: 4px 0 0;
  padding: 0;
  list-style: none;
  font-weight: 400;
}
.resumen-llm__alertas > ul > li {
  position: relative;
  margin: 0 0 3px;
  padding: 3px 8px 3px 20px;
  border-radius: 4px;
  background: #fff8e1;
  color: #664d03;
}
.resumen-llm__alertas > ul > li::before {
  content: "";
  position: absolute;
  left: 8px;
  top: .75em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ffc107;
}

.resumen-llm__sin-alertas { color: #198754; }
.resumen-llm__fecha { color: #adb5bd; font-size: 11px; }

/* ── Garantías: popup validar / rechazar garantía ─────────── */
.gv-modal .modal-content { border: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 20px 50px rgba(11, 28, 48, .25); }
.gv-header { display: flex; align-items: flex-start; gap: 14px; padding: 22px 24px 18px; border-bottom: 1px solid #e3eaec; }
.gv-header-icon { flex: 0 0 44px; height: 44px; border-radius: 12px; background: #e0f5f6; color: #00A8B0; display: flex; align-items: center; justify-content: center; }
.gv-header-icon .material-symbols-outlined { font-size: 26px; }
.gv-title { margin: 0; font-size: 18px; font-weight: 700; color: #0b1c30; }
.gv-subtitle { margin-top: 2px; font-size: 13px; color: #6d797b; }
.gv-close { margin-left: auto; }
.gv-body { padding: 20px 24px; background: #fafcfc; }
.gv-card { background: #fff; border: 1px solid #e3eaec; border-radius: 12px; padding: 16px 18px; }
.gv-summary { display: flex; gap: 16px; align-items: stretch; }
.gv-summary-main { flex: 1; min-width: 0; }
.gv-label { font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #6d797b; margin-bottom: 4px; }
.gv-cuenta { display: flex; align-items: center; gap: 6px; font-size: 16px; font-weight: 700; color: #0b1c30; }
.gv-cuenta .material-symbols-outlined { font-size: 20px; color: #00A8B0; }
.gv-concepto { margin-top: 12px; font-size: 14px; color: #3d494b; max-height: 120px; overflow-y: auto; }
.gv-concepto p:last-child { margin-bottom: 0; }
.gv-adjuntos { margin-top: 14px; }
.gv-adjunto { display: flex; align-items: center; gap: 8px; margin-top: 6px; padding: 8px 12px; border: 1px solid #e3eaec; border-radius: 8px; background: #fafcfc; color: #0b1c30; font-size: 13px; text-decoration: none; transition: border-color .15s, background-color .15s; }
.gv-adjunto:hover { border-color: #00A8B0; background: #e0f5f6; color: #0b1c30; }
.gv-adjunto .material-symbols-outlined { font-size: 20px; color: #00A8B0; }
.gv-adjunto-nombre { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gv-adjunto .gv-adjunto-descarga { font-size: 18px; color: #6d797b; }
.gv-adjunto:hover .gv-adjunto-descarga { color: #00A8B0; }
.gv-importe { flex: 0 0 150px; border-radius: 10px; background: #e0f5f6; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 12px; }
.gv-importe-valor { font-size: 26px; font-weight: 700; color: #00A8B0; line-height: 1.1; }
.gv-section-title { margin: 22px 0 10px; font-size: 14px; font-weight: 700; color: #0b1c30; }
.gv-options { display: flex; gap: 12px; }
.gv-option { flex: 1; display: flex; gap: 12px; align-items: flex-start; text-align: left; background: #fff; border: 2px solid #e3eaec; border-radius: 12px; padding: 14px; cursor: pointer; transition: border-color .15s, background-color .15s, box-shadow .15s; }
.gv-option:hover { border-color: #bcc9cb; }
.gv-option .material-symbols-outlined { font-size: 26px; color: #bcc9cb; transition: color .15s; }
.gv-option-title { display: block; font-size: 14px; font-weight: 700; color: #0b1c30; }
.gv-option-desc { display: block; margin-top: 2px; font-size: 12px; color: #6d797b; }
.gv-option.gv-aceptar.active { border-color: #10B981; background: #ecfdf5; box-shadow: 0 0 0 3px rgba(16, 185, 129, .15); }
.gv-option.gv-aceptar.active .material-symbols-outlined { color: #10B981; }
.gv-option.gv-rechazar.active { border-color: #EF4444; background: #fef2f2; box-shadow: 0 0 0 3px rgba(239, 68, 68, .15); }
.gv-option.gv-rechazar.active .material-symbols-outlined { color: #EF4444; }
.gv-panel { margin-top: 14px; }
.gv-panel label { font-size: 13px; font-weight: 600; color: #0b1c30; margin-bottom: 6px; }
.gv-centro { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding: 12px 14px; border: 1px solid #e3eaec; border-left: 4px solid #00A8B0; border-radius: 10px; background: #fff; }
.gv-centro-cargando { color: #6d797b; font-size: 13px; gap: 10px; }
.gv-centro-icono.material-symbols-outlined { font-size: 26px; color: #00A8B0; }
.gv-centro-datos { flex: 1; min-width: 0; }
.gv-centro-nombre { font-size: 15px; font-weight: 700; color: #0b1c30; }
.gv-centro-detalle { margin-top: 2px; font-size: 12px; color: #6d797b; }
.gv-centro-origen { flex: 0 0 auto; padding: 3px 10px; border-radius: 999px; background: #e0f5f6; color: #00858b; font-size: 11px; font-weight: 700; letter-spacing: .03em; white-space: nowrap; }
.gv-centro-cambiar { flex: 0 0 auto; border-radius: 999px; }
.gv-buscador { margin-bottom: 16px; }
.gv-buscador-input { position: relative; display: flex; align-items: center; }
.gv-buscador-input > .material-symbols-outlined { position: absolute; left: 10px; font-size: 20px; color: #6d797b; pointer-events: none; }
.gv-buscador-input .form-control { padding-left: 36px; padding-right: 36px; }
.gv-buscador-input .gv-spinner { position: absolute; right: 10px; }
.gv-buscador-resultados { margin-top: 6px; max-height: 220px; overflow-y: auto; border: 1px solid #e3eaec; border-radius: 10px; background: #fff; }
.gv-buscador-item { display: block; width: 100%; padding: 9px 14px; border: 0; border-bottom: 1px solid #eef3f4; background: transparent; text-align: left; cursor: pointer; }
.gv-buscador-item:last-child { border-bottom: 0; }
.gv-buscador-item:hover, .gv-buscador-item:focus { background: #e0f5f6; outline: none; }
.gv-buscador-item-nombre { display: block; font-size: 14px; font-weight: 700; color: #0b1c30; }
.gv-buscador-item-detalle { display: block; margin-top: 1px; font-size: 12px; color: #6d797b; }
.gv-spinner.gv-spinner-sm { width: 18px; height: 18px; border-width: 2px; }
.gv-panel .gv-alert { margin-bottom: 16px; }
.gv-panel .gv-label-importe { display: block; }
.gv-input-importe { max-width: 220px; }
.gv-input-importe .form-control { font-size: 18px; font-weight: 700; }
.gv-help { margin-top: 6px; font-size: 12px; color: #6d797b; }
.gv-help.gv-warning { color: #B45309; }
.gv-panel textarea { resize: vertical; min-height: 100px; }
.gv-alert { display: flex; align-items: center; gap: 10px; border-radius: 10px; padding: 12px 14px; font-size: 14px; }
.gv-alert-warning { background: #fffbeb; color: #92400e; border: 1px solid #fde68a; }
.gv-alert-danger { background: #fef2f2; color: #991b1b; border: 1px solid #fecaca; }
.gv-loading { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 0; color: #6d797b; font-size: 14px; }
.gv-spinner { width: 28px; height: 28px; border: 3px solid #e0f5f6; border-top-color: #00A8B0; border-radius: 50%; animation: gv-spin .8s linear infinite; }
@keyframes gv-spin { to { transform: rotate(360deg); } }
.gv-footer { display: flex; justify-content: flex-end; gap: 10px; padding: 16px 24px; border-top: 1px solid #e3eaec; background: #fff; }
.gv-footer .btn { display: inline-flex; align-items: center; gap: 6px; border-radius: 999px; padding: 8px 20px; font-weight: 600; }
.gv-footer .btn .material-symbols-outlined { font-size: 18px; }
.gv-btn-aceptar { background: #10B981; border-color: #10B981; color: #fff; }
.gv-btn-aceptar:hover, .gv-btn-aceptar:focus { background: #059669; border-color: #059669; color: #fff; }
.gv-btn-rechazar { background: #EF4444; border-color: #EF4444; color: #fff; }
.gv-btn-rechazar:hover, .gv-btn-rechazar:focus { background: #DC2626; border-color: #DC2626; color: #fff; }
@media (max-width: 575px) {
  .gv-summary, .gv-options { flex-direction: column; }
  .gv-importe { flex-basis: auto; }
}

/* admin2.css pone overflow:hidden en .main_content y eso anula position:sticky
   (p.ej. el panel "Acciones disponibles" .acc-sb). clip recorta igual sin crear contenedor de scroll.
   Más especificidad porque mainback.php vuelve a cargar admin2.css después de este fichero */
body .wrapper.main_content { overflow: clip; }
