/* ============================================================
   GinecoLab - Manual Digital: estilos compartilhados dos
   componentes do faq.js (barra de utilidades, modal de FAQ e
   busca de funcao). Carregado pela landing (index.html) e pelos
   4 decks. Depende dos tokens de cor (--rose, --tint, --card...)
   definidos pela pagina host.
   ============================================================ */

/* barra fixa inferior-esquerda dos decks (espelha a .nav a direita, na MESMA base) */
.mtb{position:fixed;bottom:calc(clamp(10px,2vh,18px) + env(safe-area-inset-bottom,0px));
  left:calc(clamp(10px,2vw,22px) + env(safe-area-inset-left,0px));z-index:26;
  display:flex;align-items:center;gap:6px;opacity:.9;transition:opacity .35s var(--ease)}
.mtb:hover,.mtb:focus-within{opacity:1}
/* icones com bom contraste sobre qualquer fundo (tinta escura da marca + sombra leve) */
.mtb__b{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.96);
  backdrop-filter:blur(10px);border:1px solid var(--line);color:var(--rose-dd);
  font-family:var(--ss);font-size:.74rem;font-weight:600;padding:0 12px;height:36px;
  border-radius:9px;cursor:pointer;text-decoration:none;box-shadow:0 3px 10px rgba(120,60,50,.16);
  transition:all .22s var(--ease)}
