/**
 * Vintage Football - Lightweight Breadcrumbs Widget Styles
 *
 * Left: Breadcrumbs Trail (HOME > CLUBS > BAYERN)
 * Right: Return to Previous Page (< RETURN TO PREVIOUS PAGE)
 * Font: Staatliches condensed font
 *
 * Selectors keep the original class and add the two parents when they exist:
 * .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container
 * .page-heading .vf-breadcrumbs-container
 */

:root {
    --vf-font-title: 'Staatliches', Impact, 'Inter', sans-serif;
    --vf-bc-text-color: #111111;
    --vf-bc-link-color: #777777;
    --vf-bc-link-hover: #111111;
    --vf-bc-delimiter-color: #999999;
}

/* =============================================================================
   CONTAINER LAYOUT
   ============================================================================= */
.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container,
.page-heading .vf-breadcrumbs-container,
.vf-breadcrumbs-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px 24px;
    width: 100%;
    box-sizing: border-box;
    padding: 30px 20px;
}

@media screen and (max-width: 767px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container,
    .page-heading .vf-breadcrumbs-container,
    .vf-breadcrumbs-container {
        padding: 20px 20px;
    }
}

@media screen and (max-width: 767.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container,
    .page-heading .vf-breadcrumbs-container,
    .vf-breadcrumbs-container {
        gap: 10px 16px;
    }
}

@media screen and (max-width: 575.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container,
    .page-heading .vf-breadcrumbs-container,
    .vf-breadcrumbs-container {
        gap: 8px 12px;
    }
}

