.smm-fw{
  --smm-accent:#ff6a3d;
  --smm-accent-2:#ff8a5b;
  --smm-active:#3aa6ff;
  --smm-vip:#7b5cff;
  --smm-bg:#fff;
  --smm-border:#e6e8ee;
  --smm-text:#1a1a1a;
  --smm-muted:#6b7280;
  font-family:inherit;color:var(--smm-text);
  max-width:600px;margin:0 auto;
}
.smm-fw *{box-sizing:border-box}

/* VIP toggle pill */
.smm-fw__vip-toggle{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;border:1px solid #e9d5ff;border-radius:999px;
  background:#fff;margin-bottom:14px;
}
.smm-fw__vip-text{flex:1;font-weight:500;color:#374151}
.smm-fw__help{
  width:22px;height:22px;border-radius:50%;background:#f3f4f6;
  display:inline-flex;align-items:center;justify-content:center;
  color:#9ca3af;font-size:12px;cursor:help;
}
.smm-fw__switch{position:relative;display:inline-block;width:40px;height:22px;flex-shrink:0}
.smm-fw__switch input{opacity:0;width:0;height:0}
.smm-fw__slider{
  position:absolute;inset:0;background:#e5e7eb;border-radius:999px;
  transition:.2s;cursor:pointer;
}
.smm-fw__slider:before{
  content:"";position:absolute;width:16px;height:16px;left:3px;top:3px;
  background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2);
}
.smm-fw__switch input:checked + .smm-fw__slider{background:var(--smm-vip)}
.smm-fw__switch input:checked + .smm-fw__slider:before{transform:translateX(18px)}

/* Card */
.smm-fw__card{
  background:var(--smm-bg);border:1px solid var(--smm-border);
  border-radius:16px;overflow:hidden;
  box-shadow:0 4px 24px rgba(15,23,42,.06);
}

