/* theme.css
  Este archivo contiene únicamente las variables de tema (colores).
  Está compilado y listo para subirse a la CDN de Azure.
*/

:root {  
	
	/* === Colores Institucionales === */
  --color-naranja: #FF5500;
  --color-amarillo: #FF8D1D;
  --color-azul-marino: #002635;
  --color-azul-zafiro: #477696;
  --color-artico: #CFDEE5;
  --color-gris: #768693;
  --color-negro: #1A1A1A;
  --color-blanco: #FFFFFF;

  /* === Estados y Alertas === */
  --color-exito: #14AE5C;
  --color-error: #DC362E;
  --color-alerta: var(--color-amarillo);

  /* === Gradientes base === */
  --gradiente-naranja-artico: linear-gradient(90deg, var(--color-naranja) 0%, var(--color-artico) 100%);
  --gradiente-naranja-amarillo: linear-gradient(90deg, var(--color-naranja) 0%, var(--color-amarillo) 100%);
  --gradiente-azulmarino-zafiro: linear-gradient(90deg, var(--color-azul-marino) 0%, var(--color-azul-zafiro) 100%);
  --gradiente-artico-blanco: linear-gradient(90deg, var(--color-artico) 0%, var(--color-blanco) 100%);

  /* === Escalas de color (por si se necesitan tonos intermedios) === */
  --naranja-10: #441700;
  --naranja-20: #782901;
  --naranja-40: #EA4E00;
  --naranja-60: #FF8A4F;
  --naranja-80: #FFD0B8;

  --azul-marino-10: #072336;
  --azul-marino-20: #103C59;
  --azul-marino-40: #356383;
  --azul-marino-60: #5D8EB0;
  --azul-marino-80: #A2C3DA;

  --azul-zafiro-10: #072336;
  --azul-zafiro-20: #103C59;
  --azul-zafiro-40: #356383;
  --azul-zafiro-60: #5D8EB0;
  --azul-zafiro-80: #A2C3DA;

  --artico-10: #172D36;
  --artico-20: #426371;
  --artico-40: #A9C7D4;
  --artico-60: #E2EBF0;
  --artico-80: #E8F2F7;

  --gris-10: #232A30;
  --gris-20: #3E4B56;
  --gris-40: #667683;
  --gris-60: #96A4AF;
  --gris-80: #CFD6DB;

  --error-10: #410E;
  --error-20: #601410;
  --error-40: #B3261E;
  --error-60: #E46962;
  --error-80: #F2B8B5;

  --exito-10: #015126;
  --exito-20: #046833;
  --exito-40: #0D974D;
  --exito-60: #23BE6B;
  --exito-80: #4FE795;

  /* === Sombras y bordes === */
  --sombra-base: rgba(0, 0, 0, 0.15);
  --borde-base: #D2D2D2;

  /*no se que estoy haciendo pero finjamos que si, si es que funciona (̶◉͛‿◉̶)--ATT: KAZU*/


}

