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

html, body {
  height: 100%;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}


main { flex: 1; }

/* --- Navbar --- */

.navbar .nav-link {
  color: #fff;
  text-decoration: none;
  transition: color .2s ease, font-weight .2s ease;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus {
  color: #28a745;       
  font-weight: 600;      
}

#btn-search {
  background-color: #28a745;
  color: #fff;
  border-radius: 20px;
  padding: 8px 20px;
  border: 1px solid #28a745;
  transition: background-color .2s ease, opacity .2s ease;
  cursor: pointer;
}
#btn-search:hover { opacity: .9; }

/* Input search */
input[type="search"] {
  border-radius: 20px;
  border: 1px solid #ccc;
  padding: 8px 15px;
  transition: border-color .2s ease, box-shadow .2s ease;
}
input[type="search"]:focus {
  border-color: #673DE6;
  box-shadow: 0 0 8px rgba(103,61,230,.3);
  outline: none;
}


@media (max-width: 575.98px) {
  .site-search { display: none !important; }
  
}


@media (hover: hover) and (pointer: fine) {
  .navbar .dropdown:hover > .dropdown-menu,
  .navbar .dropdown:focus-within > .dropdown-menu {
    display: block;
    margin-top: 0;
  }
}

/* --- Footer --- */
#email {
  color: #fff;
  text-decoration: none;
  transition: color .2s ease, font-weight .2s ease;
}
#email:hover {
  color: #28a745;
  font-weight: 600;
}


footer svg { width: 80%; }


#copyr { padding-left: 50px; }

/*section*/



/* --- Responsive adjustments for mobile --- */
@media (max-width: 767px) {

  /* Oculta el email en móviles */
  #email {
    display: none;
  }

  /* Centra los íconos del footer */
  footer .col-md-8 {
    justify-content: center !important;
    align-items: center !important;
  }

  /* Centra también el copyright */
  #dvcopy {
    justify-content: center !important;
    text-align: center;
    margin-bottom: 10px;
  }

  /* Ajusta el padding del footer */
  footer .container-fluid {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  /* Reduce el tamaño de los SVG */
  footer svg {
    width: 45px !important;
    height: 45px !important;
  }

  /* Ajusta la separación entre íconos */
  footer a {
    margin: 0 8px !important;
  }
}