/*
Theme Name: Supplement Review Auto
Theme URI: https://example.com
Author: Sujon
Description: Product review theme for affiliate supplement sites. Paste the official product URL and affiliate link, upload your content, and the product photo, CTA buttons and rating box are placed automatically.
Version: 1.0
Text Domain: sr-auto
*/

:root{
  --brand:#0f9d58;
  --brand-dark:#0b7a43;
  --accent:#ff7a00;
  --bg:#f7f8fa;
  --card:#ffffff;
  --text:#1c1f24;
  --muted:#5b6470;
  --border:#e6e8ec;
  --radius:14px;
  --maxw:860px;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
}
a{color:var(--brand-dark);}
img{max-width:100%;height:auto;display:block;}

.sr-wrap{max-width:var(--maxw);margin:0 auto;padding:0 18px;}

/* Header */
.sr-site-header{background:#fff;border-bottom:1px solid var(--border);padding:14px 0;}
.sr-site-header .sr-wrap{display:flex;align-items:center;justify-content:space-between;}
.sr-logo{font-weight:800;font-size:20px;text-decoration:none;color:var(--text);}
.sr-disclosure-top{font-size:12px;color:var(--muted);}

/* Hero */
.sr-hero{padding:28px 0 10px;}
.sr-badge{display:inline-block;background:#eafaf0;color:var(--brand-dark);font-weight:700;font-size:13px;padding:5px 12px;border-radius:999px;margin-bottom:12px;}
.sr-title{font-size:clamp(24px,4vw,36px);font-weight:800;line-height:1.25;margin:0 0 10px;}
.sr-subtitle{color:var(--muted);font-size:16px;margin:0 0 18px;}
.sr-meta-line{font-size:13px;color:var(--muted);margin-bottom:18px;}

.sr-hero-grid{display:grid;grid-template-columns:1fr;gap:20px;align-items:start;}
@media(min-width:720px){.sr-hero-grid{grid-template-columns:280px 1fr;}}

.sr-product-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:16px;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.04);}
.sr-product-card img{border-radius:10px;margin:0 auto 14px;}
.sr-rating-box{display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:14px;}
.sr-rating-num{font-size:28px;font-weight:800;color:var(--brand-dark);}
.sr-stars{color:#f5a623;font-size:18px;letter-spacing:2px;}
.sr-price-badge{display:inline-block;background:#fff3e6;color:var(--accent);font-weight:700;font-size:13px;padding:5px 10px;border-radius:8px;margin-bottom:12px;}

.sr-cta-btn{
  display:block;width:100%;text-align:center;
  background:var(--accent);color:#fff !important;
  font-weight:800;font-size:16px;
  padding:14px 18px;border-radius:10px;
  text-decoration:none;
  box-shadow:0 4px 14px rgba(255,122,0,.35);
  transition:transform .15s ease;
}
.sr-cta-btn:hover{transform:translateY(-2px);}
.sr-cta-sub{font-size:12px;color:var(--muted);margin-top:8px;}

/* Content */
.sr-content{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin:24px 0;}
.sr-content h2{font-size:22px;margin-top:30px;}
.sr-content h2:first-child{margin-top:0;}
.sr-content table{width:100%;border-collapse:collapse;margin:16px 0;}
.sr-content table td,.sr-content table th{border:1px solid var(--border);padding:10px 12px;text-align:left;font-size:14px;}

/* Pros / Cons */
.sr-proscons{display:grid;grid-template-columns:1fr;gap:16px;margin:20px 0;}
@media(min-width:640px){.sr-proscons{grid-template-columns:1fr 1fr;}}
.sr-pc-card{border-radius:var(--radius);padding:18px;}
.sr-pros{background:#eafaf0;}
.sr-cons{background:#fdeceb;}
.sr-pc-card h3{margin:0 0 10px;font-size:16px;}
.sr-pc-card ul{margin:0;padding-left:18px;}
.sr-pc-card li{margin-bottom:8px;font-size:14px;}

/* Mid CTA */
.sr-mid-cta{text-align:center;margin:28px 0;}

/* Floating CTA (mobile) */
.sr-sticky-cta{
  position:fixed;left:0;right:0;bottom:0;
  background:#fff;border-top:1px solid var(--border);
  padding:10px 14px;
  box-shadow:0 -4px 14px rgba(0,0,0,.08);
  z-index:999;
  display:none;
}
@media(max-width:720px){.sr-sticky-cta{display:block;}}
.sr-sticky-cta .sr-cta-btn{padding:12px 16px;font-size:15px;}

/* Footer */
.sr-site-footer{padding:30px 0 90px;text-align:center;color:var(--muted);font-size:12px;}
@media(min-width:721px){.sr-site-footer{padding-bottom:30px;}}
.sr-disclosure-box{background:#fff8e6;border:1px solid #f1e2ad;border-radius:10px;padding:14px 16px;font-size:12.5px;color:#6b5b1e;margin:24px 0;}