/* ========================================
   INPLAYKALENDER - EYES ON YOU
======================================== */

/* KALENDER GRUNDLAYOUT */

#mini-kalender {
    width: 100%;
    font-size: 9px;
    border: 1px solid #315669;
    border-spacing: 1px;
    background: linear-gradient(
        115deg,
        #10232D 0%,
        #172B38 55%,
        #202744 100%
    );
}

#mini-kalender td {
    padding: 4px 2px;
    text-align: center;
    border: 0;
}

/* MONATSÜBERSCHRIFT */

#mini-kalender .tcat {
    background: linear-gradient(
        115deg,
        #10232D 0%,
        #172B38 55%,
        #202744 100%
    );
    color: #D4E0EA;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    padding: 10px 5px;
    border-bottom: 2px solid #00B847;
}

/* WOCHENTAGE */

#mini-kalender .thead {
    background: #10232D;
    color: #7775F2;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: 0;
    padding: 6px 2px;
}

/* KALENDERTAGE */

#mini-kalender td.inplaykalender_tag {
    height: 16px;
    padding: 4px 2px;
    background-color: #1B3442;
    color: #D4E0EA;
    font-size: 9px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 14px;
    transition: background-color .2s ease,
                color .2s ease;
}

#mini-kalender .inplaykalender_tag:hover {
    background-color: #294A5A;
    color: #FFFFFF;
}

/* TAGESZAHLEN UND LINKS */

#mini-kalender .inplaykalender_tag a,
#mini-kalender .inplaykalender_tag num {
    color: #FFFFFF;
    text-decoration: none;
    font-size: 9px;
    font-weight: 400;
    letter-spacing: 0;
    line-height: 14px;
}

/* SZENEN */

#mini-kalender .szenen {
    background: #00882E !important;
}

.szenen strong {
    color: #FFFFFF !important;
}

/* GEBURTSTAGE */

#mini-kalender .geburtstag {
    background: #7775F2 !important;
}

.geburtstag strong {
    color: #FFFFFF !important;
}

/* EVENTS */

#mini-kalender .event {
    background: #278FB0 !important;
}

.event strong {
    color: #FFFFFF !important;
}

/* SZENEN + GEBURTSTAGE */

#mini-kalender .szenengeburtstag {
    background: linear-gradient(
        135deg,
        #00882E 50%,
        #7775F2 50%
    ) !important;
}

/* SZENEN + EVENTS */

#mini-kalender .szenenevent {
    background: linear-gradient(
        135deg,
        #00882E 50%,
        #278FB0 50%
    ) !important;
}

/* GEBURTSTAGE + EVENTS */

#mini-kalender .geburtstagevent {
    background: linear-gradient(
        135deg,
        #7775F2 50%,
        #278FB0 50%
    ) !important;
}

/* SZENEN + GEBURTSTAGE + EVENTS */

#mini-kalender .szenengeburtstagevent {
    background: linear-gradient(
        135deg,
        #00882E 33.33%,
        #7775F2 33.33%,
        #7775F2 66.66%,
        #278FB0 66.66%
    ) !important;
}

/* SCHRIFTFARBEN BEI KOMBINATIONEN */

.szenengeburtstag strong,
.szenenevent strong,
.geburtstagevent strong,
.szenengeburtstagevent strong {
    color: #FFFFFF !important;
}

/* EVENTLISTE */

.inplaykalender-eventlist {
    max-height: 70px;
    overflow: auto;
    padding-right: 5px;
    color: #D4E0EA;
}

/* POPUP HINTERGRUND */

.calpop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(5, 14, 22, .85);
    z-index: 1000;
    opacity: 0;
    transition: opacity .3s ease-in-out;
    pointer-events: none;
}

.calpop:target {
    opacity: 1;
    pointer-events: auto;
}

/* POPUP FENSTER */

.calpop > .pop {
    text-align: justify;
    background: linear-gradient(
        115deg,
        #10232D 0%,
        #172B38 55%,
        #202744 100%
    );
    color: #D4E0EA;
    width: 800px;
    max-width: 90%;
    position: relative;
    margin: 5% auto;
    padding: 25px;
    box-sizing: border-box;
    z-index: 1002;
    font-size: 11px;
    border: 1px solid #315669;
    border-top: 3px solid #00B847;
    box-shadow: 0 15px 50px rgba(0, 0, 0, .4);
}

/* POPUP SCHLIESSEN */

.closepop {
    position: absolute;
    right: -5px;
    top: -5px;
    width: 100%;
    height: 100%;
    z-index: 999;
}

/* Vollständig leere Kalenderzeilen ausblenden */
#mini-kalender tr:has(> td.inplaykalender_tag:empty):not(:has(a, num)) {
    display: none;
}

/* ========================================
   FARBEN FÜR DIE GROSSE KALENDERÜBERSICHT
======================================== */

/* SZENEN */
.inplaykalender_tag.szenen,
td.szenen {
    background: #00882E !important;
}

/* GEBURTSTAGE */
.inplaykalender_tag.geburtstag,
td.geburtstag {
    background: #7775F2 !important;
}

/* EVENTS */
.inplaykalender_tag.event,
td.event {
    background: #278FB0 !important;
}

/* PLOTS */
.inplaykalender_tag.timeline,
td.timeline {
    background: #B58A35 !important;
}

/* SZENEN + GEBURTSTAGE */
td.szenengeburtstag {
    background: linear-gradient(
        135deg,
        #00882E 50%,
        #7775F2 50%
    ) !important;
}

/* SZENEN + EVENTS */
td.szenenevent {
    background: linear-gradient(
        135deg,
        #00882E 50%,
        #278FB0 50%
    ) !important;
}

/* GEBURTSTAGE + EVENTS */
td.geburtstagevent {
    background: linear-gradient(
        135deg,
        #7775F2 50%,
        #278FB0 50%
    ) !important;
}

/* SZENEN + GEBURTSTAGE + EVENTS */
td.szenengeburtstagevent {
    background: linear-gradient(
        135deg,
        #00882E 33.33%,
        #7775F2 33.33%,
        #7775F2 66.66%,
        #278FB0 66.66%
    ) !important;
}

/* BESCHRIFTUNGEN DER LEGENDE */
td.szenen,
td.geburtstag,
td.event,
td.timeline {
    color: #FFFFFF;
}

td.szenen strong,
td.geburtstag strong,
td.event strong,
td.timeline strong {
    color: #FFFFFF !important;
}


/* ========================================
   GROSSER INPLAYKALENDER - FEINSCHLIFF
======================================== */

/* Kalendertabellen kompakter gestalten */

.inplaykalender_tag {
    height: 24px;
    padding: 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    letter-spacing: 0 !important;
}

/* Tageszahlen und Links */

.inplaykalender_tag a,
.inplaykalender_tag num,
.inplaykalender_tag strong {
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: center !important;
    text-decoration: none;
}

/* Gleichmäßige Zellbreiten */

.inplaykalender_tag {
    width: 14.285%;
    box-sizing: border-box;
}

/* Farben etwas dezenter */

td.szenen {
    background: #087B38 !important;
}

td.geburtstag {
    background: #5755C9 !important;
}

td.event {
    background: #247F9D !important;
}

td.timeline {
    background: #A5823A !important;
}

/* Wochentage etwas feiner */

.inplaykalender_tag + .inplaykalender_tag {
    border-left: 1px solid rgba(255,255,255,0.03);
}