/* ==========================================================
   superfood-greens.com · sg-Komponenten (Boxen, Tabellen, Rechner)
   Einmalig global einbinden (Plugin "SG Content Tools" oder
   Thesis > Skin Editor > Custom CSS). Farben aus dem Theme.
   Stand: 09.11.2026
   ========================================================== */
.post_content .sg-summary,.post_content .sg-note,.post_content .sg-warn,.post_content .sg-calc,
.post_content .sg-proscons,.post_content .sg-cta,.post_content .sg-author,.post_content .sg-sources,
.post_content .sg-timeline,.post_content .sg-check,.post_content .sg-bars,.post_content .sg-faq,
.post_content .sg-video,.post_content .sg-kpis{box-sizing:border-box;margin:1.6em 0;font-size:16px;line-height:1.55}
.sg-summary{background:#e3f9e3;border:1px solid #b7f0b7;border-left:6px solid #339900;border-radius:6px;padding:16px 20px}
.sg-summary>strong:first-child,.sg-summary .sg-label{display:block;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#135d13;margin-bottom:6px}
.sg-summary ul{margin:.4em 0 .2em 1.2em;padding:0}
.sg-summary li{margin:.25em 0}
.sg-meta{font-size:14px;color:#555;margin:-.4em 0 1.2em}
.sg-meta strong{color:#111}
.sg-note{background:#fafafa;border:1px solid #ddd;border-radius:6px;padding:12px 16px;font-size:15px}
.sg-warn{background:#fff8e1;border:1px solid #f0d27a;border-left:6px solid #e0a800;border-radius:6px;padding:12px 16px;font-size:15px}
.sg-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.sg-kpi{background:#fff;border:1px solid #c7f3c7;border-radius:8px;padding:12px;text-align:center}
.sg-kpi b{display:block;font-size:24px;color:#135d13;line-height:1.2}
.sg-kpi span{font-size:13px;color:#444}
.sg-cta{text-align:center;background:#def8de;border-radius:8px;padding:18px 14px}
.sg-cta small{display:block;margin-top:8px;color:#444;font-size:13px}
.post_content a.sg-btn,.sg-btn{display:inline-block;background:#339900;color:#fff!important;text-decoration:none!important;font-weight:bold;padding:12px 22px;border-radius:6px;box-shadow:0 2px 0 #135d13;font-size:17px}
.post_content a.sg-btn:hover{background:#135d13}
.sg-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1.2em 0}
.sg-table{border-collapse:collapse;width:100%;min-width:480px;font-size:15px}
.sg-table th,.sg-table td{border:1px solid #c7f3c7;padding:8px 10px;text-align:left;vertical-align:top}
.sg-table thead th{background:#339900;color:#fff}
.sg-table tbody tr:nth-child(even){background:#f4fcf4}
.sg-table td.num,.sg-table th.num{text-align:right;white-space:nowrap}
.sg-table tr.sg-hl td{background:#fff8c4;font-weight:bold}
.sg-proscons{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sg-pros,.sg-cons{border-radius:8px;padding:12px 16px}
.sg-pros{background:#e3f9e3;border:1px solid #b7f0b7}
.sg-cons{background:#fdeeee;border:1px solid #f3c4c4}
.sg-pros ul,.sg-cons ul{margin:.3em 0 0 1.1em;padding:0}
@media (max-width:640px){.sg-proscons{grid-template-columns:1fr}}
/* FAQ */
.sg-faq details{border:1px solid #c7f3c7;border-radius:6px;margin:8px 0;background:#fff}
.sg-faq summary{cursor:pointer;padding:12px 14px;font-weight:bold;list-style:none;position:relative;padding-right:36px}
.sg-faq summary::-webkit-details-marker{display:none}
.sg-faq summary::after{content:"+";position:absolute;right:14px;top:9px;font-size:22px;color:#339900}
.sg-faq details[open] summary::after{content:"\2212"}
.sg-faq details>div{padding:0 14px 12px}
/* Rechner */
.sg-calc{background:#fff;border:2px solid #339900;border-radius:10px;padding:16px 18px}
.sg-calc h3{margin-top:0}
.sg-calc .sg-row{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:10px 0}
.sg-calc label{font-size:14px;font-weight:bold;display:flex;flex-direction:column;gap:4px;flex:1 1 180px}
.sg-calc select,.sg-calc input[type=number]{font-size:16px;padding:8px;border:1px solid #9c9;border-radius:5px;background:#fff;width:100%;box-sizing:border-box}
.sg-calc input[type=range]{width:100%}
.sg-calc output,.sg-calc .sg-result{display:block;background:#e3f9e3;border-radius:6px;padding:12px 14px;margin-top:10px}
.sg-calc .sg-big{font-size:26px;font-weight:bold;color:#135d13}
.sg-calc .sg-small{font-size:13px;color:#555}
.sg-calc .sg-ok{color:#135d13;font-weight:bold}
.sg-calc .sg-bad{color:#b00000;font-weight:bold}
.sg-calc .sg-mid{color:#9a6a00;font-weight:bold}
/* Balken */
.sg-bars{border:1px solid #ddd;border-radius:8px;padding:14px 16px;background:#fff}
.sg-bars figcaption{font-weight:bold;margin-bottom:8px}
.sg-bar{display:grid;grid-template-columns:minmax(110px,34%) 1fr auto;align-items:center;gap:8px;margin:6px 0;font-size:14px}
.sg-bar i{display:block;height:18px;background:#339900;border-radius:3px;min-width:2px}
.sg-bar.sg-alt i{background:#9ccc65}
.sg-bar.sg-grey i{background:#bbb}
.sg-bar b{white-space:nowrap}
.sg-bars .sg-small{font-size:12px;color:#666;margin-top:6px}
/* Timeline */
.sg-timeline{border-left:4px solid #339900;padding-left:18px;list-style:none;margin-left:12px}
.sg-timeline li{position:relative;margin:0 0 14px}
.sg-timeline li::before{content:"";position:absolute;left:-32px;top:5px;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid #339900}
.sg-timeline .sg-year{font-weight:bold;color:#135d13;display:block}
/* Check / Quiz */
.sg-check{background:#f7fdf7;border:1px solid #b7f0b7;border-radius:10px;padding:16px 18px}
.sg-check fieldset{border:0;margin:0 0 10px;padding:0}
.sg-check legend{font-weight:bold;margin-bottom:4px}
.sg-check label{margin-right:16px;font-size:15px;white-space:nowrap}
/* Countdown */
.sg-countdown{display:flex;gap:8px;justify-content:center;margin:10px 0}
.sg-countdown span{background:#135d13;color:#fff;border-radius:6px;padding:8px 10px;min-width:56px;text-align:center;font-size:13px}
.sg-countdown b{display:block;font-size:22px}
/* Video-Hinweis & Autor */
.sg-video{margin:1.4em 0}
.sg-video figcaption{font-size:14px;color:#444;margin-top:6px}
.sg-author{display:flex;gap:14px;align-items:flex-start;background:#fafafa;border:1px solid #e3e3e3;border-radius:8px;padding:14px 16px;font-size:15px}
.sg-author .sg-avatar{flex:0 0 48px;height:48px;border-radius:50%;background:#339900;color:#fff;font-weight:bold;font-size:20px;display:flex;align-items:center;justify-content:center}
.sg-sources{font-size:14px;color:#444}
.sg-sources ol{margin-left:1.2em}
.sg-js-only{display:none}
.sg-js .sg-js-only{display:block}
.sg-table .sg-bar{display:block;margin:0}
.sg-table .sg-bar i{height:12px}
[data-sg="filter"] button{font:inherit;font-size:14px;padding:6px 12px;border:1px solid #339900;background:#fff;color:#135d13;border-radius:16px;cursor:pointer;margin:0 4px 6px 0}
[data-sg="filter"] button[aria-pressed="true"]{background:#339900;color:#fff}