/* Fonts */
:root {
    --font-default: "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-primary: "Roboto", sans-serif;
    --font-secondary: "Work Sans", sans-serif;
  }
  
  /* Colors */
  :root {
    --color-default: #364d59;
    --color-primary: #e22428;
    --color-secondary: #203864;
  }
  
  /* Smooth scroll behavior */
  :root {
    scroll-behavior: smooth;
  }
  
  /*--------------------------------------------------------------
  # General
  --------------------------------------------------------------*/
/* Estilos del header */
  
body {
    font-family: 'Roboto', sans-serif;
    background-color: #f8f9fa;
}

.footer {
    background-color: #343a40;
    color: white;
    text-align: center;
    padding: 20px 0;
}

.img-fluid {
    border-radius: 10px;
}

body.bg-image {
    background-image: url('../assets/img/fondo.jpg'); /* Asegúrate de que esta ruta sea correcta */
    background-size: cover; /* O prueba con 'contain' si no se muestra bien */
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh; /* Asegúrate de que esto esté definido */
    margin: 0; /* Evita márgenes por defecto */
}


/* Estilo adicional para mejorar el aspecto del login form */
.login-container {
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.7);
    padding: 30px; /* Aumentado para más espacio interno */
    border-radius: 10px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); /* Sombra sutil */
}

.card {
    border: none; /* Eliminar borde de la tarjeta si se usa la clase card */
}

/* Estilos de transición para el botón */
.btn-primary {
    transition: background-color 0.3s ease, transform 0.2s ease;
}

.btn-primary:hover {
    background-color: #0056b3; /* Color de fondo más oscuro al pasar el mouse */
    transform: scale(1.05); /* Efecto de aumento al pasar el mouse */
}
.specifications {
    margin: 20px 0;
}
.table th {
    background-color: #203864; /* Verde para la fila principal */
    color: white;
}
.table th, .table td {
    text-align: center;
}
.table tbody tr:nth-child(odd) {
    background-color: #f8f9fa; /* Gris claro para las filas impares */
}
.table tbody tr:nth-child(even) {
    background-color: #ffffff; /* Blanco para las filas pares */
}
.table .bold-header {
    font-weight: bold;
}
.table a {
    color: #007bff;
    text-decoration: none;
}
.table a:hover {
    text-decoration: underline;
}
.table td:first-child {
    font-weight: bold;
}
.card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.card-title {
    text-align: center;
}

#control-buttons {
    position: absolute;
    top: 50px;
    left: 20px;
    z-index: 100;
    display: flex;
    flex-direction: column;
}

#control-buttons button {
    margin-bottom: 5px;
}