@import "https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css";

.header-image {
  background-image: url("img/fond-canada-quebec-lac-des-truites.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.is-dark-blue {
  background-color: #041d75;
}

.is-svg-link {
  color: #041d75;
  filter: invert(5%) sepia(84%) saturate(6330%) hue-rotate(231deg) brightness(113%) contrast(97%);
}

.is-svg-warning {
  color: #ffe08a;
  filter: invert(83%) sepia(50%) saturate(402%) hue-rotate(339deg) brightness(103%) contrast(103%);
}

.has-bullets {
  list-style: initial;
  list-style-type: disc;
  padding: 1rem;
}

.header-dunes {
  background-image: url("img/dunes-maroc.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.header-claire {
  background-image: url("img/bckgrnd.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}
.header-spring {
  background-image: url("img/header-osteo.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.header-lac-matin {
  background-image: url("img/lac-truites-matin.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

.header-lac-soir {
  background-image: url("img/lac-truites-soir.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

/* Custom color palette 4 Claire */
:root {
  --black-olive: #2A2C24;
  --ebony: #585B4C;
  --cinerous: #826D62;
  --rose-quartz: #AA9D9F;
  --lavender: #D2D2EB;
}

/* Text color utilities */
.has-text-black-olive { color: var(--black-olive) !important; }
.has-text-ebony       { color: var(--ebony) !important; }
.has-text-cinerous    { color: var(--cinerous) !important; }
.has-text-rose-quartz { color: var(--rose-quartz) !important; }
.has-text-lavender    { color: var(--lavender) !important; }

/* Background color utilities */
.has-background-black-olive { background-color: var(--black-olive) !important; }
.has-background-ebony       { background-color: var(--ebony) !important; }
.has-background-cinerous    { background-color: var(--cinerous) !important; }
.has-background-rose-quartz { background-color: var(--rose-quartz) !important; }
.has-background-lavender    { background-color: var(--lavender) !important; }

/* Support pour SVG inline : utilisez fill:currentColor pour que la couleur suive la couleur du texte */
.is-svg-inline svg {
  display: block;
  fill: currentColor;
  display: inline-block;
}

/* Optional contrast helpers (use when placing text on these backgrounds) */
.has-text-on-black-olive { color: #ffffff !important; }
.has-text-on-ebony       { color: #ffffff !important; }
.has-text-on-cinerous    { color: #ffffff !important; }
.has-text-on-rose-quartz { color: #000000 !important; }
.has-text-on-lavender    { color: #000000 !important; }