/**
 * File: pipnhub.css
 * Theme: PIP'N'HUB
 * Description: Fichier principal - Imports système design simplifié
 * Author: krafsht
 * Version: 0.0.7-simplified
 */

/* ========== SYSTÈME DE DESIGN (NOUVEAU) ========== */
@import url('variables.css');  /* ⚙️ Point central customisation */
@import url('reset.css');
@import url('base.css');
@import url('layout.css');
@import url('components.css');
@import url('utilities.css');
@import url('article.css');
@import url('loading.css');
@import url('header.css');

/* ========== LEGACY CODE (COMPATIBILITÉ) ========== */

/* Font faces */
@font-face {
  font-family: 'FugazOne';
  src: url('../font/fugazone-regular.woff2') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto Condensed';
  src: url('../font/roboto-condensed-regular.woff2') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* Classes legacy préservées */
p.imgtext {
  text-align: center;
  line-height: 1.3;
  padding: 4px;
  font-size: 14px;
}

.Highlight {
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.header-content {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
    padding: var(--space-sm) 10px; /* au lieu de 0 10px */
}

.header-center {
  text-align: center;
  flex: 1;
  order: 2;
}

.header-center .custom-logo {
  max-height: 120px;
  width: auto;
  display: inline-block;
}

.burger-menu {
  position: absolute;
  left: 10px;
  order: 1;
  cursor: pointer;
}

.header-right {
  position: absolute;
  right: 10px;
  order: 3;
}

#sch-button {
  cursor: pointer;
  background: none;
  border: none;
  font-size: 1.2em;
  color: var(--color-text);
  padding: 8px;
  transition: var(--transition);
}

#sch-button:hover {
  color: var(--color-secondary);
}

.header-menu,
.search-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  display: none;
}

.header-menu.open,
.search-container.open {
  display: block;
}

@media (min-width: 768px) {
  .burger-menu {
    display: none;
  }
  
  .header-menu {
    display: block !important;
  }
}