body {
            background-color: #f4f8fb;
            color: #003366;
        }

        .navbar {
            background-color: #0059b3;
        }

        .navbar-brand {
            font-weight: bold;
        }

        .navbar-nav .nav-link {
            color: white !important;
        }

        .navbar-nav .nav-link:hover {
            text-decoration: underline;
        }

        /* Tarjetas de noticias */
        .card {
            border: none;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
            margin-bottom: 20px;
            transition: transform 0.3s ease-in-out;
        }

        .card:hover {
            transform: translateY(-10px);
        }

        .card-img-top {
            object-fit: cover;
            height: 250px;
        }

        footer {
            background-color: #003366;
            color: white;
            text-align: center;
            padding: 20px 0;
            margin-top: 40px;
        }
        table,td { 
            border: 1px solid black;
            padding: 10px 10px;      
        }
        th { 
            border: 1px solid black;
            text-align: center;
            color: black;
            font-weight: bold;
            background-color: #cbcccc;
            padding: 15px 0;       }
   /* Fondo del popup */
    #popupOverlay {
      display: none;
      position: fixed;
      top: 0; left: 0;
      width: 100%; height: 100%;
      background-color: rgba(0,0,0,0.6);
      justify-content: center;
      align-items: center;
      z-index: 9999;
    }
    /* Caja del popup */
    #popupBox {
       color: #aedfee;  
      background: rgb(0, 0, 0);
      padding: 25px;
      border-radius: 12px;
      text-align: center;
      box-shadow: 0 4px 15px rgba(0,0,0,0.3);
      max-width: 350px;
    }
    #popupBox a {
      display: inline-block;
      margin-top: 10px;
      color: #9aa5b0;
      text-decoration: none;
      font-weight: bold;
    }
    #popupBox a:hover {
      text-decoration: underline;
    }
    button {
      margin-top: 15px;
      padding: 8px 16px;
      border: none;
      background-color: #007BFF;
      color: white;
      border-radius: 6px;
      cursor: pointer;
    }
    button:hover {
      background-color: #0056b3;
    }
  body.high-contrast {
    background-color: #000000 !important;
    color: #ffffff !important;
}

body.high-contrast header,
body.high-contrast footer,
body.high-contrast .navbar {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* Enlaces */
body.high-contrast a {
    color: #00ffff !important;
    text-decoration: underline;
}

/* Títulos */
body.high-contrast h1,
body.high-contrast h2,
body.high-contrast h3,
body.high-contrast h4,
body.high-contrast h5,
body.high-contrast h6 {
    color: #ffffff !important;
}

/* Tarjetas */
body.high-contrast .card {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff;
    box-shadow: none;
}

/* Tablas */
body.high-contrast table,
body.high-contrast th,
body.high-contrast td {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}

/* Botones */
body.high-contrast button,
body.high-contrast .btn {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #ffffff !important;
}

/* Inputs */
body.high-contrast input,
body.high-contrast textarea,
body.high-contrast select {
    background-color: #000000 !important;
    color: #ffffff !important;
    border: 2px solid #ffffff !important;
}

/* Imágenes con fondo claro */
body.high-contrast img {
    filter: brightness(1.1) contrast(1.2);
}    

#contrastToggle {
    font-weight: bold;
    border-width: 2px;
}

/* Botón en modo normal */
body:not(.high-contrast) #contrastToggle {
    background-color: #ffffff;
    color: #003366;
    border: 2px solid #003366;
}

/* Botón cuando el alto contraste está activo */
body.high-contrast #contrastToggle {
    background-color: #ffff00; /* amarillo accesible */
    color: #000000;
    border: 3px solid #ffffff;
}

html {
    font-size: 100%; /* 16px base */
}

body {
    font-size: 1rem;
    line-height: 1.6;
}

/* Asegurar legibilidad de títulos */
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1.1rem; }
h6 { font-size: 1rem; }

/* Botones de accesibilidad */
#increaseFont,
#decreaseFont,
#resetFont {
    font-weight: bold;
}
.navbar .nav-link:focus,
.navbar .nav-link:focus-visible {
    outline: 3px solid #FFD200;      /* contorno visible */
    outline-offset: 3px;
    background-color: #000000;       /* fondo visible */
    color: #ffffff;                  /* texto con alto contraste */
    text-decoration: underline;
}

/* Para todos los enlaces del sitio (recomendado) */
a:focus,
a:focus-visible,
button:focus,
button:focus-visible {
    outline: 3px solid #FFD200;
    outline-offset: 3px;
}
a {
  color: #080486; /* Oscruro para mayor contraste*/
  
}
.card-header {
            background-color: #0d6efd;
            color: #ffffff;
        }

        iframe {
            border: 0;
        }

        /* Enfoque visible WCAG 2.1 */
        iframe:focus-visible {
            outline: 4px solid #ffbf47;
            outline-offset: 4px;
        }