/* chili-eventsearch – baseline styling (framework-agnostic, no Bootstrap dependency) */
.chili-eventsearch { --ces-accent: #6EA2D6; }
.chili-eventsearch .ces-title { margin: 0 0 1rem; }

.ces-form { background: #E3EAED; padding: 2rem 2rem 1.5rem 2rem; border-radius: 30px; margin-bottom: 3rem; margin-top: 3rem; }
.ces-row { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-bottom: .75rem; }
.ces-row > label:first-child, .ces-label { text-align: left; margin-bottom: 0;}
.ces-form input[type="text"], .ces-form input[type="date"], .ces-form select {
    padding: .8rem; border: 1px solid #ccc; border-radius: 4px; min-width: 12rem; width: 100%;
}
.ces-checkboxes, .ces-sort{margin-bottom: 0; margin-top: 0.8rem; gap: 20px;}
.ces-checkboxes label, .ces-sort label { flex: 0 0 auto; font-weight: 400; }
.ces-actions, .ces-downloads { justify-content: flex-end; }
.fortbildungen-checkbox {font-weight: normal;}

.ces-btn {
    display: inline-block; padding: .4rem .8rem; border: 1px solid #bbb; border-radius: 4px;
    background: #fff; cursor: pointer; font-size: 1rem; line-height: 1.3; text-decoration: none; color: #222;
}
.ces-btn:hover { background: #eee; }
.ces-btn-primary { background: var(--ces-accent); color: #fff; border-color: var(--ces-accent); }
.ces-btn-sm { padding: .2rem .5rem; font-size: 1rem; }

.ces-toolbar { display: flex; gap: .5rem; margin: 1rem 0; flex-wrap: wrap; }
.ces-merkliste { border: 1px solid #ddd; border-radius: 6px; padding: 1rem; margin-bottom: 1rem; }
/* Cloned result element inside the Merkliste: same layout as a result, tinted differently. */
/*
.ces-merkliste-row { background: #eef4fb; border: 1px solid #cfe0f2; border-radius: 6px; padding: .25rem .75rem; margin-bottom: .75rem; }
*/
.ces-merkliste-row .ces-day-header { background: #4a7ab0;}
.ces-merkliste-row .ces-item { border-bottom: 0; padding: .5rem .25rem; }

.ces-count { margin: 1rem 0; }
.ces-day { margin-bottom: 1.5rem; }
.ces-day-header { background: var(--ces-accent); color: #fff; padding: .35rem .75rem; font-weight: 600; }

.ces-item { display: flex; gap: 1rem; padding: 1rem .25rem; border-bottom: 1px solid #eee; }
.ces-item-date { flex: 0 0 12rem; }
.ces-item-code { font-size: 1rem; color: #555; }
.ces-item-type { font-size: 1rem; color: #777; }
.ces-item-info { flex: 1 1 auto; }
.ces-item-info h2 { font-size: 1.15rem; margin: 0 0 .35rem; color: var(--ces-accent)}
.ces-item-speaker { font-size: 1rem; color: #444; }
.ces-item-location .glyphicon { color: var(--ces-accent); }
.ces-item-actions { margin-top: .5rem; display: flex; gap: .5rem; flex-wrap: wrap; }
.ces-status-cancelled { background: #c0392b; color: #fff; font-size: .7rem; padding: .5rem .7rem; border-radius: 3px; vertical-align: middle; font-family: "Source Sans Pro", sans-serif; text-transform: uppercase; font-weight: bold; }

.ces-pagination { display: flex; gap: .25rem; margin-top: 1rem; flex-wrap: wrap; }
.ces-page { padding: .3rem .6rem; border: 1px solid #ccc; background: #fff; cursor: pointer; border-radius: 4px; }
.ces-page.is-current { background: var(--ces-accent); color: #fff; border-color: var(--ces-accent); }
.ces-page[disabled] { opacity: .4; cursor: default; }

.ces-detail-row { display: flex; gap: 1rem; padding: .4rem 0; border-bottom: 1px solid #eee; }
.ces-detail-row > span:first-child { flex: 0 0 14rem; text-align: right; color: #555; }

/* Download-Buttons mit Ladeanzeige */
.ces-btn.is-loading { position: relative; padding-left: 2.1rem; cursor: progress; opacity: .8; }
.ces-btn.is-loading::before {
    content: "";
    position: absolute;
    left: .8rem;
    top: 50%;
    width: .85em;
    height: .85em;
    margin-top: -.45em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: ces-spin .7s linear infinite;
}
@keyframes ces-spin { to { transform: rotate(360deg); } }

/* Der Tooltip-Text, während des Downloads sichtbar statt nur beim Hovern. */
.ces-download-hint {
    display: inline-block;
    margin-right: auto;
    padding: .3rem .55rem;
    border: 1px solid #e0c477;
    border-radius: 3px;
    background: #fdf6e3;
    color: #7a5a12;
    font-size: .85em;
    line-height: 1.35;
    max-width: 32rem;
    vertical-align: middle;
}

/* Respect a reduced-motion preference: keep the state, drop the rotation. */
@media (prefers-reduced-motion: reduce) {
    .ces-btn.is-loading::before { animation: none; border-right-color: currentColor; opacity: .5; }
}

/* Detailansicht: Abschnitte der PH-Online-Kursseite */
.ces-registration-state { display: inline-block; margin: 0 0 1rem; padding: .25rem .6rem; border-radius: 4px; background: #f3f3f3; color: #555; font-size: .9em; }
.ces-person-role { display: block; color: #777; font-size: .85em; }
.ces-person { display: block; margin-bottom: .35rem; }
.ces-person-link { color: var(--ces-accent, #3d7ebd); text-decoration: none; }
.ces-person-link:hover { text-decoration: underline; }
.ces-person-link::before { content: "\1F464"; margin-right: .3rem; opacity: .6; font-size: .9em; }
.ces-category { margin-bottom: .2rem; }
.ces-online-info { margin-bottom: .2rem; }

.ces-group { margin: 1rem 0 1.5rem; padding-left: .75rem; border-left: 3px solid var(--ces-accent); }
.ces-group > h3 { margin: 0 0 .5rem; font-size: 1.05rem; }

.ces-dates-table,
.ces-same-courses { width: 100%; border-collapse: collapse; margin-top: .5rem; }
.ces-dates-table th, .ces-dates-table td,
.ces-same-courses th, .ces-same-courses td { padding: .35rem .5rem; border-bottom: 1px solid #eee; text-align: left; vertical-align: top; }
.ces-dates-table th, .ces-same-courses th { color: #555; font-weight: 600; font-size: .9em; }
.ces-dates-table tr.is-cancelled td { text-decoration: line-through; color: #999; }

/* Wide tables must scroll inside themselves, never the page. */
.ces-detail { overflow-x: auto; }

/* Today/Fortbildungen heute */
.ces-today-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.ces-today-date { margin: 0; text-align: center; flex: 1 1 auto; }
.ces-empty { padding: 1rem; color: #666; }

/* Infoscreen/Infoscreen Raumanzeige */
.ces-infoscreen-date { margin: 0 0 1rem; }
.ces-infoscreen-table { width: 100%; border-collapse: collapse; }
.ces-infoscreen-table th, .ces-infoscreen-table td { border-bottom: 1px solid #ddd; padding: .5rem .6rem; text-align: left; vertical-align: top; }
.ces-infoscreen-table th { background: var(--ces-accent); color: #fff; }
.ces-infoscreen-table tr.is-cancelled td { color: #c0392b; text-decoration: line-through; }

@media (max-width: 700px) {
    .ces-row > label:first-child, .ces-label { flex-basis: 100%; }
    .ces-item { flex-direction: column; }
    .ces-item-date { flex-basis: auto; }
    .ces-detail-row { flex-direction: column; }
    .ces-detail-row > span:first-child { text-align: left; flex-basis: auto; }
}

/* --------------------------- Date picker ---------------------------- */
.ces-dates { position: relative; }
.ces-datepicker {
    position: absolute; z-index: 1000; margin-top: 2px;
    background: #fff; border: 1px solid #b7c7d9; border-radius: 6px;
    box-shadow: 0 6px 20px rgba(0,0,0,.15); padding: 8px; width: 15.5em;
    font-size: .9rem; color: #222;
}
.ces-dp-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
.ces-dp-title { font-weight: 700; }
.ces-dp-nav {
    border: 0; background: #eef4fb; color: #1a4f8a; cursor: pointer;
    width: 1.8em; height: 1.8em; border-radius: 4px; font-size: 1.1em; line-height: 1;
}
.ces-dp-nav:hover { background: #d9e6f5; }
.ces-dp-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.ces-dp-wd { font-size: .75em; color: #7a8aa0; padding: 2px 0; font-weight: 700; }
.ces-dp-day {
    border: 0; background: transparent; cursor: pointer; padding: 4px 0;
    border-radius: 4px; color: #222;
}
.ces-dp-day:hover { background: #eef4fb; }
.ces-dp-day.is-selected { background: #1a4f8a; color: #fff; }
.ces-dp-day.is-weekend { background: #d9edf7; }
.ces-dp-day.is-weekend:hover { background: #c3e2f1; }
.ces-dp-day.is-selected { background: #1a4f8a; color: #fff; }