/* LBF : lancement de l'app LeBonFlip (13/11/2026). Charge par novamira-sandbox/lbf-app-lancement.php.
   1. Accueil du site : la section #app (classes lbf-al-*), qui reprend les cartes du bloc de l'app (classes ins-*, app-install.css).
   2. La fenetre de lancement (classes al-*), sur l'accueil du site et dans l'app web.
   Aucun tiret long. Pas de carte a liseré gauche. */

/* ---------- 1. Accueil du site : section « L'app LeBonFlip est la » ---------- */
.lbf-al{position:relative;overflow:hidden;scroll-margin-top:84px;
  background:radial-gradient(44% 62% at 4% 0%,rgba(233,228,248,.95),rgba(233,228,248,0) 70%),
    radial-gradient(40% 56% at 97% 10%,rgba(220,240,241,.95),rgba(220,240,241,0) 70%),
    radial-gradient(56% 64% at 52% 104%,rgba(255,231,212,.9),rgba(255,231,212,0) 72%),#FFFCF8}
.lbf-al-cf{position:absolute;left:0;right:0;top:18px;width:100%;height:220px;pointer-events:none;opacity:.85}
.lbf-al .lbh2-in{position:relative}
.lbf-al .lbh2-head.lbf-al-head{max-width:720px;margin-bottom:0}
.lbf-al-lead{margin:12px auto 0!important;max-width:580px;font-size:15.5px!important;line-height:1.55!important;color:var(--soft,#4A4857)!important;text-wrap:pretty}
.lbf-al-pk{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;list-style:none!important;margin:18px auto 0!important;padding:0!important}
.lbf-al-pk li{display:inline-flex;align-items:center;gap:7px;margin:0!important;padding:5px 12px 5px 5px!important;border-radius:999px;background:rgba(255,255,255,.82);border:1px solid #EFE3D9;font-size:13px!important;font-weight:600;line-height:1.2!important;color:#2B2935}
.lbf-al-pk li::before{content:none!important;display:none!important}
.lbf-al-pk i{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#FFF1C2;color:#7A5300;font-style:normal}
.lbf-al-pk svg{width:14px;height:14px}

/* les cartes : celles du bloc de l'app, a la typographie de l'accueil */
.lbf-al .ins.lbf-al-ins{margin-top:28px;--font:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;font-family:var(--font)}
.lbf-al .ins-c{box-shadow:0 22px 44px -36px rgba(22,21,31,.45)}
.lbf-al h3.ins-ct{font-family:var(--font)!important;font-size:16.5px!important;font-weight:700!important;line-height:1.2!important;letter-spacing:0!important;margin:0!important;padding:0!important;color:var(--ink,#16151F)!important;text-transform:none!important}
.lbf-al h3.ins-ct::before{content:none!important;display:none!important}
.lbf-al p.ins-cs{margin:4px 0 0!important;font-size:13px!important;line-height:1.4!important;color:var(--soft,#4A4857)!important}
.lbf-al .ins-l,.lbf-al .ins-o ol{list-style:none!important;margin-left:0!important;padding-left:0!important}
.lbf-al .ins-l{margin:12px 0 0!important}
.lbf-al .ins-l>li{margin:0!important;padding:0!important;font-size:inherit!important;line-height:inherit!important}
.lbf-al .ins-l>li::before{content:none!important;display:none!important}
.lbf-al .ins-o li{font-size:13px!important;line-height:1.5!important;margin:0 0 6px!important;padding:0 0 0 26px!important}
.lbf-al .ins-o p{margin:0 0 6px!important;font-size:13px!important}
.lbf-al .ins-o a{color:inherit!important;text-decoration:underline;text-underline-offset:2px}
.lbf-al a.ins-r,.lbf-al a.ins-r:hover{text-decoration:none!important;color:var(--ink,#16151F)!important}
.lbf-al .ins-rt b{color:var(--ink,#16151F)}
.lbf-al .ins-rt small{color:var(--mute,#6E6B7B)}
.lbf-al img.ins-sc{max-width:none!important;height:100%!important;width:100%!important;border-radius:0!important;box-shadow:none!important}
.lbf-al img.ins-bd{display:block;width:auto!important;height:38px!important;max-width:none!important;border-radius:0!important;box-shadow:none!important}
.lbf-al img.ins-bd-play{height:49.5px!important;margin:-5.75px 0!important}
@container insc (max-width:318px){
  .lbf-al img.ins-bd{height:36px!important}
  .lbf-al img.ins-bd-play{height:47px!important;margin:-5.5px 0!important}
}
.lbf-al .lbf-al-go{display:inline-block}
.lbf-al .ins-lg{text-align:center;margin-top:14px!important}

.lbf-al-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 26px;margin-top:22px}
.lbf-al-qr{display:flex;align-items:center;gap:14px;max-width:460px;padding:10px 18px 10px 10px;border-radius:18px;background:#fff;border:1px solid #EFE3D9;box-shadow:0 18px 36px -30px rgba(22,21,31,.5)}
.lbf-al-qr img{flex:none;display:block;width:84px!important;height:84px!important;max-width:none!important;border-radius:10px}
.lbf-al-qr b{display:block;font-size:14.5px;color:#16151F;margin-bottom:2px}
.lbf-al-qr span{display:block;font-size:12.5px;line-height:1.45;color:#4A4857}
@media (hover:none),(pointer:coarse),(max-width:899px){.lbf-al-qr{display:none}}

/* la pastille du haut de page, pendant le lancement */
a.lbf-art-badge.lbf-al-pill{text-decoration:none!important;cursor:pointer;gap:7px;transition:background-color .2s ease,transform .2s ease}
a.lbf-art-badge.lbf-al-pill:hover{background:#fff;transform:translateY(-1px)}
.lbf-al-pill b{font-weight:800;color:var(--acc,#E8621A)}
.lbf-al-pill svg{width:13px;height:13px;flex:none}

/* ---------- 2. La fenetre de lancement ---------- */
.al-o{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;
  background:rgba(32,26,48,.58);opacity:0;transition:opacity .24s ease;-webkit-tap-highlight-color:transparent;
  font-family:var(--font,'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif);color:var(--ink,#3D3552);line-height:1.4;text-align:left}
.al-o *{box-sizing:border-box}
.al-o.on{opacity:1}
html.al-lock,html.al-lock body{overflow:hidden!important}
.al-c{position:relative;width:100%;max-width:430px;max-height:calc(100% - 4px);overflow:auto;overscroll-behavior:contain;background:#fff;border-radius:20px;
  box-shadow:0 34px 80px -24px rgba(32,26,48,.55);transform:translateY(16px) scale(.97);transition:transform .34s cubic-bezier(.22,1,.36,1);scrollbar-width:thin}
.al-o.on .al-c{transform:none}
.al-x{position:absolute;top:10px;right:10px;z-index:2;display:grid;place-items:center;width:34px;height:34px;padding:0;border:0;border-radius:50%;
  background:rgba(255,255,255,.9);color:#3D3552;cursor:pointer;box-shadow:0 3px 10px rgba(32,26,48,.14)}
.al-x svg{width:18px;height:18px;display:block}
.al-x:focus{outline:none}
.al-x:focus-visible{outline:3px solid rgba(240,138,36,.5);outline-offset:2px}
.al-st{position:relative;aspect-ratio:640/330;overflow:hidden;background:linear-gradient(150deg,#FFE7D4,#FFF4DC);border-bottom:1px solid #F3D6C2}
.al-pc .al-st{background:linear-gradient(150deg,#E9E4F8,#E3ECFC);border-bottom-color:#D8D0F0}
.al-st::before{content:"";position:absolute;inset:0;background:radial-gradient(70% 90% at 88% -10%,rgba(255,255,255,.85),rgba(255,255,255,0) 62%)}
.al-sc{position:absolute;left:0;top:6%;width:100%;height:100%;object-fit:contain;object-position:50% 0;pointer-events:none;-webkit-user-select:none;user-select:none;max-width:none}
.al-b{padding:16px 20px 12px}
.al-tag{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;background:#FFF1C2;color:#7A5300;font-size:12px;font-weight:700;line-height:1.2;letter-spacing:.01em}
.al-tag svg{width:14px;height:14px;display:block}
.al-c h2{margin:10px 0 6px;padding:0;border:0;font-family:var(--serif,'Gloock'),'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:27px;line-height:1.1;letter-spacing:-.005em;color:var(--ink,#3D3552);text-transform:none}
.al-home h2{font-weight:700;font-size:30px;line-height:1.02;color:#16151F}
.al-s{margin:0 0 14px;font-size:14.5px;line-height:1.5;color:var(--muted,#5C5170)}
.al-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin:0;padding:12px 16px;border:0;border-radius:12px;
  background:#FCB900;color:#3D3552!important;font-family:inherit;font-size:15px;font-weight:700;line-height:1.2;text-decoration:none!important;cursor:pointer;
  box-shadow:0 10px 20px -12px rgba(140,98,0,.6);transition:transform .1s ease,filter .15s ease}
.al-btn:hover{filter:brightness(1.04)}
.al-btn:active{transform:scale(.99)}
.al-btn svg{width:18px;height:18px;flex:none;display:block}
.al-how>summary{list-style:none}
.al-how>summary::-webkit-details-marker{display:none}
.al-how[open]>summary{margin-bottom:12px}
.al-or{display:flex;align-items:center;gap:10px;margin:12px 0;color:#8A7FA0;font-size:12px}
.al-or::before,.al-or::after{content:"";flex:1;height:1px;background:#ECE4D8}
.al-ctr{display:flex;justify-content:center}
.al-sa{display:inline-flex;justify-content:center;border-radius:8px}
.al-sa:focus-visible{outline:3px solid rgba(240,138,36,.5);outline-offset:3px}
.al-bd{display:block;width:auto;height:44px;max-width:none}
.al-bd-play{height:57px;margin:-6.6px 0}
.al-big .al-bd-play{height:74px;margin:-8.6px 0}
.al-also{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.al-tile{display:flex;align-items:center;gap:12px;min-width:0;padding:10px 12px;border:1px solid #ECE4D8;border-radius:14px;background:#FBF8F3;font-size:12.5px;line-height:1.38;color:var(--muted,#5C5170)}
.al-tile>div{flex:1;min-width:0}
.al-tile b{display:block;margin-bottom:1px;color:var(--ink,#3D3552);font-size:13.5px}
.al-tile span{display:block}
.al-tile .al-sa{flex:none}
.al-tile .al-bd{height:36px}
.al-qr img{flex:none;display:block;width:64px;height:64px;max-width:none;border-radius:8px;background:#fff;border:1px solid #ECE4D8;padding:3px}
/* boutons : les styles du theme du site (fond orange au survol et au focus) ne s'appliquent pas ici */
.al-o button{font-family:inherit;text-transform:none;letter-spacing:normal;min-height:0}
.al-o .al-x,.al-o .al-x:hover,.al-o .al-x:focus,.al-o .al-x:active{background:rgba(255,255,255,.92)!important;color:#3D3552!important;border:0!important;padding:0!important;outline:none!important;box-shadow:0 3px 10px rgba(32,26,48,.14)!important}
.al-o .al-x:focus-visible{outline:3px solid rgba(240,138,36,.5)!important;outline-offset:2px!important}
@media (max-width:480px){
  .lbf-al-pk{gap:6px}
  .lbf-al-pk li{gap:6px;padding:4px 10px 4px 4px!important;font-size:12.5px!important}
  .lbf-al-pk i{width:22px;height:22px}
}
.al-o .al-ft button,.al-o .al-ft button:hover,.al-o .al-ft button:focus,.al-o .al-ft button:active{background:none!important;border:0!important;box-shadow:none!important;padding:8px 2px!important;color:#7A7090!important}
.al-o .al-ft button:first-child{color:#3D3552!important}
.al-o .al-ft button:hover{text-decoration:underline;text-underline-offset:3px}
.al-o .al-btn,.al-o .al-btn:hover,.al-o .al-btn:focus,.al-o .al-btn:active{background:#FCB900!important;color:#3D3552!important;border:0!important}
.al-ol{list-style:none;margin:0 0 14px;padding:0;counter-reset:aln}
.al-ol li{position:relative;margin:0 0 9px;padding:0 0 0 30px;font-size:14px;line-height:1.45;color:var(--ink,#3D3552);counter-increment:aln}
.al-ol li::before{content:counter(aln);position:absolute;left:0;top:0;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#FFE2C8;color:#A8501A;font-size:12px;font-weight:700;line-height:1}
.al-ol b{font-weight:700}
.al-ki{display:inline-grid;place-items:center;width:24px;height:24px;margin:0 1px;border-radius:7px;background:#EEF3FF;color:#2F6FED;vertical-align:-7px}
.al-ki svg{width:15px;height:15px;display:block}
.al-note{margin:8px 0 0;text-align:center;font-size:12px;color:#8A8198}
.al-ft{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px;padding-top:8px;border-top:1px solid #F1EBE1}
.al-ft button{border:0;background:none;margin:0;padding:8px 2px;font-family:inherit;font-size:13.5px;font-weight:600;line-height:1.2;color:#7A7090;cursor:pointer}
.al-ft button:first-child{color:var(--ink,#3D3552)}
.al-ft button:only-child{margin-left:auto;margin-right:auto}
.al-cf{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
@media (max-width:560px){
  .al-o{align-items:flex-end;padding:0}
  .al-c{max-width:none;border-radius:22px 22px 0 0;max-height:calc(100% - 20px);transform:translateY(60px);padding-bottom:env(safe-area-inset-bottom,0)}
  .al-also{grid-template-columns:1fr}
  .al-c h2{font-size:25px}
  .al-home h2{font-size:28px}
}
@media (prefers-reduced-motion:reduce){.al-o,.al-c{transition:none}}
