/**
 * Dioqa Core - CSS Principal
 * Import de tous les fichiers CSS du thème
 *
 * Bootstrap 5.3 est chargé en premier (via enqueue.php).
 * Ce fichier ne contient QUE les styles custom qui n'existent pas dans Bootstrap.
 *
 * @package Dioqa_Core
 */

/* Core CSS - Variables et utilities custom */
@import url('core/variables.css');
@import url('core/typography.css');
@import url('core/utilities.css');

/* Components */
@import url('components/back-to-top.css');
@import url('components/accessibility.css');

/* Note : Header et Footer sont stylisés dans les thèmes enfants */
/* Note : Les sections du page builder sont dans les thèmes enfants modèles */
/* Chaque modèle (corporate, vitrine, etc.) a ses propres styles de header/footer/sections */

/* Animations et utilitaires */
.fade-in-on-scroll {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in-on-scroll.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.slide-in-on-scroll {
  opacity: 0;
  transform: translateX(-50px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.slide-in-on-scroll.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* Lightbox */
.lightbox-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.9);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.lightbox-overlay.is-open {
  opacity: 1;
}

.lightbox-content {
  position: relative;
  max-width: 90%;
  max-height: 90vh;
}

.lightbox-content img {
  max-width: 100%;
  max-height: 90vh;
  object-fit: contain;
}

.lightbox-close {
  position: absolute;
  top: -40px;
  right: -40px;
  background: transparent;
  border: none;
  color: white;
  font-size: 40px;
  cursor: pointer;
  padding: 0;
  width: 40px;
  height: 40px;
  line-height: 1;
}

/* Focus visible pour accessibilité */
body.user-is-tabbing *:focus {
  outline: 3px solid var(--bs-primary);
  outline-offset: 2px;
}