/* ═══════════════════════════════════════════════════════════════════════
   Skin base de Porto — define las ~158 variables de color que usan las
   utilidades del tema (.bg-color-dark-100, .text-color-primary, etc.).

   Sin este archivo esas clases resuelven a variables inexistentes y
   quedan transparentes. Es lo que hacía invisible al footer: fondo sin
   definir + texto blanco sobre página blanca.

   Los valores de --primary se PISAN por tenant desde Vista::estilosTenant(),
   que los deriva del color del municipio. Este archivo es solo el piso.
   ═══════════════════════════════════════════════════════════════════════ */

/* General */
:root {
  --border-radius: 4px;
  --border-radius2x: 8px;
  --default: #777;
}
/* Skin Colors */
:root {
  --primary: #05ad6d ;
  --primary-100: #04a165;
  --primary-200: #057047;
  --primary-300: #034d30;
  --primary--100: #04a165;
  --primary--200: #057047;
  --primary--300: #034d30;
  --primary-rgba-0: rgba(0, 136, 204, 0);
  --primary-rgba-10: rgba(0, 136, 204, 0.1);
  --primary-rgba-20: rgba(0, 136, 204, 0.2);
  --primary-rgba-30: rgba(0, 136, 204, 0.3);
  --primary-rgba-40: rgba(0, 136, 204, 0.4);
  --primary-rgba-50: rgba(0, 136, 204, 0.5);
  --primary-rgba-60: rgba(0, 136, 204, 0.6);
  --primary-rgba-70: rgba(0, 136, 204, 0.7);
  --primary-rgba-80: rgba(0, 136, 204, 0.8);
  --primary-rgba-90: rgba(0, 136, 204, 0.9);
  --secondary: #e36159;
  --secondary-100: #df4c43;
  --secondary-200: #dd4238;
  --secondary-300: #dc372d;
  --secondary--100: #e7766f;
  --secondary--200: #e9807a;
  --secondary--300: #ea8b85;
  --secondary-rgba-0: rgba(227, 97, 89, 0);
  --secondary-rgba-10: rgba(227, 97, 89, 0.1);
  --secondary-rgba-20: rgba(227, 97, 89, 0.2);
  --secondary-rgba-30: rgba(227, 97, 89, 0.3);
  --secondary-rgba-40: rgba(227, 97, 89, 0.4);
  --secondary-rgba-50: rgba(227, 97, 89, 0.5);
  --secondary-rgba-60: rgba(227, 97, 89, 0.6);
  --secondary-rgba-70: rgba(227, 97, 89, 0.7);
  --secondary-rgba-80: rgba(227, 97, 89, 0.8);
  --secondary-rgba-90: rgba(227, 97, 89, 0.9);
  --tertiary: #2BAAB1;
  --tertiary-100: #26969c;
  --tertiary-200: #248c92;
  --tertiary-300: #218388;
  --tertiary--100: #30bec6;
  --tertiary--200: #34c6ce;
  --tertiary--300: #3fc9d0;
  --tertiary-rgba-0: rgba(43, 170, 177, 0);
  --tertiary-rgba-10: rgba(43, 170, 177, 0.1);
  --tertiary-rgba-20: rgba(43, 170, 177, 0.2);
  --tertiary-rgba-30: rgba(43, 170, 177, 0.3);
  --tertiary-rgba-40: rgba(43, 170, 177, 0.4);
  --tertiary-rgba-50: rgba(43, 170, 177, 0.5);
  --tertiary-rgba-60: rgba(43, 170, 177, 0.6);
  --tertiary-rgba-70: rgba(43, 170, 177, 0.7);
  --tertiary-rgba-80: rgba(43, 170, 177, 0.8);
  --tertiary-rgba-90: rgba(43, 170, 177, 0.9);
  --quaternary: #383f48;
  --quaternary-100: #2d323a;
  --quaternary-200: #272c32;
  --quaternary-300: #22262b;
  --quaternary--100: #434c56;
  --quaternary--200: #49525e;
  --quaternary--300: #4e5865;
  --quaternary-rgba-0: rgba(56, 63, 72, 0);
  --quaternary-rgba-10: rgba(56, 63, 72, 0.1);
  --quaternary-rgba-20: rgba(56, 63, 72, 0.2);
  --quaternary-rgba-30: rgba(56, 63, 72, 0.3);
  --quaternary-rgba-40: rgba(56, 63, 72, 0.4);
  --quaternary-rgba-50: rgba(56, 63, 72, 0.5);
  --quaternary-rgba-60: rgba(56, 63, 72, 0.6);
  --quaternary-rgba-70: rgba(56, 63, 72, 0.7);
  --quaternary-rgba-80: rgba(56, 63, 72, 0.8);
  --quaternary-rgba-90: rgba(56, 63, 72, 0.9);
  --dark: #212529;
  --dark-100: #16181b;
  --dark-200: #101214;
  --dark-300: #0a0c0d;
  --dark--100: #2c3237;
  --dark--200: #32383e;
  --dark--300: #383f45;
  --dark-rgba-0: rgba(33, 37, 41, 0);
  --dark-rgba-10: rgba(33, 37, 41, 0.1);
  --dark-rgba-20: rgba(33, 37, 41, 0.2);
  --dark-rgba-30: rgba(33, 37, 41, 0.3);
  --dark-rgba-40: rgba(33, 37, 41, 0.4);
  --dark-rgba-50: rgba(33, 37, 41, 0.5);
  --dark-rgba-60: rgba(33, 37, 41, 0.6);
  --dark-rgba-70: rgba(33, 37, 41, 0.7);
  --dark-rgba-80: rgba(33, 37, 41, 0.8);
  --dark-rgba-90: rgba(33, 37, 41, 0.9);
  --light: #FFF;
  --light-100: #f2f2f2;
  --light-200: #ececec;
  --light-300: #e6e6e6;
  --light--100: #ffffff;
  --light--200: #ffffff;
  --light--300: #ffffff;
  --light-rgba-0: rgba(255, 255, 255, 0);
  --light-rgba-10: rgba(255, 255, 255, 0.1);
  --light-rgba-20: rgba(255, 255, 255, 0.2);
  --light-rgba-30: rgba(255, 255, 255, 0.3);
  --light-rgba-40: rgba(255, 255, 255, 0.4);
  --light-rgba-50: rgba(255, 255, 255, 0.5);
  --light-rgba-60: rgba(255, 255, 255, 0.6);
  --light-rgba-70: rgba(255, 255, 255, 0.7);
  --light-rgba-80: rgba(255, 255, 255, 0.8);
  --light-rgba-90: rgba(255, 255, 255, 0.9);


  /* Colores principales del sistema CUIDAR */
  --cuidar-primary: #2563eb;        /* Azul confianza */
  --cuidar-primary-dark: #1e40af;
  --cuidar-primary-light: #3b82f6;
  --cuidar-primary-lighter: #dbeafe;
  
  --cuidar-success: #10b981;        /* Verde esperanza */
  --cuidar-success-dark: #059669;
  --cuidar-success-light: #34d399;
  --cuidar-success-lighter: #d1fae5;
  
  --cuidar-warning: #f59e0b;        /* Naranja atención */
  --cuidar-warning-dark: #d97706;
  --cuidar-warning-light: #fbbf24;
  --cuidar-warning-lighter: #fef3c7;
  
  --cuidar-danger: #ef4444;         /* Rojo precaución */
  --cuidar-danger-dark: #dc2626;
  --cuidar-danger-light: #f87171;
  --cuidar-danger-lighter: #fee2e2;
  
  --cuidar-info: #06b6d4;           /* Cyan información */
  --cuidar-info-dark: #0891b2;
  --cuidar-info-light: #22d3ee;
  --cuidar-info-lighter: #cffafe;
  
  --cuidar-secondary: #64748b;      /* Gris neutro */
  --cuidar-secondary-dark: #475569;
  --cuidar-secondary-light: #94a3b8;
  --cuidar-secondary-lighter: #f1f5f9;
  
  /* Backgrounds */
  --cuidar-bg-base: #ffffff;
  --cuidar-bg-subtle: #f8fafc;
  --cuidar-bg-muted: #f1f5f9;
  
  /* Textos */
  --cuidar-text: #1e293b;
  --cuidar-text-muted: #64748b;
  --cuidar-text-light: #94a3b8;
  
  /* Bordes y sombras */
  --cuidar-border: #e2e8f0;
  --cuidar-border-light: #f1f5f9;
  --cuidar-shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --cuidar-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --cuidar-shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --cuidar-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

}
/* Skin Colors - Inverse */
:root {
  --primary-inverse: #FFF;
  --secondary-inverse: #FFF;
  --tertiary-inverse: #FFF;
  --quaternary-inverse: #FFF;
  --dark-inverse: #FFF;
  --light-inverse: #777;
}
/* Grey Colors */
:root {
  --grey: #969696;
  --grey-100: #f4f4f4;
  --grey-200: #eaeaea;
  --grey-300: #e5e5e5;
  --grey-400: #e0e0e0;
  --grey-500: #dbdbdb;
  --grey-600: #cecece;
  --grey-700: #c1c1c1;
  --grey-800: #a8a8a8;
  --grey-900: #8e8e8e;
  --grey-1000: #757575;
}


