/*!
 Theme Name:   JFconcept Bricks Child Theme
 Theme URI:    https://jfconcept.de/
 Description:  A JFconcept GmbH Child-Theme for Bricks Builder
 Author:       JFconcept GmbH
 Author URI:   https://jfconcept.de/
 Template:     bricks
 Version:      1.7
 Text Domain:  bricks
*/
html[data-theme="dark"],.brxc-dark-colors,html[data-theme="light"] .brxc-reversed-colors,html[data-theme="dark"] .brxc-initial-colors,html {
    --blue: hsla(210, 68.8%, 21.4%, 1);
    --green: hsla(152, 100%, 32.4%, 1);
    --light-grey: hsla(0, 0%, 97.6%, 1);
    --blue-grey: hsla(209, 9.7%, 42.5%, 1);
    --fogtec-green: hsla(154, 100%, 24.7%, 1)
}

body {
    font-family: "Inter";
    font-weight: 400
}

.brxe-text ul {
    padding-left: 1em
}

.brxe-text a {
    color: var(--green);
    font-weight: 600
}

[id] {
	scroll-margin-top: 104px;
    scroll-behavior: smooth
}

.gform_wrapper.gravity-theme .gform_fields .gfield.file-download-field {
    background-color: #f8f9fa;
    padding: 15px;
    border-left: 4px solid #0073aa
}

.gform_wrapper.gravity-theme .gform_fields .gfield.file-download-field .gfield_label {
    font-weight: 600;
    color: #0073aa
}