/* Tabs */
.smm-fw__tabs{display:flex;gap:3px;padding:14px 14px 0}
.smm-fw__tab{
  position:relative;flex:1;background:#fff;border:1px solid var(--smm-border);
  border-bottom:none;border-radius:12px 12px 0 0;
  padding:14px 10px 18px;cursor:pointer;text-align:left;
  font-weight:600;font-size:14px;line-height:1.25;color:var(--smm-text);
  transition:.2s;
}
.smm-fw__tab-badge{
  position:absolute;top:-10px;left:10px;
  background:var(--smm-accent);color:#fff;font-size:10px;font-weight:700;
  padding:3px 8px;border-radius:6px;letter-spacing:.5px;
}
.smm-fw__tab--active.is-active{background:var(--smm-active);color:#fff;border-color:var(--smm-active)}
.smm-fw__tab--vip.is-active{background:var(--smm-vip);color:#fff;border-color:var(--smm-vip)}
.smm-fw__tab--hq.is-active{background:#fff;border-color:#d1d5db;box-shadow:0 -2px 0 var(--smm-text) inset}
.smm-fw__tab--vip .smm-fw__tab-badge{background:var(--smm-vip)}

/* Body */
.smm-fw__body{padding:22px 18px 20px;background:#fff;border-top:1px solid var(--smm-border)}
.smm-fw__loading{padding:30px;text-align:center;color:var(--smm-muted)}

/* Variation tiles */
.smm-fw__variations{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px;
}
.smm-fw__var{
  position:relative;border:1px solid var(--smm-border);border-radius:12px;
  padding:14px 6px 12px;text-align:center;cursor:pointer;background:#fff;
  transition:.15s;
}
.smm-fw__var:hover{border-color:#cbd5e1}
.smm-fw__var.is-selected{
  border-color:var(--smm-accent);
  background:linear-gradient(135deg,var(--smm-accent),var(--smm-accent-2));
  color:#fff;box-shadow:0 6px 16px rgba(255,106,61,.35);
}
.smm-fw__var-qty{font-size:18px;font-weight:700;line-height:1}
.smm-fw__var-save{font-size:11px;color:var(--smm-accent);margin-top:6px;font-weight:600}
.smm-fw__var.is-selected .smm-fw__var-save{color:#fff}
.smm-fw__var-badge{
  position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  font-size:9px;font-weight:700;padding:3px 8px;border-radius:6px;color:#fff;white-space:nowrap;
}
.smm-fw__var--best .smm-fw__var-badge{background:#22c55e}
.smm-fw__var--bulk .smm-fw__var-badge{background:linear-gradient(90deg,var(--smm-accent),var(--smm-accent-2))}
.smm-fw__var--bulk{border-color:var(--smm-accent)}

/* Summary */
.smm-fw__summary{text-align:center}
.smm-fw__title{font-size:18px;font-weight:600;margin-bottom:10px}
.smm-fw__price-row{display:flex;align-items:baseline;justify-content:center;gap:10px;margin-bottom:14px}
.smm-fw__price{font-size:26px;font-weight:700}
.smm-fw__price-old{color:#9ca3af;text-decoration:line-through;font-size:15px}
.smm-fw__cta{
  width:100%;border:none;cursor:pointer;color:#fff;font-weight:700;letter-spacing:1px;
  padding:14px 20px;border-radius:999px;font-size:15px;
  background:linear-gradient(90deg,var(--smm-accent),var(--smm-accent-2));
  box-shadow:0 8px 20px rgba(255,106,61,.35);transition:.15s;
}
.smm-fw__cta:hover{transform:translateY(-1px)}
.smm-fw__cta:disabled{opacity:.6;cursor:not-allowed}
.smm-fw__save{color:var(--smm-accent);font-weight:600;margin-top:10px;font-size:13px;min-height:18px}
.smm-fw__msg{margin-top:8px;font-size:13px;min-height:18px}
.smm-fw__msg.is-error{color:#dc2626}
.smm-fw__msg.is-success{color:#16a34a}

@media (max-width:600px){
  /* Tabs scroll container */
  .smm-fw__tabs{
    overflow-x: auto;
    overflow-y: visible;
    flex-wrap: nowrap;
    gap: 4px;
    padding: 14px 14px 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;        /* Firefox */
    -ms-overflow-style: none;     /* IE/Edge */
  }
  .smm-fw__tabs::-webkit-scrollbar{ display: none; }  /* Chrome/Safari */

  /* Tabs: fixed min-width, no flex-grow */
  .smm-fw__tab{
    flex: 0 0 auto;
    min-width: 130px;
    font-size: 13px;
    padding: 12px 14px 18px;
  }
  .smm-fw__variations{grid-template-columns:repeat(3,1fr)}
}

@media (max-width:380px){
  .smm-fw__tab{ min-width: 110px; font-size: 12px; }
}

/* ===== 2-TIER WIDGET OVERRIDES ===== */
.smm-fw--2tier .smm-fw__tab {
  font-size: 15px;
  padding: 16px 12px 20px;
}
@media (max-width: 600px) {
  .smm-fw--2tier .smm-fw__tab { min-width: 150px; }
}

/* ===== SINGLE-TIER WIDGET ===== */
.smm-fw--single {
  --smm-deal: #7b5cff;
}
.smm-fw__card--notabs {
  border-radius: 16px; /* full radius, no tab cut */
}
.smm-fw__card--notabs .smm-fw__body {
  border-top: none;
  padding-top: 24px;
}

/* BEST DEAL badge */
.smm-fw__var--deal .smm-fw__var-badge {
  background: var(--smm-deal);
}
.smm-fw__var--deal {
  border-color: var(--smm-deal);
}
.smm-fw__var--deal.is-selected {
  background: linear-gradient(135deg, var(--smm-deal), #a07bff);
  border-color: var(--smm-deal);
  box-shadow: 0 6px 16px rgba(123,92,255,.35);
}