/* ============================================
   TABULATOR - TABLAS MODERNAS
   ============================================ */

/* Contenedor general de la tabla */
.tabulator {
  background-color: var(--cuidar-bg-base) !important;
  border: 1px solid var(--cuidar-border) !important;
  border-radius: 0.75rem !important;
  box-shadow: var(--cuidar-shadow) !important;
  overflow: hidden !important;
  font-size: 0.875rem !important;
}

/* Header de la tabla */
.tabulator .tabulator-header {
  background: linear-gradient(180deg, var(--cuidar-bg-subtle) 0%, var(--cuidar-bg-muted) 100%) !important;
  border-bottom: 2px solid var(--cuidar-border) !important;
  font-weight: 600 !important;
  color: var(--cuidar-text) !important;
  letter-spacing: 0.025em !important;
}

.tabulator .tabulator-header .tabulator-col {
  background: transparent !important;
  border-right: 1px solid var(--cuidar-border-light) !important;
  padding: 1rem 0.75rem !important;
}

.tabulator .tabulator-header .tabulator-col:last-child {
  border-right: none !important;
}

.tabulator .tabulator-header .tabulator-col-content {
  color: var(--cuidar-text) !important;
  font-size: 0.8125rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

/* Hover en headers ordenables */
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover {
  background-color: var(--cuidar-primary-lighter) !important;
}

/* Filas de la tabla */
.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row {
  background-color: var(--cuidar-bg-base) !important;
  border-bottom: 1px solid var(--cuidar-border-light) !important;
  transition: all 0.2s ease !important;
}

.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row:hover {
  background-color: var(--cuidar-primary-lighter) !important;
  cursor: pointer !important;
}

.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-row-even {
  background-color: var(--cuidar-bg-subtle) !important;
}

.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-row-even:hover {
  background-color: var(--cuidar-primary-lighter) !important;
}

/* Celdas */
.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row .tabulator-cell {
  padding: 0.875rem 0.75rem !important;
  border-right: 1px solid var(--cuidar-border-light) !important;
  color: var(--cuidar-text) !important;
}

.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row .tabulator-cell:last-child {
  border-right: none !important;
}

/* Fila seleccionada */
.tabulator .tabulator-tableHolder .tabulator-table .tabulator-row.tabulator-selected {
  background-color: rgba(37, 99, 235, 0.08) !important;
  border-left: 3px solid var(--cuidar-primary) !important;
}

/* Footer con paginación */
.tabulator .tabulator-footer {
  background: linear-gradient(180deg, var(--cuidar-bg-subtle) 0%, var(--cuidar-bg-muted) 100%) !important;
  border-top: 2px solid var(--cuidar-border) !important;
  padding: 0.75rem 1rem !important;
  color: var(--cuidar-text-muted) !important;
}

.tabulator .tabulator-footer .tabulator-page {
  background-color: var(--cuidar-bg-base) !important;
  border: 1px solid var(--cuidar-border) !important;
  color: var(--cuidar-text) !important;
  border-radius: 0.375rem !important;
  padding: 0.375rem 0.75rem !important;
  margin: 0 0.25rem !important;
  transition: all 0.2s ease !important;
  font-weight: 500 !important;
}

.tabulator .tabulator-footer .tabulator-page:hover:not(.disabled) {
  background-color: var(--cuidar-primary-lighter) !important;
  border-color: var(--cuidar-primary) !important;
  color: var(--cuidar-primary) !important;
}

.tabulator .tabulator-footer .tabulator-page.active {
  background-color: var(--cuidar-primary) !important;
  border-color: var(--cuidar-primary) !important;
  color: white !important;
  font-weight: 600 !important;
}

.tabulator .tabulator-footer .tabulator-page.disabled {
  opacity: 0.4 !important;
  cursor: not-allowed !important;
}