/* Cookie consent (js/consent.js) and legal links -> loaded by every page (after custom.css) and by the legal pages. Adapted from the
   Fontannaz Consulting project (sass/components/_consent.scss), in the colors and fonts of this website (theme navy #00205b, red #e7194f,
   Open Sans / Encode Sans served from this website) and in px (the root font size of this website is 16px, not 10px) */

/* Banner: fixed at the bottom of the window, above everything (header bar, mobile menu, "scroll to top" button) */
.consent-banner {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100000;
  padding: 20px;
  background-color: rgba(0, 32, 91, 0.97); /* theme navy #00205b */
  color: #f2f2f2;
  font-family: "Open Sans", sans-serif;
  font-size: 15px;
  line-height: 1.5;
  box-shadow: 0 -5px 30px rgba(0, 0, 0, 0.35);
}

.consent-banner__inner {
  max-width: 1100px;
  margin: 0 auto;
}

.consent-banner__title {
  margin: 0 0 8px 0;
  font-family: "Encode Sans", sans-serif;
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
  color: #ffffff;
}

.consent-banner__intro {
  margin: 0 0 10px 0;
}

.consent-banner__details {
  margin: 0 0 10px 0;
}

.consent-banner__details[hidden] {
  display: none;
}

.consent-banner__option {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-bottom: 6px;
  cursor: pointer;
}

/* checkbox at its natural size (form styles of the theme could give inputs a 100% width) */
.consent-banner__option input {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  margin: 4px 0 0 0;
  padding: 0;
}

/* the text takes all the remaining width */
.consent-banner__option span {
  flex: 1 1 auto;
  min-width: 0;
}

.consent-banner__links {
  margin: 0 0 12px 0;
  font-size: 13px;
}

.consent-banner__links a {
  color: #cfd8dc;
  text-decoration: underline;
}

.consent-banner__links a:hover,
.consent-banner__links a:focus-visible {
  color: #ffffff;
}

.consent-banner__buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.consent-banner__button[hidden] {
  display: none;
}

/* "Tout accepter" and "Tout refuser" equally visible (no nudging: GDPR / CNIL / PFPDT guidance); #page-independent selectors with
   "button" so that the theme button styles (red background) do not apply */
button.consent-banner__button {
  padding: 9px 20px;
  border: 1px solid #f2f2f2;
  border-radius: 30px;
  background-color: transparent;
  color: #f2f2f2;
  font-family: "Open Sans", sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  cursor: pointer;
  box-shadow: none;
}

button.consent-banner__button:hover,
button.consent-banner__button:focus-visible {
  background-color: #f2f2f2;
  border-color: #f2f2f2;
  color: #00205b;
}

/* phones: buttons on full width, one per line */
@media (max-width: 480px) {
  .consent-banner {
    padding: 15px;
    font-size: 13.5px;
  }

  .consent-banner__buttons {
    flex-direction: column-reverse;
  }

  button.consent-banner__button {
    width: 100%;
  }
}

/* phones held sideways (short screens): the banner scrolls inside itself instead of covering the whole screen */
@media (orientation: landscape) and (max-height: 500px) {
  .consent-banner {
    max-height: 70vh;
    overflow-y: auto;
    padding: 12px 20px;
    font-size: 13px;
  }
}

/* Footer: the cookie icon after the Instagram and Facebook icons (footer social icons of the theme) reopens the cookie
   banner; the same size, spacing and color as them (same classes) */
.ast-builder-social-element.scuderi-cookie-settings {
  cursor: pointer;
}

/* "Vos choix de confidentialité" link (footer menu item and legal pages footer): United States visitors only (US state privacy laws);
   hidden elsewhere, its own display kept when shown */
:root:not(.consent-region-us) .footer-legal__us,
:root:not(.consent-region-us) #astra-footer-menu .footer-legal__us { /* the footer menu items of the theme: "#astra-footer-menu .menu-item" (display flex) */
  display: none;
}

/* Footer of the website: the legal pages links on their own line, between the footer menu and the copyright line (inside the copyright
   block of the below footer row), centered like it, smaller than the menu links */
.scuderi-footer-legal {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 20px;
  margin: 0 0 10px 0;
  font-size: 14px;
  line-height: 1.6;
}

.site-footer .scuderi-footer-legal a {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
}

.site-footer .scuderi-footer-legal a:hover,
.site-footer .scuderi-footer-legal a:focus-visible {
  color: #ffffff;
  text-decoration: underline;
}
