.tx-seminars-pi1-clear {
    clear: both;
    width: 1px;
    height: 1px;
}

.tx-seminars-pi1-error {
    color: #f00;
    background-color: inherit;
    font-weight: bold;
}

.tx-seminars-pi1-hidden {
    display: none;
    visibility: hidden;
}

.tx-seminars-pi1-listrow th a {
    display: block;
}

.tx-seminars-pi1-listrow img.category_image {
    margin: 0 2px;
    border: none;
}

.tx-seminars-pi1-listrow table ul {
    list-style: none;
}

th.tx-seminars-pi1-title {
    text-align: left;
}

.tx-seminars-pi1-title a {
    display: block;
}

td.tx-seminars-pi1-expiry,
.tx-seminars-pi1-vacancies,
.tx-seminars-pi1-price,
.tx-seminars-pi1-uid {
    text-align: right;
}

.tx-seminars-pi1-date {
    white-space: nowrap;
}

.tx-seminars-pi1-seats {
    text-align: center;
}

.tx-seminars-pi1-vacancies-available .tx-seminars-pi1-square {
    background-color: #00a500;
    color: inherit;
}

.tx-seminars-pi1-vacancies-2 .tx-seminars-pi1-square,
.tx-seminars-pi1-vacancies-1 .tx-seminars-pi1-square {
    background-color: #ffff3c;
    color: inherit;
}

.tx-seminars-pi1-vacancies-0 .tx-seminars-pi1-square,
.tx-seminars-pi1-canceled .tx-seminars-pi1-square {
    background-color: #c30000;
    color: inherit;
}

.tx-seminars-pi1-registration-deadline-over .tx-seminars-pi1-square {
    background-color: transparent;
    color: inherit;
}

.tx-seminars-pi1-canceled td {
    text-decoration: line-through;
}

.tx-seminars-pi1-canceled td.tx-seminars-pi1-vacancies {
    text-decoration: none;
}

div.tx-seminars-pi1-selectorwidget {
    border: 1px solid #ccc;
}

.tx-seminars-pi1-selectorwidget p {
    clear: left;
}

.tx-seminars-pi1-selectorwidget .tx-seminars-pi1-optionbox {
    float: left;
    padding-bottom: .5em;
}

.tx-seminars-pi1-selectorwidget .tx-seminars-pi1-optionbox select {
    width: 100%;
}

#tx-seminars-pi1-optionbox-1,
#tx-seminars-pi1-optionbox-4,
#tx-seminars-pi1-optionbox-5 {
    width: 20%;
}

#tx_seminars_pi1_price_from, #tx_seminars_pi1_price_to {
    width: 6em;
}

table.tx-seminars-pi1-timeslots {
    background-color: #fff;
    color: #000;
    border: 1px solid #000;
}

table.tx-seminars-pi1-timeslots th {
    background-color: #f0f0f0;
    color: inherit;
    text-align: left;
    padding: 5px;
}

table.tx-seminars-pi1-timeslots td {
    padding: 5px;
}

/*
 * Utilities
 */

.tx-seminars-display-block {
    display: block;
}

.tx-seminars-display-none {
    display: none;
}

/*
 * Hide content visually while keeping it accessible to assistive technologies
 *
 * See: https://www.a11yproject.com/posts/2013-01-11-how-to-hide-content/
 * See: https://kittygiraudel.com/2016/10/13/css-hide-and-seek/
 *
 * copied from Twitter Bootstrap:
 * https://github.com/twbs/bootstrap/blob/main/scss/mixins/_visually-hidden.scss
 */
.tx-seminars-visually-hidden {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
}

/*
 * FE editor
 */
form.tx-seminars-frontendeditor input[type="datetime-local"],
form.tx-seminars-frontendeditor input[type="number"],
form.tx-seminars-frontendeditor input[autocomplete="number"] {
    width: 13em;
}

/* Making label texts unselectable improves accessibility. */
form.tx-seminars-frontendeditor label {
    user-select: none;
}

/*
 * Registration form
 */
form.tx-seminars-event-registration input[type="number"] {
    width: 3em;
}

/* Making label texts unselectable improves accessibility. */
form.tx-seminars-event-registration label {
    user-select: none;
}

/*
 * Events list page
 */
.event-list-item__header a:hover,
.event-list-item__header a:focus,
.event-list-item__header a:active {
    text-decoration: none;
}

.event-list-item__header a:active {
    outline: 2px dashed var(--bs-link-hover-color, #0a58ca);
}

.event-list-item__details-title {
    display: inline-block;
    min-width: 8rem;
    overflow-wrap: break-word;
}

@media screen and (max-width: 767px) {
    .event-list-item__details {
        border-bottom: 1px solid var(--bs-white, #ffffff);
        padding-bottom: 1rem;
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 768px) {
    .event-list-item__content {
        flex: 1;
    }

    .event-list-item__action {
        border-left: 1px solid var(--bs-white, #ffffff);
        width: min(25%, 220px);
    }
}