/* Buyzon shared theme + header + footer — ONE file for ALL pages */
:root{
  --bg:#FAFAFA;--surface:#FFFFFF;--surface-2:#F5F5F5;--surface-hover:#EEEEEE;
  --border:#E0E0E0;--border-light:#F0F0F0;
  --text:#212121;--text-dim:#757575;--text-light:#BDBDBD;
  --accent:#E53935;--accent-hover:#C62828;--accent-glow:rgba(229,57,53,.06);--accent-orange:#E53935;
  --green:#E53935;--red:#E53935;--blue:#E53935;
  --badge-hot:#E53935;--badge-new:#E53935;--badge-top:#E53935;--badge-top-text:#fff;
  --radius:12px;--radius-lg:16px;
  --font:'Outfit',system-ui,-apple-system,sans-serif;
  --shadow:0 1px 4px rgba(0,0,0,.04),0 0 0 1px rgba(0,0,0,.02);
  --shadow-hover:0 8px 24px rgba(0,0,0,.06),0 0 0 1px rgba(0,0,0,.03);
  --ease:cubic-bezier(.25,1,.5,1);--dur:.2s
}
[dir="rtl"]{--font:'Noto Sans Hebrew','Noto Sans Arabic','Outfit',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
html{max-width:100%}
body{max-width:100%;overflow-x:hidden;font-family:var(--font);background:var(--bg);color:var(--text);min-height:100vh;line-height:1.5;font-size:15px;-webkit-font-smoothing:antialiased}
.topbar{position:-webkit-sticky;position:sticky;top:0;z-index:450;max-width:1280px;margin:0 auto;padding:.75rem 1.5rem;display:flex;align-items:center;gap:.5rem;isolation:isolate}
.topbar::before{content:"";position:absolute;top:0;right:calc((100vw - 100%)/-2);bottom:0;left:calc((100vw - 100%)/-2);background:rgba(250,250,250,.94);border-bottom:1px solid var(--border-light);box-shadow:0 6px 24px rgba(0,0,0,.04);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:-1}
.topbar .logo{flex-shrink:0;order:0;margin-right:auto}
.topbar .logo .logo-icon{height:80px;width:auto}
.topbar .logo .logo-head{display:none;height:36px;width:auto}
.topbar-search{flex:1;max-width:420px;order:2}
.topbar-search input{width:100%;padding:0 1rem;border-radius:10px;border:none;background:var(--surface);color:var(--text);font-size:.9rem;font-family:var(--font);outline:none;transition:box-shadow .2s;height:40px;box-shadow:var(--shadow)}
.topbar-search input::placeholder{color:var(--text-light)}
.topbar-search input:focus{box-shadow:0 0 0 3px rgba(0,0,0,.08),var(--shadow)}
.topbar-tools{display:flex;align-items:center;gap:.5rem;flex-shrink:0;order:3}
.topbar-right{display:flex;align-items:center;gap:.5rem;flex-shrink:0;order:4}
.settings-wrap{position:relative}
.settings-btn{background:var(--surface);border:none;border-radius:10px;padding:0 12px;cursor:pointer;color:var(--text-dim);font-size:.78rem;display:inline-flex;align-items:center;gap:4px;font-family:var(--font);transition:all .15s;height:40px;box-shadow:var(--shadow)}
.settings-btn:hover{color:var(--text);box-shadow:var(--shadow-hover)}
.settings-btn svg{flex-shrink:0}
.settings-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);border:none;border-radius:var(--radius-lg);padding:1rem;z-index:200;min-width:230px;box-shadow:0 8px 40px rgba(0,0,0,.12)}
.settings-menu.open{display:flex;flex-direction:column;gap:.5rem}
.settings-menu label{font-size:.68rem;color:var(--text-light);font-weight:600;text-transform:uppercase;letter-spacing:.06em}
.settings-menu select{font-family:var(--font);font-size:.85rem;background:var(--bg);color:var(--text);border:none;border-radius:8px;padding:.4rem .6rem;cursor:pointer;width:100%}
.settings-menu .search-select{width:100%;position:relative}
.settings-menu .ss-display{width:100%;box-sizing:border-box;border-radius:8px;color:var(--text)}
.theme-toggle{display:none!important}
.mob-drawer .theme-toggle{display:none!important}
.hamburger{display:none;background:var(--surface);border:none;border-radius:10px;padding:8px;cursor:pointer;color:var(--text-dim);transition:all .15s;order:0;box-shadow:var(--shadow);position:relative;z-index:501}
.hamburger:hover{color:var(--text)}
.mob-search{display:none;flex:1;order:2}
.mob-drawer{display:none;position:fixed;top:0;right:0;bottom:0;width:85%;max-width:340px;background:var(--surface);z-index:500;padding:1.5rem;overflow-y:auto;box-shadow:-12px 0 60px rgba(0,0,0,.1);flex-direction:column;gap:.8rem}
.mob-drawer.open{display:flex}
.drawer-section{display:flex;flex-wrap:wrap;gap:.6rem;border-bottom:1px solid var(--border-light);padding-bottom:1rem;margin-bottom:.2rem}
.drawer-label{width:100%;font-size:.68rem;font-weight:600;color:var(--text-light);text-transform:uppercase;letter-spacing:.06em}
.drawer-nav-link{color:var(--text);text-decoration:none;font-size:.88rem;font-weight:500;line-height:1.25}
.drawer-telegram-link{display:inline-flex;align-items:center;justify-content:center;gap:.45rem;width:100%;min-height:42px;padding:.72rem .9rem;border-radius:10px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);text-decoration:none;font-size:.88rem;font-weight:600;box-shadow:var(--shadow);transition:all .12s}
.drawer-telegram-link:hover{background:var(--surface);box-shadow:var(--shadow-hover)}
.drawer-telegram-link svg{flex-shrink:0;fill:currentColor!important}
.drawer-telegram-link svg path{fill:currentColor!important}
.settings-row{display:flex;gap:.4rem;flex-wrap:wrap;width:100%}
.settings-row select{flex:1;font-family:var(--font);font-size:.88rem;padding:.55rem .6rem;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);height:42px}
@media(max-width:1000px){.topbar .logo .logo-icon{display:none}.topbar .logo .logo-head{display:block;height:48px;width:auto}}
@media(max-width:768px){
  .topbar::before{left:0;right:0}
  .topbar .logo{order:0;margin-right:0;margin-left:0}
  .mob-search{order:1}
  .hamburger{order:2}
  .topbar-tools{order:3}
  .topbar-right{order:4}
  #source-filters{display:none!important}
  .topbar-search,.topbar-right .settings-wrap{display:none}
  .site-nav{display:none!important}
  .hamburger,.mob-search{display:flex}
  .topbar .mob-theme{display:none!important}
  .topbar{padding:.6rem 1rem}
  .topbar .logo .logo-icon{display:block;height:40px;width:auto}
  .topbar .logo .logo-head{display:none;height:32px;width:auto}
  .mob-search input{width:100%;padding:0 1rem;border-radius:10px;border:none;background:var(--surface);color:var(--text);font-size:.88rem;font-family:var(--font);height:38px;box-shadow:var(--shadow)}
  .topbar.search-active .logo .logo-icon{display:none!important}
  .topbar.search-active .logo .logo-head{display:block!important;height:32px}
  .mob-drawer{left:auto;right:0}
}
.site-nav{display:flex;gap:.5rem;padding:0;order:1}
.tg-nav-btn{display:inline-flex;align-items:center;justify-content:center;height:40px;min-width:40px;padding:0 12px;border-radius:10px;background:var(--surface);color:var(--text-dim);text-decoration:none;transition:all .12s;flex-shrink:0;box-shadow:var(--shadow)}
.tg-nav-btn:hover{color:#229ED9;box-shadow:var(--shadow-hover)}
.tg-nav-btn svg{flex-shrink:0;fill:currentColor!important}
.tg-nav-btn svg path{fill:currentColor!important}
.site-nav a{color:var(--text-dim);text-decoration:none;font-size:.85rem;font-weight:500;padding:0 .9rem;border-radius:8px;transition:all .12s;background:var(--surface);box-shadow:var(--shadow);height:40px;display:inline-flex;align-items:center;white-space:nowrap}
.site-nav a:hover{color:var(--text);background:var(--surface);box-shadow:var(--shadow-hover)}
.site-nav a.nav-active,
.drawer-nav-link.nav-active{color:#fff;background:var(--text);font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.site-nav a.nav-active:hover,
.drawer-nav-link.nav-active:hover{color:#fff;background:var(--text);box-shadow:0 2px 8px rgba(0,0,0,.15)}
.site-nav a[style*="accent"]{color:#fff!important;background:var(--text)!important;font-weight:600!important;box-shadow:0 2px 8px rgba(0,0,0,.15)!important}
.site-nav a.coupon-nav-link,
.drawer-nav-link.coupon-nav-link{gap:.35rem;color:#fff;background:var(--accent);font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.site-nav a.coupon-nav-link:hover,
.drawer-nav-link.coupon-nav-link:hover{color:#fff;background:var(--accent-hover);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.site-nav a.coupon-nav-link:active,
.site-nav a.coupon-nav-link.coupon-popup-active{color:#fff;background:var(--text);font-weight:600;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.site-nav a.coupon-nav-link .badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.35rem;height:1.35rem;padding:0 .35rem;border-radius:999px;background:var(--surface-2);color:var(--text);font-size:.68rem;font-weight:700;line-height:1}
.drawer-nav-link.coupon-nav-link .badge{display:inline-flex;align-items:center;justify-content:center;min-width:1.35rem;height:1.35rem;padding:0 .35rem;border-radius:999px;background:rgba(255,255,255,.16);color:#fff;font-size:.68rem;font-weight:700;line-height:1}
.site-nav a.coupon-nav-link:active .badge,
.site-nav a.coupon-nav-link.coupon-popup-active .badge{background:rgba(255,255,255,.16);color:#fff}


/* RTL header */
[dir="rtl"] .topbar{direction:rtl}
[dir="rtl"] .topbar .logo{margin-right:0;margin-left:auto}

[dir="rtl"] .topbar-search input{text-align:right;direction:rtl}
[dir="rtl"] .topbar-right{}
[dir="rtl"] .settings-menu{right:auto;left:0;text-align:right;direction:rtl}
[dir="rtl"] .settings-menu select{direction:rtl;text-align:right}
[dir="rtl"] .settings-menu input{direction:rtl;text-align:right}
[dir="rtl"] .settings-btn{direction:rtl}
[dir="rtl"] .settings-menu label{text-align:right}
[dir="rtl"] .site-nav{direction:rtl}
[dir="rtl"] .drawer-section{direction:rtl;text-align:right}
[dir="rtl"] .drawer-label{text-align:right}
[dir="rtl"] .settings-row{direction:rtl}
[dir="rtl"] .settings-row select{direction:rtl;text-align:right}
[dir="rtl"] .mob-drawer{left:0;right:auto;border-left:none;border-right:1px solid var(--border)}

/* Country search input inside settings */
.settings-menu input[type="text"]{font-family:var(--font);font-size:.85rem;background:var(--bg);color:var(--text);border:none;border-radius:8px;padding:.4rem .6rem;width:100%;outline:none;box-shadow:inset 0 0 0 1px var(--border)}
.settings-menu input[type="text"]:focus{box-shadow:inset 0 0 0 1px var(--text)}
.settings-menu input[type="text"]::placeholder{color:var(--text-light)}

/* Search-select dropdown styling */
.ss-dropdown{position:relative;display:none}
.ss-dropdown.open{display:block;position:absolute;top:100%;left:0;right:0;background:var(--surface);border-radius:8px;box-shadow:0 8px 40px rgba(0,0,0,.12);z-index:300;overflow:hidden}
.ss-display{background:var(--bg);border:none;border-radius:8px;padding:.4rem 1.8rem .4rem .6rem;font-family:var(--font);font-size:.85rem;color:var(--text);cursor:pointer;width:100%;position:relative;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ss-display::after{content:'\25BE';position:absolute;right:.6rem;top:50%;transform:translateY(-50%);color:var(--text-light);font-size:.7rem;pointer-events:none}
[dir="rtl"] .ss-display{padding:.4rem .6rem .4rem 1.8rem}
[dir="rtl"] .ss-display::after{right:auto;left:.6rem}
.ss-options{max-height:200px;overflow-y:auto}
.ss-dropdown.open .ss-options{display:block}
.ss-dropdown [data-v]{padding:.4rem .6rem;cursor:pointer;font-size:.82rem;transition:background .1s}
.ss-dropdown [data-v]:hover{background:var(--bg)}
.ss-dropdown [data-v].selected{background:rgba(0,0,0,.05);color:var(--text);font-weight:600}
.ss-dropdown input{width:100%;padding:.5rem .6rem;border:none;border-bottom:1px solid var(--border-light);font-family:var(--font);font-size:.82rem;outline:none;background:var(--surface);color:var(--text);box-sizing:border-box}

/* Footer */
footer{max-width:1280px;margin:3rem auto 0;padding:2rem 1.5rem 1.5rem;border-top:1px solid var(--border-light);text-align:center}
footer .copyright{font-size:.8rem;color:var(--text-dim);font-weight:500;margin-bottom:.3rem}
footer .footer-sub{font-size:.7rem;color:var(--text-light);line-height:1.5;max-width:640px;margin:0 auto}
footer .footer-links{display:flex;gap:1.5rem;justify-content:center;margin-bottom:.5rem;flex-wrap:wrap}
footer .footer-links a{color:var(--text-dim);text-decoration:none;font-size:.82rem;font-weight:500}
footer .footer-links a:hover{color:var(--text)}
[dir="rtl"] footer{direction:rtl;text-align:right}

.mob-drawer a{font-size:1rem!important;padding:.5rem 0!important;font-weight:500!important}
.mob-drawer .drawer-nav-link{display:block;width:100%;padding:.15rem 0!important;background:transparent!important;box-shadow:none!important;border-radius:0!important}
.mob-drawer .drawer-nav-link:hover{background:transparent!important;box-shadow:none!important;color:var(--text)!important}
.mob-drawer .drawer-nav-link.nav-active,
.mob-drawer .drawer-nav-link.nav-active:hover{background:transparent!important;box-shadow:none!important;color:var(--text)!important;font-weight:700!important}
.mob-drawer .drawer-nav-link.coupon-nav-link,
.mob-drawer .drawer-nav-link.coupon-nav-link:hover,
.mob-drawer .drawer-nav-link.coupon-nav-link:active,
.mob-drawer .drawer-nav-link.coupon-nav-link.coupon-popup-active{background:transparent!important;box-shadow:none!important;color:var(--text)!important;font-weight:700!important}
.mob-drawer .drawer-nav-link.coupon-nav-link .badge{background:transparent!important;color:var(--text-dim)!important;min-width:auto!important;height:auto!important;padding:0!important}
.mob-drawer .drawer-telegram-link{font-size:.88rem!important;padding:.72rem .9rem!important;font-weight:600!important}
@media(max-width:768px){.ad-slot{display:none}}
/* Theme buttons in drawer — HIDDEN */
.mob-drawer .theme-btn{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.5rem .8rem;cursor:pointer;color:var(--text-dim);display:flex;align-items:center;gap:.3rem;transition:all .12s}
.mob-drawer .theme-btn:hover{border-color:var(--text);color:var(--text)}
.mob-drawer .theme-btn.active{background:var(--text);border-color:var(--text);color:#fff}
.mob-drawer .theme-btn.active svg{stroke:#fff}

/* Desktop source/category filters centered */
@media(min-width:769px){
  .source-filters{justify-content:center}
  .filters{justify-content:center}
}

/* Drawer overlay — blocks bg when open */
.mob-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:499;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
.mob-overlay.open{display:block}



/* Drawer store buttons */
.mob-drawer .source-filters{flex-wrap:wrap!important;gap:.4rem!important;justify-content:center!important;padding:0!important;overflow:visible!important}
.mob-drawer .src-btn{height:34px;padding:0 .8rem;font-size:.8rem}
