/* ==========================================================================
   SAC Toggenburg – Tourenliste & Tourdetails
   Alle Klassen/Variablen mit Präfix "sac-", alles unter .sac-tours gescoped,
   damit nichts mit Bootstrap 4.5 oder main.css kollidiert.
   Farben/Fonts gemäss Original (main.css, frontend.scss, default.php).
   ========================================================================== */
.sac-tours{
  --sac-rot:#FF0000;        /* a, h1–h6, .btn im Original */
  --sac-rot-hover:#D00000;
  --sac-text:#212529;       /* Bootstrap body */
  --sac-grau-text:#777;     /* .abdate, .ab-newsdate */
  --sac-grau-hell:#999;     /* .suitable-no */
  --sac-grau-bg:#eee;       /* .bg-grau, .ab-sidecol */
  --sac-linie:#ddd;
  --sac-linie-dunkel:#aaa;
  --sac-gruen:lime;         /* .suitable-yes */
  font-family:"Open Sans",sans-serif;color:var(--sac-text);font-size:16px;line-height:1.6;text-align:left;
  -webkit-hyphens:manual;hyphens:manual;
  max-width:1140px;margin:0 auto;padding:48px 16px 96px;box-sizing:border-box}
.sac-tours *,.sac-tours *::before,.sac-tours *::after{box-sizing:border-box}
.sac-tours a{color:var(--sac-rot);text-decoration:none}
.sac-tours a:hover{color:var(--sac-rot);text-decoration:underline}
.sac-tours h1,.sac-tours h2,.sac-tours h3{color:var(--sac-rot);font-weight:400;margin:0}
.sac-tours button{font:inherit}
.sac-tours section{padding:0}   /* main.css setzt Abstand auf jede section */