.whitepaper {
    background: #fff;
    box-shadow: 4px 4px 0 #E3E6EB;
    background-image: linear-gradient(90deg, #f9f9f9 12px, 0, #E3E6EB 15px, 0, #f9f9f9 20px, 0, #f9f9f9 100%), radial-gradient(circle closest-side, rgba(255, 255, 255, 0) 88%, #f9f9f9 100%), radial-gradient(circle at 22px 8px, #f9f9f9 40%, #E3E6EB 40%, #E3E6EB 100%);
    background-size: 32px 8px, 32px 16px, 32px 16px;
    background-repeat: space no-repeat;
    background-position: center top, center 6px, center 6px
}

.whitepaper--alt {
    background-image: linear-gradient(90deg, #f9f9f9 12px, 0, #E3E6EB 15px, 0, #f9f9f9 20px, 0, #f9f9f9 100%), radial-gradient(circle closest-side, rgba(255, 255, 255, 0) 88%, #f9f9f9 100%), radial-gradient(circle at 22px 8px, #f9f9f9 40%, #E3E6EB 40%, #E3E6EB 100%);
    background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 21'%3E%3Cpath d='M20 0h-7v6.9a7.5 7.5 0 107 0V0z' fill='%23f9f9f9'/%3E%3Cpath d='M13 0h3v6.9a7.5 7.5 0 002 14 7.5 7.5 0 01-9-7.4c0-2.9 1.6-5.4 4-6.6V0z' fill='%23E3E6EB'/%3E%3C/svg%3E");
    background-size: 2em 1.3125em
}

.paper {
    background: #fff;
    box-shadow: 0 0px 2px rgba(0, 0, 0, 0.15), 0 10px 0 -5px #E3E6EB, 0 10px 1px -4px rgba(0, 0, 0, 0.15), 0 20px 0 -10px #E3E6EB, 0 20px 1px -9px rgba(0, 0, 0, 0.15);
    padding: 30px
}

.paper-box {
    position: relative;
    background: #fff;
    border-radius: 2px
}

.paper-box::before,.paper-box::after {
    content: "";
    position: absolute;
    bottom: 10px;
    width: 40%;
    height: 10px;
    box-shadow: 0 5px 14px rgba(0, 0, 0, 0.7);
    z-index: -1;
    transition: all 0.3s ease-in-out
}

.paper-box::before {
    left: 15px;
    transform: skew(-5deg) rotate(-5deg)
}

.paper-box::after {
    right: 15px;
    transform: skew(5deg) rotate(5deg)
}

.paper-box:hover::before,.paper-box:hover::after {
    box-shadow: 0 2px 14px rgba(0, 0, 0, 0.4)
}

.paper-box:hover::before {
    left: 5px
}

.paper-box:hover::after {
    right: 5px
}

.jfc-download-ready {
    background-color: #E3E6EB !important;
    padding: 20px !important;
    margin: 20px 0 !important;
    text-align: center !important
}

.jfc-download-ready h4 {
    color: var(--blue) !important;
    margin-top: 0;
    font-weight: bold !important;
    margin-bottom: var(--gap-s) !important;
    font-size: var(--font-h4) !important
}

.jfc-download-ready .bricks-background-primary {
    display: inline-block;
    background-color: #0073aa;
    color: #fff;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 4px;
    font-weight: bold;
    margin-top: 10px;
    padding-top: var(--gap-2xs) !important;
    padding-right: var(--gap-s) !important;
    padding-bottom: var(--gap-2xs) !important;
    padding-left: var(--gap-s) !important;
    line-height: 1.2 !important
}

.jfc-download-ready .button:hover {
    background-color: #005177
}

.fold {
    position: relative;
    height: 200px;
    padding: 25px;
    background: #fff
}

.fold:before {
    content: "";
    position: absolute;
    top: 32px;
    right: 32px;
    border-style: solid;
    border-width: 0 100px 100px 0;
    border-color: #ddd #344;
    transition: all ease 0.5s
}

.note {
    position: relative;
    color: #fff;
    background: #11375C;
    overflow: hidden;
    border-radius: 5px 0px 0px 0px
}

.note:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    border-width: 0 24px 24px 0;
    border-style: solid;
    border-color: var(--light-grey) var(--light-grey) #1A446C #1A446C;
    background: #1A446C;
    box-shadow: 0 0px 10px rgba(0, 0, 0, 0.3);
    display: block;
    width: 0;
    border-radius: 0px 0px 0px 5px
}

.note.rounded {
    -moz-border-radius: 5px 0 5px 5px;
    border-radius: 5px 0 5px 5px
}

.note.rounded:before {
    border-width: 8px;
    border-color: var(--light-grey) var(--light-grey) transparent transparent;
    -moz-border-radius: 0 0 0 5px;
    border-radius: 0 0 0 5px
}

.banner-caption .banner-title {
    font-size: var(--font-h1);
    padding-top: 4.5vw;
    font-size: 14vw;
    font-size: 9vw;
    line-height: 1;
    line-height: 0.7;
    color: var(--blue);
    font-family: "Hand Book";
    text-transform: uppercase;
    font-weight: 400
}

.banner-caption .banner-subtitle {
    font-size: var(--font-h3);
    font-size: 4.3vw;
    color: var(--green);
    color: var(--fogtec-green);
    line-height: 1;
    line-height: 0.5;
    background: rgba(255, 255, 255, 0.86);
    padding: var(--gap-s) var(--gap-m);
    padding: 2vw 1vw 0.8vw 1vw;
    border-radius: 10px;
    font-family: "Hand Book";
    text-transform: uppercase;
    font-weight: 400
}

.resend-message {
    padding: 10px;
    margin: 10px 0;
    border-radius: 4px
}

.resend-message-success {
    background-color: #d4edda;
    color: #155724;
    border: 1px solid #c3e6cb
}

.resend-message-error {
    background-color: #f8d7da;
    color: #721c24;
    border: 1px solid #f5c6cb
}

.resend-confirmation-btn {
    margin-top: var(--gap-s);
    color: #fff !important
}

.resend-confirmation-btn.loading {
    opacity: 0.6;
    cursor: not-allowed
}

.resend-confirmation-btn.cooldown {
    opacity: 0.7;
    cursor: not-allowed
}

.gform-theme--framework .gform_validation_errors ol a {
    text-decoration: none !important
}

.fogtec_validation_message {
    color: #fff !important;
    padding: 15px !important;
    border-radius: 0px !important;
    margin-top: 8px !important
}

.fogtec_validation_message b {
    font-weight: 700 !important
}

.fogtec_validation_message.success {
    background-color: var(--green) !important
}

.fogtec_validation_message.error {
    background-color: #c0392b !important
}

.bricks-nav-menu .sub-menu {
    box-shadow: 0 15px 15px rgba(0, 0, 0, 0.1);
}

/* fluid 5 columns */
.grid-sizer,
.grid-item {
    width: calc(50% - calc(var(--gap-l) / 2));
    margin-bottom: var(--gap-l);
}

/* Styling für das Vorschaubild in der Nested Forms Tabelle */
.gpnf-summary-image img {
    width: 75px;      /* Breite des Bildes */
    height: 75px;     /* Höhe des Bildes */
    object-fit: cover;/* Stellt sicher, dass das Bild den Raum füllt, ohne sich zu verzerren */
    border-radius: 4px; /* Leicht abgerundete Ecken */
}

/* Container für das Bild in der Zelle */
.image-preview-container {
    position: relative;
    display: inline-block; /* Verhindert, dass der Container die ganze Zelle einnimmt */
}

/* Das versteckte große Bild (die "Lightbox") */
.image-preview-lightbox {
    display: none; /* Standardmäßig komplett versteckt */
    position: fixed; /* Positioniert sich relativ zum Browserfenster */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); /* Zentriert das Element perfekt */
    z-index: 9999; /* Stellt sicher, dass es über allem liegt */
    background-color: white;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.4);
    pointer-events: none; /* Wichtig, damit die Box die Maus nicht "fängt" */
}

