:root {
  --accent:#1c9718;
  --accent-hover:#178312;
  --dark:#333;
  --gray:#555;
  --border:#ddd;
  --bg-light:#fff;
  --overlay:rgba(0,0,0,0.6);
  --radius:8px;
  --transition:0.35s ease;
  --font-small:12px;
  --font-medium:16px;
  --font-large:24px;
}

.flex-center { display:flex; align-items:center; justify-content:center; }

.widget, #widget-container {
  position:fixed; z-index:9999; opacity:0; visibility:hidden;
  transform:translateY(20px);
  transition:opacity var(--transition), transform var(--transition);
}
.widget.active, #widget-container.active {
  opacity:1; visibility:visible; transform:translateY(0);
}

body.popup-open { overflow:hidden; }

#backToTop {
  right:23px; bottom:100px;
  width:60px; height:60px; border-radius:50%;
  background:var(--accent); color:#fff; font-size:34px;
  box-shadow:0 2px 10px rgba(0,0,0,0.2);
  cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background 0.3s,color 0.3s,transform 0.3s;
}
#backToTop:hover, #backToTop:focus-visible {
  background:white; color:var(--accent); transform:scale(1.1);
  outline:none;
}

#subscribe-popup {
  position:fixed; top:50%; left:50%;
  background:var(--bg-light); border-radius:var(--radius);
  box-shadow:0 4px 20px rgba(0,0,0,0.15);
  transform:translate(-50%,-50%) scale(0.95);
  opacity:0; visibility:hidden; z-index:1000;
  width:90%; max-width:400px; max-height:90vh;
  padding:30px; text-align:center;
  font-family:Arial,sans-serif;
  transition:opacity var(--transition), transform var(--transition);
  will-change:transform,opacity;
  overflow-y:auto;
}
#subscribe-popup.active { opacity:1; visibility:visible; transform:translate(-50%,-50%) scale(1); }

#overlay {
  position:fixed; inset:0; background:var(--overlay);
  opacity:0; visibility:hidden; transition:opacity var(--transition); z-index:999;
}
#overlay.active { opacity:1; visibility:visible; }

.close-btn {
  position:absolute; top:15px; right:15px;
  font-size:22px; color:#666; background:none;
  border:none; cursor:pointer;
}
.close-btn:hover, .close-btn:focus-visible { color:var(--accent); }

.title { font-size:var(--font-large); font-weight:bold; color:var(--dark); margin-bottom:5px; }
.subtitle { font-size:var(--font-medium); color:var(--gray); line-height:1.5; }
.promo-code, .highlight { color:var(--accent); font-weight:bold; display:inline-block; margin:5px 0; }

.divider { height:1px; background:#eee; margin:20px 0; }

.form-group { margin-bottom:15px; text-align:left; position:relative; }
.form-label { display:block; font-size:14px; color:var(--dark); margin-bottom:5px; font-weight:bold; }
.form-label.required::after { content:" *"; color:var(--accent); }
.form-input { width:100%; padding:10px; border:1px solid var(--border); border-radius:4px; font-size:14px; box-sizing:border-box; }
.error-message { color:var(--accent); font-size:var(--font-small); margin-top:3px; display:none; text-align:left; }

.submit-btn {
  width:100%; padding:12px 10px; font-size:16px;
  font-weight:bold; border:none; border-radius:4px;
  background:var(--accent); color:#fff; cursor:pointer; box-sizing:border-box;
  transition:background 0.3s;
}
.submit-btn:hover, .submit-btn:focus-visible { background:var(--accent-hover); outline:none; }

.privacy { font-size:var(--font-small); color:#666; margin-top:20px; line-height:1.5; }
.privacy a { color:var(--accent) !important; text-decoration:none; }

#widget-container { bottom:100px; left:23px; }
#widget-button {
  background:var(--accent); color:white; border:none;
  border-radius:50%; width:60px; height:60px; padding:0;
  font-size:16px; font-weight:bold; cursor:pointer;
  box-shadow:0 4px 15px rgba(28,151,24,0.4);
  display:flex; align-items:center; justify-content:center;
  transition:all 0.3s;
}
#widget-button:hover, #widget-button:focus-visible { background:white; transform:scale(1.1); outline:none; }
#widget-button:hover .widget-icon svg { fill:var(--accent); }
#widget-button .widget-icon svg { fill:white; transition:fill 0.3s; width:28px; height:28px; }
#widget-button .widget-text { display:none; }

@media(max-width:980px){
  #widget-button { width:auto;height:auto;padding:12px 20px;border-radius:30px; }
  #widget-button .widget-icon { display:none; }
  #widget-button .widget-text { display:inline; color:white; }
  #widget-container { bottom:30px; left:20px; }
  #backToTop { right:20px; bottom:100px; width:64px; height:64px; font-size:44px; }
  #backToTop:hover,#backToTop:active { transform:none; background:var(--accent); color:#fff; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition:none !important; }
}