/*
Android App promo — popup + footer section.
Self-contained (fallback colors included) so it works regardless of
what custom properties the rest of the theme's style.css defines.
*/

/* ---------- Popup ---------- */
.app-promo-scrim{
  position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:9000;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.app-promo-scrim.is-open{opacity:1;pointer-events:auto;}

.app-promo-modal{
  position:fixed;left:50%;top:50%;transform:translate(-50%,-45%) scale(.96);
  width:90%;max-width:340px;background:var(--black-2,#101015);border:1px solid rgba(255,255,255,.1);
  border-radius:18px;padding:28px 24px;text-align:center;z-index:9001;
  opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;
  box-shadow:0 20px 50px rgba(0,0,0,.4);
}
.app-promo-modal.is-open{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1);}
.app-promo-modal img.custom-logo{height:36px;width:auto;margin:0 auto 14px;}
.app-promo-modal h3{color:#fff;font-size:18px;margin:0 0 8px;}
.app-promo-modal p{color:#9a9ea6;font-size:13.5px;margin:0 0 18px;line-height:1.5;}
.app-promo-qr{width:140px;height:140px;margin:0 auto 8px;border-radius:10px;background:#fff;padding:8px;}
.app-promo-scan-label{display:block;font-size:11px;color:#9a9ea6;margin-bottom:18px;}

.app-promo-close{
  position:absolute;top:12px;right:12px;width:30px;height:30px;border-radius:50%;
  background:rgba(255,255,255,.08);color:#fff;display:flex;align-items:center;justify-content:center;
}

.app-promo-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  padding:13px;border-radius:999px;font-weight:600;font-size:14px;
  background:linear-gradient(135deg,#1e6fff,#0a3fc4);color:#fff;
}
.app-promo-btn:hover{opacity:.92;}

/* ---------- Footer section ---------- */
.app-promo-footer{
  background:#000;border-radius:16px;margin:24px 0;padding:24px;
}
.app-promo-footer-inner{
  display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:center;text-align:center;
}
.app-promo-footer-inner img.custom-logo{height:34px;width:auto;}
.app-promo-footer-text{min-width:160px;}
.app-promo-footer-text h4{color:#fff;font-size:15px;margin:0 0 4px;}
.app-promo-footer-text p{color:#9a9ea6;font-size:12.5px;margin:0;}
.app-promo-footer-qr{width:76px;height:76px;border-radius:8px;background:#fff;padding:6px;flex-shrink:0;}
.app-promo-btn-footer{width:auto;padding:11px 22px;font-size:13px;flex-shrink:0;}

@media (max-width:480px){
  .app-promo-footer-inner{flex-direction:column;}
}