/* Das große Bild innerhalb der Lightbox */
.image-preview-lightbox img {
    width: auto;
    height: auto;
    max-width: 400px;  /* Maximale Breite des großen Bildes */
    max-height: 400px; /* Maximale Höhe des großen Bildes */
    display: block;
}

/* Der Magische Teil: Wenn man über den Container hovert... */
.image-preview-container:hover .image-preview-lightbox {
    display: block; /* ...wird die Lightbox sichtbar! */
}

.gf_product_dropdown .select2-container .select2-selection--single {
    height: 75px !important;
    border: 0;
    border-radius: 5px;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
    background: #fff;
    position: relative;
    overflow: hidden;
}

.gf_product_dropdown .select2 .select2-selection__rendered img {
    width: 75px;
    height: 75px;
    object-fit: cover;
    object-position: center;
}

.gf_product_dropdown .select2 .select2-selection__rendered {
    padding: 0 !important;
    line-height: 0 !important;
}

.gf_product_dropdown .select2 .select2-selection__rendered .select2-product-option,
.select2-product-option {
    display: flex;
    align-items: center;
    gap: var(--gap-s);
}

.gf_product_dropdown .select2 .select2-selection__rendered .select2-product-text,
.select2-product-text {
    line-height: 1;
    font-family: "Hand Book";
    text-transform: uppercase;
    font-weight: 400;
    font-size: var(--font-h3);
    color: var(--blue);
    display: flex;
    flex-direction: column;
    padding-top: 3px;
}

.gf_product_dropdown .select2 .select2-selection__rendered .select2-product-text .select2-product-price,
.select2-product-text .select2-product-price {
    font-size: 50%;
    color: var(--blue-grey);
    font-family: 'Inter';
}

.select2-dropdown {
    background: var(--light-grey) !important;
    border: 0 !important;
    border-radius: 0 !important;
}

.select2-dropdown .select2-search--dropdown {
    display: none !important;
}

.select2-dropdown .select2-results__options {
    display: flex;
    flex-direction: column;
    gap: var(--gap-2xs);
    background: none;
    border: 0;
}

.select2-dropdown .select2-results__options .select2-results__option--selectable {
    padding: 0 !important;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
}

.select2-dropdown .select2-results__options .select2-results__option--selectable .select2-product-image {
    border-radius: 0px;
}

.select2-dropdown .select2-results__options .select2-results__option--selected {
    background: var(--green) !important;
}

.select2-dropdown .select2-results__options .select2-results__option--selected.select2-results__option--highlighted {
    background: var(--green) !important;
}

.select2-dropdown .select2-results__options .select2-results__option--selected .select2-product-text {
    color: #fff !important;
}

.select2-dropdown .select2-results__options .select2-results__option--selected .select2-product-price {
    color: rgba(255,255,255,0.67) !important;
}

.select2-dropdown .select2-results__options .select2-results__option--highlighted {
    background: #fff !important;
}

/* Vertikale Ausrichtung der Zelleninhalte anpassen */
.gpnf-nested-entries-container td {
    vertical-align: middle !important;
}

.select2-product-option { display: flex; align-items: center; }
.select2-product-image { width: 75px; height: 75px; margin-right: 10px; border-radius: 3px; object-fit: cover; margin: 0; }
.select2-container .select2-selection--single { height: 75px !important; }
.select2-container--default .select2-selection--single .select2-selection__arrow { height: 100% !important; }

.tingle-modal .tingle-modal-box {
    background: var(--light-grey);
}

.tingle-modal .tingle-modal-box .tingle-modal-box__content {
    box-shadow: 0 0 45px 0 rgba(0,0,0,0.1) inset;
}

.tingle-modal .tingle-modal-box .tingle-modal-box__content input[type="number"] {
    box-shadow: 0 0 15px 0 rgba(0,0,0,0.1);
    background: #fff;
    border: 0;
}

.tingle-modal .tingle-modal-box .tingle-modal-box__footer {
    background: #fff;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
}

table.gpnf-nested-entries {
    border: 0;
    border-bottom: 4px solid var(--light-grey);
}

table.gpnf-nested-entries tbody tr td {
   border-bottom: 2px solid var(--light-grey);
}

table.gpnf-nested-entries thead {
    background: var(--blue);
}

table.gpnf-nested-entries thead th {
    color: #fff;
}

.gpnf-row-actions ul {
    display: flex;
    gap: var(--gap-2xs);
}

