/*
 * Окно «Война и Мир 2 — в телефоне» под кнопкой «Играть» (templates/components/store-window.php) — главная и «Игра».
 * Вид — карточка страниц аккаунта (accounts.css): #1d1d1d, рамка #3a3226, радиус 8, зелёная кнопка .account-btn--primary;
 * выбор владельца 04.11.2026 из четырёх проб — tools/site-mobile/window-probe/okno-v2-kartochka.html.
 */

/* главная и «Игра»: кнопка «Играть» и окно вместе внизу первого экрана */
.play-cta{position:absolute;left:0;right:0;bottom:30px;z-index:2}
.play-cta .play-button-block{position:relative;bottom:auto}

.app-window{position:relative;width:560px;max-width:100%;margin:18px auto 0;background:#1d1d1d;border:1px solid #3a3226;border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.4);overflow:hidden;text-align:center}
.app-window .modal-header{padding:14px 16px 12px;border-bottom:1px solid #3a3226}
.app-window .modal-title{margin:0;font-size:22px;font-weight:300;color:#ecd19a}
.app-window .modal-title .fa{margin-right:6px}
.app-window .modal-body{padding:18px 22px 20px;font-size:90%}
.app-window__row{display:flex;align-items:center;justify-content:center;gap:22px}
.app-window__qr{flex:none;width:126px;height:126px;padding:4px;background:#fff;border-radius:6px;border:1px solid #3a3226}
.app-window__qr img{display:block;width:100%;height:100%}
.app-window__stores{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.app-window__text{margin:8px 0 0;color:#b5b5b5;font-size:14px;line-height:1.4}
.app-window__text--phone{display:none}
.app-window__text--phone.app-window__text--on{display:block}
.app-window__legal{margin:14px 0 0;color:#71675b;font-size:10.5px;line-height:1.35}

/* официальные значки: один размер у всех (владелец 04.11) — коробка 160×50 с чёрным фоном и рамкой, картинка заполняет её
   (object-fit: cover — срезаются только поля и край рамки). Пропорции: Apple 2,99, RuStore 2,78, Google 3,4 (PNG с полями) */
.store-badges{display:flex;flex-direction:column;align-items:center;gap:7px}
.store-badge{display:block;width:160px;height:50px;border-radius:8px;overflow:hidden;background:#000;border:1px solid #a6a6a6;box-sizing:border-box}
.store-badge img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.store-badge--rustore{background:#1a1c20;border-color:#393e45}
.store-badge:hover{filter:brightness(115%)}

/* вид «Скоро»: подписка по почте — поле и зелёная кнопка в стиле страниц аккаунта */
.app-window__lead{margin:0 0 12px;font-size:14px;line-height:1.45}
.app-window__form{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto;max-width:440px}
.app-window__form input.form-control{height:44px;padding:.25rem .8rem;font-size:15px;background:#141414;border:1px solid #3a3226;border-radius:6px;color:#ecd19a;box-shadow:none}
.app-window__form input.form-control:focus{border-color:#ad835a;box-shadow:none;outline:none}
.app-window__form input.form-control::placeholder{color:#8a7a60}
.app-window__form .app-window__btn{flex:none;height:44px;padding:0 22px;font-size:15px;font-weight:600;justify-content:center;white-space:nowrap}
.app-window__form .app-window__btn:disabled{opacity:.7}
.app-window .app-window__hp{position:absolute;left:-10000px;width:1px;height:1px;opacity:0}
.app-window__done{margin:4px 0 0;color:#ffd65d;font-size:15px}
.app-window__note{margin:12px 0 0;font-size:12.5px;color:#8a8a8a}
.app-window__note--error{color:#e0735a}

@media (max-width:767px){
  .play-cta{bottom:16px}
  .play-cta .play-button-block{width:260px;height:80px}
  .play-cta .play-button-block .play-button .red-design-btn{font-size:30px}
  .app-window{width:calc(100% - 30px);margin-top:14px}
  .app-window .modal-header{padding:10px 10px 8px}
  .app-window .modal-title{font-size:19px}
  .app-window .modal-body{padding:14px 12px 16px}
  .app-window__row{flex-direction:column;gap:10px}
  .app-window__qr{display:none}
  .app-window__text--pc{display:none}
  .app-window__text--phone{display:block}
  .app-window__text{font-size:13px}
  .store-badge{width:192px;height:60px;border-radius:9px}
  .app-window__form{flex-direction:column;gap:8px}
  .app-window__form input.form-control{width:100%}
  .app-window__lead{font-size:13.5px}
}

/* на странице игры /game: иконка в полосе сайта (templates/components/game-bar.php) — у аватара на ПК, в левой полоске телефона —
   рядом с «Во весь экран» / «На экран Домой»; размеры — как у соседних кнопок полосы (assets/css/game-bar.css) */
.agbar__app{order:4}
@media (orientation: landscape) and (max-height: 520px), (pointer: coarse) and (max-width: 940px){
  .agbar__app{order:1;width:38px;height:38px;border-radius:10px;background:#1b1b1b}
}

/* то же окно поверх игры (bootstrap modal, $swMode = "modal"): влезает в экран, не влезло — прокрутка внутри окна */
.app-window-modal .modal-dialog{width:560px;max-width:calc(100% - 20px);margin:30px auto}
.app-window-modal .app-window{display:flex;flex-direction:column;width:100%;max-height:calc(100vh - 60px);margin:0}
.app-window-modal .modal-header{position:relative;flex:none;padding-left:36px;padding-right:36px}
.app-window-modal .modal-header .close{position:absolute;top:10px;right:12px;z-index:3;color:#ad835a;opacity:.9;text-shadow:none;font-size:26px}
.app-window-modal .modal-header .close:hover{color:#ecd19a}
.app-window-modal .modal-body{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;touch-action:pan-y;-webkit-overflow-scrolling:touch}
@media (max-height:520px){
  .app-window-modal .modal-dialog{margin:10px auto}
  .app-window-modal .app-window{max-height:calc(100vh - 20px)}
}