:root {
  --font-heading: "Playfair Display", serif;
  --font-body: "Merriweather", serif;

  --color-background: #faf0e6;
  --color-text: #333333;
  --color-titles: #b3001b;
  --color-button: #14532d;
  --color-button-hover: #2a7347;
  --color-accent: #e5aa5c;
  --color-accent-hover: #d49445;
}

* {
  transition: opacity 0.2s ease, transform 0.2s ease !important;
}

body {
  background-color: var(--color-background);
  color: var(--color-text);
}

h1,
h2,
h3 {
  color: var(--color-titles);
}

p {
  text-align: left !important;
}

.bold {
  font-weight: bold;
}

.color-accent {
  color: var(--color-button-hover) !important;
}

.button {
  background-color: var(--color-button);
  color: white !important;
  cursor: pointer;
}

.button:hover,
.button:focus,
.button:active {
  background-color: var(--color-button-hover);
  color: white !important;
  box-shadow: none;
}

.logo-completo {
  max-width: 40%;
  margin: 2rem;
}

/* VIDEO DE YOUTUBE */
.video-vertical {
  display: inline-block;
  width: 560px;
  border-radius: 0.75rem; /* opcional, combina con el estilo de tu web */
}

.center {
  display: inline-block;
}

/* Grid of products */
#products {
  color: var(--color-text);
}

#img-products img {
  width: 100%;
  border-radius: 15px;
}

#button-reservation {
  background-color: var(--color-accent);
  color: var(--color-text) !important;
}

#button-reservation:hover,
#button-reservation:focus,
#button-reservation:active {
  background-color: var(--color-accent-hover);
  box-shadow: none;
}

/* Footer */

/* Instagram Icon */
.icons li a.fa-instagram:hover::before,
.icons li a.fa-instagram:focus::before,
.icons li a.fa-instagram:active::before {
  color: white;
  background-color: #c13584;
  box-shadow: none;
}

/* Facebook Icon */
.icons li a.fa-facebook-f:hover::before,
.icons li a.fa-facebook-f:focus::before,
.icons li a.fa-facebook-f:active::before {
  color: white;
  background-color: #3b5998;
  box-shadow: none;
}

/* YouTube Icon */
.icons li a.fa-youtube:hover::before,
.icons li a.fa-youtube:focus::before,
.icons li a.fa-youtube:active::before {
  color: white;
  background-color: #ff0000;
  box-shadow: none;
}

/* Email Icon */
.icons li a.fa-envelope:hover::before,
.icons li a.fa-envelope:focus::before,
.icons li a.fa-envelope:active::before {
  color: white;
  background-color: #14532d;
  box-shadow: none;
}

/* Legal terms */
.legal-terms {
  display: inline-block;
}

.legal-terms:hover,
.legal-terms:focus,
.legal-terms:active {
  color: var(--color-text);
}