/* Perfect Plants Club – telepíthető app (PWA): telepítő sáv, iOS-útmutató, push-beállítások kártyái. */

/* Telepített appként (iOS black-translucent állapotsor): a fejléc a státuszsor alá csúszik. */
@media (display-mode: standalone) {
  html body .site-header{box-sizing:content-box;padding-top:env(safe-area-inset-top,0px)}
  html body{padding-top:env(safe-area-inset-top,0px)}
  html body .to-top{display:none}
}
@media (display-mode: standalone) and (max-width:900px) {
  html body .app-header .nav{top:calc(60px + env(safe-area-inset-top,0px))}
}

/* ---------- telepítő sáv ---------- */
.pwa-bar{position:fixed;z-index:240;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));width:min(440px,calc(100% - 24px));display:flex;align-items:center;gap:14px;padding:12px 12px 12px 14px;border-radius:22px;
  background:linear-gradient(160deg,rgba(28,46,33,.97),rgba(12,22,16,.97));border:1px solid rgba(232,189,104,.32);box-shadow:0 24px 60px -18px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,248,235,.07);
  color:var(--text,#f3efe4);transform:translate(-50%,140%);opacity:0;transition:transform .55s cubic-bezier(.2,.9,.25,1.15),opacity .35s}
.pwa-bar.show{transform:translate(-50%,0);opacity:1}
body.logged .pwa-bar{bottom:calc(18px + env(safe-area-inset-bottom,0px))}
@media (max-width:900px){ body.logged .pwa-bar{bottom:calc(84px + env(safe-area-inset-bottom,0px))} }
.pwa-bar-ic{flex:0 0 52px;width:52px;height:52px;border-radius:14px;box-shadow:0 8px 18px -6px rgba(0,0,0,.8),0 0 0 1px rgba(255,248,235,.1)}
.pwa-bar-txt{flex:1;min-width:0;display:grid;gap:2px}
.pwa-bar-txt strong{font:600 16px/1.2 'Playfair Display',Georgia,serif;letter-spacing:-.2px}
.pwa-bar-txt span{font-size:12.5px;line-height:1.4;color:var(--muted,#b9b5a6)}
.pwa-bar-go{flex:0 0 auto;min-height:40px;padding:0 16px;border:0;border-radius:999px;cursor:pointer;font:700 13.5px/1 'DM Sans',system-ui,sans-serif;color:#1b2414;background:linear-gradient(135deg,#efd59b,#d4a95a);box-shadow:0 8px 20px -8px rgba(216,180,106,.8)}
.pwa-bar-go:active{transform:scale(.96)}
.pwa-x{flex:0 0 auto;width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;cursor:pointer;background:rgba(255,248,235,.06);color:var(--muted,#b9b5a6)}
.pwa-x svg,.pwa-ios svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- iOS „Hozzáadás a kezdőképernyőhöz” lap ---------- */
.pwa-ios-bg{position:fixed;inset:0;z-index:260;background:rgba(4,8,6,.55);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);opacity:0;transition:opacity .3s}
.pwa-ios-bg.show{opacity:1}
.pwa-ios{position:fixed;z-index:261;left:0;right:0;bottom:0;margin:0 auto;max-width:520px;padding:10px 20px calc(22px + env(safe-area-inset-bottom,0px));border-radius:26px 26px 0 0;
  background:linear-gradient(180deg,#18281d,#0e1812);border:1px solid rgba(232,189,104,.28);border-bottom:0;box-shadow:0 -30px 70px -20px rgba(0,0,0,.9);color:var(--text,#f3efe4);
  transform:translateY(105%);transition:transform .5s cubic-bezier(.2,.9,.25,1)}
.pwa-ios.show{transform:translateY(0)}
.pwa-ios-grab{width:42px;height:5px;margin:0 auto 14px;border-radius:9px;background:rgba(255,248,235,.2)}
.pwa-ios-head{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.pwa-ios-head img{width:56px;height:56px;border-radius:15px;box-shadow:0 8px 18px -6px rgba(0,0,0,.8),0 0 0 1px rgba(255,248,235,.1)}
.pwa-ios-head strong{display:block;font:600 19px/1.2 'Playfair Display',Georgia,serif}
.pwa-ios-head span{display:block;margin-top:3px;font-size:13px;line-height:1.45;color:var(--muted,#b9b5a6)}
.pwa-ios-head .pwa-x{margin-left:auto;align-self:flex-start}
.pwa-steps{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:s}
.pwa-steps li{counter-increment:s;display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:rgba(255,248,235,.045);border:1px solid rgba(255,248,235,.08);font-size:14.5px;line-height:1.4}
.pwa-steps li::before{content:counter(s);flex:0 0 26px;height:26px;display:grid;place-items:center;border-radius:50%;font:700 13px/1 'DM Sans',sans-serif;color:#1b2414;background:linear-gradient(135deg,#efd59b,#d4a95a)}
.pwa-steps b{font-weight:600;color:#fff}
.pwa-key{display:inline-grid;place-items:center;width:30px;height:30px;margin-left:auto;flex:0 0 30px;border-radius:9px;background:rgba(255,255,255,.1);color:#5ab0ff}
.pwa-key svg{width:18px;height:18px}
.pwa-ios-ok{display:block;width:100%;margin-top:16px;min-height:46px;border:0;border-radius:999px;cursor:pointer;font:700 15px/1 'DM Sans',system-ui,sans-serif;color:#1b2414;background:linear-gradient(135deg,#efd59b,#d4a95a)}
.pwa-ios-arrow{display:block;width:26px;height:26px;margin:12px auto 0;color:#d8b46a;animation:pwaBob 1.4s ease-in-out infinite}
@keyframes pwaBob{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
.pwa-ios.ipad .pwa-ios-arrow{display:none}

/* ---------- Beállítások: push + app kártyák ---------- */
.push-card .push-status{display:flex;align-items:center;gap:10px;margin:0;padding:11px 14px;border-radius:14px;background:rgba(255,248,235,.045);border:1px solid var(--line,rgba(255,248,235,.1));font-size:14px;line-height:1.45;color:var(--muted,#b9b5a6)}
.push-status i{flex:0 0 10px;height:10px;border-radius:50%;background:#7d7a70;box-shadow:0 0 0 4px rgba(125,122,112,.18)}
.push-status[data-state="on"] i{background:#8fae76;box-shadow:0 0 0 4px rgba(143,174,118,.22)}
.push-status[data-state="on"]{color:var(--text,#f3efe4)}
.push-status[data-state="warn"] i{background:#d8b46a;box-shadow:0 0 0 4px rgba(216,180,106,.2)}
.push-status[data-state="off"] i{background:#c97a5a;box-shadow:0 0 0 4px rgba(201,122,90,.2)}
.push-opts{display:grid;transition:opacity .3s}
.push-opts[aria-disabled="true"]{opacity:.45;pointer-events:none}
.push-hour{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0;border-bottom:1px solid var(--line,rgba(255,248,235,.1))}
.push-hour strong{display:block;font-size:15px}
.push-hour small{display:block;margin-top:2px;font-size:13px;color:var(--muted,#b9b5a6);line-height:1.5}
.push-hour select{flex:0 0 auto;min-width:104px;min-height:42px;padding:0 34px 0 14px;border-radius:12px;border:1px solid var(--line,rgba(255,248,235,.14));background:rgba(255,248,235,.06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8b46a' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center/16px;color:var(--text,#f3efe4);font:600 15px 'DM Sans',sans-serif;appearance:none;-webkit-appearance:none}
.push-hour select option{background:#13201a;color:#f3efe4}
.push-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.pwa-card .pwa-lead{display:flex;align-items:center;gap:16px;margin:0}
.pwa-card .pwa-lead img{flex:0 0 64px;width:64px;height:64px;border-radius:17px;box-shadow:0 10px 24px -8px rgba(0,0,0,.85),0 0 0 1px rgba(255,248,235,.1)}
.pwa-card .pwa-lead p{margin:0;color:var(--muted,#b9b5a6);font-size:14.5px;line-height:1.6}
.pwa-feats{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.pwa-feats li{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;font-size:12.5px;background:rgba(143,174,118,.12);border:1px solid rgba(143,174,118,.25);color:#cfe0c1}
.pwa-feats .ic{width:14px;height:14px}
.pwa-done{display:flex;align-items:center;gap:10px;margin:0;padding:12px 14px;border-radius:14px;background:rgba(143,174,118,.12);border:1px solid rgba(143,174,118,.3);color:#d9e8cc;font-size:14px}
.pwa-card .pwa-steps li{font-size:14px}
.pwa-card [data-pwa-state][hidden]{display:none!important}
.push-actions .btn:disabled{opacity:.45;cursor:not-allowed}
.pwa-manual{margin:0;color:var(--muted,#b9b5a6);font-size:14px;line-height:1.6}

@media (max-width:560px){
  .pwa-bar{gap:10px;padding:10px 10px 10px 12px}
  .pwa-bar-ic{flex-basis:44px;width:44px;height:44px;border-radius:12px}
  .pwa-bar-txt span{display:none}
  .pwa-card .pwa-lead{align-items:flex-start}
  .pwa-card .pwa-lead img{flex-basis:52px;width:52px;height:52px;border-radius:14px}
}
@media (prefers-reduced-motion:reduce){.pwa-bar,.pwa-ios,.pwa-ios-bg{transition:none}.pwa-ios-arrow{animation:none}}