/*
Theme Name: Libreville Fashion Council
Theme URI: https://libreville-fashion-show.higgsfield.app
Author: Libreville Fashion Council
Description: Thème sur mesure de l'association Libreville Fashion Council : calendrier mode, événements, actualités, annuaire des membres. Aucun constructeur de pages requis.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lfs
*/

/* =========================================================
   1. Base (équivalent du « preflight » Tailwind v4 de la maquette)
   ========================================================= */
@layer base, utilities;
@layer base {
*, ::after, ::before, ::backdrop { box-sizing: border-box; margin: 0; padding: 0; border: 0 solid; border-color: var(--lfs-line); }
html { line-height: 1.5; -webkit-text-size-adjust: 100%; tab-size: 4; -webkit-tap-highlight-color: transparent; }
body { line-height: inherit; }
hr { height: 0; color: inherit; border-top-width: 1px; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: bolder; }
small { font-size: 80%; }
table { text-indent: 0; border-color: inherit; border-collapse: collapse; }
ol, ul, menu { list-style: none; }
img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; border-radius: 0; background-color: transparent; opacity: 1; }
::placeholder { opacity: 1; color: color-mix(in oklab, currentcolor 50%, transparent); }
textarea { resize: vertical; }
button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { appearance: button; }
[hidden]:where(:not([hidden="until-found"])) { display: none !important; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; }
.screen-reader-text:focus { clip: auto; clip-path: none; height: auto; width: auto; z-index: 100; background: #fff; padding: .75rem 1rem; top: .5rem; left: .5rem; }
}

/* =========================================================
   2. Couche de marque LFC (copie conforme de app/src/styles.css)
   ========================================================= */
