/* AGUSKA PATAGONIA · Fase 2 (3/11/2026): pantallas interiores del sistema administrativo y del portal.
   Reutiliza las clases existentes (app.css en el sistema; base.css y portal.css en el portal) y solo cambia su
   presentación: colores, encabezados, botones, filtros, tarjetas, tablas y formularios. Actúa con body.pat-admin
   (sesión interna) o body.pat-portal; el ingreso y las páginas públicas no cambian. */

/* ---------- Paleta común: las variables de cada hoja apuntan a los colores Patagonia ---------- */
body.pat-admin, body.pat-portal {
    --color-primario: var(--pat-azul);
    --color-primario-hover: var(--pat-azul-2);
    --color-primario-activo: var(--pat-azul-2);
    --color-fondo: #eef5fa;
    --color-texto: var(--pat-texto);
    --color-texto-suave: var(--pat-suave);
    --color-borde: var(--pat-borde);
    --radio: var(--pat-radio);
    --radio-chico: 10px;
    --sombra: 0 2px 12px rgba(11, 60, 107, .07);
}
body.pat-admin {
    --primario: var(--pat-azul);
    --primario-hover: var(--pat-azul-2);
    --primario-suave: var(--pat-azul-claro);
    --primario-borde: #c3d8ea;
    --fondo: #eef5fa;
    --superficie-2: #f5f9fc;
    --borde: var(--pat-borde);
    --borde-fuerte: #c9dbe9;
    --texto: var(--pat-texto);
    --texto-2: #3f5a72;
    --texto-3: var(--pat-suave);
    --foco: #2a7fc9;
}
body.pat-portal {
    --portal-azul: var(--pat-azul-2);
    --portal-texto: var(--pat-texto);
    --portal-secundario: var(--pat-suave);
    --portal-borde: var(--pat-borde);
}

/* ---------- Encabezado de página ---------- */
.pat-admin .pagina-cabecera { margin-bottom: 18px; gap: 12px 16px; }
.pat-admin .pagina-cabecera h1, .pat-portal .header h2, .pat-portal .portal-pagina-titulo h2 { color: var(--pat-azul); font-size: 26px; font-weight: 800; letter-spacing: -.01em; }
.pat-admin .pagina-cabecera p, .pat-portal .header p, .pat-portal .portal-pagina-titulo p { color: var(--pat-suave); }
.pat-admin .pagina-miga { color: var(--pat-azul-2); font-weight: 600; }
.pat-portal .header { margin-bottom: 18px; }

