
.wfw-card{padding:14px;border:1px solid #e7e7e7;border-radius:16px;box-shadow:0 2px 8px rgba(0,0,0,.04);background:#fff}
.wfw-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap}
.wfw-select{padding:8px 10px;border:1px solid #ddd;border-radius:10px;background:#fafafa}
.wfw-modes button{padding:6px 10px;border:1px solid #ddd;border-radius:999px;background:#f6f6f6;cursor:pointer}
.wfw-modes button.active{background:#111;color:#fff;border-color:#111}
.wfw-chartwrap{display:flex;flex-direction:column;gap:8px}
.wfw-info{font-weight:600}
.wfw-chartdiv{width:100%;min-height:260px}
.wfw-svg{width:100%;height:280px;display:block}
.wfw-note{font-size:.9em;color:#666}
.wfw-error{color:#b00}
.wfw-skeleton{opacity:.6}


/* Polish */
.wfw-card{border-radius:18px;box-shadow:0 6px 18px rgba(0,0,0,.06);border:1px solid #ebedf3}
.wfw-toolbar{gap:14px;margin-bottom:14px}
.wfw-select{padding:10px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 1px 2px rgba(0,0,0,.03)}
.wfw-modes button{padding:8px 14px;border-radius:999px;border:1px solid #e5e7ef;background:#f7f8fc}
.wfw-modes button:hover{background:#eef1f6}
.wfw-modes button.active{background:#111;color:#fff;border-color:#111}
.wfw-info{font-weight:700;color:#0f1d5b}
.wfw-svg{height:320px}
.wfw-ytick,.wfw-xtick{font-size:12px;fill:#8b93a7}
.wfw-tip{position:absolute;transform:translate(-50%,-100%);background:#111;color:#fff;padding:6px 8px;border-radius:8px;font-size:12px;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.15)}
.wfw-chartwrap{position:relative}


/* WOW-style daily cards + enhanced chart/legend */
.wfw-rowhdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.wfw-title{margin:0;font-size:20px;color:#0f1d5b}
.wfw-now{color:#0f1d5b;opacity:.8;font-weight:600}
.wfw-cards-wrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.wfw-daycard{background:#f8fbff;border:1px solid #e8eef7;border-radius:14px;padding:12px;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.wfw-dayhead{font-weight:700;color:#0f1d5b;margin-bottom:6px}
.wfw-line{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.wfw-ic{width:var(--wfw-ic-size,22px)!important;height:var(--wfw-ic-size,22px)!important}
.wfw-temps{font-weight:600}
.wfw-precip{color:#3b3f58;opacity:.85}
.wfw-body{padding:8px}
.wfw-legend{display:flex;gap:16px;margin-top:8px;font-size:12px;color:#3b3f58}
.lg::before{content:'';display:inline-block;width:12px;height:3px;border-radius:3px;margin-right:6px;vertical-align:middle;background:currentColor}
.lg-t{color:#f2a807}
.lg-p{color:#07a4f2}
.lg-w{color:#d389f5}
@media (max-width: 640px){
  .wfw-cards-wrap{grid-template-columns:1fr 1fr}
  .wfw-title{font-size:18px}
  .wfw-now{font-size:14px}
}


/* Axis label separation */
.wfw-ytick-right{fill:#c54697; opacity:.9}  /* precip % labels */
.wfw-ytick-wind{fill:#e08a1c; opacity:.9}   /* wind labels */

/* Theming vars for daily cards (override via Settings → Appearance JSON) */
:root{
  --wfw-card-bg: #f8fbff;
  --wfw-card-border: #e8eef7;
}
.wfw-daycard{background:var(--wfw-card-bg);border-color:var(--wfw-card-border)}


/* Better note styling */
.wfw-note{font-size:13px;color:#6b7280;margin:6px 2px 10px}

/* Bars (precip) are already colored via inline fill; just ensure legend spacing works */
.wfw-legend{display:flex;gap:18px;align-items:center;flex-wrap:wrap}


.wfw-axistitle{font-size:11px;fill:#8b93a7}
.wfw-precip-title{fill:#c54697}
.wfw-wind-title{fill:#e08a1c}
.wfw-ytick-right{fill:#c54697}
.wfw-ytick-wind{fill:#e08a1c}

/* Feels like styles */
.wfw-feels{font-size:12px;color:#555;margin-top:4px}
.lg-f::before{content:'';display:inline-block;width:12px;height:3px;border-radius:3px;margin-right:6px;vertical-align:middle;background:currentColor}
.lg-f{color:#f2a807}

/* Lite location label */
.wfw-location{display:inline-flex;align-items:center;font-weight:600;padding:8px 12px;border-radius:12px;background:var(--wfw-card-bg,#fff);border:1px solid var(--wfw-card-border,#e8eef7)}