/* ===== Libreville Fashion Council brand layer ===== */
:root {
  /* Charte graphique LFC : Black C #2D2926 et Cloud Dancer #F0F2EB. */
  --lfs-paper: #f0f2eb;
  --lfs-ink: #2d2926;
  --lfs-stone: #e6e8e0;
  --lfs-mist: #8a8a85;
  --lfs-line: #d8dad2;
  /* Couleur d'accent : Black C, comme le texte (la charte n'a pas de couleur vive). */
  --lfs-forest: #2d2926;
  --lfs-ink-soft: #4a4541;
  /* Texte courant : Arial Nova. Logo et titres : Felix Titling. (Repli si la police n'est pas installée.) */
  --lfs-font: "Arial Nova", Arial, "Helvetica Neue", Helvetica, sans-serif;
  --lfs-font-title: "Felix Titling", "Cinzel", "Times New Roman", serif;
}
.lfs-title { font-family: var(--lfs-font-title); font-weight: 400; }
html { scroll-behavior: smooth; }
body.lfs { background: var(--lfs-paper); color: var(--lfs-ink); font-family: var(--lfs-font); -webkit-font-smoothing: antialiased; color-scheme: light; }
.lfs a { color: inherit; }
.lfs-label { font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 500; }
/* Titres en Felix Titling (capitales de titrage) : approche légèrement ouverte au lieu de resserrée. */
.lfs-h1 { font-family: var(--lfs-font-title); font-weight: 400; letter-spacing: 0.01em; line-height: 1.02; font-size: clamp(2.3rem, 6vw, 5.6rem); }
.lfs-h2 { font-family: var(--lfs-font-title); font-weight: 400; letter-spacing: 0.01em; line-height: 1.08; font-size: clamp(1.8rem, 3.8vw, 3.2rem); }
.lfs-h3 { font-weight: 400; letter-spacing: -0.01em; line-height: 1.2; font-size: 1.25rem; }
.lfs-wrap { width: 100%; max-width: 1440px; margin: 0 auto; padding-left: clamp(16px, 3vw, 48px); padding-right: clamp(16px, 3vw, 48px); }
.lfs-link { position: relative; display: inline-block; padding-bottom: 2px; font-weight: 500; }
.lfs-link::after { content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; background: currentColor; transform: scaleX(0.35); transform-origin: left; transition: transform .35s ease; }
.lfs-link:hover::after { transform: scaleX(1); }
.lfs-pill { display: inline-flex; align-items: center; gap: .5rem; border-radius: 999px; padding: .8rem 1.5rem; background: var(--lfs-ink); color: var(--lfs-paper); font-size: 13px; font-weight: 500; letter-spacing: .02em; transition: background .25s ease, transform .25s ease; }
.lfs-pill:hover { background: var(--lfs-ink-soft); transform: translateY(-1px); }
.lfs-pill-outline { display: inline-flex; align-items: center; border-radius: 999px; padding: .45rem 1rem; border: 1px solid var(--lfs-ink); font-size: 12px; font-weight: 500; transition: background .2s, color .2s; }
.lfs-pill-outline:hover { background: var(--lfs-ink); color: var(--lfs-paper); }
.lfs-img { overflow: hidden; background: var(--lfs-stone); }
.lfs-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.lfs-img:hover img { transform: scale(1.04); }
.lfs-rail { display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .5rem; scrollbar-width: none; }
.lfs-rail::-webkit-scrollbar { display: none; }
.lfs-rail > * { scroll-snap-align: start; flex: 0 0 min(72vw, 300px); }
.lfs-marquee { display: flex; overflow: hidden; gap: 1rem; }
.lfs-marquee-track { display: flex; gap: 1rem; flex-shrink: 0; animation: lfs-marquee 55s linear infinite; }
.lfs-marquee-track.reverse { animation-direction: reverse; }
@keyframes lfs-marquee { from { transform: translateX(0); } to { transform: translateX(calc(-100% - 1rem)); } }
.lfs-rise { animation: lfs-rise .9s cubic-bezier(.2,.7,.2,1) both; }
.lfs-rise.d1 { animation-delay: .12s; } .lfs-rise.d2 { animation-delay: .24s; } .lfs-rise.d3 { animation-delay: .36s; }
@keyframes lfs-rise { from { transform: translateY(18px); } to { transform: translateY(0); } }
.lfs-input { width: 100%; border: 0; border-bottom: 1px solid var(--lfs-ink); background: transparent; padding: .8rem 0; font-size: 1rem; outline: none; }
.lfs-input::placeholder { color: var(--lfs-mist); }
.lfs-daytab { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 84px; padding: .7rem .5rem; border: 1px solid var(--lfs-ink); background: var(--lfs-paper); color: var(--lfs-ink); transition: background .2s, color .2s; cursor: pointer; }
.lfs-daytab:hover { background: var(--lfs-stone); }
.lfs-daytab.active { background: var(--lfs-ink); color: var(--lfs-paper); }
.lfs-daytab .n { font-family: var(--lfs-font-title); font-size: 2rem; font-weight: 400; line-height: 1; }
.lfs-row { display: grid; grid-template-columns: 70px 1fr auto; gap: 1rem; align-items: center; padding: 1.1rem 0; border-top: 1px solid var(--lfs-line); cursor: pointer; transition: background .2s; }
.lfs-row:hover { background: var(--lfs-stone); }
@media (min-width: 900px) { .lfs-row { grid-template-columns: 80px 1.4fr 130px 1.2fr auto; } }
.lfs-chip { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding: .3rem .55rem; border: 1px solid var(--lfs-line); white-space: nowrap; }
.lfs-filter { appearance: none; border: 1px solid var(--lfs-ink); background: var(--lfs-paper); padding: .55rem 2rem .55rem .9rem; font-size: 13px; border-radius: 999px; }
.lfs-seg { display: inline-flex; border: 1px solid var(--lfs-ink); border-radius: 999px; overflow: hidden; }
.lfs-seg button { padding: .5rem 1rem; font-size: 12px; font-weight: 500; }
.lfs-seg button.on { background: var(--lfs-ink); color: var(--lfs-paper); }
.lfs-month { display: grid; grid-template-columns: repeat(7, 1fr); border-left: 1px solid var(--lfs-line); border-top: 1px solid var(--lfs-line); }
.lfs-month > div { border-right: 1px solid var(--lfs-line); border-bottom: 1px solid var(--lfs-line); min-height: 86px; padding: .5rem; font-size: 13px; position: relative; }
.lfs-month > div.has { cursor: pointer; } .lfs-month > div.has:hover { background: var(--lfs-stone); }
.lfs-month > div.sel { background: var(--lfs-ink); color: var(--lfs-paper); }
.lfs-dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--lfs-forest); margin-right: 3px; }
.lfs-modal { position: fixed; inset: 0; z-index: 60; background: rgba(45,41,38,.55); display: flex; align-items: flex-end; justify-content: center; }
@media (min-width: 900px) { .lfs-modal { align-items: center; } }
.lfs-modal-card { background: var(--lfs-paper); width: 100%; max-width: 920px; max-height: 92vh; overflow: auto; display: grid; grid-template-columns: 1fr; }
@media (min-width: 900px) { .lfs-modal-card { grid-template-columns: 1fr 1fr; } }
.lfs-menu { position: fixed; inset: 0; z-index: 50; background: var(--lfs-ink); color: var(--lfs-paper); display: flex; flex-direction: column; padding: 1.5rem; }
.lfs-sticky { position: sticky; top: 64px; z-index: 20; background: var(--lfs-paper); }
@media (prefers-reduced-motion: reduce) {
  .lfs-marquee-track { animation: none; }
  .lfs-rise { animation: none; }
  .lfs-img img { transition: none; }
  html { scroll-behavior: auto; }
}

