/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* `turbo_stream_from` émet un <turbo-cable-stream-source> (abonnement WebSocket,
   purement fonctionnel). Sans display:none il reste un élément de flux : dans un
   grid/flex parent il occupe une cellule et décale la mise en page — c'est ce qui
   poussait la colonne chat hors de vue sur /live. On le sort du rendu partout. */
turbo-cable-stream-source { display: none !important; }
/* Dropdowns de la pill-nav (Discover + menu compte). Ici (et non dans theme_public)
   pour être partagés par le layout public ET le layout live (même menu). */
.pill-dd { position: relative; display: inline-flex; }
.pill-dd--end { margin-left: 0.5rem; }
.pill-nav__links a.is-active { color: var(--gold-light); }
.pill-nav__dd-trigger, .pill-nav__account { display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.7rem 1.2rem; background: none; border: 0; cursor: pointer; font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; color: var(--text); border-radius: var(--r-pill); transition: all var(--t); white-space: nowrap; }
.pill-nav__account { border: 1px solid var(--line-2); letter-spacing: 0.18em; }
.pill-nav__dd-trigger:hover, .pill-nav__account:hover, .pill-nav__dd-trigger[aria-expanded="true"], .pill-nav__account[aria-expanded="true"] { color: var(--white); background: rgba(255,255,255,0.05); }
.pill-nav__dd-trigger.is-active { color: var(--gold-light); }
.pill-dd__chevron { transition: transform var(--t); }
[aria-expanded="true"] .pill-dd__chevron { transform: rotate(180deg); }
.pill-dd__menu { position: absolute; top: calc(100% + 0.55rem); left: 0; min-width: 210px; display: none; flex-direction: column; padding: 0.5rem; background: rgba(20,16,12,0.97); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid var(--line-2); border-radius: var(--r); box-shadow: 0 24px 56px -18px rgba(0,0,0,0.75); z-index: 60; }
.pill-dd__menu--right { left: auto; right: 0; }
.pill-dd__menu.is-open { display: flex; animation: dd-in 0.18s var(--ease); }
@keyframes dd-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.pill-dd__menu a, .pill-dd__menu button { display: block; width: 100%; text-align: left; padding: 0.7rem 0.9rem; background: none; border: 0; cursor: pointer; font-family: var(--sans); font-size: 11px; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--text); border-radius: var(--r-sm); transition: all var(--t); white-space: nowrap; }
.pill-dd__menu a:hover, .pill-dd__menu button:hover { color: var(--white); background: rgba(201,169,97,0.12); }
.pill-dd__menu a.is-active { color: var(--gold-light); }
.pill-dd__menu form { margin: 0; }
.pill-dd__divider { height: 1px; background: var(--line); margin: 0.4rem 0.3rem; }
@media (max-width: 1100px) { .pill-dd--end { display: none; } }

/* Intitulé de groupe « Discover » dans le drawer mobile. */
.drawer__sub-label { font-family: var(--sans); font-size: 10px; font-weight: 600; letter-spacing: 0.28em; text-transform: uppercase; color: var(--gold); opacity: 0.7; padding: 0.9rem 0 0.2rem; }

/* Bouton WhatsApp flottant (bas-gauche, toutes pages publiques). Brief marketing. */
.nf-wa { position: fixed; left: 20px; bottom: 20px; z-index: 1000; display: inline-flex; align-items: center; gap: 12px; padding: 12px 20px 12px 14px; border-radius: 999px; background: #161210; border: 1px solid rgba(201,169,97,.45); color: #FAF8F4; text-decoration: none; font-family: Inter, system-ui, sans-serif; font-size: 13px; font-weight: 600; letter-spacing: .04em; box-shadow: 0 12px 30px -12px rgba(0,0,0,.6); transition: transform .2s, box-shadow .2s; }
.nf-wa:hover { transform: translateY(-2px); box-shadow: 0 18px 38px -14px rgba(0,0,0,.7); }
.nf-wa__icon { display: flex; color: #25D366; }
.nf-wa__label { white-space: nowrap; }
@media (max-width: 600px) {
  .nf-wa { padding: 14px; }
  .nf-wa__label { max-width: 0; overflow: hidden; opacity: 0; transition: max-width .25s, opacity .25s; }
  .nf-wa:hover .nf-wa__label, .nf-wa:focus .nf-wa__label { max-width: 200px; opacity: 1; margin-left: 2px; }
}

/* ===== Combobox pays recherchable (signup + filtre admin) ===== */
.country-cs { position: relative; }
.country-cs--block { width: 100%; }
.country-cs--inline { display: inline-block; width: 210px; vertical-align: middle; }
/* Style de base (admin) — au signup, .auth-card input[type=text] est plus spécifique et l'emporte. */
.country-cs__input {
  width: 100%; box-sizing: border-box; background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.1); border-radius: 8px; color: #FAF8F4;
  font-family: var(--sans); font-size: 0.8rem; padding: 0.5rem 0.75rem; outline: none;
}
.country-cs__input:focus { border-color: rgba(201,169,97,0.5); }
.country-cs__input::placeholder { color: rgba(250,248,244,0.4); }
.country-cs__panel {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 200;
  background: #161210; border: 1px solid rgba(201,169,97,0.3); border-radius: 10px;
  max-height: 280px; overflow-y: auto; box-shadow: 0 14px 34px rgba(0,0,0,0.55); padding: 4px;
}
.country-cs__panel[hidden] { display: none; }
.country-cs__list { list-style: none; margin: 0; padding: 0; }
.country-cs__opt {
  padding: 0.5rem 0.7rem; border-radius: 6px; cursor: pointer; font-size: 0.85rem;
  color: #FAF8F4; white-space: nowrap; user-select: none;
}
.country-cs__opt[hidden] { display: none; }
.country-cs__opt:hover, .country-cs__opt.is-active { background: rgba(201,169,97,0.16); }
.country-cs__empty { padding: 0.6rem 0.7rem; color: rgba(250,248,244,0.4); font-size: 0.82rem; }