:root {

	
  /* Tema claro (por defecto) */
  --primary-bg: var(--color-blanco);
  --sidebar-bg: var(--color-azul-marino);
  --secondary-bg: var(--color-azul-marino);
  --primary-bg-btn: var(--color-naranja);
  --primary-bg-icon:var(--color-azul-marino);
  --secondary-bg-btn: var(--color-amarillo); 
  --card-bg: var(--color-blanco);

  /*Date picker*/
  --dp-tooltip-bg:var(--color-azul-marino);
  --dp-tooltip-text: var(--color-blanco);


  /*Footer Colores*/
  --text-footer-secondary:var(--color-blanco);
  --text-footer-primary: var(--color-naranja);

	/*Color de textos*/
  --text-primary:var(--color-naranja);
  --text-secondary:var(--color-negro);
  --text-contrast: var(--color-negro);
  --text-back:var(--color-blanco);
  --text-secondary-contrast:var(--gris-60);
  --text-bg-accent: var(--color-blanco);
  --text-placeholder:rgba(0, 0, 0, 0.15);
  --text-placeholder-login: rgba(255, 255, 255, 0.15);
  --text-title-h1:var(--color-naranja);
  --text-zafiro:var(--color-azul-zafiro);
  --text-neutral-black:var(--color-negro);
  --text-error:var(--color-error);


  /*tamaño textos*/
  --text-static-title-small-size:14px;
  --text-static-title-medium-size:16px;
  --text-static-title-large-size:22px;
  --text-static-body-large-size:16px;
  --text-static-body-small-size:12px; 
  --text-static-headline-small-size:24px;
  --text-static-headline-medium-size:28px;



  --border-color: var(--borde-base);
  --shadow-color: rgba(0, 0, 0, 0.15);

    /*------------------------------------------------------------------------------------------------------*/
	/*Colores para graficas. algunos elementos contienen gradientes por lo que se utiliza low para parte baja y hg para parte alta del gradiente*/
	/*Home Clients Economic savings */
  --es-CFE-low: var(--btn-azulzafiro-hg);
	--es-CFE-hg: var(--color-artico);
	--es-er-low:var(--color-naranja);
	--es-er-hg: var(--color-amarillo);
	--es-savings-low:var(--color-azul-marino);
	--es-savings-hg: var(--color-azul-zafiro);
	--es-whithouter-low:var(--color-error);
	--es-whithouter-hg: var(--error-60);

	/*Home Clients Economic Savings Historic(ESH)*/
	--esh-savings-low: var(--color-amarillo);
	--esh-savings-hg: var(--color-naranja);
	--esh-savings-indicator: var(--color-negro);

	/*Home Clients Generacion Historica(HG)*/ 
	--hg-CFE-low:var(--color-azul-zafiro);
	--hg-CFE-hg:var(--color-azul-marino);
	--hg-ER-low:var(--color-amarillo);
	--hg-ER-hg:var(--color-naranja);
	--hg-total-indicator:var(--color-exito);

	/*Home Clients Plants Overview(PO)*/
	--po-production-low: var(--color-azul-marino);
	--po-production-hg:var(--color-azul-zafiro);
	--po-consumption-low:var(--color-naranja);
	--po-consumption-hg:var(--color-amarillo);

	/*Limites del Home Mapa*/
	--mp-limit-0000:#E0E0E0;
	--mp-limit-1500:#FFC791; 
	--mp-limit-3000:#FFA97E;
	--mp-limit-4500:#FF8D1D;
	--mp-limit-6000:#EA4E00;

	/*Limites del Home Mem Mapa*/
	--mmp-limit-0000:#E0E0E0;
	--mmp-limit-0500:#BDE8E8;
	--mmp-limit-1000:#00E5FF;
	--mmp-limit-1500:#6490E2;
	--mmp-limit-2000:#FAB700;
	--mmp-limit-2500:#F97316;
    --mmp-limit-3000:#FF0003;
	--mmp-limit-3500:#A70002;


	/*GRAFICA Daily Averge(DA) MEM */
    --mem-da-mtr-bg:rgba(20, 174, 92, 0.5);
	--mem-da-mtr-line:var(--color-exito);
	--mem-da-mda-bg:rgba(255, 85, 0, 0.5);
	--mem-da-mda-line:var(--color-naranja);
	--mem-da-nod-bg:rgba(71, 118, 150, 0.5);
	--mem-da-nod-line:var(--color-azul-zafiro);

	/*EJES DE GRAFICAS*/
	--axis-line:var(--borde-base);

	/*PMLS MEM CARD*/
	--text-mda: var(--color-naranja);
	--text-mtr:var(--color-exito);
	--text-no:var(--color-azul-zafiro);

	/*TABLAS DEL REPORTE MENSUAL DE MEM*/
	--text-header-rmem:var(--color-blanco);
	--header-bg-rmem:var(--color-naranja);

		/*GRAFICA PERFORMANCE plant details*/
    --performance-estim-low:var(--color-azul-zafiro);
	--performance-estim-hg:var(--color-azul-marino);
	--performance-prod-low:var(--color-amarillo);
	--performance-prod-hg:var(--color-naranja);
	--performance-guar-line:var(--color-error);
	--performance-performance-line:var(--color-exito);

	/*GRAFICA BILLINGS SUMMARY*/
	--bs-prod-low: var(--color-naranja);
	--bs-prod-hg: var(--color-amarillo);
	--bs-billed-low: var(--color-azul-marino); 
	--bs-billed-hg: var(--color-azul-zafiro);
	--bs-total: var(--color-exito);  

	/*GRAFICA PLANT DETAILS CONSUMO VS GENERACION  */
    --gvsp-gen-low:var(--color-azul-marino);
	--gvsp-gen-hg: var(--color-azul-zafiro);
	--gvsp-prod-low: var(--color-naranja);
	--gvsp-prod-hg: var(--color-amarillo); 
	--gvsp-cons-indicator:var(--color-exito);

	/*GRAFICA PLANT DETAILS SAVINGS*/
	--pd-savings-low: var(--color-artico);
	--pd-savings-hg: var(--color-azul-zafiro);
	--pd-subER-low:var(--color-amarillo);
	--pd-subER-hg:var(--color-naranja);
	--pd-subCFE-low:var(--color-azul-zafiro);
	--pd-subCFE-hg:var(--color-azul-marino);
	--pd-woER:var(--color-error);

	/*GRAFICA MEM ECONOMIC SAVINGS*/
	--mes-subER-low: var(--color-naranja);
	--mes-subER-hg: var(--color-amarillo);
	--mes-savings-low: var(--color-azul-marino);
	--mes-savings-hg: var(--color-azul-zafiro);
	--mes-whithoutER-low: var(--error-60);
	--mes-whithoutER-hg: var(--color-error);

    /*------------------------------------------------------------------------------------------------------*/
    /*Colores para las tablas de Tabulator*/
	--text-tab-header:var(--color-azul-marino); 
	--text-tab-contrast: var(--color-naranja);
	--text-tab-primary-content: var(--color-negro);
	--text-tab-disabled:var(--gris-60);


	--tabulator-bg:var(--color-blanco);
	
		/*Colores para botones con gradiente low y hg,*/
	--btn-primary-low: var(--color-naranja);
	--btn-primary-hg: var(--color-amarillo);
    --btn-artico-low: var(--color-gris);  
    --btn-artico-hg: var(--color-artico);
    --btn-azulzafiro-low: var(--color-azul-marino);
	--btn-azulzafiro-hg: var(--color-azul-zafiro);
	--btn-success-low:var(--exito-80);
	--btn-success-hg:var(--color-exito);
	--btn-error-low:var(--error-80);
	--btn-error-hg:var(--color-error);
	--btn-cancel: var(--gris-60);
    --btn-mem-control:var(--color-artico);



	--mat-input-border:var(--color-azul-zafiro);
	--mat-input-border-focused:var(--color-naranja);
}


