/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/Other/CascadeStyleSheet.css to edit this template
*/
/* 
    Created on : 4/06/2025, 4:30:42 p. m.
    Author     : mario
*/
:root {
  --blue: #002d62;
  --indigo: #6610f2;
  --purple: #772583;
  --pink: #B092BD;
  --red: #ff0000;
  --orange: #FF6900;
  --yellow: #FFD616;
  --green: #438d42;
  --teal: #78BE21;
  --cyan: #05C3DD;
  --white: #fff;
  --gray: #858796;
  --gray-dark: #5a5c69;
  --primary: #002d62;
  --secondary: #05C3DD;
  --success: #C7D64F;
  --info: #99E1EF;
  --warning: #FFED99;
  --danger: #ff0000;
  --light: #f8f9fc;
  --dark: #5a5c69;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family-sans-serif: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",  sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* html,
body {
    height: 100%;
} */

body{
    font-family: 'Arial';
}

/* Tema claro */
body.theme-light {
  background-color: #ffffff;
  color: var(--primary);
}

/* Tema oscuro (por defecto)  */
body.theme-dark {
  background-color: var(--primary);
  color: #f8f9fa;
}

.theme-dark .card {
  background-color: var(--primary);
  color: #f8f9fa;
}

.theme-dark .modal-content {
  background-color: var(--primary);
  color: #f8f9fa;
}

.theme-light .border-custom-theme {
  color: var(--primary);
  border: 1px solid var(--primary) !important;
}

.theme-dark .border-custom-theme {
  color: var(--white);
  border: 1px solid var(--white) !important;
}

.theme-light .bg-h3-theme {
  background: var(--primary) !important;
  color: var(--white);
}

.theme-dark .bg-h3-theme {
  background: var(--white) !important;
  color: var(--primary);
}


.form-signin {
    max-width: 330px;
    padding: 1rem;
}

.form-signin .form-floating:focus-within {
    z-index: 2;
}

.form-signin input[type="email"] {
    margin-bottom: -1px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.form-signin input[type="password"] {
    margin-bottom: 10px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.theme-dark .circle-background {
    width: 100%;
    height: 100%;
    background-image: url("../img/background-veolia-cut.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position:center;
    pointer-events:none; 
    background-color: transparent;
    z-index:-1;
    opacity:0.2;
}

.theme-light .circle-background {
    width: 100%;
    height: 100%;
    background-image: url("../img/background-veolia-azul.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position:center;
    pointer-events:none; 
    background-color: transparent;
    z-index:-1;
    opacity:0.2;
}


.rounded-custom{
    /* border-top-left-radius: 1rem;
    border-bottom-right-radius: 1rem; */
    border-radius: 1rem;
}


.theme-light .bg-primary {
    background-color: var(--white) !important;
}

.theme-dark .bg-primary {
    background-color: var(--primary) !important;
}

/* Sobre escribe clases de Bootstrap */
.bg-secondary {
    background-color: var(--secondary) !important;
}
.bg-success {
    background-color: var(--success) !important;
}
.bg-info {
    background-color: var(--info) !important;
}
.bg-warning {
    background-color: var(--warning) !important;
}
.bg-danger {
    background-color: var(--danger) !important;        
}
.bg-light {
    background-color: var(--light) !important;
}
.bg-dark {
    background-color: var(--dark) !important;
}  

.theme-light .text-primary {
    color: var(--primary) !important;
}

.theme-dark .text-primary {
    color: var(--white) !important;
}

.text-primary {
    color: var(--primary) !important;
}

.text-secondary {
    color: var(--secondary) !important;
}

.text-success {
    color: var(--success) !important;
}

.text-info {            
    color: var(--info) !important;
}

.text-warning {
    color: var(--warning) !important;
}

.text-danger {
    color: var(--danger) !important;
}

.text-light {
    color: var(--light) !important;
}

.text-dark {
    color: var(--dark) !important;
}

.theme-light .btn-custom-theme {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
    color: var(--white);
}

.theme-dark .btn-custom-theme {
    background-color: var(--white) !important;
    border-color: var(--white) !important;  
}

.btn-primary {
    background-color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-secondary {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
}

.btn-success {
    background-color: var(--success) !important;                
    border-color: var(--success) !important;
}

.btn-info {
    background-color: var(--info) !important;
    border-color: var(--info) !important;
}

.btn-warning {
    background-color: var(--warning) !important;        
    border-color: var(--warning) !important;
}

.btn-danger {
    background-color: var(--danger) !important;
    border-color: var(--danger) !important;
}

.btn-light {
    background-color: var(--light) !important;
    border-color: var(--light) !important;
}

.btn-dark {
    background-color: var(--dark) !important;
    border-color: var(--dark) !important;
}

.btn-outline-primary {
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

.btn-outline-secondary {
    color: var(--secondary) !important;
    border-color: var(--secondary) !important;
}

.btn-outline-success {
    color: var(--success) !important;
    border-color: var(--success) !important;
}

.btn-outline-info {
    color: var(--info) !important;
    border-color: var(--info) !important;
}

.btn-outline-warning {
    color: var(--warning) !important;
    border-color: var(--warning) !important;
}

.btn-outline-danger {
    color: var(--danger) !important;
    border-color: var(--danger) !important;
}

.theme-light .link-custom {
    color: var(--secondary) !important;
}

.theme-dark .link-custom {
    color: var(--white) !important;
}

.theme-light .link-primary {
    color: var(--primary) !important;
}

.theme-dark .link-primary {
    color: var(--white) !important;
}



.link-primary {
    color: var(--primary) !important;
}
.link-secondary {
    color: var(--secondary) !important;
}
.link-success {
    color: var(--success) !important;
}
.link-info {
    color: var(--info) !important;
}
.link-warning {
    color: var(--warning) !important;
}

/* Responsivo */
@media (max-width: 768px) {
  /* Estilos para pantallas con ancho máximo de 768px (por ejemplo, tablets) */
    .theme-dark .circle-background, .theme-light .circle-background {
        background-position: center;
        background-size: cover;
    }
}

@media (min-width: 768px) {
  /* Estilos para pantallas con ancho mínimo de 768px (por ejemplo, desktops) */
    .theme-dark .bg-md-transparent, .theme-light .bg-md-transparent  {
        background-color: transparent !important;
    }
}