/* VVDSB Wetter – Standard-Styling (Version 1.7)
 * Anpassen per Snippet über die Variablen --vw-…, z. B.  .vvdsb-flyin { --vw-unten: 90px; }
 * Abschalten: add_filter('vvdsb_wetter_standard_css', '__return_false');
 */
/* ---------- Variablen (Spezifität 0, per Snippet überschreibbar) ---------- */
:where(.vvdsb-wetter:not(.vvdsb-wetter--flyin),.vvdsb-flyin){
--vw-akzent:#2b707d;--vw-titel:#1a444c;--vw-text:#4d4d4d;--vw-text-hell:#666;--vw-rahmen:#e6e6e6;--vw-hintergrund:#fff;
--vw-radius:14px;--vw-breite:340px;
--vw-sonne:#c47a00;--vw-sonne-kern:#ffd34d;--vw-mond:#6b7aa6;--vw-nass:#1f6fd1;--vw-schnee:#2f86c8;--vw-blitz:#c26a00}
:where(.vvdsb-flyin){
--vw-seite:16px;--vw-unten:16px;--vw-versatz:8px;
--vw-chip-breite:96px;--vw-chip-hoehe:56px;--vw-chip-rahmen:1px;--vw-chip-hintergrund:#fff;
--vw-panel-breite:360px;
--vw-panel-seitlich:calc(var(--vw-chip-ist,var(--vw-chip-breite)) + var(--vw-versatz));
--vw-panel-anheben:calc(var(--vw-chip-ist-h,var(--vw-chip-hoehe)) + var(--vw-versatz));
--vw-schatten:0 4px 14px rgba(0,0,0,.18);--vw-schatten-hover:0 6px 18px rgba(0,0,0,.25);--vw-schatten-panel:0 10px 30px rgba(0,0,0,.2);
--vw-ebene:9990;--vw-ebene-offen:999999}

/* ---------- Box ---------- */
.vvdsb-wetter{box-sizing:border-box;max-width:var(--vw-breite);margin:0;padding:1.1em 1.25em .85em;background:var(--vw-hintergrund);border:1px solid var(--vw-rahmen);border-radius:var(--vw-radius);color:var(--vw-text);font-size:15px;line-height:1.35;text-align:left}
:where(.vvdsb-wetter) *,:where(.vvdsb-flyin) *{box-sizing:border-box}
:where(.vvdsb-wetter) .vw-ort{font-size:1em;font-weight:600;color:var(--vw-titel)}
:where(.vvdsb-wetter) .vw-jetzt{display:flex;align-items:center;gap:1em;margin:.6em 0 1em}
:where(.vvdsb-wetter) .vw-icon,:where(.vvdsb-flyin) .vw-icon{display:block;width:2.1em;height:2.1em;color:var(--vw-akzent)}
:where(.vvdsb-wetter) .vw-icon-gross{width:4.4em;height:4.4em;flex:none}
:where(.vvdsb-wetter) .vw-icon svg,:where(.vvdsb-flyin) .vw-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
:where(.vvdsb-wetter) .vw-f,:where(.vvdsb-flyin) .vw-f{fill:var(--vw-hintergrund)}
:where(.vvdsb-wetter) .vw-p,:where(.vvdsb-flyin) .vw-p{stroke-width:2.4}
:where(.vvdsb-wetter) .vw-sonne,:where(.vvdsb-flyin) .vw-sonne{stroke:var(--vw-sonne)}
:where(.vvdsb-wetter) .vw-sonne circle,:where(.vvdsb-flyin) .vw-sonne circle{fill:var(--vw-sonne-kern)}
:where(.vvdsb-wetter) .vw-mond,:where(.vvdsb-flyin) .vw-mond{stroke:var(--vw-mond)}
:where(.vvdsb-wetter) .vw-nass,:where(.vvdsb-flyin) .vw-nass{stroke:var(--vw-nass);stroke-width:1.8}
:where(.vvdsb-wetter) .vw-schnee,:where(.vvdsb-flyin) .vw-schnee{stroke:var(--vw-schnee)}
:where(.vvdsb-wetter) .vw-blitz,:where(.vvdsb-flyin) .vw-blitz{stroke:var(--vw-blitz);stroke-width:1.8}
:where(.vvdsb-wetter) .vw-temp{font-size:2.7em;font-weight:300;line-height:1;color:var(--vw-titel)}
:where(.vvdsb-wetter) .vw-text{font-size:1em;font-weight:500;margin-top:.2em}
:where(.vvdsb-wetter) .vw-wind{font-size:.85em;color:var(--vw-text-hell)}
:where(.vvdsb-wetter) .vw-tage{display:grid;grid-template-columns:repeat(3,1fr);gap:.5em;padding-top:.85em;border-top:1px solid var(--vw-rahmen)}
:where(.vvdsb-wetter) .vw-tag{display:flex;flex-direction:column;align-items:center;gap:.3em;text-align:center}
:where(.vvdsb-wetter) .vw-tagname{font-size:.85em;color:var(--vw-text-hell)}
:where(.vvdsb-wetter) .vw-temps{font-size:.9em}
:where(.vvdsb-wetter) .vw-max{font-weight:600;color:var(--vw-titel)}
:where(.vvdsb-wetter) .vw-min{margin-left:.35em;color:var(--vw-text-hell)}
:where(.vvdsb-wetter) .vw-fuss{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.3em 1em;margin-top:1em;font-size:.72em;color:var(--vw-text-hell)}
:where(.vvdsb-wetter) .vw-fuss a{color:inherit;text-decoration:underline}

/* ---------- Fly-in: Chip ---------- */
.vvdsb-flyin{font-size:18px;line-height:1.35;color:var(--vw-text)}
:where(.vvdsb-flyin) .vw-chip{position:fixed;z-index:var(--vw-ebene);left:var(--vw-seite);right:auto;bottom:calc(var(--vw-unten) + env(safe-area-inset-bottom,0px));display:inline-flex;align-items:center;justify-content:center;gap:.35em;min-width:var(--vw-chip-breite);height:var(--vw-chip-hoehe);margin:0;padding:0 .8em 0 .6em;font-family:inherit;font-size:1.1em;font-weight:700;line-height:1;letter-spacing:normal;text-transform:none;color:var(--vw-titel);background:var(--vw-chip-hintergrund);border:var(--vw-chip-rahmen) solid var(--vw-akzent);border-radius:999px;box-shadow:var(--vw-schatten);cursor:pointer;-webkit-tap-highlight-color:transparent}
:where(.vvdsb-flyin--rechts) .vw-chip{left:auto;right:var(--vw-seite)}
:where(.vvdsb-flyin) .vw-chip:hover{box-shadow:var(--vw-schatten-hover)}
:where(.vvdsb-flyin) .vw-chip:focus-visible,:where(.vvdsb-flyin) .vw-zu:focus-visible{outline:3px solid var(--vw-akzent);outline-offset:3px}
:where(.vvdsb-flyin) .vw-chip .vw-icon{width:1.9em;height:1.9em;margin:0;padding:0;background:none}
:where(.vvdsb-flyin) .vw-chip .vw-f{fill:var(--vw-chip-hintergrund)}
:where(.vvdsb-flyin) .vw-chip-temp{margin:0;padding:0;color:var(--vw-titel)}

/* ---------- Fly-in: Panel (mobil: von unten) ---------- */
:where(.vvdsb-flyin) .vw-backdrop{position:fixed;inset:0;z-index:var(--vw-ebene-offen);margin:0;padding:0;background:rgba(0,0,0,.35);opacity:0;transition:opacity .25s ease}
:where(.vvdsb-flyin.ist-offen) .vw-backdrop{opacity:1}
:where(.vvdsb-flyin) .vw-panel{position:fixed;z-index:calc(var(--vw-ebene-offen) + 1);left:0;right:0;bottom:0;max-height:75vh;overflow:auto;margin:0;padding:.5em 0 env(safe-area-inset-bottom,0px);background:var(--vw-hintergrund);border:0;border-radius:20px 20px 0 0;box-shadow:0 -6px 24px rgba(0,0,0,.2);transform:translateY(100%);transition:transform .3s ease}
:where(.vvdsb-flyin.ist-offen) .vw-panel{transform:none}
:where(.vvdsb-flyin) .vw-griff{display:block;width:44px;height:5px;margin:.2em auto .1em;padding:0;border-radius:3px;background:var(--vw-rahmen)}
:where(.vvdsb-flyin) .vw-zu{position:absolute;top:.35em;right:.4em;display:flex;align-items:center;justify-content:center;width:48px;height:48px;margin:0;padding:0;font:inherit;color:var(--vw-titel);background:transparent;border:0;border-radius:50%;box-shadow:none;cursor:pointer}
:where(.vvdsb-flyin) .vw-zu:hover{background:rgba(0,0,0,.06)}
:where(.vvdsb-flyin) .vw-zu svg{width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
:where(.vvdsb-flyin) .vvdsb-wetter{max-width:none;margin:0;padding:.75em 1.25em 1.1em;font-size:17px;background:transparent;border:0;border-radius:0}
:where(.vvdsb-flyin) .vvdsb-wetter .vw-ort{padding-right:3em;font-size:1.05em}

/* ---------- Fly-in: Desktop/Tablet – öffnet links oben versetzt am Chip ---------- */
@media (min-width:768px){
:where(.vvdsb-flyin) .vw-backdrop{display:none}
:where(.vvdsb-flyin) .vw-panel{left:calc(var(--vw-seite) + var(--vw-panel-seitlich));right:auto;bottom:calc(var(--vw-unten) + var(--vw-panel-anheben) + env(safe-area-inset-bottom,0px));width:var(--vw-panel-breite);max-width:calc(100vw - 2 * var(--vw-seite));max-height:calc(100vh - var(--vw-unten) - var(--vw-panel-anheben) - 24px);padding:.3em 0 0;border:1px solid var(--vw-rahmen);border-radius:var(--vw-radius);box-shadow:var(--vw-schatten-panel);opacity:0;transform:translateY(12px);transition:transform .25s ease,opacity .25s ease}
:where(.vvdsb-flyin--rechts) .vw-panel{left:auto;right:calc(var(--vw-seite) + var(--vw-panel-seitlich))}
:where(.vvdsb-flyin.ist-offen) .vw-panel{opacity:1;transform:none}
:where(.vvdsb-flyin) .vw-griff{display:none}
}
@media (prefers-reduced-motion:reduce){:where(.vvdsb-flyin) .vw-panel,:where(.vvdsb-flyin) .vw-backdrop{transition:none}}
@media print{.vvdsb-flyin{display:none}}