.mtb__b svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.mtb__b:hover{background:var(--rose);color:#fff;border-color:var(--rose);transform:translateY(-1px)}
.mtb__b--wa{color:#0f7a41}
.mtb__b--wa:hover{background:#0f7a41;color:#fff;border-color:#0f7a41}
.mtb__ss{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 15px 0 16px;
  margin-left:2px;border-radius:10px;background:rgba(255,255,255,.97);border:1px solid var(--line);
  box-shadow:0 3px 10px rgba(120,60,50,.16);text-decoration:none;transition:all .22s var(--ease)}
.mtb__ss:hover{background:#fff;transform:translateY(-1px)}
.mtb__ss-l{font-family:var(--ss);font-size:.68rem;font-weight:600;letter-spacing:.02em;color:var(--muted)}
.mtb__ss img{height:26px;width:auto;display:block}
.topbar-on-dark .mtb__b{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.34)}
.topbar-on-dark .mtb__b:hover{background:#fff;color:var(--rose-d)}
.topbar-on-dark .mtb__b--wa:hover{background:#0f7a41;color:#fff;border-color:#0f7a41}
/* o selo SeuSaude fica SEMPRE em chip branco com a logo colorida: legivel em
   qualquer fundo (a versao escura translucida apagava a marca nos slides salmao) */

/* ---------- modal generico (FAQ + busca) ---------- */
.mmodal-lock{overflow:hidden}
.mmodal-ov{position:fixed;inset:0;background:rgba(60,40,36,.42);z-index:60;
  display:flex;align-items:flex-start;justify-content:center;padding:clamp(14px,5vh,64px) 16px;
  opacity:0;pointer-events:none;transition:opacity .28s var(--ease);backdrop-filter:blur(3px);overflow-y:auto}
.mmodal-ov.open{opacity:1;pointer-events:auto}
.mmodal{background:var(--card);border:1px solid var(--line2);border-radius:16px;width:100%;
  max-width:640px;max-height:calc(100vh - clamp(28px,10vh,128px));display:flex;flex-direction:column;
  box-shadow:0 30px 80px rgba(120,60,50,.28);transform:translateY(14px) scale(.985);
  transition:transform .3s var(--ease);overflow:hidden}
.mmodal-ov.open .mmodal{transform:none}
.mmodal__h{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 18px;border-bottom:1px solid var(--line2);flex-shrink:0}
.mmodal__h h3{font-family:var(--sf);font-weight:600;font-size:clamp(1.05rem,2.4vw,1.3rem);color:var(--ink)}
.mmodal__x{background:var(--bg2);border:1px solid var(--line2);color:var(--muted);
  width:34px;height:34px;border-radius:9px;font-size:1.3rem;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s var(--ease)}
.mmodal__x:hover{background:var(--rose);color:#fff;border-color:var(--rose)}
.mmodal__b{padding:16px 18px;overflow-y:auto;flex:1;min-height:0}
.mmodal__b::-webkit-scrollbar{width:8px}
.mmodal__b::-webkit-scrollbar-thumb{background:var(--sand-d);border-radius:4px}

/* ---------- FAQ (acordeao) ---------- */
.mfaq__search,.msr__input{width:100%;font-family:var(--ss);font-size:1rem;color:var(--ink);
  background:var(--bg2);border:1px solid var(--line2);border-radius:11px;padding:12px 15px;
  margin-bottom:14px;outline:none;transition:border-color .2s,box-shadow .2s}
.mfaq__search:focus,.msr__input:focus{border-color:var(--rose);box-shadow:0 0 0 3px var(--rose-tint)}
.mfaq__list{display:flex;flex-direction:column;gap:8px}
.mfaq__item{border:1px solid var(--line2);border-radius:11px;overflow:hidden;background:var(--card);transition:border-color .2s}
.mfaq__item.open{border-color:rgba(201,84,74,.32)}
.mfaq__q{width:100%;display:flex;align-items:center;gap:10px;text-align:left;background:none;
  border:none;cursor:pointer;padding:12px 14px;font-family:var(--ss);color:var(--ink)}
.mfaq__q:hover{background:var(--tint)}
.mfaq__cat{flex-shrink:0;font-size:.62rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  padding:4px 8px;border-radius:6px;background:var(--tint);color:var(--rose-d);border:1px solid var(--line)}
.mfaq__qt{flex:1;min-width:0;font-size:.95rem;font-weight:500;line-height:1.35}
.mfaq__ch{flex-shrink:0;width:11px;height:11px;border-right:2px solid var(--rose);border-bottom:2px solid var(--rose);
  transform:rotate(45deg);transition:transform .25s var(--ease);margin-right:3px}
.mfaq__item.open .mfaq__ch{transform:rotate(-135deg)}
.mfaq__a{max-height:0;overflow:hidden;transition:max-height .3s var(--ease)}
.mfaq__item.open .mfaq__a{max-height:360px}
.mfaq__a p{padding:0 14px 14px;font-size:.92rem;line-height:1.55;color:var(--muted)}
.mfaq__empty{display:none;padding:22px 6px;text-align:center;color:var(--muted);font-size:.92rem}

/* ---------- lista completa de recursos (modal "Ver todos os recursos") ---------- */
.mall__list{list-style:none;display:flex;flex-direction:column;gap:11px;margin:2px 0 4px}
.mall__list li{position:relative;padding-left:22px;font-size:.94rem;line-height:1.5;color:var(--ink2)}
.mall__list li::before{content:'';position:absolute;left:0;top:.42em;width:8px;height:8px;border-radius:50%;
  background:linear-gradient(135deg,var(--rose),var(--rose-l));box-shadow:0 0 0 3px var(--rose-tint)}
.mall__list b{color:var(--ink);font-weight:600}

/* ---------- busca de funcao ---------- */
.msr__results{display:flex;flex-direction:column;gap:7px}
.msr__results.has{margin-top:2px}
.msr__item{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"area t" "area d";
  gap:1px 12px;text-decoration:none;border:1px solid var(--line2);border-radius:11px;
  padding:11px 14px;background:var(--card);transition:all .18s var(--ease)}
.msr__item:hover{border-color:rgba(201,84,74,.4);background:var(--tint);transform:translateX(3px)}
.msr__area{grid-area:area;align-self:center;font-size:.6rem;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;color:var(--rose-d);background:var(--tint);border:1px solid var(--line);
  border-radius:6px;padding:5px 8px;text-align:center;max-width:104px;line-height:1.2}
.msr__t{grid-area:t;font-family:var(--sf);font-weight:600;font-size:.98rem;color:var(--ink)}
.msr__d{grid-area:d;font-size:.8rem;color:var(--muted);line-height:1.35}
.msr__empty{padding:18px 6px;text-align:center;color:var(--muted);font-size:.92rem}

@media(max-width:600px){
  /* alinha a barra na MESMA base do numero da pagina (.nav), opacidade cheia (sem hover no toque) */
  .mtb{gap:5px;opacity:1;
    left:calc(9px + env(safe-area-inset-left,0px));
    bottom:calc(9px + env(safe-area-inset-bottom,0px))}
  .mtb__b{padding:0 9px;height:34px;font-size:0}
  .mtb__b svg{width:17px;height:17px}
  .mtb__b span{display:none}
  .mtb__ss{height:38px;padding:0 12px 0 13px;gap:7px}
  .mtb__ss img{height:23px}
  .mfaq__cat{display:none}
  .msr__area{max-width:80px;font-size:.55rem}
}

/* ============================================================
   OVERRIDE TexPonto: contraste grafite sobre ambar + tints da marca.
   Acrescentado ao final; depende dos tokens redefinidos em deck.css
   (ou no CSS inline da pagina host).
   ============================================================ */
.mtb__b{box-shadow:0 3px 10px rgba(20,20,20,.12)}
.mtb__ss{box-shadow:0 3px 10px rgba(20,20,20,.12)}
.mtb__b:hover{color:#141414}
.mtb__b--wa:hover{color:#fff}
.topbar-on-dark .mtb__b:hover{color:#8A5B00}
.mmodal-ov{background:rgba(20,18,12,.45)}
.mmodal{box-shadow:0 30px 80px rgba(20,20,20,.25)}
.mmodal__x:hover{color:#141414}
.mfaq__item.open{border-color:rgba(229,162,0,.4)}
.msr__item:hover{border-color:rgba(254,181,3,.5)}
