/* =========================================================
   belisoft Cart v3.0.0 – CI layer
   Technical base remains the working Novahosting orderform.
   ========================================================= */

#order-standard_cart {
    --brand-primary: #ff5b4d;
    --brand-primary-dark: #ef493b;
    --brand-petrol: #073b49;
    --brand-petrol-dark: #062d38;
    --brand-text: #173042;
    --brand-muted: #6f8290;
    --brand-border: #dfe7eb;
}

#order-standard_cart .header-lined {
    background: linear-gradient(
        115deg,
        var(--brand-petrol-dark) 0%,
        var(--brand-petrol) 56%,
        var(--brand-primary) 100%
    ) !important;
}

#order-standard_cart .btn-primary,
#order-standard_cart .btn-success,
#order-standard_cart .btn-warning,
#order-standard_cart .btn-order-now,
#order-standard_cart button[type="submit"],
#order-standard_cart input[type="submit"] {
    border-color: var(--brand-primary) !important;
    background: var(--brand-primary) !important;
    color: #fff !important;
}

#order-standard_cart .btn-primary:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart .btn-warning:hover,
#order-standard_cart .btn-order-now:hover,
#order-standard_cart button[type="submit"]:hover,
#order-standard_cart input[type="submit"]:hover {
    border-color: var(--brand-primary-dark) !important;
    background: var(--brand-primary-dark) !important;
}

#order-standard_cart .products .product > header,
#order-standard_cart .belisoft-product-grid .product > header {
    border-bottom-color: var(--brand-primary) !important;
}

#order-standard_cart .products .product-desc li::before,
#order-standard_cart .belisoft-product-grid .product-desc li::before,
#order-standard_cart .belisoft-price-prefix {
    color: var(--brand-primary) !important;
}

#order-standard_cart input[name="paymentmethod"] {
    accent-color: var(--brand-primary) !important;
}

#order-standard_cart .payment-method:hover,
#order-standard_cart .belisoft-checkout-payment-card:hover,
#order-standard_cart .payment-method.active,
#order-standard_cart .payment-method.selected,
#order-standard_cart .belisoft-checkout-payment-card.is-selected {
    border-color: var(--brand-primary) !important;
    box-shadow: 0 0 0 2px rgba(255, 91, 77, .14) !important;
}

#order-standard_cart .order-summary .total-due-today,
#order-standard_cart .order-summary .amt {
    color: var(--brand-primary) !important;
}

/* Preise sauber mit Abstand */
#order-standard_cart .price,
#order-standard_cart .amt {
    white-space: normal !important;
}

/* Drei Produktspalten wie im funktionierenden Aufbau */
#order-standard_cart .belisoft-product-grid,
#order-standard_cart .belisoft-product-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
}

@media (max-width: 1199px) {
    #order-standard_cart .belisoft-product-grid,
    #order-standard_cart .belisoft-product-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    #order-standard_cart .belisoft-product-grid,
    #order-standard_cart .belisoft-product-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   Dynamische Produktbreite nach Produktanzahl
   ========================================================= */

/* 1 Produkt: volle Breite */
#order-standard_cart .belisoft-product-grid.belisoft-products-count-1 {
    grid-template-columns: minmax(0, 1fr) !important;
}

/* 2 Produkte: zwei gleich breite Spalten */
#order-standard_cart .belisoft-product-grid.belisoft-products-count-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Ab 3 Produkten: drei Spalten */
#order-standard_cart .belisoft-product-grid:not(.belisoft-products-count-1):not(.belisoft-products-count-2) {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

/* Karten füllen ihre jeweilige Spalte vollständig */
#order-standard_cart .belisoft-product-grid-item,
#order-standard_cart .belisoft-product-grid-item > .product {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

