/*
 Theme Name:   Educavo Child
 Description:  Educavo Child Theme
 Author:       nexserv GmbH
 Author URI:   https://www.nexserv.de
 Template:     educavo
 Version:      1.0
 Text Domain:  educavo-child
*/

.termine-table {
    border-radius: 12px;
    border-spacing: 0;
    border-collapse: separate;
}

.termine-table td,
.termine-table th {
    border: none;
    padding: 5px 12px;
    border-bottom: 1px solid #d5d8dc;
}

.termine-table tr:not(.last-date) td[data-type="date"] {
    border-bottom: none;
}

.termine-table th {
    background: var(--e-global-color-primary);
    color: white;
}

.termine-table tr:last-child td:first-child {
    border-bottom-left-radius: 12px;
}

.termine-table tr:last-child td:last-child {
    border-bottom-right-radius: 12px;
}

.termine-table tr:not(.additional-date) th:first-child,
.termine-table tr:not(.additional-date) td:first-child {
    border-left: 1px solid #d5d8dc;
    /* Entfernt vertikale Rahmen */
}

.termine-table tr:not(.additional-date) th:last-child,
.termine-table tr:not(.additional-date) td:last-child {
    border-right: 1px solid #d5d8dc;
    /* Entfernt vertikale Rahmen */
}

.termine-table tr:first-child th,
.termine-table tr:first-child td {
    border-top: 1px solid var(--e-global-color-primary);
}

.termine-table tr:first-child th:first-child,
.termine-table tr:first-child td:first-child {
    border-top-left-radius: 12px;
}

.termine-table tr:first-child th:last-child,
.termine-table tr:first-child td:last-child {
    border-top-right-radius: 12px;
}

@media (max-width: 768px) {
    .termine-table {
        width: 100%;
        border-radius: 0;
    }

    .termine-table tr:first-child td:last-child,
    .termine-table tr:first-child td:first-child,
    .termine-table tr:last-child td:first-child,
    .termine-table tr:last-child td:last-child {
        border-radius: none;
    }

    .termine-table th {
        display: none;
    }

    .termine-table td {
        display: block;
        width: 100%;
        padding: 10px 5px;
        text-align: right;
        box-sizing: border-box;
    }

    .termine-table tr {
        display: block;
        margin-bottom: 10px;
        border-bottom: 1px solid #d5d8dc;
    }

    .termine-table tr td:first-child {
        border-left: none !important;
    }

    .termine-table tr td:last-child {
        border-right: none !important;
    }

    .termine-table td::before {
        /* Platz für die Spaltenüberschrift in der mobilen Ansicht */
        content: attr(data-label);
        font-weight: bold;
        display: block;
        text-align: left;
        margin-bottom: 5px;
    }

    .termine-table td {
        position: relative;
        text-align: left;
    }

    /* Anpassen der Icons in den Zellen, um sie ordentlich anzuzeigen */
    .termine-table td svg {
        display: block;
        margin-bottom: 5px;
    }

    .termine-table td a.button {
        margin-top: 10px;
        text-align: center;
        display: block;
    }
}


/* ---------- Tag‑Overlay (schräge Ecke) ---------- */
.ct-thumb-wrap{
    position:relative;
    display:inline-block;
    overflow:hidden;            /* schneidet Band an Bildkante ab */
}
.ct-thumb-wrap>img{display:block}

/* Text selber – keine Füllfarbe mehr, nur Positionierung */
.ct-overlay{
    height: 100%;
    position:absolute;
    top:0;                      /* oben links bleiben */
    left:0;
    z-index:1;                  /* vor dem Pseudo‑Bg */
    color:var(--e-global-color-primary);
    padding:0px 76px 6px 7px;  /* etwas mehr links, damit Text nicht an Schräge klebt */
    font-size:16px;
    font-weight:700;
    pointer-events:none;
    white-space:nowrap;
    text-transform: uppercase;
    border-top-left-radius: 15px;
    overflow:hidden;
}

/* Schräger Hintergrund */
.ct-overlay::before{
    content:"";
    position:absolute;
    inset:0;                    /* deckt komplette Overlayfläche ab */
    background:rgba(0,0,0,.7);
    transform-origin:0 0;       /* Drehpunkt: linke obere Ecke */
    transform:skewX(292deg);    /* Schräge */
    z-index:-1;                 /* liegt hinter dem Text */
}

/* Mobile Feinschliff */
@media(max-width:480px){
    .ct-overlay{
        font-size:12px;
        padding:4px 12px 4px 28px;
    }
}