/* ================================
   Touren & Kapazität – Layout
   ================================ */

/* Grundlayout */
h1 {
    text-align: center;
    margin-top: 40px;
    margin-bottom: 30px;
}

h2 {
    margin-top: 30px;
    margin-bottom: 15px;
}

/* Erklärungstext */
.kapazitaet-erklaerung {
    max-width: 800px;
    margin: 0 auto 40px auto;
    padding: 0 20px;
    line-height: 1.6;
}

.kapazitaet-erklaerung p {
    margin-bottom: 15px;
}

/* Tour-Blöcke */
.tour-block {
    max-width: 900px;
    margin: 0 auto 40px auto;
    padding: 0 20px;
}

/* ============================================
   Tabellen – Soft Card Style (schmal + schön)
   ============================================ */

table.kapazitaet {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    font-size: 1.0rem;
}

table.kapazitaet th {
    text-align: left;
    padding: 8px 6px;
    color: #333;
    font-weight: 600;
    font-size: 1.05rem;
}

table.kapazitaet td {
    background: #f4f4f4;
    padding: 10px 12px;
    border-radius: 6px;
    color: #222;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

/* Erste Spalte (Orte) */
table.kapazitaet tr td:first-child {
    width: 85%;
    font-weight: 500;
}

/* Zweite Spalte (Kapazität) */
table.kapazitaet tr td:last-child {
    width: 15%;
    text-align: right;
    font-weight: 600;
}

/* Hover */
table.kapazitaet tr:hover td {
    background: #e9e9e9;
}

/* ============================================
   Farbskala für Kapazität – 0% bis 100%
   ============================================ */

/* Neue, dunkle, gut unterscheidbare Kapazitätsfarben */
.kapa-0   { color: #7a0000 !important; }  /* tiefrot */
.kapa-5   { color: #8c0000 !important; }
.kapa-10  { color: #a00000 !important; }
.kapa-15  { color: #b30000 !important; }
.kapa-20  { color: #c40000 !important; }

.kapa-25  { color: #a63c00 !important; }  /* rostrot */
.kapa-30  { color: #b34700 !important; }
.kapa-35  { color: #bf5200 !important; }
.kapa-40  { color: #cc5c00 !important; }
.kapa-45  { color: #d96600 !important; }

.kapa-50  { color: #806000 !important; }  /* olivbraun */
.kapa-55  { color: #6f6f00 !important; }
.kapa-60  { color: #5e7e00 !important; }
.kapa-65  { color: #4d8d00 !important; }
.kapa-70  { color: #3c9c00 !important; }

.kapa-75  { color: #2b8f1a !important; }  /* dunkles grün */
.kapa-80  { color: #1f7f1f !important; }
.kapa-85  { color: #166f26 !important; }
.kapa-90  { color: #0d5f2d !important; }
.kapa-95  { color: #064f33 !important; }
.kapa-100 { color: #004d26 !important; }  /* tiefgrün */

/* Grafikcontainer */
.tour-grafik {
    text-align: center;
    margin-top: 20px;
}

.tour-grafik img {
    max-width: 100%;
    height: auto;
    border: 1px solid #ddd;
    padding: 10px;
    background: #fafafa;
    border-radius: 6px;
}