/* Tablet */
@media (max-width: 1199px) {
    #order-standard_cart .belisoft-product-grid:not(.belisoft-products-count-1) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    #order-standard_cart .belisoft-product-grid.belisoft-products-count-1 {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    #order-standard_cart .belisoft-product-grid,
    #order-standard_cart .belisoft-product-grid.belisoft-products-count-1,
    #order-standard_cart .belisoft-product-grid.belisoft-products-count-2 {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/* =========================================================
   belisoft Cart v3.0.8
   Produkterweiterungen – finales Bootstrap-Grid
   ========================================================= */

html body .cart-body > .products > .row.row-eq-height {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 22px !important;
    width: 100% !important;
    margin: 0 !important;
}

/*
 * Nur die echten Produktspalten sind Grid-Elemente.
 * Bootstrap-Clearfix-Elemente dürfen keine eigene Grid-Zelle belegen.
 */
html body .cart-body > .products > .row.row-eq-height > .clearfix {
    display: none !important;
}

html body .cart-body > .products > .row.row-eq-height > .col-md-6 {
    float: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Karte füllt nur ihre Spalte; der interne WHMCS-Aufbau bleibt erhalten */
html body .cart-body > .products > .row.row-eq-height > .col-md-6 > .product {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 100% !important;
    margin: 0 !important;
}

/* Alte Bootstrap-Floats innerhalb der Karte neutralisieren */
html body .cart-body > .products > .row.row-eq-height .product header,
html body .cart-body > .products > .row.row-eq-height .product footer,
html body .cart-body > .products > .row.row-eq-height .product .product-desc {
    float: none !important;
    width: 100% !important;
}

/* Zwei Produkte verteilen sich auf die volle Breite */
html body .cart-body > .products > .row.row-eq-height:has(> .col-md-6:nth-of-type(2):last-of-type) {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

/* Ein Produkt nutzt die volle Breite */
html body .cart-body > .products > .row.row-eq-height:has(> .col-md-6:first-of-type:last-of-type) {
    grid-template-columns: minmax(0, 1fr) !important;
}

@media (max-width: 1199px) {
    html body .cart-body > .products > .row.row-eq-height {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    html body .cart-body > .products > .row.row-eq-height {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}


/* =========================================================
   belisoft Produkterweiterungen – finales 2-Spalten-Layout
   Nur addons.tpl, keine Auswirkung auf andere Produktgruppen
   ========================================================= */

.cart-body .belisoft-addon-products {
    width: 100% !important;
    margin: 10px 0 0 !important;
}

.cart-body .belisoft-addon-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    align-items: stretch !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.cart-body .belisoft-addon-grid-item {
    display: flex !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.cart-body .belisoft-addon-grid-item > .product {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
}

.cart-body .belisoft-addon-form {
    display: flex !important;
    flex: 1 1 auto !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
}

.cart-body .belisoft-addon-grid-item header {
    float: none !important;
    width: 100% !important;
}

.cart-body .belisoft-addon-grid-item .product-desc {
    float: none !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
}

.cart-body .belisoft-addon-description {
    width: 100% !important;
    overflow-wrap: anywhere !important;
}

.cart-body .belisoft-addon-product-select,
.cart-body .belisoft-addon-product-select select {
    width: 100% !important;
    max-width: 100% !important;
}

.cart-body .belisoft-addon-grid-item footer {
    float: none !important;
    width: 100% !important;
    margin-top: auto !important;
}

.cart-body .belisoft-addon-grid-item .product-pricing {
    margin-bottom: 14px !important;
}

/* Belisoft-CI */
.cart-body .belisoft-addon-grid-item .btn-success {
    border-color: #ff5b4d !important;
    background: #ff5b4d !important;
    color: #fff !important;
}

.cart-body .belisoft-addon-grid-item .btn-success:hover,
.cart-body .belisoft-addon-grid-item .btn-success:focus {
    border-color: #ed493c !important;
    background: #ed493c !important;
}

/* Mobil: eine Spalte */
@media (max-width: 767px) {
    .cart-body .belisoft-addon-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}


/* =========================================================
   BELISOFT ADDONS EMERGENCY FINAL
   Nur Produkterweiterungen: exakt zwei Spalten
   ========================================================= */

/* Alte globale Flex-/Grid-Regeln auf dieser Seite neutralisieren */
html body #order-standard_cart .products.belisoft-addon-page {
    display: block !important;
    width: 100% !important;
    margin: 10px 0 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

html body #order-standard_cart
.products.belisoft-addon-page > .row.row-eq-height {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px !important;
    width: 100% !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
    align-items: stretch !important;
}

html body #order-standard_cart
.products.belisoft-addon-page > .row.row-eq-height > .col-md-6 {
    display: block !important;
    float: none !important;
    flex: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Alte Höhen- und Flexregeln vollständig zurücksetzen */
html body #order-standard_cart
.products.belisoft-addon-page .product {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 100% !important;
    margin: 0 !important;
}

html body #order-standard_cart
.products.belisoft-addon-page .product > form {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 100% !important;
}

html body #order-standard_cart
.products.belisoft-addon-page header,
html body #order-standard_cart
.products.belisoft-addon-page .product-desc,
html body #order-standard_cart
.products.belisoft-addon-page footer {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
}

html body #order-standard_cart
.products.belisoft-addon-page .product-desc {
    flex: 1 1 auto !important;
}

html body #order-standard_cart
.products.belisoft-addon-page footer {
    margin-top: auto !important;
}

html body #order-standard_cart
.products.belisoft-addon-page select {
    width: 100% !important;
    max-width: 100% !important;
}

/* Belisoft-CI */
html body #order-standard_cart
.products.belisoft-addon-page .btn-success {
    border-color: #ff5b4d !important;
    background: #ff5b4d !important;
    color: #fff !important;
}

html body #order-standard_cart
.products.belisoft-addon-page .btn-success:hover {
    border-color: #ed493c !important;
    background: #ed493c !important;
}

/* Mobil: eine Spalte */
@media (max-width: 767px) {
    html body #order-standard_cart
    .products.belisoft-addon-page > .row.row-eq-height {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}


/* =========================================================
   BELISOFT CHECKOUT PAYMENT CARDS V3.1
   ========================================================= */

/* ---------------------------------------------------------
   Bestellsumme: Titel weiss
   --------------------------------------------------------- */

html body #order-standard_cart #orderSummary .order-summary > h2,
html body #order-standard_cart .order-summary > h2,
html body #order-standard_cart .order-summary header h2,
html body #order-standard_cart .order-summary .summary-title,
html body .secondary-cart-sidebar .order-summary > h2 {
    color: #ffffff !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

html body #order-standard_cart #orderSummary .order-summary > h2 *,
html body #order-standard_cart .order-summary > h2 * {
    color: #ffffff !important;
}

/* ---------------------------------------------------------
   Zahlungsarten-Container
   --------------------------------------------------------- */

html body #order-standard_cart #paymentGatewaysContainer {
    width: 100% !important;
    margin: 0 0 28px !important;
}

html body #order-standard_cart #paymentGatewaysContainer > p {
    margin: 0 0 14px !important;
    color: #6f8290 !important;
    text-align: left !important;
}

html body #order-standard_cart .belisoft-payment-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important;
    align-items: stretch !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
}

/* ---------------------------------------------------------
   Zahlungsmethoden-Karte
   --------------------------------------------------------- */

html body #order-standard_cart .belisoft-payment-card {
    position: relative !important;

    display: grid !important;
    grid-template-columns: 46px minmax(0, 1fr) 20px !important;
    gap: 13px !important;
    align-items: center !important;

    min-width: 0 !important;
    width: 100% !important;
    min-height: 98px !important;

    margin: 0 !important;
    padding: 17px 16px !important;

    border: 1px solid #dce5e9 !important;
    border-radius: 14px !important;

    background: #ffffff !important;
    color: #173042 !important;

    cursor: pointer !important;
    overflow: hidden !important;

    box-shadow: 0 7px 20px rgba(7, 59, 73, .07) !important;

    transition:
        border-color .18s ease,
        background-color .18s ease,
        box-shadow .18s ease,
        transform .18s ease !important;
}

html body #order-standard_cart .belisoft-payment-card:hover {
    border-color: #ff5b4d !important;

    box-shadow:
        0 10px 24px rgba(255, 91, 77, .14) !important;

    transform: translateY(-1px) !important;
}

html body #order-standard_cart .belisoft-payment-card.is-selected {
    border-color: #ff5b4d !important;
    background: #fff8f7 !important;

    box-shadow:
        0 0 0 2px rgba(255, 91, 77, .12),
        0 10px 24px rgba(255, 91, 77, .12) !important;
}

/* ---------------------------------------------------------
   Zahlungsarten-Icon
   --------------------------------------------------------- */

html body #order-standard_cart .belisoft-payment-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;

    border-radius: 11px !important;

    background: #073b49 !important;
    color: #ffffff !important;

    font-size: 19px !important;
    line-height: 1 !important;
}

html body #order-standard_cart .belisoft-payment-icon i {
    margin: 0 !important;
    color: #ffffff !important;
    font-size: 19px !important;
    line-height: 1 !important;
}