/* ---------- Botones ---------- */
.pat-admin .btn { border-radius: 10px; font-weight: 700; }
.pat-admin .btn-sec, .pat-portal .boton-secundario { background: #fff; color: var(--pat-azul); border-color: #c9dbe9; }
.pat-admin .btn-sec:hover, .pat-portal .boton-secundario:hover { background: #f1f7fc; border-color: var(--pat-azul-2); color: var(--pat-azul); }
.pat-admin .btn-ghost { color: var(--pat-azul-2); }
.pat-portal .boton { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 9px 18px; border-radius: 10px; font-weight: 700; line-height: 1.2; }
.pat-portal .boton-chico { min-height: 34px; padding: 5px 12px; font-size: 13px; }
.pat-portal .boton-peligro { border-radius: 10px; }

/* Pestañas y filtros rápidos: cápsulas como en los paneles */
.pat-admin .chip { min-height: 32px; padding: 4px 14px; border-color: #c9dbe9; color: var(--pat-texto); }
.pat-admin .chip.activo { background: var(--pat-azul); border-color: var(--pat-azul); color: #fff; }
.pat-portal .filtros .boton-chico { border-radius: 999px; padding-left: 14px; padding-right: 14px; }

/* ---------- Tarjetas ---------- */
.pat-admin .tarjeta, .pat-portal .panel, .pat-portal .card { border: 1px solid var(--pat-borde); border-radius: var(--pat-radio); box-shadow: var(--sombra); }
.pat-admin .tarjeta-cabecera { padding: 14px 20px; }
.pat-admin .tarjeta-cabecera h2, .pat-admin .tarjeta-cabecera h3, .pat-portal .panel h3 { color: var(--pat-azul); font-weight: 750; }
.pat-admin .tarjeta-cuerpo { padding: 18px 20px; }
.pat-admin .app-main .tarjeta h2 { color: var(--pat-azul); }

/* ---------- Formularios y filtros ---------- */
.pat-admin .barra-filtros input, .pat-admin .barra-filtros select,
.pat-admin .form-ui input:not([type="checkbox"]):not([type="radio"]), .pat-admin .form-ui select, .pat-admin .form-ui textarea,
.pat-portal input[type="text"], .pat-portal input[type="email"], .pat-portal input[type="search"], .pat-portal input[type="password"],
.pat-portal input[type="number"], .pat-portal input[type="date"], .pat-portal input[type="time"], .pat-portal select, .pat-portal textarea {
    border-color: #c9dbe9; border-radius: 10px;
}
.pat-admin .barra-filtros label, .pat-admin .form-ui label, .pat-portal .campo label { color: var(--pat-texto); }

/* ---------- Avisos ---------- */
.pat-admin .aviso-revision-global { border: 1px solid #f1d9a6; border-left: 4px solid var(--pat-naranja); border-radius: 10px; background: #fff8ea; }

/* ---------- Tablas compactas (pantallas anchas; la impresión y las tarjetas móviles no cambian) ---------- */
@media screen and (min-width: 981px) {
    .pat-admin .tabla { font-size: 14px; }
    .pat-admin .tabla th, .pat-admin .tabla td { padding-top: 9px; padding-bottom: 9px; }
    .pat-admin .tabla th { background: #f3f8fc; color: var(--pat-suave); font-size: 11.5px; }
    .pat-admin .tabla tbody tr:hover td { background: #f6fafd; }
    .pat-portal .tabla-portal th, .pat-portal .tabla-portal td, .pat-portal .panel table th, .pat-portal .panel table td { padding: 10px 12px; }
    .pat-portal .panel table th { background: #f3f8fc; color: var(--pat-suave); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
    .pat-portal .tabla-portal td.c-titulo a { font-weight: 700; color: var(--pat-azul-2); text-decoration: none; }
    .pat-portal .tabla-portal td.c-titulo a:hover { text-decoration: underline; }
    /* Lista de servicios: cliente en una línea por dato, para que la fila no crezca. */
    .pat-admin .tabla-servicios td:nth-child(2) { min-width: 170px; }
    .pat-admin .tabla-servicios td:nth-child(3) { min-width: 190px; }
}

/* ---------- Celular: tarjetas de la lista de servicios más compactas ---------- */
@media screen and (max-width: 980px) {
    .pat-admin .tabla-servicios tbody tr { padding: 10px 12px; row-gap: 0; }
    .pat-admin .tabla-servicios td { padding-top: 1px; padding-bottom: 1px; }
    .pat-admin .tabla-servicios td.celda-titulo { padding-bottom: 2px; }
    .pat-admin .tabla-servicios td.celda-acciones { padding-top: 8px; }
    .pat-admin .tabla-servicios .acciones-fila .btn { min-height: 36px; }
}

/* ---------- Cotizaciones: filtros con el mismo aspecto que Servicios ---------- */
.pat-admin .cot-acciones { display: flex; flex-wrap: wrap; gap: 8px; }
.pat-admin .cot-historial > form.cot-grid { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 10px 14px; align-items: end; }
.pat-admin .cot-grid .cot-filtro { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pat-admin .cot-grid .cot-filtro label { font-size: 12.5px; font-weight: 700; }
.pat-admin .cot-grid .cot-filtro-acciones { flex-direction: row; align-items: center; gap: 8px; }
.pat-admin .cot-tabla th { background: #f3f8fc; color: var(--pat-suave); font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.pat-admin .cot-tabla th, .pat-admin .cot-tabla td { border-bottom: 1px solid var(--pat-borde); }