/*Tema oscuro no nativo del navegador*/
html.force-dark-theme {
	--primary-bg: var(--color-azul-marino);
	--sidebar-bg:var(--color-azul-marino);
	--primary-bg-icon:var(--color-naranja);
    --secondary-bg: var(--color-azul-marino);
    --card-bg: var(--color-azul-marino);
	--primary-bg-btn: var(--color-naranja);
	--secondary-bg-btn: var(--color-amarillo); 

	/*Date picker*/
    --dp-tooltip-bg:var(--color-artico);
	--dp-tooltip-text: var(--color-azul-marino);

	/*Footer Colores*/
    --text-footer-secondary:var(--color-blanco);
    --text-footer-primary: var(--color-naranja);

		/*Color de textos*/
    --text-primary: var(--color-naranja);
    --text-secondary: var(--gris-40);
	--text-contrast: var(--color-blanco);
	--text-back:#fffdfd;
	--text-secondary-contrast:var(--color-artico);
    --text-placeholder:rgba(255, 255, 255, 0.15);
    --text-placeholder-login: rgba(255, 255, 255, 0.15);
    --text-zafiro:var(--color-azul-zafiro);
    --text-neutral-black:var(--color-naranja);
	--text-error:var(--color-error);


    /*tamaño textos*/
    --text-static-title-small-size:14px;
	--text-static-title-medium-size:16px;
	--text-static-title-large-size:22px;
	--text-static-body-large-size:16px;
    --text-static-body-small-size:12px;
	--text-static-headline-small-size:24px;
    --text-static-headline-medium-size:28px;

    --border-color: var(--border-color);
    --shadow-color: rgba(0, 0, 0, 0.3);
	--text-bg-accent: var(--color-blanco);

    /*------------------------------------------------------------------------------------------------------*/

	/*Colores para graficas. algunos elementos contienen gradientes por lo que se utiliza low para parte baja y hg para parte alta del gradiente*/
	/*Home Clients Economic savings */
  --es-CFE-low: var(--color-azul-zafiro);
	--es-CFE-hg: var(--color-artico);
	--es-er-low:var(--color-naranja);
	--es-er-hg: var(--color-amarillo);
	--es-savings-low:var(--azul-marino-80);
	--es-savings-hg: var(--color-azul-zafiro);
	--es-whithouter-low:var(--error-80);
	--es-whithouter-hg: var(--color-error);

	/*Home Clients Economic Savings Historic(ESH)*/
	--esh-savings-low: var(--color-amarillo);
	--esh-savings-hg: var(--color-naranja);
	--esh-savings-indicator: var(--color-blanco);

	/*Home Clients Generacion Historica(HG)*/ 
	--hg-CFE-low:var(--color-azul-zafiro);
	--hg-CFE-hg:var(--color-azul-marino);
	--hg-ER-low:var(--color-amarillo);
	--hg-ER-hg:var(--color-naranja);
	--hg-total-indicator:var(--color-exito);

	/*Home Clients Plants Overview(PO)*/
	--po-production-low: var(--azul-marino-80);
	--po-production-hg:var(--color-azul-zafiro);
	--po-consumption-low:var(--color-naranja);
	--po-consumption-hg:var(--color-amarillo);

	/*Limites del Home Mapa*/
	--mp-limit-0000:#E0E0E0;
	--mp-limit-1500:#FFC791; 
	--mp-limit-3000:#FFA97E;
	--mp-limit-4500:#FF8D1D;
	--mp-limit-6000:#EA4E00;

	/*Limites del Home Mem Mapa*/
	--mmp-limit-0000:#E0E0E0;
	--mmp-limit-0500:#BDE8E8;
	--mmp-limit-1000:#00E5FF;
	--mmp-limit-1500:#6490E2;
	--mmp-limit-2000:#FAB700;
	--mmp-limit-2500:#F97316;
    --mmp-limit-3000:#FF0003;
	--mmp-limit-3500:#A70002;

	/*GRAFICA Daily Averge(DA) MEM */
     --mem-da-mtr-bg:rgba(20, 174, 92, 0.5);
	--mem-da-mtr-line:var(--color-exito);
	--mem-da-mda-bg:rgba(255, 85, 0, 0.5);
	--mem-da-mda-line:var(--color-naranja);
	--mem-da-nod-bg:rgba(71, 118, 150, 0.5);
	--mem-da-nod-line:var(--color-azul-zafiro);

	/*PMLS MEM CARD*/
	--text-mda: var(--color-naranja);
	--text-mtr:var(--color-exito);
	--text-no:var(--color-azul-zafiro);

		/*GRAFICA PERFORMANCE plant details*/
    --performance-estim-low:var(--color-azul-zafiro);
	--performance-estim-hg:var(--azul-marino-80);
	--performance-prod-low:var(--color-amarillo);
	--performance-prod-hg:var(--color-naranja);
	--performance-guar-line:var(--color-amarillo);
	--performance-performance-line: var(--color-exito); 

    	/*GRAFICA BILLINGS SUMMARY*/
	--bs-prod-low: var(--color-naranja);
	--bs-prod-hg: var(--color-alerta);
	--bs-billed-low: var(--color-artico); 
	--bs-billed-hg: var(--color-azul-zafiro);
	--bs-total: var(--color-exito); 

	/*GRAFICA PLANT DETAILS CONSUMO VS GENERACION  */
    --gvsp-gen-low:var(--azul-marino-80);
	--gvsp-gen-hg: var(--color-azul-zafiro);
	--gvsp-prod-low: var(--color-naranja);
	--gvsp-prod-hg: var(--color-amarillo);
    --gvsp-cons-indicator:var(--color-exito);  

	/*GRAFICA PLANT DETAILS SAVINGS*/
	--pd-savings-low: var(--color-artico);
	--pd-savings-hg: var(--color-azul-zafiro);
	--pd-subER-low:var(--color-amarillo);
	--pd-subER-hg:var(--color-naranja);
	--pd-subCFE-low:var(--color-blanco);
	--pd-subCFE-hg:var(--azul-marino-80);
	--pd-woER:var(--color-error);

	/*GRAFICA MEM ECONOMIC SAVINGS*/
	--mes-subER-low: var(--color-naranja);
	--mes-subER-hg: var(--color-amarillo);
	--mes-savings-low: var(--azul-marino-80);
	--mes-savings-hg: var(--color-azul-zafiro);
	--mes-whithoutER-low:var(--error-80);
	--mes-whithoutER-hg: var(--color-error);

	/*TABLAS DEL REPORTE MENSUAL DE MEM*/
	--text-header-rmem:var(--color-blanco);
	--header-bg-rmem:var(--color-naranja);
	
	/*EJES DE GRAFICAS*/
	--axis-line:var(--borde-base);

	/*------------------------------------------------------------------------------------------------------*/
    /*Colores para las tablas de Tabulator*/
	--text-tab-header:var(--color-artico); 
	--text-tab-contrast: var(--color-naranja);
	--text-tab-primary-content:var(--color-blanco);
	--text-tab-disabled:var(--gris-40);
    --text-title-h1:var(--color-naranja);
	--tabulator-bg:var(--color-azul-marino);

		/*Colores para botones con gradiente low y hg,*/
	--btn-primary-low: var(--color-naranja);
	--btn-primary-hg: var(--color-amarillo);
    --btn-artico-low: var(--color-artico);  
    --btn-artico-hg: var(--color-blanco);
    --btn-azulzafiro-low: var(--azul-marino-80);
	--btn-azulzafiro-hg: var(--color-azul-zafiro);
	--btn-success-low:var(--exito-80);
	--btn-success-hg:var(--color-exito);
	--btn-error-low:var(--error-80);
	--btn-error-hg:var(--color-error);
	--btn-cancel: var(--gris-40);
	--btn-mem-control:var(--azul-zafiro-40);

    --mat-input-border:var(--color-azul-zafiro);
	--mat-input-border-focused:var(--color-naranja);
}