/* QR-Rechnung und aktive Zahlungsmethode im Belisoft-Rot */
html body #order-standard_cart
.belisoft-payment-card[data-gateway-system*="swiss_slip"]
.belisoft-payment-icon,

html body #order-standard_cart
.belisoft-payment-card[data-gateway-name*="QR"]
.belisoft-payment-icon,

html body #order-standard_cart
.belisoft-payment-card.is-selected
.belisoft-payment-icon {
    background: #ff5b4d !important;
}

/* ---------------------------------------------------------
   Text
   --------------------------------------------------------- */

html body #order-standard_cart .belisoft-payment-copy {
    display: block !important;
    min-width: 0 !important;

    margin: 0 !important;
    text-align: left !important;
}

html body #order-standard_cart .belisoft-payment-copy strong {
    display: block !important;

    margin: 0 0 4px !important;

    color: #173042 !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;

    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

html body #order-standard_cart .belisoft-payment-copy small {
    display: block !important;

    margin: 0 !important;

    color: #6f8290 !important;

    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;

    white-space: normal !important;
}

/* ---------------------------------------------------------
   Auswahlkreis
   --------------------------------------------------------- */

html body #order-standard_cart .belisoft-payment-check {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 20px !important;
    height: 20px !important;

    border: 1.5px solid #ccd8de !important;
    border-radius: 50% !important;

    background: #ffffff !important;
}

