/* Container + Kopfzeile */
.ipk{
	margin:var(--space-m) 0;
}
.ipk-strip{
	width: 100%;
    border: 0px;
    border-radius: 0px;
    font-size: var(--main-xxs);
    font-family: var(--maintitle-font);
    font-weight: 200;
    color: var(--colorbase2);
    text-shadow: var(--shadow1) var(--accent4);
    background: var(--accent3);
    padding: 0px var(--space-m);
    border-left: var(--space-xs) solid var(--accent4);
    border-right: var(--space-xs) solid var(--accent4);
    text-transform: none;
    line-height: var(--main-s);
    margin-left: 0px;
    margin-bottom: var(--space-xs);
}

.ipk-strip a{
	color:inherit; 
	text-decoration:underline
}

.ipk-legende{
	display: grid;
    gap: var(--space-s);
    margin-top: var(--space-m);
    grid-template-columns: repeat(auto-fit, minmax(var(--bild-w), 1fr));
    text-align: center;
}

/* Grid für mehrere Monate nebeneinander */
.ipk-months{
    display: grid;
    gap: var(--space-xxs);
    margin-top: var(--space-m);
    grid-template-columns: repeat(auto-fit, minmax(var(--bild-w), 1fr));
}

/* Monatskarte */
.ipk-month{
	background: var(--colorbase2);
    border: var(--border1) var(--color3);
    overflow: hidden;
}
.ipk-month-title{
	background: var(--accent3);
    color: var(--colorbase2);
    text-align: center;
    font-weight: 700;
}

/* Wochentage-Zeile */
.ipk-weekdays{
	display:grid; 
	grid-template-columns:repeat(7,1fr);
}
.ipk-weekday{
    background: var(--ipk-muted);
    text-align: center;
    font-weight: 700;
    padding: var(--space-xxs) 0;
}
.ipk-weekday:last-child{
}

/* === Legacy-Table unsichtbar machen & als Grid nutzen === */
.ipk-days{ 
	display:grid; 
}
.ipk-days .ipk-legacy{ 
	display:contents;
}                /* table verschwindet */
.ipk-days .ipk-legacy tbody{ 
	display:contents;
}
.ipk-days .ipk-legacy tr{
	display:contents; 
}

/* Die gelieferten <td> werden zu Grid-Kacheln */
.ipk-days .ipk-legacy td{
	display: block;
    padding: var(--space-xxs);
    position: relative;
}
.ipk-days{
	display:grid; 
	grid-template-columns:repeat(7,1fr);
}

/* kleine Nummer */
.ipk-days .ipk-legacy td .daynum,
.ipk-days .ipk-legacy td .ipk-num{
  font-size:12px; 
	font-weight:700; 
	opacity:.85;
}

/* Mobile: 1 Spalte pro Monat */
@media (max-width: 700px){
  .ipk-months{ grid-template-columns:1fr; }
}  

td.vollmond { position: relative; }
td.vollmond::after{
  content:"";
  position:absolute;
  top:6px; right:6px;
  width:10px; height:10px;
  background:#ffd54f;
  box-shadow:0 0 0 2px #fff inset, 0 0 0 1px rgba(0,0,0,.2);
}

.inplaykalender_tag { 
	text-align: center;
    font-size: var(--text-xs);
    letter-spacing: var(--space-xxxs);
} 
        .szenen { background-color: #C8B6CC; } 
        .geburtstag { background-color: #e38da7; } 

.timeline{
  position: relative;
}
.timeline::after  {
    content: "";
    position: absolute;
    top: 3px;
    right: 3px;
    width: var(--space-s);
    height: var(--space-s);
    background: #BADBAF;
    box-shadow: 0 0 0 2px #BADBAF inset, 0 0 0 1px #bdbcb9;
}
        .event{background:#ABD9D8;}
        
        .szenentimeline { background: linear-gradient(to left top, #EBD39D 50%, #BADBAF 50%); }
        .szenengeburtstag { background: linear-gradient(to left top, #e38da7 50%, #C8B6CC 50%); }
        .szenenevent { background: linear-gradient(to left top, #C8B6CC 50%, #ABD9D8 50%); }
        .geburtstagtimeline { background: linear-gradient(to left top, #e38da7 50%, #BADBAF 50%); }
        .geburtstagevent { background: linear-gradient(to left top, #e38da7 50%, #ABD9D8 50%); }
        .timelineevent { background: linear-gradient(to left top, #BADBAF 50%, #ABD9D8 50%);  }
        
        .szenengeburtstagtimeline { background: linear-gradient(to left top, #e38da7 33%, #C8B6CC 33%, #C8B6CC 66%, #BADBAF 66%); }
        .szenengeburtstagevent { background: linear-gradient(to left top, #e38da7 33%, #C8B6CC 33%, #C8B6CC 66%, #ABD9D8 66%); }
        .szenentimelineevent {  background: linear-gradient(to left top, #ebb79d 33%, #BADBAF 33%, #BADBAF 66%, #ABD9D8 66%); }
        .geburtstagtimelineevent { background: linear-gradient(to left top, #e38da7 33%, #BADBAF 33%, #BADBAF 66%, #ABD9D8 66%); }
        .szenengeburtstagtimelineevent { background: linear-gradient(to left top, #e38da7 25%, #C8B6CC 25%, #C8B6CC 50%, #BADBAF 50%, #BADBAF 75%, #ABD9D8 75%); }

        #mini-kalender { font-size: 7px; }
        #mini-kalender td { padding: 5px; }
        .inplaykalender-eventlist { max-height: 50px; overflow: auto; padding-right: 5px;}

/* Vollmond-Marker oben rechts in der Zelle */
td.vollmondevent, .vollmondevent{
  position: relative;
}
td.vollmondevent::after, .vollmondevent::after  {
    content: "";
    position: absolute;
    top: 3px;
    right: 5px;
    width: var(--space-m);
    height: var(--space-m);
    border-radius: 50%;
    background: #fae6a5;
    box-shadow: 0 0 0 2px #fae6a5 inset, 0 0 0 1px #bdbcb9;
}
td.vollmondszenenevent{background: linear-gradient(to left top, #C8B6CC 50%, #fae6a5 50%);}
td.vollmondeventevent{background: linear-gradient(to left top, #ABD9D8 50%, #fae6a5 50%);}
td.vollmondtimelineevent{background: linear-gradient(to left top, #BADBAF 50%, #fae6a5 50%);}
td.vollmondgeburtstagevent{background: linear-gradient(to left top, #e38da7 50%, #fae6a5 50%);}