
@charset "utf-8";

/* Farben */

:root {
	--notarblaualt: #2face1;
	--notarblau: #096693;
	--notarblaudark: #095d94;
	--orange: #f8a710;
}

/* ============================================================
   Cart Kurz Navi
   ============================================================ */


.navigation-item.cart a {position: relative; padding-left: 40px; display: block; min-width: 50px; }
.navigation-item.cart a::before {content:''; width: 30px; height: 30px; background: url(../img/warenkorb.svg) center no-repeat; background-size: contain; display: block; position: relative; left: 0; top: 5px;}
.navigation-item.cart a span {display: none;}
.navigation-item.cart a span.cart-num-items {display: block;
  background-color: var(--notarblau); width: 30px; color: #fff; line-height: 30px;
  height: 30px;
  border-radius: 50%;
  text-align: center;
  text-decoration: none;
  position: relative;
  left: 20px;
  top: -10px;}


/* ============================================================
   Produktbeschreibung Detailansicht
   ============================================================ */

   .no-products-message {
    padding: 20px;
    background: #f2f6f9;
    border-left: 4px solid #095d94;
    color: #3b3b3b;
}

   .auditProd {border: 2px solid #f2f2f2; margin-top: 1%; border-radius: 5px; padding: 25px; box-sizing: border-box;}
   .priceOrderBox  .boxRight .shippingInfo, .priceOrderBox .priceContainer .taxInfo {display: none;}


   .prodHead {background-color: #e4f6ff; padding: 40px; box-sizing: border-box; border-radius: 5px; }

    .prodHead p.seminar-lecturer {margin-top: 45px;}
    .prodHead p.seminar-lecturer strong {margin-right: 30px; display:inline-block;}
    .prodHead .course-duration, .prodHead .seminar-hours, .prodHead .course-degree, .prodHead .course-contact {margin-bottom: 10px;}
    .prodHead .course-duration strong, .prodHead .seminar-hours strong, .prodHead .course-degree strong, .prodHead .course-contact strong {width: 160px; display: inline-block;}


   h1.productTitle {font-size: 1.65rem; line-height: 2.25rem; margin-bottom: 20px; padding-bottom: 35px; border-bottom: 1px solid var(--notarblaudark);}
   p.code, .taxInfo {font-size: 0.875rem; line-height: 1rem; color: #ccc;}

   .priceOrderBox .currentPrice {text-align: right; color: var(--notarblau); font-size: 1.875rem;  line-height: 2.25rem; font-weight: bold;}

   .add-to-cart-container { margin-top: 1.5rem; text-align: right;}
   .add-to-cart-container .add-to-cart > * {display: inline-block;}
   .add-to-cart-container .quantity-input label {display: none;}

   input[type="number"] {width: inherit; max-width: 50px;}
   input:not([type="checkbox"]):not([type="radio"]), textarea {font-size: 1.125rem; line-height: 1.45rem; font-weight: 400; font-style: normal; padding: 10px 20px; border: 1px solid #ccc;}
.add-to-cart-container .quantity-input input {appearance: textfield;}
.submit:not(.no-button), .button:not(.no-button), button:not(.no-button) {background-color: #f8a710; border: 1px solid var(--notarblaudark); border-radius: 5px; padding: 10px 20px; font-size: 1.125rem; line-height: 1.45rem; font-weight: 400; color: #212121; font-style: normal; padding: 10px 20px; }
button.participants-modal__cancel, button.participants-modal__close {background-color:#ccc;}
.submit:not(.no-button):hover, .button:not(.no-button):hover, button:not(.no-button):hover {background-color: var(--notarblaudark); color: #fff; transition: all 0.25s ease;}

.seminar-dates-title {color: var(--notarblau);}
.auditProd ul {margin-left: 20px; margin-bottom: 20px; list-style: none;}
.auditProd ul li {padding-left: 15px; position: relative;}
.auditProd ul li::before {content:'\276F\276F'; color: var(--notarblau); position: absolute; display: block; left: -15px;}
.auditProd ul li ul {margin-top: 20px;}

/*.seminar-badge.seminar-notary {text-align: right; background-color: #ff0000; color: #fff; padding: 10px; font-size: 0.875rem; line-height: 1.125rem; float: right; margin-bottom: 25px;}*/
.seminar-badge.seminar-notary {display: inline-block; background-color: #ff0000; color: #fff; margin-bottom: 25px;
    padding: .1rem .5rem; border-radius: 3px; font-size: .8rem;}
.seminar-badge.seminar-duration {display: inline-block; background-color: var(--notarblau); color: #fff; margin-bottom: 25px;
    padding: .1rem .5rem; border-radius: 3px; font-size: .8rem;}

.priceContainer { padding-top: 25px; margin-top: 35px;}
.boxDesc {margin-top: 30px; padding-top: 50px; padding: 40px; box-sizing: border-box;}

.restockInfoListSwitchBox {text-align: right; font-size: 0.875rem; line-height: 1rem;}

.backButton a, .back-button-box a {color: var(--notarblau); text-decoration: none; margin-bottom: 20px; display: inline-block;}

.inside-description table {display: table; width: 100%; overflow: scroll; border-collapse: collapse; border-bottom: 1px solid var(--notarblau);}
.inside-description table tr:nth-child(even) {background-color: #d0e8f1;}
.inside-description table td {padding: 10px; box-sizing: border-box;}
.inside-description table thead {background-color: var(--notarblau); color: #fff; hyphens: manual;}
.inside-description table thead td {min-width: 150px;}
.inside-description table p {margin-bottom: 10px;}

/* ==========================================================================
 * Kurstyp / Kursart (Lehrgang, Online/Präsenz)
 * ======================================================================== */

/* Label "Online" / "Präsenz" (Übersicht und Detailansicht) */
.course-format {
    display: inline-block;
    padding: .1rem .5rem;
    border-radius: 3px;
    font-size: .8rem;
}

.course-format--online   { background: #a9daf8; color: #212121; }
.course-format--praesenz { background: #b9e69f; color: #212121; }
.course-format--hybrid  { background: #e4e4e4; color: #212121; }

/* Hinweis "Einstieg ggf. noch möglich" bei laufenden Lehrgängen */
.course-started {
    font-style: italic;
    color: #b25b00;
}

 .seminar-date-format {
       display: inline-block;
       margin-left: .5em;
       padding: .1em .5em;
       border-radius: 3px;
       font-size: .85em;
       line-height: 1.4;
       vertical-align: middle;
   }



/* Ansprechpartner in der Detailansicht */
.course-contact {
    margin-top: .75rem;
}

/* Warenkorb Preview */

.cart-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .65); animation: cartOverlayIn .1s ease-out; }
.cart-overlay__box { position: relative; width: 100%; max-width: 520px; max-height: 90vh; overflow-y: auto; padding: 2rem 1.5rem 1.5rem; background: #fff; border-radius: 8px; box-shadow: 0 10px 40px rgba(0, 0, 0, .25); }
.cart-overlay__close { position: absolute; top: .5rem; right: .75rem; border: 0; background: none; font-size: 1.75rem; line-height: 1; cursor: pointer; }
.cart-overlay.is-hidden { display: none; }

@keyframes cartOverlayIn {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.cart-overlay__box .product {margin-top: 25px;}
.cart-overlay__box .product .artNr {display: none;}
.cart-overlay__box .product .ls-field.quantity {display: block; width: 100%;}
.cart-overlay__box .product .ls-field.quantity .ls-field-label {float: left; margin-right: 10px;}

span#cart-preview-link-to-cart a {padding: 10px 15px; background-color: #58a709; color: #fff; margin-right: 10px; display: inline-block; text-decoration: none; transition: all 0.25s ease;}
span#cart-preview-link-to-cart a:hover {background-color: #3b6e07; transition: all 0.25s ease;}
button.participants-modal__submit {background-color: #58a709; color: #fff; transition: all 0.25s ease;}
button.participants-modal__submit:hover {background-color: #3b6e07; transition: all 0.25s ease;}


/* ============================================================
   Warenkorb BIG
   ============================================================ */

/* Warenkorb: Spaltenüberschriften nur einmal als Kopfzeile */
.cart-item-list .cart-head {
    padding-top: 0;
    padding-bottom: 8px;
    border-bottom: 1px solid #ccc;
}
.cart-item-list .cart-head .field-label {
    font-weight: 600;
}

/* Beschriftungen in den einzelnen Positionen ausblenden */
.cart-item-list .product:not(.cart-head) .price-single .field-label,
.cart-item-list .product:not(.cart-head) .quantity .field-label,
.cart-item-list .product:not(.cart-head) .price-cumulative .field-label,
.cart-item-list .product:not(.cart-head) .tax-class .field-label {
    display: none;
}

/* Smartphone: Kopfzeile weg, Beschriftungen wieder an jeder Position */
@media (max-width: 600px) {
    .cart-item-list .cart-head {
        display: none;
    }
    .cart-item-list .product:not(.cart-head) .price-single .field-label,
    .cart-item-list .product:not(.cart-head) .quantity .field-label,
    .cart-item-list .product:not(.cart-head) .price-cumulative .field-label,
    .cart-item-list .product:not(.cart-head) .tax-class .field-label {
        display: block;
    }
}

.seminar-participant-list li {margin-bottom: 0!important;}

.deviant-shipping-address-checkbox {display: none;}

   .product {display: flex; flex-wrap: wrap; position: relative;}
   .product .image {width: 16%; margin-right: 2%;}
   .order-overview .product .name-and-description {width: 58%; padding-right: 25px; box-sizing: border-box;}
   .order-overview .product .price-single {width: 10%; margin-right: 2%;}
   .order-overview .product .quantity {width: 8%; margin-right: 2%;}
   .order-overview .product .price-cumulative {width: 8%; margin-right: 2%;}
   .order-overview .product .tax-class {width: 10%;}

    .order-overview .product .product-title {margin-bottom: 15px;}
    .order-overview .product .comment .field-label {color: var(--notarblau); margin-bottom: 15px;}
    .order-overview .product .comment .field-content {margin-bottom: 15px;}

    button.remove-item {background-color: transparent; position: relative; padding-left: 55px; border: 1px solid #ccc; border-radius: 5px; margin-bottom: 15px;}
    button.remove-item:hover {background-color: #f2f2f2; color:#3b3b3b;cursor:pointer;}
    button.remove-item::before {content:''; width: 30px; height: 30px; position: absolute; display: inline-block; background: url(../img/delete.svg) center no-repeat; background-size: contain; left: 10px; top: 5px;}

    p.change-hint {font-size: 0.75rem; line-height: 1rem; color:#858585;}

    .cart-item-list .product {border-bottom: 1px solid #ccc; margin-bottom: 15px;}

.checkout-validation-error {color: #ff0000; margin-bottom: 20px;}
p.success {color: #02751f;}
#checkout-content h3 {padding-bottom: 20px; border-bottom: 1px solid var(--notarblaudark); margin-bottom: 25px;}
#checkoutStepCart, #checkoutStepCalculation, #checkoutStepCustomerData, #checkoutStepShipping, #checkoutStepPayment, #checkoutStepCustomerDataReview {padding: 20px; box-sizing: border-box;}
#checkoutStepCalculation {margin-top: 25px; margin-bottom: 25px; background-color: #f2f2f2; }
#checkoutStepCalculation .field {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
#checkoutStepCalculation .field-group.coupons {display: none;}
#checkoutStepCalculation .invoiced-amount .ls_invoiced-amount {font-weight: bold;font-size: 1.875rem;}

#checkoutStepCustomerData {border: 1px solid #ccc; margin-bottom: 35px;}

.paymentSelection #prepayment .shipping-payment-image {display: none;}

/* Warenkorb: Zahlungs- und Versandart nicht als Link darstellen */
#checkoutStepPayment a,
#checkoutStepPayment a:visited,
#checkoutStepShipping a,
#checkoutStepShipping a:visited {
    color: inherit;
    text-decoration: none;
    cursor: default;
}

#finishingOrderSubmitBox a, .widget.buttonBuy button {display: inline-block; background-color:#fcac00; color: #fff; text-decoration: none; transition: all 0.25s ease;}
#finishingOrderSubmitBox a:hover, .buttonBuy button:hover {background-color: #099409; transition: all 0.25s ease;}

.widget.buttonBuy {width: 100%; float: none; clear: both; text-align: left;}

#checkoutStepCustomerDataReview .content div {display: block;}
#checkoutStepCustomerDataReview .content .label {min-width: 120px; margin-right: 20px; float: left;}
#checkoutStepFinalConfirmation .widget-explanation {width: 98%; clear: both; float: none;}

label#lbl_66_0::after, label#lbl_83_0::after {content:'*'; color: #ff0000; display: inline-block;}


.order-login-type-wrapper {margin-top: 35px;}

.edit-item-box:not(.is-lightbox) {
    display: none !important;
}

   .lightbox-backdrop {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 999;
    background: rgba(0, 0, 0, .55);
}

.lightbox-backdrop.is-visible {
    display: block;
}

.edit-item-box.is-lightbox {
    position: fixed !important;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    max-height: 90vh;
    overflow-y: auto !important;
    width: min(520px, calc(100% - 32px));
    padding: 2.5rem 1.5rem 1.5rem;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, .25);
}

.edit-item-box .lightbox-close {
    display: none;
}

.edit-item-box.is-lightbox .lightbox-close {
    display: block;
    position: absolute;
    top: .5rem;
    right: .75rem;
    border: 0;
    background: none;
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
}

.useDeviantShippingAddress.hideElement {
    display: none;
}

.useDeviantShippingAddress:not(.hideElement) {
    animation: deviantAddressFadeIn .3s ease-out;
}

@keyframes deviantAddressFadeIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .useDeviantShippingAddress:not(.hideElement) {
        animation: none;
    }
}

.widget-explanation {width: 98%!important; float: none!important;}


#special-shop-navigation {position: absolute; right: 50px; top: 50px;}
@media screen and (max-width:1250px) {
    #special-shop-navigation { right: 140px; top: 10px;}
    .naviSecond #special-shop-navigation {display: block; position: relative; right: inherit; left: 0px; margin-top: 25px;}
    .naviSecond #special-shop-navigation  .navigation-item.cart a {padding-left:0;}
}
@media screen and (max-width:1250px) {
    #special-shop-navigation { display: none;}
}

/* Warenkorb: Zahlenspalten rechtsbündig (Werte und Kopfzeile) */
.cart-item-list .product .price-single,
.cart-item-list .product .quantity,
.cart-item-list .product .price-cumulative,
.cart-item-list .product .tax-class {
    text-align: right;
}

@media (max-width: 600px) {
    .cart-item-list .product .price-single,
    .cart-item-list .product .quantity,
    .cart-item-list .product .price-cumulative,
    .cart-item-list .product .tax-class {
        text-align: left;
    }
}


/* ============================================================
   Produktkacheln / Übersicht
   ============================================================ */

/* Produktkachel: Bezugsrahmen für das Ribbon, überstehende Enden abschneiden */
.shopProduct.prodShort {
    position: relative;
    overflow: hidden;
}

/* Hüllen des Status-Icons neutralisieren, damit das Ribbon an der Kachel ausgerichtet wird */
.shopProduct .imageContainer,
.shopProduct .product-status-icon-wrapper {
    position: static;
}

/* Ribbon "New" oben links */
.shopProduct .product-status-icon.is-new {
    position: absolute;
    top: 20px;
    left: -35px;
    width: 120px;
    padding: 3px 0;
    background: #ef4444;
    color: #fff;
    text-align: center;
    font-size: 0.8rem;
    font-weight: 700;
    line-height: 1.4;
    transform: rotate(-45deg);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 10;
}

.shopProduct .product-status-icon.is-new a {
    color: inherit;
    text-decoration: none;
    display: block;
}



.product-list .boxInnerWrapper {box-sizing: border-box; position: relative;}
.product-list .boxInnerWrapper .bottomWrapper {padding: 5px; box-sizing: border-box;}
/*.product-list .layerLinkProduct {position: absolute; width: calc(100% + 40px); height: calc(100% + 40px); top: 0; left: 0;}
.product-list .layerLinkProduct a {display: block; width: 100%; height: 100%;}
.product-list .layerLinkProduct a span {text-indent: -9999px; display: block;}*/

.product-group {margin-right: 10px;}
.product-list .product-groups {color: #fff; font-size: 0.875rem; line-height: 1rem; text-align: right;}
.product-list .priceContainer span.currentPrice {background-color:#cacaca;  font-size: 1.125rem; line-height: 1.675rem; text-align: right; padding: 10px 5%; box-sizing:border-box; display: block;}
.product-list .struck-price-addon {display: none;}

.product-list .shopProduct {margin-top: 20px; margin-bottom: 20px; position: relative; width: calc(31% - 2px); margin: 1%; float: left; border: 2px solid #f1f1f1; border-radius: 5px;}
.product-list .shopProduct:nth-of-type(3n+4) {clear: both;}
@media screen and (max-width:1000px) {
    .product-list .shopProduct {width: calc(48% - 5px);}
    .product-list .shopProduct:nth-of-type(3n+4) {clear: none;}
    .product-list .shopProduct:nth-of-type(2n+3) {clear: both;}
    .product-list .shopProduct h3 {font-size: 1.1255rem; line-height: 1.675rem;}
}
@media screen and (max-width:700px) {
    .product-list .shopProduct {width: calc(98% - 5px);}
    .product-list .shopProduct:nth-of-type(3n+4) {clear: none;}
    .product-list .shopProduct:nth-of-type(2n+3) {clear: both;}
}
.product-list .prodProdBox {background-color:var(--notarblaudark); padding: 25px 5%; box-sizing: border-box; min-height: 150px;}
.product-list .shopProduct h3 a {color: #fff; text-decoration: none; hyphens: auto; text-transform: none; margin-bottom: 0;}
.product-list .shopProduct h3 {margin-bottom: 0; font-size: 1.55rem; line-height: 2rem; hyphens: auto; display: table; margin-bottom: 0; margin-top: 35px;}
.product-list .shopProduct h3::after {content:''; width: 50px; height: 0px; border-bottom: 2px solid #fff; display: block; margin: 15px 0 5px;}
.product-list .shopProduct .seminar-meta {margin-bottom: 0!important; padding-left: 5%; padding-right: 5%;}
.product-list .shopProduct .seminar-meta .seminar-duration { display: block;}
.product-list .shopProduct .seminar-meta .seminar-start { margin: 20px 0 10px 0; color: var(--notarblau); font-weight: bold; display: block;}
.product-list .shopProduct .seminar-meta .seminar-duration::before {content: ''; display: inline-block; width: 20px; height: 20px; background: url(../img/clock.svg) center no-repeat; background-size: auto; background-size: contain; opacity: 0.7; position: relative; top: 3px; margin-right: 5px;} 

.product-list .shopProduct .priceContainer {margin-top: 10px; padding-top: 0;}


.pagination-and-sorting-container {display: block; clear: both; float: none; text-align: center;}

.pagination-and-sorting-container.bottom {clear: both; float: none; width: 100%;}
.pagination-container.bottom-pagination .merconis-pagination {margin-top: 35px;}
.merconis-pagination a span, .merconis-pagination a  {color: var(--notarblaualt)!important; text-decoration: none;}
.pagination-container span {color:#707070;}
.pagination-container.top-pagination {display: none;}

.detailLink, .detailLink a {position: absolute; width: 100%; height: 100%; left: 0; z-index: 9;}
.detailLink {transition: background 0.25s ease;} .detailLink:hover {background-color: rgba(9,93,148,0.75); transition: all 0.25s ease;}
.detailLink a::after {content:''; position: absolute; top: 150%; left: 0; display: block; width: 100%; height: 100%; z-index: 998; transition: all 0.25s ease;background: url(../img/linkWhiteThin.svg) center no-repeat; background-size: 30% auto;} 
.detailLink a:hover::after {top: 0; transition: all 0.25s ease;}


.product-list .seminar-meta {text-align: right;}

.product-list p.seminar-lecturer {color: #fff; font-size: 1.0125rem; line-height: 1.25rem; margin-top: 25px; hyphens: manual;}




#kopfgrafik .content-image img {width: 100%; height: auto;}



/* ==========================================================================
 * Checkout: Login nur nach Klick auf "Mit Kundenkonto bestellen"
 * ======================================================================== */

.order-login-type-wrapper[data-misc-order-login-type="without-login"] #checkoutStepLogin {
    display: none;
}

.order-login-type-wrapper[data-misc-order-login-type="with-login"] #checkoutStepLogin {
    animation: checkoutFadeIn .3s ease-out;
}

/* aktiven Button kennzeichnen */
.order-login-type-wrapper[data-misc-order-login-type="with-login"] .order-with-login,
.order-login-type-wrapper[data-misc-order-login-type="without-login"] .order-without-login {
    font-weight: 600;
    box-shadow: inset 0 0 0 2px currentColor;
}

/* ==========================================================================
 * Checkout: bedingte Felder (z. B. abweichende Lieferadresse)
 * ======================================================================== */

.hideElement {
    display: none !important;
}

.useDeviantShippingAddress:not(.hideElement) {
    animation: checkoutFadeIn .3s ease-out;
}

@keyframes checkoutFadeIn {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
    .order-login-type-wrapper #checkoutStepLogin,
    .useDeviantShippingAddress {
        animation: none !important;
    }
}



/* ==========================================================================
 * Teilnehmer-Popup
 * ======================================================================== */


.participants-modal { position: fixed; inset: 0; z-index: 1100; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .55); animation: participantsFadeIn .2s ease-out; }
.participants-modal.is-hidden { display: none; }
html.participants-modal-open { overflow: hidden; }
.participants-modal__box { position: relative; width: 100%; max-width: 620px; max-height: 90vh; overflow-y: auto; padding: 2rem 1.5rem 1.5rem; background: #fff; border-radius: 8px; box-shadow: 0 10px 40px rgba(0, 0, 0, .25); }
.participants-modal__close { position: absolute; top: .5rem; right: .75rem; border: 0; background: none; font-size: 1.75rem; line-height: 1; cursor: pointer; }
.participants-modal__title { margin: 0 0 .5rem; }
.participants-modal__intro { margin: 0 0 1.25rem; }
.participants-modal .participant { margin: 0 0 1rem; padding: 1rem; border: 1px solid #ddd; border-radius: 6px; }
.participants-modal .participant legend { padding: 0 .25rem; font-weight: 600; }
.participants-modal .participant__row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.participants-modal label { display: block; margin-bottom: .75rem; font-size: .9rem; }
.participants-modal *, .participants-modal *::before, .participants-modal *::after { box-sizing: border-box; }
.participants-modal input { display: block; width: 100%; margin-top: .25rem; padding: .5rem .6rem; border: 1px solid #bbb; border-radius: 4px; font: inherit; }
.participants-modal input:focus { outline: 2px solid #333; outline-offset: 1px; }
.participants-modal input:user-invalid { border-color: #c0392b; }
.participants-modal__error { margin: 0 0 1rem; color: #c0392b; }
.participants-modal__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .75rem; }
.participants-modal__actions button { padding: .6rem 1.2rem; border-radius: 4px; font: inherit; cursor: pointer; }
.participants-modal__cancel { border: 1px solid #bbb; background: #fff; }
.participants-modal__submit { border: 1px solid #333; background: #333; color: #fff; }

@media (max-width: 520px) { .participants-modal .participant__row { grid-template-columns: 1fr; gap: 0; } .participants-modal__actions button { flex: 1 1 100%; } }
@keyframes participantsFadeIn { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .participants-modal { animation: none; } }
/* Fehlermeldung direkt am "In den Warenkorb"-Formular (z. B. zu wenige freie Plätze) */
.seminar-participants-error { margin: .5rem 0 0; color: #c0392b; }
.add-to-cart .seminar-participants-data {display: none !important;}

/* ==========================================================================
 * Listenseite
 * ======================================================================== */

 /* =====================================================================
 * Listenansicht aller Seminare (template_productOverview_liste)
 * ===================================================================== */
 .mod_ls_shop_cross_seller.ls_contentWrapper.crossSellerCTE {margin-top: 1%;}
.seminar-list-item { position: relative; float: none !important; width: auto !important; margin: 0 !important; padding: 10px 20px 0 20px;
  box-sizing: border-box; border: none!important; }

/* ganze Zeile klickbar */
.seminar-list-item__link a { position: absolute; inset: 0; z-index: 1; }
.shopProduct.seminar-list-item:hover {background-color:#dbf1ff; transition: all 0.25s ease;}

.seminar-list-item__row { display: flex; align-items: flex-start; gap: 0; padding: 20px 0; border-bottom: 1px solid #ccc; font-size: 18px; line-height: 1.3; color: #3b3b3b; }

.seminar-list-item__kind { flex: 0 0 10%; padding-left: 10px; box-sizing: border-box; }
.seminar-list-item__kind span + span::before { content: ", "; }

.seminar-list-item__name { flex: 1 1 70%; padding-right: 20px; }
.seminar-list-item__name a { position: relative; z-index: 2; color: #095d94; text-decoration: none; }
.seminar-list-item:hover .seminar-list-item__name a,
.seminar-list-item__name a:focus { text-decoration: underline; }

.seminar-list-item__started { display: block; margin-top: 4px; font-size: 15px; color: #909090; }

.seminar-list-item__date { flex: 0 0 20%; text-align: right; }
.seminar-list-item__date time { display: block; }

.seminar-list-item__duration { display: block; color: #909090; }
.seminar-list-item__duration::before { content: ""; display: inline-block; width: 20px; height: 20px; margin-right: 5px; vertical-align: -3px; opacity: .7; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23555' stroke-width='1.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9.5'/%3E%3Cpath d='M12 6.5V12l3.5 2.5'/%3E%3C/svg%3E") no-repeat center / contain; }

/* Legende unter der Liste */
.seminar-legend { margin-top: 30px; font-size: 16px; }
.seminar-legend ul { margin: 0; padding: 0; list-style: none; }

/* Smartphone: Datum unter den Titel */
@media (max-width: 600px) {
    .seminar-list-item__row { flex-wrap: wrap; }
    .seminar-list-item__kind { flex-basis: 40px; padding-left: 0; }
    .seminar-list-item__name { flex-basis: calc(100% - 40px); padding-right: 0; }
    .seminar-list-item__date { flex-basis: 100%; margin-top: 6px; padding-left: 40px; text-align: left; }
    .seminar-list-item__date time,
    .seminar-list-item__duration { display: inline-block; margin-right: 12px; }
}

/* ==========================================================================
 * Widerruf
 * ======================================================================== */

 #ctrl_withdrawalIdentifier {margin-left: 25px;}

 /* =====================================================================
 * Widerrufsformular (Merconis-Modul "Widerruf", .mod_ls_shop_withdrawal)
 * ===================================================================== */
.mod_ls_shop_withdrawal__screen-b h2 {
    margin-bottom: 20px;
}

/* "Alles auswählen" nur einmal: am Desktop im Tabellenkopf, mobil darüber */
.mod_ls_shop_withdrawal__select-all-responsive {
    display: none;
}

/* Tabelle der Positionen */
.mod_ls_shop_withdrawal__items {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
}
.mod_ls_shop_withdrawal__items th,
.mod_ls_shop_withdrawal__items td {
    padding: 12px 10px;
    text-align: left;
    vertical-align: middle;
    border-bottom: 1px solid #ccc;
}
.mod_ls_shop_withdrawal__items th {
    font-weight: 600;
    border-bottom-color: #3b3b3b;
}
.mod_ls_shop_withdrawal__items th:first-child,
.mod_ls_shop_withdrawal__items td:first-child {
    width: 1%;
    white-space: nowrap;
}

/* Zahlen rechtsbündig: Einzelpreis, Menge */
.mod_ls_shop_withdrawal__items th:nth-child(4),
.mod_ls_shop_withdrawal__items td:nth-child(4),
.mod_ls_shop_withdrawal__items th:nth-child(5),
.mod_ls_shop_withdrawal__items td:nth-child(5) {
    text-align: right;
    white-space: nowrap;
}

/* Beschriftungen in den Zellen nur mobil (am Desktop steht die Überschrift im Kopf) */
.mod_ls_shop_withdrawal__item-detail-key {
    display: none;
}

/* Checkbox "Auswählen": Text nur für Screenreader */
.mod_ls_shop_withdrawal__items td:first-child label {
    font-size: 0;
}
.mod_ls_shop_withdrawal__items td:first-child input[type="checkbox"],
.mod_ls_shop_withdrawal__items th:first-child input[type="checkbox"],
.mod_ls_shop_withdrawal__select-all-responsive input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin: 0 6px 0 0;
    vertical-align: middle;
}
.mod_ls_shop_withdrawal__items th:first-child label {
    font-weight: 600;
    cursor: pointer;
}

/* Menge ändern: Eingabe erst nach Klick auf "Ändern" zeigen */
.mod_ls_shop_withdrawal [data-withdrawal-toggle-container] [data-lsjs-element="toggleableArea"] {
    display: none;
}
.mod_ls_shop_withdrawal [data-withdrawal-toggle-container][data-misc-status="edit"] [data-lsjs-element="toggleableArea"] {
    display: block;
    margin-top: 8px;
}
.mod_ls_shop_withdrawal [data-withdrawal-toggle-container][data-misc-status="edit"] [data-lsjs-element="toggler"] {
    display: none;
}
.mod_ls_shop_withdrawal [data-withdrawal-quantity-controls] {
    display: flex;
    gap: 6px;
    align-items: center;
}
.mod_ls_shop_withdrawal [data-withdrawal-quantity-input] {
    width: 70px;
    padding: 6px 8px;
}

/* Kleine Buttons in der Tabelle ("Ändern", "OK") */
.mod_ls_shop_withdrawal__items button {
    padding: 6px 14px;
    font-size: 0.9rem;
    cursor: pointer;
}

/* Eingabefelder Name / E-Mail untereinander, Beschriftung oben */
.mod_ls_shop_withdrawal__screen-b .widget {
    margin-bottom: 18px;
    max-width: 480px;
}
.mod_ls_shop_withdrawal__screen-b .widget label {
    display: block;
    margin-bottom: 5px;
}
.mod_ls_shop_withdrawal__screen-b .widget input[type="text"] {
    width: 100%;
    box-sizing: border-box;
}

/* Absende-Button */
.mod_ls_shop_withdrawal__screen-b button[type="submit"] {
    margin-top: 10px;
    padding: 10px 24px;
    font-weight: 600;
    cursor: pointer;
}

.mod_ls_shop_withdrawal .error {
    color: #c00;
    margin: 6px 0 0;
}

/* Allgemeine Tabellen-Regeln des Themes (unter 900 px) für dieses Formular aufheben */
.mod_ls_shop_withdrawal__items { display: table; }
.mod_ls_shop_withdrawal__items thead { display: table-header-group; }
.mod_ls_shop_withdrawal__items tbody { display: table-row-group; }
.mod_ls_shop_withdrawal__items tr { display: table-row; border: 0; }
.mod_ls_shop_withdrawal__items th,
.mod_ls_shop_withdrawal__items td { display: table-cell; position: static; margin: 0; font-size: 1rem; line-height: 1.4; }
.mod_ls_shop_withdrawal__items td::before { content: none; }

/* Tablet/Smartphone (wie das Theme bis 900 px): Tabelle als Karten, Beschriftungen in den Zellen */
@media (max-width: 900px) {
    .mod_ls_shop_withdrawal__select-all-responsive {
        display: block;
        margin-bottom: 10px;
    }
    .mod_ls_shop_withdrawal__items thead {
        display: none;
    }
    .mod_ls_shop_withdrawal__items,
    .mod_ls_shop_withdrawal__items tbody,
    .mod_ls_shop_withdrawal__items tr,
    .mod_ls_shop_withdrawal__items td {
        display: block;
        width: auto !important;
    }
    .mod_ls_shop_withdrawal__items tr {
        padding: 10px 0;
        border-bottom: 1px solid #ccc;
    }
    .mod_ls_shop_withdrawal__items td {
        padding: 4px 0;
        border: 0;
        text-align: left !important;
    }
    .mod_ls_shop_withdrawal__items td:first-child label {
        font-size: inherit;
    }
    .mod_ls_shop_withdrawal__item-detail-key {
        display: inline-block;
        min-width: 120px;
        color: #909090;
    }
}

/* =====================================================================
 * Warenkorb, Bestellübersicht, Seite nach Bestellabschluss: Smartphone
 * Titel oben, darunter Einzelpreis | Menge | Preis nebeneinander,
 * dann Teilnehmer und "Entfernen".
 * ===================================================================== */
@media (max-width: 600px) {
    .cart-item-list .product:not(.cart-head) {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        column-gap: 10px;
        row-gap: 6px;
        padding: 15px 0;
    }

    /* Spaltenbreiten und Floats aus dem Desktop-Layout aufheben */
    .cart-item-list .product:not(.cart-head) > div {
        width: auto !important;
        float: none !important;
        margin: 0 !important;
        padding: 0 !important;
        min-width: 0;
    }
    .cart-item-list .product .image {
        display: none !important;
    }

    /* Inhalt des Titelblocks direkt ins Raster holen, damit die Preise
       zwischen Titel und Teilnehmern stehen können */
    .cart-item-list .product:not(.cart-head) > .name-and-description {
        display: contents;
    }
    .cart-item-list .product .name-and-description > * {
        grid-column: 1 / -1;
        order: 3;
        margin: 0;
    }
    .cart-item-list .product .name-and-description > .title,
    .cart-item-list .product .name-and-description > .error {
        order: 1;
        font-weight: 600;
        hyphens: auto;
        overflow-wrap: break-word;
    }

    /* Preiszeile */
    .cart-item-list .product .price-single,
    .cart-item-list .product .quantity,
    .cart-item-list .product .price-cumulative {
        order: 2;
        margin-top: 6px !important;
        padding-bottom: 4px !important;
        white-space: nowrap;
    }
    .cart-item-list .product .price-single { text-align: left !important; }
    .cart-item-list .product .quantity { text-align: center !important; }
    .cart-item-list .product .price-cumulative { text-align: right !important; font-weight: 600; }

    .cart-item-list .product .price-single .field-label,
    .cart-item-list .product .quantity .field-label,
    .cart-item-list .product .price-cumulative .field-label {
        display: block !important;
        font-size: 0.75rem;
        color: #909090;
        line-height: 1.3;
    }

    /* Steuersatz (bei Seminaren 0 %) mobil ausblenden */
    .cart-item-list .product .tax-class {
        display: none !important;
    }

    /* Teilnehmer: lange E-Mail-Adressen umbrechen */
    .cart-item-list .product .comment {
        margin-top: 8px;
    }
    .cart-item-list .product .comment .field-content {
        overflow-wrap: anywhere;
        hyphens: none;
    }

    /* Entfernen-Button und Hinweis */
    .cart-item-list .product .form-delete {
        margin-top: 10px;
    }
    .cart-item-list .product .change-hint {
        hyphens: none;
    }
}