/* ---------- Allgemein ---------- */
.sac-kicker{margin:0 0 6px;font-size:.875rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--sac-grau-text)}
.sac-label{font-size:.8rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sac-grau-text)}
.sac-meta{margin:0 0 4px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;color:var(--sac-grau-text);font-size:.95rem}
.sac-meta__date{font-weight:600;color:var(--sac-text)}
.sac-meta__sep{color:#ccc}

.sac-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid var(--sac-linie-dunkel);background:#fff;color:var(--sac-rot);font-weight:700;cursor:pointer}
.sac-btn:hover{background:var(--sac-rot);border-color:var(--sac-rot);color:#fff}
.sac-btn--primary{width:100%;min-height:50px;background:var(--sac-rot);border-color:var(--sac-rot);color:#fff}
.sac-btn--primary:hover{background:var(--sac-rot-hover);border-color:var(--sac-rot-hover)}
.sac-btn--primary:disabled,.sac-btn--primary:disabled:hover{background:var(--sac-grau-bg);border-color:var(--sac-grau-bg);color:var(--sac-grau-text);cursor:not-allowed}

.sac-badge{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 7px;line-height:1.5}
.sac-badge--warn{color:var(--sac-rot);border:1px solid var(--sac-rot)}
.sac-badge--info{color:var(--sac-text);border:1px solid var(--sac-linie-dunkel)}

/* Eignung (wie .suitable-yes / .suitable-no) */
.sac-grp{display:inline-block;margin-right:10px;font-size:.875rem;border-bottom:2px solid transparent}
.sac-grp--ok{color:var(--sac-text);border-bottom-color:var(--sac-gruen)}
.sac-grp--no{color:var(--sac-grau-hell)}

/* Fitness-Balken */
.sac-bars rect{fill:#ccc}
.sac-bars .sac-bars__on{fill:var(--sac-text)}


/* ---------- Tourenliste ---------- */
.sac-list-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:12px 32px;margin-bottom:28px}
.sac-list-head h1{font-size:2.4rem;line-height:1.15}
.sac-list-head__intro{margin:8px 0 0;color:var(--sac-grau-text);font-size:1.05rem}
.sac-list-head__count{margin:0;font-weight:600}

.sac-filter{padding:18px 0;border-top:1px solid var(--sac-linie);border-bottom:1px solid var(--sac-linie);display:flex;flex-direction:column;gap:12px}
.sac-filter__row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px}
.sac-filter__row .sac-label{flex:0 0 72px}
.sac-filter__note{font-size:.82rem;color:var(--sac-grau-text)}

/* Segmented Control */
.sac-seg{display:inline-flex;flex-wrap:wrap;gap:2px;padding:3px;background:#f2f2f2;border-radius:8px}
.sac-seg__btn{display:inline-flex;align-items:center;gap:7px;min-height:38px;padding:0 14px;border:0;border-radius:6px;background:transparent;color:#555;font-size:.9rem;font-weight:600;cursor:pointer;transition:background .15s,color .15s,box-shadow .15s}
.sac-seg__btn:hover{color:var(--sac-text);background:rgba(255,255,255,.6)}
.sac-seg__btn[aria-pressed="true"]{background:#fff;color:var(--sac-text);box-shadow:0 1px 3px rgba(0,0,0,.12),0 0 0 1px rgba(0,0,0,.04)}
.sac-seg__btn:focus-visible{outline:2px solid var(--sac-rot);outline-offset:2px}
.sac-seg__btn:disabled,.sac-seg__btn:disabled:hover{background:transparent;box-shadow:none;color:#aaa;cursor:not-allowed}
.sac-seg__btn:disabled .sac-bars .sac-bars__on{fill:#c8c8c8}
.sac-seg__btn .sac-bars rect{fill:#c8c8c8}
.sac-seg__btn .sac-bars .sac-bars__on{fill:#777}
.sac-seg__btn[aria-pressed="true"] .sac-bars .sac-bars__on{fill:var(--sac-rot)}

.sac-month{margin-top:44px}
.sac-month h2{font-size:1.5rem;color:grey;padding-bottom:8px;border-bottom:1px solid var(--sac-linie-dunkel)}

.sac-tour{display:flex;flex-wrap:wrap;gap:14px 40px;padding:22px 0;border-bottom:1px solid var(--sac-linie)}
.sac-tour__main{flex:999 1 460px;min-width:0}
.sac-tour__side{flex:1 1 400px;max-width:440px;min-width:0;display:flex;flex-direction:column;gap:10px}
.sac-tour h3{font-size:1.4rem;line-height:1.3}
.sac-tour__teaser{margin:6px 0 0;color:#555;font-size:.95rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sac-tour__facts{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;font-size:.875rem}
.sac-tour__facts > span{display:inline-flex;align-items:center;gap:6px}
.sac-tour__who{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 18px}
.sac-tour__leader{font-size:.875rem;color:var(--sac-grau-text)}
.sac-tour__places{font-size:.8rem;color:var(--sac-grau-text)}
.sac-empty{padding:60px 0;text-align:center;color:var(--sac-grau-text)}

/* ---------- Tourdetails ---------- */
.sac-back{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:600}
.sac-detail .sac-meta{margin:12px 0 6px;font-size:1rem}
.sac-detail h1{font-size:2.2rem;line-height:1.2;max-width:900px}
.sac-detail__lead{margin:14px 0 0;font-size:1.15rem;font-weight:300;max-width:760px}

.sac-keys{display:flex;flex-wrap:wrap;gap:1px;background:var(--sac-linie);border:1px solid var(--sac-linie);margin:32px 0 16px}
.sac-keys__item{flex:1 1 170px;background:#fff;padding:14px 18px}
.sac-keys__value{margin:2px 0 0;font-size:1.5rem;font-weight:300;display:flex;align-items:center;gap:8px}
.sac-keys__value small{font-size:.85rem;color:var(--sac-grau-text)}

.sac-suit{margin-bottom:44px}
.sac-suit .sac-label{margin-right:12px}

.sac-cols{display:flex;flex-wrap:wrap;gap:44px 64px;align-items:flex-start}
.sac-cols__main{flex:999 1 560px;min-width:0}
.sac-cols__aside{flex:1 1 300px;max-width:420px;display:flex;flex-direction:column;gap:20px}
.sac-cols__main h2{font-size:1.5rem;margin-bottom:10px}
.sac-cols__main > section{margin-bottom:36px}

.sac-richtext p:last-child{margin-bottom:0}

.sac-details{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));column-gap:32px}
.sac-details > div{padding:12px 0;border-bottom:1px solid var(--sac-linie)}
.sac-details dt{font-size:.82rem;font-weight:600;color:var(--sac-grau-text)}
.sac-details dd{margin:2px 0 0;overflow-wrap:anywhere}

.sac-tours section.sac-box{padding:24px;background:#fff;box-shadow:0 0 12px rgba(0,0,0,.2)}   /* wie .ab-table */
.sac-box h2{font-size:1.5rem;margin-bottom:6px}
.sac-box__text{margin:0 0 14px;color:var(--sac-grau-text);font-size:.95rem}
.sac-box__places{margin:0 0 18px;font-size:.85rem;font-weight:600}

.sac-kv{margin:18px 0 0;font-size:.9rem;display:flex;flex-direction:column;gap:8px}
.sac-kv > div{display:flex;justify-content:space-between;gap:12px}
.sac-kv dt{color:var(--sac-grau-text);font-weight:400}
.sac-kv dt{flex:0 0 auto}
.sac-kv dd{margin:0;font-weight:600;text-align:right}
.sac-kv .sac-kv__block{display:block}
.sac-kv .sac-kv__block dd{margin-top:2px;font-weight:400;text-align:left}
.sac-kv__block dd p:last-child{margin-bottom:0}

.sac-tours section.sac-panel{background:var(--sac-grau-bg);padding:24px}   /* wie .ab-sidecol */
.sac-panel__name{margin:4px 0 2px;font-size:1.2rem}
.sac-panel__details{font-size:.95rem}

.sac-fitlist{list-style:none;margin:8px 0 0;padding:0;font-size:.9rem}
.sac-fitlist li{display:flex;justify-content:space-between;gap:12px;padding:7px 10px;color:var(--sac-grau-text)}
.sac-fitlist .sac-is-current{background:var(--sac-grau-bg);color:var(--sac-text);font-weight:600}