html body #order-standard_cart
.belisoft-payment-card.is-selected
.belisoft-payment-check {
    border-color: #ff5b4d !important;
    background: #ff5b4d !important;
}

html body #order-standard_cart
.belisoft-payment-card.is-selected
.belisoft-payment-check::after {
    content: "✓" !important;

    color: #ffffff !important;

    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

/* Native Radio- und iCheck-Darstellungen ausblenden */
html body #order-standard_cart .belisoft-payment-card
input[name="paymentmethod"] {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    margin: 0 !important;
    padding: 0 !important;

    opacity: 0 !important;
    overflow: hidden !important;
}

html body #order-standard_cart .belisoft-payment-card
.iradio_square-blue,

html body #order-standard_cart .belisoft-payment-card
.iradio_flat-blue {
    position: absolute !important;

    width: 1px !important;
    height: 1px !important;

    opacity: 0 !important;
    overflow: hidden !important;
}

/* ---------------------------------------------------------
   Bestellbutton ebenfalls Belisoft-Rot
   --------------------------------------------------------- */

html body #order-standard_cart #btnCompleteOrder {
    border-color: #ff5b4d !important;
    background: #ff5b4d !important;
    color: #ffffff !important;
}

html body #order-standard_cart #btnCompleteOrder:hover,
html body #order-standard_cart #btnCompleteOrder:focus {
    border-color: #ed493c !important;
    background: #ed493c !important;
}

/* ---------------------------------------------------------
   Responsive
   --------------------------------------------------------- */

@media (max-width: 991px) {
    html body #order-standard_cart .belisoft-payment-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    html body #order-standard_cart .belisoft-payment-grid {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    html body #order-standard_cart .belisoft-payment-card {
        min-height: 88px !important;
    }
}
/* ==========================================================
   BELISOFT CHECKOUT DESIGN v3.2
   ========================================================== */

/* ----------------------------------------------------------
   Bemerkungsfeld
   ---------------------------------------------------------- */

#order-standard_cart #inputNotes,
#order-standard_cart textarea {
    border: 1px solid #01303a !important;
    border-radius: 10px !important;
    background: #fff !important;
    transition: .2s;
}

#order-standard_cart #inputNotes:focus,
#order-standard_cart textarea:focus {
    border-color: #2AA9A5 !important;
    box-shadow: 0 0 0 3px rgba(42,169,165,.12) !important;
}


/* ----------------------------------------------------------
   Heute fälliger Gesamtbetrag
   ---------------------------------------------------------- */

#order-standard_cart .alert-success,
#order-standard_cart .alert-info {
    font-size: 22px !important;
    font-weight: 700 !important;
}
/* ==========================================================
   BELISOFT CI - Hover Farben
   ========================================================== */

/* Produktkarten */
#order-standard_cart .product {
    transition: all .25s ease;
}

#order-standard_cart .product:hover {
    border-color: #F15A29 !important;
    box-shadow: 0 12px 30px rgba(241,90,41,.18) !important;
}

/* Rote Linie oben */
#order-standard_cart .product:hover header {
    border-bottom-color: #F15A29 !important;
}

/* Buttons */
#order-standard_cart .product .btn {
    transition: all .25s ease;
}

#order-standard_cart .product .btn:hover {
    background: #F15A29 !important;
    border-color: #F15A29 !important;
    color: #fff !important;
}

/* Links im Sidebar-Menü */
#order-standard_cart .panel-sidebar a:hover,
#order-standard_cart .panel-sidebar .list-group-item:hover {
    color: #F15A29 !important;
}
/* ==========================================================
   BELISOFT BUTTONS
   ========================================================== */

#order-standard_cart .product .btn,
#order-standard_cart .btn-success,
#order-standard_cart .btn-primary {

    background: #F15A29 !important;
    border: 1px solid #F15A29 !important;
    color: #fff !important;

    transition: all .25s ease;
}

/* Hover */
#order-standard_cart .product .btn:hover,
#order-standard_cart .btn-success:hover,
#order-standard_cart .btn-primary:hover {

    background: #01303a !important;
    border-color: #01303a !important;
    color: #fff !important;

    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(87,199,197,.28);
}

/* Active */
#order-standard_cart .product .btn:active,
#order-standard_cart .btn-success:active,
#order-standard_cart .btn-primary:active {

    background: #46b7b4 !important;
    border-color: #46b7b4 !important;
    color: #fff !important;
}
/* Produktkarte */

#order-standard_cart .product header {
    border-bottom: 2px solid #F15A29 !important;
    transition: border-color .25s ease;
}

#order-standard_cart .product:hover header {
    border-bottom-color: #01303a !important;
}


/* Sicherheit: Der Inhalt der Box darf nicht abgeschnitten werden */
#order-standard_cart #orderSummary,
#order-standard_cart #orderSummary .order-summary {
    overflow: visible !important;
}