/*
 * Restaurant Derya — socle natif
 * Remplace Bootstrap, Bootstrap Icons, AOS, GLightbox et Swiper.
 * Conçu uniquement pour les classes réellement utilisées par le site.
 */

:root {
  color-scheme: light;
  scroll-behavior: smooth;
  --native-gutter-x: 1.5rem;
  --native-gutter-y: 0;
}

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

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  text-align: left;
}

h1,
h2,
h3,
h4 {
  margin: 0 0 .5rem;
  font-weight: 500;
  line-height: 1.2;
}

h1 { font-size: clamp(2rem, 1.375rem + 1.5vw, 2.5rem); }
h2 { font-size: clamp(1.75rem, 1.325rem + .9vw, 2rem); }
h3 { font-size: clamp(1.5rem, 1.3rem + .6vw, 1.75rem); }
h4 { font-size: clamp(1.35rem, 1.275rem + .3vw, 1.5rem); }

p {
  margin: 0 0 1rem;
}

ul {
  margin: 0 0 1rem;
  padding-left: 2rem;
}

strong { font-weight: 700; }
a { color: inherit; }
img { vertical-align: middle; }
iframe { border: 0; }
button { font: inherit; }
button:not(:disabled),
[type="button"]:not(:disabled) { cursor: pointer; }

.img-fluid {
  max-width: 100%;
  height: auto;
}

.container,
.container-fluid {
  width: 100%;
  padding-right: calc(var(--native-gutter-x) * .5);
  padding-left: calc(var(--native-gutter-x) * .5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }

.row {
  --native-gutter-x: 1.5rem;
  --native-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--native-gutter-y));
  margin-right: calc(-.5 * var(--native-gutter-x));
  margin-left: calc(-.5 * var(--native-gutter-x));
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--native-gutter-x) * .5);
  padding-left: calc(var(--native-gutter-x) * .5);
  margin-top: var(--native-gutter-y);
}

.g-0 { --native-gutter-x: 0; --native-gutter-y: 0; }
.gy-4 { --native-gutter-y: 1.5rem; }

@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }
}

@media (min-width: 992px) {
  .col-lg-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-lg-9 { flex: 0 0 auto; width: 75%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }
}