.gpnf-row-actions button {
    background: var(--light-grey) !important;
    border: 0 !important;
    color: var(--text) !important;
    display: flex !important;
    gap: var(--gap-3xs) !important;
}

.gpnf-row-actions button:hover {
    background: var(--green) !important;
    color: #fff !important;
    filter: none !important;
}

button.gpnf-add-entry {
    background: var(--green) !important;
    color: #fff !important;
}

#gform_wrapper_3 .gform-page-footer {
    justify-content: flex-end;
}

.gform-theme--framework .gfield:where(.gfield--type-multiselect,
.gfield--input-type-multiselect) .chosen-container-multi:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework .gfield:where(.gfield--type-select,
.gfield--input-type-select) .chosen-search input[type=text]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework .gfield:where(.gfield--type-select,
.gfield--input-type-select) .chosen-single:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework .gform-theme-field-control:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework input[type]:where(:not(.gform-text-input-reset):not([type=hidden])):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework select:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework select[multiple]:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework textarea:where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper .button:where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper .gform-theme-button:where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper :where(:not(.mce-splitbtn))>button:not([id*=mceu_]):not(.mce-open):where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper button.button:where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper input:is([type=submit],[type=button],[type=reset]).button:where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper input:is([type=submit],[type=button],[type=reset]):where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)),
.gform-theme--framework.gform-theme.gform_wrapper input[type=submit].button.gform_button:where(:not(.gform-theme-no-framework)):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)) {
    --gf-local-bg-color: var(--blue) !important;
}

.post-type-archive-product .gform-theme--api,
.post-type-archive-product .gform-theme--framework {
    --gf-field-pg-prog-bar-bg-color-orange: var(--green) !important;
}

.post-type-archive-product .gform-theme--framework input[type]:where(:not(.gform-text-input-reset):not([type=hidden])):where(:not(.gform-theme__disable):not(.gform-theme__disable *):not(.gform-theme__disable-framework):not(.gform-theme__disable-framework *)):not([type="button"]):not([type="submit"]):not([type="number"]) {
    background: var(--light-grey) !important;
    border: 0 !important;
}

.post-type-archive-product .ginput_address_country select {
    background: var(--light-grey) !important;
    border: 0 !important;
}

.post-type-archive-product .gform_button.button {
    background: var(--blue) !important;
    color: #fff !important;
}

.post-type-archive-product .gform_previous_button.button {
    background: var(--blue) !important;
    color: #fff !important;
}

/*
    https://fogtec.s4.jfco.de/wp-content/uploads/2025/09/quote-left.svg
    https://fogtec.s4.jfco.de/wp-content/uploads/2025/09/quote-right.svg
*/

blockquote {
    font-family: "Inter";
    position: relative;
    padding: 25px 90px;
    border-style: solid;
    border-top-width: 4px;
    border-left-width: 0;
    border-right-width: 0;
    border-bottom-width: 4px;
    border-color: rgba(0, 0, 0, 0.1);
    line-height: 1.4;
    margin: 0;

    &:before {
        content: "";
        width: 60px;
        height: auto;
        display: block;
        background: url("/wp-content/uploads/2025/09/quote-left.svg");
        background-color: rgba(0, 0, 0, 0.1);
        background-repeat: no-repeat;
        background-size: 65%;
        background-position: center;
        left: 0;
        position: absolute;
        bottom: 0;
        aspect-ratio: 38/25;
    }

    &:after {
        content: "";
        width: 60px;
        height: auto;
        display: block;
        background: url("/wp-content/uploads/2025/09/quote-right.svg");
        background-color: rgba(0, 0, 0, 0.1);
        background-repeat: no-repeat;
        background-size: 65%;
        background-position: center;
        right: 0;
        position: absolute;
        top: 0;
        aspect-ratio: 38/25;
    }
}

@layer bricks {
    :where(p) {
        margin-block: 0 1em;
    }

    .splide__arrows-custom .splide__arrows.custom {
        display: flex !important;
    }

    .splide__arrows-custom .splide__arrows.custom svg.fill * {
        fill: inherit !important;
    }

    .brxe-toggle {
    --brxe-toggle-width: 30px !important;
  }

  .brxe-toggle .brxa-inner, .brxe-toggle .brxa-inner::after, .brxe-toggle .brxa-inner::before {
    width: 30px !important;
  }
}

.tippy-content p:last-of-type {
    margin-bottom: 0;
}

.download-type {
    i {
        font-size: var(--font-h1);
    }

    img {
        width: var(--font-h1);
        height: var(--font-h1);
        object-fit: cover;
        object-position: center;
    }
}