.fifu-detail-box {
    font-size: var(--wp--preset--font-size--xx-small) !important;
    position: relative;
    margin-bottom: 64px !important;
}
.fifu-detail-box + .wp-block-group {
    margin-top: 128px !important;
}
.wp-block-group + .fifu-detail-box {
    margin-top: 64px !important;
}

.fifu-detail-box .detail-box-placement {
    position: absolute;
    content: "1";
    top: 64px;
    left: 0;
    min-width: 1rem;
    color:white;
    font-weight: 700;
    z-index: 9;
    padding: 0.2rem 0.6rem 0.2rem 0.2rem;
    text-align: center;
    background-image: url("data:image/svg+xml,%3Csvg width='17' height='20' viewBox='0 0 17 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M-1.58398 10.7245L-2.76311 17.9606C-3.38419 18.8351 -2.70983 20 -1.58398 20H9.41833C9.8933 20 10.3362 19.7783 10.598 19.4101L16.7658 10.7245C17.0781 10.2848 17.0781 9.71464 16.7658 9.27553L10.598 0.589914C10.3362 0.221685 9.8933 0 9.41833 0H-1.58398C-2.7104 0 -3.38419 1.1649 -2.76368 2.03938L-1.58398 9.99973V10.7245Z' fill='black'/%3E%3C/svg%3E%0A");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns{
    position: relative;
    padding: 32px 32px 24px 32px;
    gap: 24px;
}

.fifu-detail-box .wp-block-read-more {
    margin-top: auto;
}

/* label badge */
.fifu-detail-box > .acf-innerblocks-container > p {
    background-color: var(--wp--preset--color--light-green);
    padding: 8px 12px;
    border-radius: 10px 10px 0 0;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    margin-left: 1.5rem;
    margin-bottom: 0;
    margin-top: 0;
    line-height: 1;
}
.fifu-detail-box > .acf-innerblocks-container > p + p {
    margin-left: 8px;
}
.fifu-detail-box > .acf-innerblocks-container > p *[class*="emoji_"] {
    margin-right: 4px;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group p.has-background {
    border-radius: 10px;
    padding: 6px 12px;
    font-weight: 400;
    display: inline-block;
}

.wp-block-acf-linked-detail-box .metafield[data-metafield-name="provider_ranking_description"] {
    background-color: #dcf6e7;
    padding: 0.2rem 0.7rem;
    border-radius: 10px 10px 0 0;
    display: inline-block;
    font-size: 1rem;
    margin-left: 1.5rem;
}

/* shadow and hover*/
.fifu-detail-box > .acf-innerblocks-container > .wp-block-columns:not(:has(.wp-block-details)),
.fifu-detail-box > .acf-innerblocks-container > .wp-block-group:not(:has(.wp-block-details)) {
    width: 100%;
    border-radius: 24px;
    clear: both;
    outline: 1px solid #EFEFEF !important;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group:not(:has(.qr_code_link_container)):hover:not(:has(.tabs:hover)) {
    outline: 1px solid var(--wp--preset--color--purple) !important;
    cursor: pointer;
}

/* new layout for new detail boxes */
.fifu-detail-box .acf-innerblocks-container > .wp-block-group {
    width: 100%;
    border-radius: 24px;
}

.fifu-detail-box .acf-innerblocks-container > .wp-block-group > .wp-block-columns {
    border-top-left-radius: 24px;
    border-top-right-radius: 24px;
    max-width: none !important;
}

.fifu-detail-box .wp-block-details summary {
    background-color: var(--wp--preset--color--light-purple);
    border-bottom-left-radius: 24px;
    border-bottom-right-radius: 24px;
}

.fifu-detail-box .wp-block-details > .wp-block-columns {
    gap: 1rem;
    margin: 0 !important;
    padding: 1rem 0 0;
    max-width: none !important;
}

.fifu-detail-box .wp-block-details > .wp-block-columns .wp-block-column {
    padding-top: 0;
}

.fifu-detail-box .wp-block-details > .wp-block-columns .wp-block-column:not(:has(.tabs)) {
    height: fit-content;
}

/* post-image and image blocks */
.fifu-detail-box .wp-block-post-featured-image {
    text-align: left !important;
}
.fifu-detail-box .wp-block-post-featured-image .wp-post-image {
    max-width: 150px;
    max-height: 80px;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column .wp-block-image {
    text-align: left !important;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child .wp-block-image img {
    object-fit: contain;
    max-width: 120px;
    max-height: 120px;
    vertical-align: initial !important;
}


/* special float on mobile */
.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child{
    float:left;
    margin-right: 1rem;
    max-width: 40%;
}
.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child img {
    max-width: 100%;
}
.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child + .wp-block-group {
    justify-content: flex-end;
    gap:0 0.5rem;
    color:#868686;
    font-size: 12px;
    flex-wrap: wrap;
}
.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-acf-responsive-content {
    text-align: right;
}

.fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:not(:first-child) {
   clear: both;
}


/* lists */
.fifu-detail-box ul.is-style-orange_checkmark_list > li,
.fifu-detail-box ul.is-style-crossmark_list > li,
.fifu-detail-box ul.is-style-green_checkmark_list > li {
    padding-left: 1.8rem;
    margin-bottom: 4px !important;
}
.fifu-detail-box ul.is-style-orange_checkmark_list > li::before,
.fifu-detail-box ul.is-style-crossmark_list > li::before,
.fifu-detail-box ul.is-style-green_checkmark_list > li::before {
    top:2px;
}

/*
.wp-block-post.type-post .wp-block-post-featured-image .wp-post-image {
    max-width: 300px;
} */
.fifu-detail-box .wp-block-post-title,
.fifu-detail-box h2.wp-block-heading{
    margin-bottom: 1rem !important;
    font-size: 20px;
}
.fifu-detail-box .wp-block-post-title + p,
.fifu-detail-box h2.wp-block-heading + p{
    margin-top: 0 !important;
}

.fifu-detail-box .wp-block-button {
    background-color: transparent;
    padding: 0;
    width: 100%;
}
.fifu-detail-box .wp-block-buttons {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

.fifu-detail-box .metafield[data-metafield-name='provider_external_link'] {
    margin-top: 2rem;
}

.fifu-detail-box .wp-block-button .wp-block-button__link,
.fifu-detail-box .metafield[data-metafield-name='provider_external_link'] a{
    background-color: var(--wp--preset--color--purple);
    color: white !important;
    padding: 0.5rem 1rem 0.5rem 1.5rem;
    font-size: 1.2rem;
    font-weight: 700 !important;
    text-decoration: none !important;
    border-radius: 9999px;
    display: inline-block;
}

.fifu-detail-box .wp-block-button .wp-block-button__link::after,
.fifu-detail-box .metafield[data-metafield-name='provider_external_link'] a::after {
    content: "";
    display: inline-block;
    margin-left: 0.5em;
    background-color: currentColor;
    width: 0.9em;
    height: 0.9em;
    -webkit-mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 20 20'%3E%3Cpath d='M18,8.3L4.1.3c-1.3-.8-3,.2-3,1.7v16c.1,1.5,1.7,2.5,3,1.7l13.9-8c1.3-.8,1.3-2.7,0-3.4h0Z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 20 20'%3E%3Cpath d='M18,8.3L4.1.3c-1.3-.8-3,.2-3,1.7v16c.1,1.5,1.7,2.5,3,1.7l13.9-8c1.3-.8,1.3-2.7,0-3.4h0Z'/%3E%3C/svg%3E");
}

.fifu-detail-box .wp-block-button .wp-block-button__link:hover,
.fifu-detail-box .metafield[data-metafield-name='provider_external_link'] a:hover {
    background-color: var(--wp--preset--color--dark-purple);
}

/* details */
.fifu-detail-box details p {
    padding: 0 !important;
}

.fifu-detail-box .wp-block-details {
    padding: 0;
    border-radius: 0 0 24px 24px;
    border: none;
    max-width: none;
}

.wp-block-acf-linked-detail-box .wp-block-details {
    background-color: var(--wp--preset--color--light-purple);
}

.fifu-detail-box .wp-block-details summary{
    padding: 0.8rem 2rem;
    text-align: center;
    font-size: 1.2rem;
    text-decoration: underline;
}

.fifu-detail-box .wp-block-details summary::after {
    position: relative;
    display: inline-block;
    margin-left: 0.5rem;
}

/* .fifu-detail-box .wp-block-details > *, */
.wp-block-acf-linked-detail-box .wp-block-details > * {
    width: calc(100% - 4rem);
    margin: 0 auto !important;
    padding: 0;
}

/* .fifu-detail-box .wp-block-details > *:last-child, */
.wp-block-acf-linked-detail-box .wp-block-details > *:last-child {
    margin-bottom: 2rem !important;
}

/* finanzfuchs-score */
.fifu-detail-box .score-box{
    text-align: right;
}
.fifu-detail-box .score-box span {
    border-radius: 10px;
    padding:6px 12px;
    font-size: 12px;
}
.fifu-detail-box .metafield[data-metafield-name="provider_finanzfuchs_score"]{
    display: flex;
    align-items: center;
    justify-self: center;
    gap: 1rem;
}

.fifu-detail-box .metafield[data-metafield-name="provider_finanzfuchs_score"] span[data-key="provider_finanzfuchs_score"] {
    color: #000;
    font-weight: 700;
    width: fit-content;
    margin: 0;
    padding: 0.25rem 1rem;
    border-radius: 0.25rem;
    background-color: var(--wp--preset--color--light-green);
    display: flex;
    align-items: center;
    justify-self: center;
}

.fifu-detail-box .metafield[data-metafield-name="provider_finanzfuchs_score"] {}

.fifu-detail-box .metafield[data-metafield-name="provider_finanzfuchs_score"] span[data-key="provider_finanzfuchs_score"]::before {
    content: "";
    display: inline-block;
    width: 1.11em;
    height: 1.11em;
    margin-right: 0.5rem;
    background-image: url("data:image/svg+xml,%3Csvg width='20' height='19' viewBox='0 0 20 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.0004 5.70958L2.10743 0.496921C1.24041 -0.0758054 0.0854492 0.546057 0.0854492 1.58426V11.7301C0.0854492 12.1681 0.305241 12.5765 0.670328 12.8179L9.28183 18.5056C9.71772 18.7935 10.283 18.7935 10.7184 18.5056L19.3299 12.8179C19.695 12.5765 19.9148 12.1681 19.9148 11.7301V1.58426C19.9148 0.545529 18.7598 -0.0758054 17.8928 0.496393L9.99933 5.70958H10.0004Z' fill='%23FF6038'/%3E%3Cpath d='M5.43274 9.1216C4.74431 9.62723 4.39982 10.8049 5.10411 11.4363C5.53101 11.8325 6.34149 11.8695 6.78847 11.459C7.31048 11.0184 7.35645 10.2274 6.97551 9.67266C6.65639 9.16545 6.04404 8.68096 5.47289 9.0936L5.43274 9.1216Z' fill='black'/%3E%3Cpath d='M15.3371 11.1573C15.1987 11.1573 15.0597 11.1045 14.9541 10.9988C14.4437 10.4884 13.6137 10.4884 13.1038 10.9988C12.8925 11.2101 12.549 11.2101 12.3377 10.9988C12.1264 10.7875 12.1264 10.444 12.3377 10.2327C12.79 9.78044 13.3907 9.53159 14.0289 9.53159C14.6672 9.53159 15.2684 9.78044 15.7202 10.2327C15.9315 10.444 15.9315 10.7875 15.7202 10.9988C15.6145 11.1045 15.4755 11.1573 15.3371 11.1573Z' fill='black'/%3E%3C/svg%3E%0A");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* tabs */
.fifu-detail-box .tabs {
    padding-bottom: 24px;
}
.fifu-detail-box .tabs-navigation-list{
    justify-content: flex-start !important;
    gap: 0;
}

.fifu-detail-box .tabs .tab {
    padding: 1rem 0;
}

.fifu-detail-box .tabs .tabs-navigation ul li {
    padding: 0 !important;
    width: 100%;
}
.fifu-detail-box .tabs .tabs-navigation ul li button {
    padding: 5px 0;
    width: 100%;
    text-align: left;
}

/* new main tabs */
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs {
    margin-top:0;
    border-radius: 0 0 24px 24px;
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation {
    border-bottom:none;
    padding: 0 32px;
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul {
    border-top:1px solid #f5f5f5;
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul > li {
    padding-bottom: 1rem;
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul li button,
.fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button{
    color:black;
    font-weight: 700;
    position: relative;
    padding-right: 1.5rem;
    font-size: var(--wp--preset--font-size--xx-small) !important;
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul li button::after,
.fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button::after {
    content: "";
    position: absolute;
    right: 5px;
    top: calc(50% - 5px);
    background-color: #000;
    width: 10px;
    height: 10px;
    mask-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='Ebene_1' xmlns='http://www.w3.org/2000/svg' version='1.1' viewBox='0 0 20 20'%3E%3Cpath d='M11.7,17.9l8-13.9c.8-1.3-.2-3-1.7-3H2C.5,1.1-.5,2.7.3,4l8,13.9c.8,1.3,2.7,1.3,3.4,0h0Z'/%3E%3C/svg%3E");
    transform: rotate(0deg);
    transform-origin: center;
    transition: transform 0.3s ease, background-color 0.3s ease;
}

.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul li button.active,
.fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button.active {
    color:var(--wp--preset--color--dark-purple);
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul li button.active::after,
.fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button.active::after {
    transform: rotate(180deg);
    background-color: var(--wp--preset--color--dark-purple);
}
.fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .acf-innerblocks-container > .tab {
    padding: 12px 32px 0 32px;
}
.fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation {
    border:none;
    border-top: 1px solid #f5f5f5;
}




@media only screen and (min-width: 782px) {
    .fifu-detail-box .tabs {
        padding-bottom: 24px;
    }
    .fifu-detail-box .tabs .tabs-navigation ul li {
        width: auto;
    }
    .fifu-detail-box .tabs .tabs-navigation ul li button {
        padding: 12px 42px 12px 0 !important;
        width: auto;
        text-align: left;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation{
        background-color: transparent !important;
        min-width: 150px;
        border:none;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list {
        padding:0;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li {
        width: 100%;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li:first-child button {
        padding-top:0 !important;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button {
        padding:6px 1.5rem 6px 0 !important;
        width: 100%;
        text-align: left;
    }
    .fifu-detail-box .wp-block-group > .wp-block-columns + .tabs > .tabs-navigation > ul li button::after {
        right: 24px;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button::after {
        transform: rotate(270deg);
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation .tabs-navigation-list li button.active::after {
        transform: rotate(90deg);
    }
    .fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child {
        float:none;
        margin-right: auto;
        max-width: none;
    }
    .fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child img{
        max-width: 120px;
    }
    .fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-image:first-child + .wp-block-group {
        justify-content: flex-start;
    }
    .fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child > .wp-block-acf-responsive-content {
        text-align: left;
    }
    .fifu-detail-box .score-box {
        text-align: left;
    }
    .fifu-detail-box > .acf-innerblocks-container > .wp-block-group > .wp-block-columns > .wp-block-column:first-child {
        flex-basis: 150px !important;
    }

}
@media only screen and (min-width: 990px) {
    .fifu-detail-box .tabs[data-vertical="1"] .tab {
        padding:0 2rem;
    }
    .fifu-detail-box .tabs[data-vertical="1"] .tabs-navigation{
        width: 20%;
    }
}