/* ==========================================================================
   Gyta Buyback demo chrome — sandbox bar + dark sticky header + dark footer.
   Injected via wp_body_open / wp_footer (theme-agnostic; no Elementor deps).
   ========================================================================== */

/* ----- DEMO / SANDBOX BAR ----- */
.gyta-demobar { background:#030712; color:#cbd2e0; font-family:'Open Sans',sans-serif; font-size:.8rem; border-bottom:1px solid #1f2937; }
.gyta-demobar-inner { max-width:80rem; margin:0 auto; padding:.5rem 1.5rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.gyta-demobar-left { display:flex; align-items:center; gap:.6rem; min-width:0; }
.gyta-testpill { display:inline-flex; align-items:center; gap:.35rem; background:#F59E0B; color:#1a1205; font-weight:800; font-size:.68rem; letter-spacing:.04em; text-transform:uppercase; padding:.22rem .55rem; border-radius:.3rem; white-space:nowrap; }
.gyta-testpill .g-pulse { width:.4rem; height:.4rem; background:#1a1205; }
.gyta-demobar-note { color:#9ca3af; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.gyta-demobar-right { display:flex; align-items:center; gap:.85rem; flex-shrink:0; }
.gyta-tourbtn { display:inline-flex; align-items:center; gap:.4rem; background:rgba(255,255,255,.06); border:1px solid #374151; color:#e5e7eb; border-radius:.45rem; padding:.3rem .65rem; cursor:pointer; font-family:'Open Sans',sans-serif; font-size:.78rem; font-weight:600; transition:background .15s,border-color .15s; }
.gyta-tourbtn:hover { background:rgba(255,255,255,.12); border-color:var(--g-brand-400); }
.gyta-try { display:inline-flex; align-items:center; gap:.35rem; background:var(--g-brand-500); color:#fff !important; border-radius:.45rem; padding:.32rem .7rem; font-weight:700; font-size:.78rem; text-decoration:none; white-space:nowrap; transition:background .15s; }
.gyta-try:hover { background:var(--g-brand-600); }
.gyta-reset { color:#9ca3af; text-decoration:none; white-space:nowrap; }
.gyta-reset:hover { color:var(--g-brand-300); }

/* ===== PRIMARY STORE-MODE SWITCHER (the demo's spine — sits above everything) ===== */
.gyta-modebar { background:linear-gradient(90deg,var(--g-brand-700) 0%,var(--g-brand-500) 100%); color:#fff; box-shadow:0 2px 10px rgba(0,0,0,.18); position:relative; z-index:60; }
.gyta-modebar-inner { max-width:80rem; margin:0 auto; padding:.7rem 1.5rem; display:flex; align-items:center; justify-content:center; gap:1.1rem; flex-wrap:wrap; }
.gyta-modebar-label { font-weight:800; font-size:.95rem; letter-spacing:.01em; white-space:nowrap; }
.gyta-modebar-hint { font-weight:400; opacity:.8; font-size:.82rem; }
.gyta-modetabs { display:inline-flex; background:rgba(0,0,0,.20); border-radius:.7rem; padding:.28rem; gap:.28rem; }
.gyta-modetab { display:inline-flex; align-items:center; padding:.55rem 1.5rem; border-radius:.5rem; color:#fff; text-decoration:none; font-weight:800; font-size:1rem; letter-spacing:.01em; transition:background .15s,color .15s,box-shadow .15s; white-space:nowrap; }
.gyta-modetab:hover { background:rgba(255,255,255,.16); }
.gyta-modetab.is-active { background:#fff; color:var(--g-brand-700); box-shadow:0 3px 10px rgba(0,0,0,.22); }
.gyta-modebar-desc { font-size:.86rem; opacity:.96; max-width:36rem; line-height:1.35; }
@media (max-width:820px){
	.gyta-modebar-inner { gap:.55rem; padding:.55rem 1rem; }
	.gyta-modebar-desc { flex-basis:100%; text-align:center; font-size:.8rem; }
	.gyta-modetab { padding:.5rem 1.05rem; font-size:.92rem; }
	.gyta-modebar-hint { display:none; }
}

/* ===== "Try selling a device" — pulse every 5s until first click ===== */
@keyframes gtaTryBlink {
	0%, 80%, 100% { box-shadow:0 0 0 0 rgba(232,99,78,0); transform:none; }
	88% { box-shadow:0 0 0 5px rgba(255,255,255,.45); transform:scale(1.05); }
	95% { box-shadow:0 0 0 0 rgba(232,99,78,0); transform:none; }
}
.gyta-try.gyta-blink { animation:gtaTryBlink 5s ease-in-out infinite; }

/* ----- DARK STICKY HEADER ----- */
.gyta-header { position:sticky; top:0; z-index:50; background:rgba(17,24,39,.95); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border-bottom:1px solid #1f2937; box-shadow:0 1px 2px rgba(0,0,0,.08); }
.gyta-nav { max-width:80rem; margin:0 auto; padding:0 1rem; height:62px; display:flex; align-items:center; justify-content:space-between; }
.gyta-brand { display:inline-flex; align-items:center; gap:.6rem; text-decoration:none; }
.gyta-logo { height:34px !important; width:auto !important; max-width:none !important; display:block; }
.gyta-brand-name { color:#fff; font-weight:800; font-size:1.05rem; letter-spacing:-.01em; }
.gyta-demobadge { display:inline-flex; align-items:center; background:rgba(232,99,78,.18); color:var(--g-brand-300); border:1px solid rgba(240,165,149,.4); font-size:.6rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; padding:.18rem .42rem; border-radius:.3rem; }
.gyta-nav-links { display:flex; align-items:center; gap:1.6rem; }
.gyta-nav-link { font-family:'Open Sans',sans-serif; font-size:.875rem; font-weight:600; color:#d1d5db; text-decoration:none; transition:color .15s; white-space:nowrap; }
.gyta-nav-link:hover { color:var(--g-brand-300); }
.gyta-getplugin { color:#9ca3af !important; }
.gyta-getplugin:hover { color:var(--g-brand-300) !important; }
.gyta-btn-primary { display:inline-flex; align-items:center; justify-content:center; gap:.35rem; padding:.5rem 1rem; background:var(--g-brand-500); color:#fff !important; font-family:'Open Sans',sans-serif; font-size:.875rem; font-weight:700; border-radius:.5rem; text-decoration:none; transition:background .15s; box-shadow:0 1px 2px rgba(0,0,0,.1); }
.gyta-btn-primary:hover { background:var(--g-brand-600); }
.gyta-nav-toggle { display:none; background:none; border:0; color:#d1d5db; padding:.5rem; cursor:pointer; }
.gyta-nav-toggle:hover { color:var(--g-brand-300); }
.gyta-mobile-menu { display:none; flex-direction:column; gap:.75rem; padding:0 1rem 1rem; background:rgba(17,24,39,.98); }
.gyta-mobile-menu.open { display:flex; }
.gyta-mobile-menu .gyta-nav-link { padding:.25rem 0; }

@media (max-width:860px){
	.gyta-nav-links { display:none; }
	.gyta-nav-toggle { display:inline-flex; }
}
@media (max-width:760px){
	.gyta-demobar-note { display:none; }
	.gyta-demobar-inner { padding:.45rem 1rem; gap:.4rem .7rem; flex-wrap:wrap; justify-content:flex-start; }
}
@media (max-width:480px){
	.gyta-demobar-right { gap:.55rem; }
	.gyta-brand-name { font-size:.95rem; }
}

/* ----- DARK FOOTER ----- */
.gyta-footer { background:#030712; color:#9ca3af; padding:4rem 0 2.5rem; font-family:'Open Sans',sans-serif; }
.gyta-footer-inner { max-width:80rem; margin:0 auto; padding:0 1.5rem; }
.gyta-footer-cols { display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.gyta-footer h4 { color:#fff; font-size:.95rem; font-weight:700; margin:0 0 1rem; }
.gyta-footer ul { list-style:none; margin:0; padding:0; }
.gyta-footer li { margin-bottom:.7rem; }
.gyta-footer a { color:#9ca3af; font-size:.875rem; text-decoration:none; transition:color .15s; }
.gyta-footer a:hover { color:var(--g-brand-300); }
.gyta-footer-brand { display:inline-flex; align-items:center; gap:.55rem; }
.gyta-footer-logo { height:26px; width:auto; display:block; }
.gyta-footer-brand b { color:#fff; font-weight:800; }
.gyta-footer-bottom { border-top:1px solid #1f2937; margin-top:3rem; padding-top:2rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem; font-size:.8125rem; color:#9ca3af; }
.gyta-footer-bottom a { color:#d1d5db; text-decoration:none; }
.gyta-footer-bottom a:hover { color:var(--g-brand-300); }

@media (max-width:880px){ .gyta-footer-cols { grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .gyta-footer-cols { grid-template-columns:1fr; } }