/* Inside the XStore single product page heading */
.elementor-widget-vf-breadcrumbs .page-heading .vf-breadcrumbs-container,
.page-heading .vf-breadcrumbs-container.is-heading,
.vf-breadcrumbs-container.is-heading {
    padding: 0;
    text-align: initial;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-breadcrumbs-left,
.page-heading .vf-breadcrumbs-container .vf-breadcrumbs-left,
.vf-breadcrumbs-container .vf-breadcrumbs-left {
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
    max-width: 100%;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-breadcrumbs-right,
.page-heading .vf-breadcrumbs-container .vf-breadcrumbs-right,
.vf-breadcrumbs-container .vf-breadcrumbs-right {
    display: flex;
    align-items: center;
    margin-left: auto;
    flex-shrink: 0;
}

@media screen and (max-width: 575.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-breadcrumbs-left,
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-breadcrumbs-right,
    .page-heading .vf-breadcrumbs-container .vf-breadcrumbs-left,
    .page-heading .vf-breadcrumbs-container .vf-breadcrumbs-right,
    .vf-breadcrumbs-container .vf-breadcrumbs-left,
    .vf-breadcrumbs-container .vf-breadcrumbs-right {
        width: auto;
    }
}

/* =============================================================================
   RETURN TO PREVIOUS PAGE BUTTON (RIGHT)
   ============================================================================= */
.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-btn,
.page-heading .vf-breadcrumbs-container .vf-bc-return-btn,
.vf-breadcrumbs-container .vf-bc-return-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--vf-font-title, 'Staatliches', Impact, 'Inter', sans-serif);
    font-size: 22px;
    color: var(--vf-bc-text-color, #111111);
    text-transform: uppercase;
    text-decoration: none;
    line-height: 1.1;
    letter-spacing: 0.5px;
    cursor: pointer;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    transition: color 0.2s ease, opacity 0.2s ease;
    user-select: none;
}

@media screen and (max-width: 767px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-btn,
    .page-heading .vf-breadcrumbs-container .vf-bc-return-btn,
    .vf-breadcrumbs-container .vf-bc-return-btn {
        display: none !important;
    }
}

@media screen and (max-width: 767.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-btn,
    .page-heading .vf-breadcrumbs-container .vf-bc-return-btn,
    .vf-breadcrumbs-container .vf-bc-return-btn {
        font-size: 18px;
        gap: 6px;
    }
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-btn:hover,
.page-heading .vf-breadcrumbs-container .vf-bc-return-btn:hover,
.vf-breadcrumbs-container .vf-bc-return-btn:hover {
    color: #000000;
    text-decoration: none;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-icon,
.page-heading .vf-breadcrumbs-container .vf-bc-return-icon,
.vf-breadcrumbs-container .vf-bc-return-icon {
    margin-bottom: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    flex-shrink: 0;
    transition: transform 0.22s cubic-bezier(0.4, 0, 0.2, 1);
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-icon svg,
.page-heading .vf-breadcrumbs-container .vf-bc-return-icon svg,
.vf-breadcrumbs-container .vf-bc-return-icon svg {
    display: block;
    width: 16px;
    height: 16px;
    transform: rotate(180deg);
    transform-origin: center;
    fill: currentColor;
}

@media screen and (max-width: 767.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-icon svg,
    .page-heading .vf-breadcrumbs-container .vf-bc-return-icon svg,
    .vf-breadcrumbs-container .vf-bc-return-icon svg {
        width: 14px;
        height: 14px;
    }
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-btn:hover .vf-bc-return-icon,
.page-heading .vf-breadcrumbs-container .vf-bc-return-btn:hover .vf-bc-return-icon,
.vf-breadcrumbs-container .vf-bc-return-btn:hover .vf-bc-return-icon {
    transform: translateX(-3px);
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-return-text,
.page-heading .vf-breadcrumbs-container .vf-bc-return-text,
.vf-breadcrumbs-container .vf-bc-return-text {
    display: inline-block;
    white-space: nowrap;
}

/* =============================================================================
   BREADCRUMBS LIST
   ============================================================================= */
.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-breadcrumbs,
.page-heading .vf-breadcrumbs-container .vf-breadcrumbs,
.vf-breadcrumbs-container .vf-breadcrumbs {
    display: block;
    width: 100%;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-list,
.page-heading .vf-breadcrumbs-container .vf-bc-list,
.vf-breadcrumbs-container .vf-bc-list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 4px 0;
    font-family: var(--vf-font-title, 'Staatliches', Impact, 'Inter', sans-serif);
    font-size: 22px;
    line-height: 1.2;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-sizing: border-box;
}

@media screen and (max-width: 767.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-list,
    .page-heading .vf-breadcrumbs-container .vf-bc-list,
    .vf-breadcrumbs-container .vf-bc-list {
        font-size: 18px;
        gap: 4px 0;
        line-height: 1.3;
    }
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-item,
.page-heading .vf-breadcrumbs-container .vf-bc-item,
.vf-breadcrumbs-container .vf-bc-item {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    color: var(--vf-bc-link-color, #777777);
    line-height: 1.2;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-link,
.page-heading .vf-breadcrumbs-container .vf-bc-link,
.vf-breadcrumbs-container .vf-bc-link {
    color: var(--vf-bc-link-color, #777777);
    text-decoration: none;
    transition: color 0.2s ease;
    display: inline-block;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-link:hover,
.page-heading .vf-breadcrumbs-container .vf-bc-link:hover,
.vf-breadcrumbs-container .vf-bc-link:hover {
    color: var(--vf-bc-link-hover, #111111);
    text-decoration: none;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-delimiter,
.page-heading .vf-breadcrumbs-container .vf-bc-delimiter,
.vf-breadcrumbs-container .vf-bc-delimiter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--vf-bc-delimiter-color, #999999);
    font-size: 14px;
    margin: 0 6px;
    line-height: 1;
    user-select: none;
    position: relative;
    top: -1px;
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-delimiter svg,
.page-heading .vf-breadcrumbs-container .vf-bc-delimiter svg,
.vf-breadcrumbs-container .vf-bc-delimiter svg {
    width: 16px;
    height: 16px;
}

@media screen and (max-width: 767.98px) {
    .elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-delimiter svg,
    .page-heading .vf-breadcrumbs-container .vf-bc-delimiter svg,
    .vf-breadcrumbs-container .vf-bc-delimiter svg {
        width: 14px;
        height: 14px;
    }
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-item.is-current,
.page-heading .vf-breadcrumbs-container .vf-bc-item.is-current,
.vf-breadcrumbs-container .vf-bc-item.is-current {
    color: var(--vf-bc-text-color, #111111);
}

.elementor-widget-vf-breadcrumbs .vf-breadcrumbs-container .vf-bc-current-title,
.page-heading .vf-breadcrumbs-container .vf-bc-current-title,
.vf-breadcrumbs-container .vf-bc-current-title {
    color: var(--vf-bc-text-color, #111111);
    cursor: default;
    display: inline-block;
}
