/* Import de la police personnalisée */
@font-face {
    font-family: 'Winter_Draw';
    src: 
        url('../fonts/winter_draw/Winter-Draw.ttf') format('truetype'),
        url('../fonts/winter_draw/Winter-Draw.otf') format('opentype');
    font-display: swap;
}

@font-face {
    font-family: 'Soul_Billani';
    src: url('../fonts/soul_billani/SoulBillani.otf') format('opentype');
    font-display: swap;
}

html {
    scroll-behavior: smooth;
}

.navbar.sticky-top {
    z-index: 1031;
    border-bottom: none !important;
}

.sticky-top.header-content {
    z-index: 1030;
    margin-top: 0 !important;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.category-anchor {
    padding-top: 280px;
    margin-top: -280px;
}

.card-link {
    transition: box-shadow .2s ease-in-out, transform .2s ease-in-out;
    cursor: default;
}

.card-link:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.categories-wrapper {
    overflow-x: auto;
    padding-bottom: 10px;
}

.categories-wrapper::-webkit-scrollbar {
    height: 6px;  
}

.categories-wrapper::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.categories-wrapper::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 3px;
}

.categories-row {
    display: flex;
    gap: 1rem;
    flex-wrap: nowrap;
}

.category-btn {
    flex: 0 0 auto;
    min-width: 120px;
    white-space: nowrap;
}

#logo-text {
    font-family: 'Winter_Draw', 'Arial', sans-serif !important;
    color: rgb(0, 0, 0) !important;
    font-size: 2.5rem !important;
    font-weight: normal !important;
    font-style: normal !important;
}

.text-font-winter-draw {
    font-family: 'Winter_Draw', 'Arial', sans-serif !important;
    font-weight: lighter !important;
    font-style: normal !important;
}

.text-font-soul-billani {
    font-family: 'Soul_Billani', 'Arial', sans-serif !important;
    font-weight: lighter !important;
    font-style: normal !important;
}

@media (min-width: 768px) {
    .header-content {
        top: 110px !important;
    }
}
@media (min-width: 992px) {
    .header-content {
        top: 110px !important;
    }
}

#basket-toggle {
  display: none !important;
}

.basket-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 1040;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  cursor: pointer;
}

#basket-toggle:checked ~ .basket-backdrop {
  opacity: 1;
  visibility: visible;
}

.basket-sidebar {
  position: fixed;
  top: 0;
  right: -100%;
  width: 100%;
  max-width: 500px;
  height: 100%;
  background-color: white;
  z-index: 1050;
  transition: right 0.3s ease;
  box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}

#basket-toggle:checked ~ .basket-sidebar {
  right: 0;
}

#basket-toggle:checked ~ body {
  overflow: hidden;
}

.basket-header {
  padding: 1.5rem;
  border-bottom: 1px solid #dee2e6;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f8f9fa;
}

.basket-content {
  flex: 1;
  padding: 1.5rem;
  overflow-y: auto;
}

/* Responsive design */
@media (min-width: 768px) {
  .basket-sidebar {
    max-width: 450px;
  }
}

@media (min-width: 992px) {
  .basket-sidebar {
    max-width: 650px;
  }
}

@media (max-width: 767px) {
  .basket-sidebar {
    width: 100vw;
    max-width: 100vw;
  }
  
  .basket-content {
    padding: 1rem;
  }
}