.fixed-top { position: fixed; inset: 0 0 auto; z-index: 1030; }
.position-relative { position: relative !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }
.d-none { display: none !important; }
.flex-column { flex-direction: column !important; }
.flex-shrink-0 { flex-shrink: 0 !important; }
.align-items-center,
.align-items-cente { align-items: center !important; }
.justify-content-center { justify-content: center !important; }
.justify-content-between { justify-content: space-between !important; }
.order-1 { order: 1 !important; }
.order-2 { order: 2 !important; }
.text-center { text-align: center !important; }
.fst-italic { font-style: italic !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.me-auto { margin-right: auto !important; }
.ms-4 { margin-left: 1.5rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.px-1 { padding-right: .25rem !important; padding-left: .25rem !important; }

@media (min-width: 576px) {
  .d-sm-none { display: none !important; }
}

@media (min-width: 768px) {
  .d-md-flex { display: flex !important; }
  .justify-content-md-between { justify-content: space-between !important; }
}

@media (min-width: 992px) {
  .align-items-lg-start { align-items: flex-start !important; }
  .order-lg-1 { order: 1 !important; }
  .order-lg-2 { order: 2 !important; }
  .mt-lg-0 { margin-top: 0 !important; }
  .pt-lg-0 { padding-top: 0 !important; }
}

@media (min-width: 1200px) {
  .d-xl-block { display: block !important; }
  .d-xl-none { display: none !important; }
  .me-xl-0 { margin-right: 0 !important; }
}

/* Icônes sans police externe. */
.bi {
  display: inline-grid;
  width: 1em;
  height: 1em;
  place-items: center;
  flex: 0 0 auto;
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  vertical-align: -.08em;
}

.bi::before { display: block; line-height: 1; }
.bi-arrow-up-short::before { content: "↑"; font-size: 1.45em; }
.bi-calendar-check-fill::before { content: "▣"; }
.bi-check2-all::before { content: "✓✓"; font-size: .75em; letter-spacing: -.25em; padding-right: .25em; }
.bi-check2-circle::before { content: "✓"; border: .1em solid currentColor; border-radius: 50%; font-size: .7em; width: 1.25em; height: 1.25em; display: grid; place-items: center; }
.bi-chevron-down::before { content: "⌄"; }
.bi-envelope::before { content: "✉"; }
.bi-facebook::before { content: "f"; font-family: Arial, sans-serif; }
.bi-geo-alt::before { content: "⌖"; }
.bi-instagram::before { content: "◎"; }
.bi-journal-check::before { content: "▤"; }
.bi-linkedin::before { content: "in"; font-family: Arial, sans-serif; font-size: .62em; }
.bi-list::before { content: "☰"; font-size: 1.15em; }
.bi-pencil-square::before { content: "✎"; }
.bi-phone::before,
.bi-telephone::before { content: "☎"; }
.bi-quote::before { content: "“"; font-family: Georgia, serif; font-size: 1.45em; }
.bi-sun-fill::before { content: "☀"; }
.bi-tiktok::before { content: "♪"; }
.bi-twitter-x::before { content: "X"; font-family: Arial, sans-serif; font-size: .8em; }
.bi-x-lg::before,
.bi-x::before { content: "×"; font-size: 1.25em; }

/* Animations au défilement — remplacement natif d'AOS. */
@media (prefers-reduced-motion: no-preference) {
  .native-enhanced [data-aos] {
    opacity: 0;
    transition-property: opacity, transform;
    transition-duration: 600ms;
    transition-timing-function: ease-in-out;
    will-change: opacity, transform;
  }

  .native-enhanced [data-aos="fade-up"] { transform: translate3d(0, 24px, 0); }
  .native-enhanced [data-aos="fade-in"] { transform: scale(.985); }
  .native-enhanced [data-aos].aos-animate {
    opacity: 1;
    transform: none;
    will-change: auto;
  }
}

/* Carrousels — remplacement natif de Swiper. */
.init-swiper {
  position: relative;
  overflow: hidden;
  touch-action: pan-y;
}

.init-swiper .swiper-wrapper {
  display: flex;
  align-items: stretch;
  gap: var(--native-slider-gap, 0px);
  transition: transform var(--native-slider-speed, 600ms) ease;
  will-change: transform;
}

.init-swiper .swiper-slide {
  flex: 0 0 100%;
  min-width: 0;
}

.swiper-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  padding: 0;
  border: 1px solid currentColor;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  opacity: .65;
}

.swiper-pagination-bullet-active {
  background: var(--accent-color, #cda45e);
  border-color: var(--accent-color, #cda45e);
  opacity: 1;
}

/* Filtres de la carte — remplacement natif d'Isotope. */
.isotope-item {
  transition: opacity 220ms ease, transform 220ms ease;
}

.isotope-item[hidden] {
  display: none !important;
}

.isotope-filters li[role="button"]:focus-visible {
  outline: 2px solid var(--accent-color, #cda45e);
  outline-offset: 4px;
}

/* Visionneuse — remplacement natif de GLightbox. */
.native-lightbox {
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, .92);
  color: #fff;
}

.native-lightbox::backdrop { background: rgba(0, 0, 0, .92); }
.native-lightbox[open] { display: grid; place-items: center; }

.native-lightbox__content {
  display: grid;
  width: min(1120px, calc(100vw - 96px));
  height: min(88dvh, 760px);
  place-items: center;
}

.native-lightbox__content img {
  max-width: 100%;
  max-height: 88dvh;
  object-fit: contain;
}

.native-lightbox__video {
  width: min(100%, 1120px);
  aspect-ratio: 16 / 9;
}

.native-lightbox__video iframe { width: 100%; height: 100%; }

.native-lightbox__close,
.native-lightbox__previous,
.native-lightbox__next {
  position: fixed;
  z-index: 2;
  display: grid;
  width: 46px;
  height: 46px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 50%;
  background: rgba(0, 0, 0, .45);
  color: #fff;
  font-size: 30px;
  line-height: 1;
}

.native-lightbox__close { top: 18px; right: 18px; }
.native-lightbox__previous { top: 50%; left: 18px; transform: translateY(-50%); }
.native-lightbox__next { top: 50%; right: 18px; transform: translateY(-50%); }
.native-lightbox__previous[hidden],
.native-lightbox__next[hidden] { display: none; }

@media (max-width: 575px) {
  .native-lightbox__content { width: calc(100vw - 32px); }
  .native-lightbox__previous { left: 8px; }
  .native-lightbox__next { right: 8px; }
}

@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
