/* =========================================================================
   Senego — Carte « Télécharger l'application » — MOBILE UNIQUEMENT, centrée.
   Affichée seulement sur iPhone / Android (voir senego-app-card.js), jamais
   sur ordinateur. Un seul bouton store (celui de l'OS), CENTRÉ et EN BAS.
   Aucun !important. Variantes de contexte : --inline / --list / --grid.
   ========================================================================= */

.senego-app-card {
  --sac-orange:  var(--senego-color-primary, #ff9900);
  --sac-accent:  var(--senego-color-accent,  #e63900);
  --sac-bg:      var(--senego-color-bg,       #f2f3ef);
  --sac-surface: var(--senego-color-surface,  #ffffff);
  --sac-heading: var(--senego-color-heading,  #16181c);
  --sac-text:    var(--senego-color-text,     #1a1a1a);
  --sac-meta:    var(--senego-color-meta,      #666666);
  --sac-border:  var(--senego-color-border,   #e0e0e0);
  --sac-font-h:  var(--senego-font-heading, 'Public Sans', system-ui, sans-serif);
  --sac-font-b:  var(--senego-font-base,    'Source Sans 3', system-ui, sans-serif);

  box-sizing: border-box;
  margin: 24px 0;
  background: var(--sac-surface);
  border: 1px solid var(--sac-border);
  border-top: 2px solid var(--sac-orange);   /* accent marque : suit les coins arrondis */
  border-radius: 12px;
  padding: 20px 18px;
  color: var(--sac-text);
  font-family: var(--sac-font-b);
  text-align: center;                         /* tous les éléments centrés */
}
.senego-app-card *,
.senego-app-card *::before,
.senego-app-card *::after { box-sizing: border-box; }

/* ---- Affichage piloté par l'OS (senego-app-card.js) --------------------- */
.senego-app-card[hidden] { display: none; }                 /* jamais sur PC, ni avant le JS */
.senego-app-card__store[data-os] { display: none; }         /* les 2 boutons masqués par défaut */
.senego-app-card.is-ios     .senego-app-card__store[data-os="ios"]     { display: inline-flex; }
.senego-app-card.is-android .senego-app-card__store[data-os="android"] { display: inline-flex; }

/* ---- En-tête centré ---------------------------------------------------- */
.senego-app-card__brand {
  display: inline-flex; align-items: center; justify-content: center;
  gap: 8px; margin-bottom: 8px;
}
.senego-app-card__logo { height: 20px; width: auto; display: block; }
.senego-app-card__eyebrow {
  font-family: var(--sac-font-h);
  font-size: 20px; font-weight: 800;          /* coordonné à la hauteur du logo */
  letter-spacing: 0.01em; text-transform: uppercase;
  color: var(--sac-orange);                   /* lockup « L'APP » + logo SENEGO */
}
.senego-app-card__title {
  font-family: var(--sac-font-h);
  font-weight: 700; font-size: 17px; line-height: 1.3;
  color: var(--sac-heading);
  margin: 0 auto; max-width: 22em; text-wrap: pretty;
}
.senego-app-card__text {
  font-size: 14px; line-height: 1.5; color: var(--sac-meta);
  margin: 5px auto 0; max-width: 26em; text-wrap: pretty;
}

/* ---- Bouton store : centré, en bas, ne déborde jamais ------------------ */
.senego-app-card__stores { display: flex; justify-content: center; margin-top: 16px; }
.senego-app-card__store {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; max-width: 280px;              /* plafonné + centré → pas de débordement */
  padding: 11px 16px; border-radius: 10px;
  background: #16181c; color: #ffffff;        /* bouton store NOIR */
  text-decoration: none; border: 1px solid #16181c;
  transition: background-color 0.15s ease,
              transform 0.15s var(--senego-ease, cubic-bezier(.2,.7,.2,1));
}
.senego-app-card__store:hover { background: #000000; transform: translateY(-1px); }
.senego-app-card__store:focus-visible { outline: 2px solid var(--sac-orange); outline-offset: 2px; }
.senego-app-card__store svg { width: 20px; height: 20px; fill: #ffffff; flex: none; }
.senego-app-card__store-txt { display: flex; flex-direction: column; line-height: 1.1; text-align: left; }
.senego-app-card__store-txt small { font-size: 10px; font-weight: 400; color: rgba(255,255,255,0.78); }
.senego-app-card__store-txt strong { font-family: var(--sac-font-h); font-size: 14px; font-weight: 700; color: #ffffff; }

/* ---- Variantes de contexte (légères différences) ----------------------- */
.senego-app-card--inline { margin: 26px 0; }                /* corps d'article */
.senego-app-card--list   { margin: 12px 0; }                /* item plein largeur dans une liste */
.senego-app-card--grid   { height: 100%; }                  /* tuile d'accueil */
