.sf{
  font: 15px/1.45 system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  padding: 14px;
  background: #fff;
}
.sf__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:10px}
.sf__title{font-weight:900;font-size:16px}
.sf__sub{font-size:12px;opacity:.78;margin-top:2px}
.sf__notice{margin-top:10px;padding:10px 12px;border-radius:14px;border:1px solid rgba(0,0,0,.10);background: rgba(0,0,0,.03);font-size:13px}
.sf__actions{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.sf__nav{display:flex;gap:6px}
.sf__tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.sf__btn{border:1px solid rgba(0,0,0,.15);background:rgba(0,0,0,.03);border-radius:12px;padding:7px 11px;cursor:pointer;font-weight:600}
.sf__btn:hover{background:rgba(0,0,0,.06)}
.sf__btn--ghost{background:transparent}
.sf__btn--ghost:hover{background:rgba(0,0,0,.04)}
.sf__list{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.sf__item{display:flex;justify-content:space-between;gap:12px;padding:12px;border-radius:16px;border:1px solid rgba(0,0,0,.08);background:rgba(0,0,0,.02)}
.sf__item--today{border-color:rgba(240,180,0,.85);box-shadow:0 0 0 3px rgba(240,180,0,.18)}
.sf__label{font-weight:900;font-size:15px}
.sf__meta{font-size:13px;opacity:.9;margin-top:6px}
.sf__row{margin-top:2px}
.sf__row strong{font-weight:800}
.sf__badge{font-size:12px;border-radius:999px;padding:5px 9px;border:2px solid rgba(0,0,0,.15);background:#fff;white-space:nowrap;height:fit-content;align-self:flex-start}
.sf__badge--schuetzenfest{border-color:#1f7a3a;}
.sf__badge--gemeinde{border-color:#1b6ec2;}
.sf__badge--kreis{border-color:#f2a200;}
.sf__badge--jubilaeum{border-color:#b10f6a;}
.sf__link{font-size:12px;margin-top:6px}
.sf__link a{text-decoration:none}
.sf__link a:hover{text-decoration:underline}
@media (max-width:420px){.sf{padding:12px}.sf__head{flex-direction:column;align-items:stretch}.sf__actions{align-items:flex-start}.sf__tools{justify-content:flex-start}}

.sf__item--hidden{display:none}

.sf__more{
  width:100%;
  margin-top:10px;
  border: 1px dashed rgba(0,0,0,.25);
  background: transparent;
  border-radius: 14px;
  padding: 10px 12px;
  cursor: pointer;
  font-weight: 700;
}
.sf__more:hover{background: rgba(0,0,0,.03)}

.sf__head--month{margin-bottom:10px}
.sf__bar{display:flex;justify-content:space-between;align-items:center;gap:10px}
.sf__barleft{display:flex;flex-direction:column;gap:2px}
.sf__barright{display:flex;align-items:center}
.sf__navrow{display:flex;gap:6px;margin-top:10px}
@media (max-width:420px){
  .sf__bar{flex-direction:column;align-items:stretch}
  .sf__tools{justify-content:flex-start}
}

/* Header clean rows */
.sf__row1{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.sf__row2{display:flex;justify-content:flex-end;margin-top:10px}
.sf__navrow{display:flex;gap:6px}
.sf__date{margin-top:4px}
@media (max-width:420px){
  .sf__row1{flex-direction:column;align-items:stretch}
  .sf__row2{justify-content:flex-start}
}

/* v1.1.5 overrides - fix header + badge layout */
.sf__head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px}
.sf__headright{display:flex;flex-direction:column;gap:8px;align-items:flex-end}
.sf__nav{display:flex;gap:6px}
.sf__tools{display:flex;gap:6px;flex-wrap:nowrap}
.sf__item{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.sf__main{flex:1 1 auto;min-width:0}
.sf__badge{align-self:flex-start}
.sf__date{margin-top:4px}
@media (max-width:420px){
  .sf__head{flex-direction:column;align-items:stretch}
  .sf__headright{align-items:flex-start}
  .sf__tools{flex-wrap:wrap}
}

/* v1.1.6: force-new asset names + header/tool layout fixes */
.sf, .sf *{box-sizing:border-box}
.sf__head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:nowrap}
.sf__headleft{min-width:0}
.sf__headright{display:flex;flex-direction:column;gap:8px;align-items:flex-end;min-width:0}
.sf__nav{display:flex;gap:6px}
.sf__tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.sf__btn{white-space:nowrap;max-width:100%}
@media (max-width:520px){
  .sf__head{flex-wrap:wrap}
  .sf__headright{align-items:flex-start}
  .sf__tools{justify-content:flex-start}
}

/* v1.1.7: rows always stacked, no overflow */
.sf__row{display:block;margin-top:4px}
.sf__meta{margin-top:2px}
.sf__tools{flex-wrap:wrap}

/* v1.1.8: card content order + no pill */
.sf__item{align-items:flex-start}
.sf__label{font-weight:800;margin-bottom:6px}
.sf__row{display:block;margin-top:4px}
.sf__date{margin-top:0}

.sf__badge--bundes{border-color:#1b5e20;color:#1b5e20}

.sf__ver{font-size:11px;opacity:.55;margin-top:2px}

/* v1.1.11: more space under header + earlier wrap on small widths */
.sf__head{margin-bottom:18px !important;}
@media (max-width: 680px){
  .sf__head{flex-wrap:wrap;}
  .sf__headright{align-items:flex-start;}
  .sf__tools{justify-content:flex-start;}
}
.sf{padding-bottom:10px;}

/* v1.1.12: real spacing to next module (outside) */
.sfwrap{display:flow-root; margin-bottom:26px;}

/* v1.1.14: iPad/Tablet landscape fix - stack header to avoid overlap */
@media (max-width: 1100px){
  .sf__head{flex-direction:column;align-items:stretch;gap:10px;}
  .sf__headright{align-items:stretch;}
  .sf__nav{justify-content:flex-start;}
  .sf__tools{justify-content:flex-start;flex-wrap:wrap;}
  .sf__nav, .sf__tools{width:100%;}
}