/* Compléments propres au thème WordPress (aucun effet visuel sur la maquette) */
/* Menu burger (mobile/tablette, sous 1024 px) : texte noir sur fond blanc opaque. */
@media (max-width: 1023px) {
  .lfs-menu { background: var(--lfs-paper); color: var(--lfs-ink); }
}
/* Connecté : le menu ouvert passe au-dessus de la barre d'administration WordPress. */
body.admin-bar .lfs-menu { z-index: 100000; }
body.admin-bar .lfs-sticky { top: calc(64px + var(--wp-admin--admin-bar--height, 32px)); }
.lfs-header { background: rgba(240,242,235,.92); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-color: var(--lfs-line); }
/* Page en cours : soulignement complet (l'accent étant noir, la couleur ne suffit plus). */
.lfs-header a[aria-current="page"]::after { transform: scaleX(1); }
.lfs-notice { border: 1px solid var(--lfs-forest); color: var(--lfs-forest); padding: .8rem 1rem; font-size: 14px; }
.lfs-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.lfs-prose > * + * { margin-top: 1.1em; }
.lfs-prose { font-size: 17px; line-height: 1.7; color: #222; }
.lfs-prose h2 { font-family: var(--lfs-font-title); font-weight: 400; letter-spacing: 0.01em; line-height: 1.1; font-size: 2rem; margin-top: 1.6em; }
.lfs-prose h3 { font-size: 1.35rem; margin-top: 1.4em; }
.lfs-prose a { text-decoration: underline; text-underline-offset: 3px; }
.lfs-prose ul { list-style: disc; padding-left: 1.2em; }
.lfs-prose ol { list-style: decimal; padding-left: 1.2em; }
.lfs-prose blockquote { border-left: 2px solid var(--lfs-forest); padding-left: 1.2em; font-size: 1.25rem; font-weight: 300; }
.lfs-prose img { height: auto; }
.lfs-prose figcaption { font-size: 13px; color: var(--lfs-mist); margin-top: .5rem; }
.lfs-pagination { display: flex; gap: .5rem; flex-wrap: wrap; }
.lfs-pagination .page-numbers { display: inline-flex; align-items: center; border-radius: 999px; padding: .45rem 1rem; border: 1px solid var(--lfs-ink); font-size: 12px; font-weight: 500; }
.lfs-pagination .page-numbers.current { background: var(--lfs-ink); color: var(--lfs-paper); }
.lfs-credit { display: inline-block; margin-top: .35rem; color: #bdbdb8; }
.lfs-partner-logo { height: 28px; width: auto; filter: grayscale(1); opacity: .7; }

/* =========================================================
   3. Utilitaires (mêmes noms et valeurs que Tailwind v4 dans la maquette)
      sm = 640px · md = 768px · lg = 1024px
   ========================================================= */
@layer utilities {
.absolute { position: absolute; } .sticky { position: sticky; } .relative { position: relative; }
.top-0 { top: 0; } .left-1\/2 { left: 50%; } .z-40 { z-index: 40; }
.-translate-x-1\/2 { translate: -50% 0; }
.translate-y-6 { translate: 0 1.5rem; }
.block { display: block; } .inline-block { display: inline-block; } .inline-flex { display: inline-flex; } .flex { display: flex; } .grid { display: grid; } .hidden { display: none; }
.flex-col { flex-direction: column; } .flex-wrap { flex-wrap: wrap; } .shrink-0 { flex-shrink: 0; }
.items-baseline { align-items: baseline; } .items-center { align-items: center; } .items-end { align-items: flex-end; } .items-start { align-items: flex-start; }
.justify-between { justify-content: space-between; } .justify-self-end { justify-self: end; } .justify-self-start { justify-self: start; }
.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.col-span-3 { grid-column: span 3 / span 3; } .col-span-full { grid-column: 1 / -1; }
.gap-1 { gap: .25rem; } .gap-2 { gap: .5rem; } .gap-3 { gap: .75rem; } .gap-4 { gap: 1rem; } .gap-5 { gap: 1.25rem; } .gap-6 { gap: 1.5rem; } .gap-8 { gap: 2rem; } .gap-10 { gap: 2.5rem; } .gap-12 { gap: 3rem; }
.gap-x-6 { column-gap: 1.5rem; } .gap-x-8 { column-gap: 2rem; } .gap-y-12 { row-gap: 3rem; } .gap-y-14 { row-gap: 3.5rem; }
.space-y-2 > :not(:last-child) { margin-bottom: .5rem; } .space-y-3 > :not(:last-child) { margin-bottom: .75rem; }
.divide-y > :not(:last-child) { border-top-width: 0; border-bottom-width: 1px; border-bottom-style: solid; }
.aspect-square { aspect-ratio: 1 / 1; } .aspect-\[16\/9\] { aspect-ratio: 16 / 9; } .aspect-\[2\/3\] { aspect-ratio: 2 / 3; } .aspect-\[3\/2\] { aspect-ratio: 3 / 2; } .aspect-\[4\/3\] { aspect-ratio: 4 / 3; } .aspect-\[4\/5\] { aspect-ratio: 4 / 5; }
.h-16 { height: 4rem; } .h-\[1px\] { height: 1px; } .h-\[200px\] { height: 200px; } .w-6 { width: 1.5rem; } .w-\[160px\] { width: 160px; } .w-full { width: 100%; }
.\!min-h-0 { min-height: 0 !important; }
.max-w-md { max-width: 28rem; } .max-w-lg { max-width: 32rem; } .max-w-xl { max-width: 36rem; } .max-w-2xl { max-width: 42rem; } .max-w-\[1440px\] { max-width: 1440px; }
.mx-auto { margin-left: auto; margin-right: auto; } .ml-auto { margin-left: auto; } .mt-auto { margin-top: auto; }
.-mt-2 { margin-top: -.5rem; } .mt-1 { margin-top: .25rem; } .mt-1\.5 { margin-top: .375rem; } .mt-2 { margin-top: .5rem; } .mt-3 { margin-top: .75rem; } .mt-4 { margin-top: 1rem; } .mt-5 { margin-top: 1.25rem; } .mt-6 { margin-top: 1.5rem; } .mt-8 { margin-top: 2rem; } .mt-10 { margin-top: 2.5rem; } .mt-12 { margin-top: 3rem; } .mt-14 { margin-top: 3.5rem; }
.mb-2 { margin-bottom: .5rem; } .mb-3 { margin-bottom: .75rem; } .mb-4 { margin-bottom: 1rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-8 { margin-bottom: 2rem; } .mb-10 { margin-bottom: 2.5rem; } .mb-14 { margin-bottom: 3.5rem; }
.p-6 { padding: 1.5rem; } .px-2 { padding-left: .5rem; padding-right: .5rem; } .px-8 { padding-left: 2rem; padding-right: 2rem; }
.py-1 { padding-top: .25rem; padding-bottom: .25rem; } .py-2 { padding-top: .5rem; padding-bottom: .5rem; } .py-4 { padding-top: 1rem; padding-bottom: 1rem; } .py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; } .py-8 { padding-top: 2rem; padding-bottom: 2rem; } .py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; } .py-12 { padding-top: 3rem; padding-bottom: 3rem; } .py-14 { padding-top: 3.5rem; padding-bottom: 3.5rem; } .py-16 { padding-top: 4rem; padding-bottom: 4rem; }
.pt-3 { padding-top: .75rem; } .pt-8 { padding-top: 2rem; } .pt-14 { padding-top: 3.5rem; }
.pb-3 { padding-bottom: .75rem; } .pb-6 { padding-bottom: 1.5rem; } .pb-8 { padding-bottom: 2rem; } .pb-10 { padding-bottom: 2.5rem; } .pb-16 { padding-bottom: 4rem; } .pb-20 { padding-bottom: 5rem; } .pb-24 { padding-bottom: 6rem; }
.pr-6 { padding-right: 1.5rem; }
.overflow-x-auto { overflow-x: auto; }
.border-t { border-top-style: solid; border-top-width: 1px; } .border-b { border-bottom-style: solid; border-bottom-width: 1px; }
.bg-black { background-color: var(--lfs-ink); }
.text-center { text-align: center; } .text-right { text-align: right; }
.text-xl { font-size: 1.25rem; line-height: calc(1.75 / 1.25); }
.text-\[11px\] { font-size: 11px; } .text-\[12px\] { font-size: 12px; } .text-\[13px\] { font-size: 13px; } .text-\[14px\] { font-size: 14px; } .text-\[15px\] { font-size: 15px; } .text-\[16px\] { font-size: 16px; } .text-\[17px\] { font-size: 17px; } .text-\[18px\] { font-size: 18px; }
.font-normal { font-weight: 400; } .font-medium { font-weight: 500; } .font-semibold { font-weight: 600; }
.leading-tight { line-height: 1.25; } .leading-snug { line-height: 1.375; } .leading-relaxed { line-height: 1.625; }
.tabular-nums { font-variant-numeric: tabular-nums; }

@media (min-width: 640px) {
  .sm\:inline { display: inline; }
  .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 768px) {
  .md\:block { display: block; } .md\:inline { display: inline; } .md\:hidden { display: none; }
  .md\:flex-row { flex-direction: row; }
  .md\:items-center { align-items: center; } .md\:items-end { align-items: flex-end; }
  .md\:justify-between { justify-content: space-between; } .md\:justify-end { justify-content: flex-end; } .md\:justify-self-end { justify-self: end; }
  .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .md\:grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } .md\:grid-cols-12 { grid-template-columns: repeat(12, minmax(0, 1fr)); } .md\:grid-cols-\[1fr_auto\] { grid-template-columns: 1fr auto; }
  .md\:col-span-4 { grid-column: span 4 / span 4; } .md\:col-span-5 { grid-column: span 5 / span 5; } .md\:col-span-6 { grid-column: span 6 / span 6; } .md\:col-span-7 { grid-column: span 7 / span 7; } .md\:col-span-8 { grid-column: span 8 / span 8; }
  .md\:col-start-1 { grid-column-start: 1; } .md\:col-start-4 { grid-column-start: 4; } .md\:col-start-6 { grid-column-start: 6; } .md\:col-start-7 { grid-column-start: 7; } .md\:col-start-8 { grid-column-start: 8; } .md\:col-start-9 { grid-column-start: 9; } .md\:col-start-10 { grid-column-start: 10; }
  .md\:row-start-1 { grid-row-start: 1; } .md\:order-2 { order: 2; }
  .md\:gap-4 { gap: 1rem; }
  .md\:aspect-auto { aspect-ratio: auto; } .md\:aspect-\[4\/5\] { aspect-ratio: 4 / 5; }
  .md\:h-\[280px\] { height: 280px; } .md\:w-\[224px\] { width: 224px; }
  .md\:p-10 { padding: 2.5rem; }
  .md\:py-16 { padding-top: 4rem; padding-bottom: 4rem; } .md\:py-20 { padding-top: 5rem; padding-bottom: 5rem; } .md\:py-24 { padding-top: 6rem; padding-bottom: 6rem; }
  .md\:pt-20 { padding-top: 5rem; } .md\:pt-24 { padding-top: 6rem; }
  .md\:pb-14 { padding-bottom: 3.5rem; } .md\:pb-24 { padding-bottom: 6rem; }
  .md\:text-\[22px\] { font-size: 22px; }
}
@media (min-width: 1024px) {
  .lg\:flex { display: flex; } .lg\:hidden { display: none; }
  .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .lg\:grid-cols-8 { grid-template-columns: repeat(8, minmax(0, 1fr)); }
}
}
