/* ============================================
   CUSTOM BREADCRUMBS BLOCK
   ============================================ */

/* Wrapper - Full width or contained */
.custom-breadcrumbs-wrapper {
    position: relative;
    width: 100%;
}

/* Full width variant */
.custom-breadcrumbs-wrapper.full-width {
    padding: 0;
    margin: 0;
}

.custom-breadcrumbs-wrapper.full-width .custom-breadcrumbs-container {
    max-width: 100%;
    padding: 0;
}

/* Container */
.custom-breadcrumbs-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Inner wrapper */
.custom-breadcrumbs-inner {
    padding: calc(var(--ss) * 1) 0;
}

/* Full width inner adjustment */
.custom-breadcrumbs-wrapper.full-width .custom-breadcrumbs-inner {
    max-width: 1280px;
    margin: 0 auto;
    padding-left: 20px;
    padding-right: 20px;
}

/* Breadcrumbs container - Both Yoast and RankMath */
.custom-breadcrumbs-wrapper .breadcrumbs,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb {
    margin: 0;
    padding: 0;
}

/* Breadcrumb text and links - More specific selectors */
.custom-breadcrumbs-wrapper .breadcrumbs,
.custom-breadcrumbs-wrapper .breadcrumbs *,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb * {
    color: var(--breadcrumb-text-color, #1E1E23) !important;
    font-size: 9px !important; /* Force small size */
    line-height: 1.6 !important;
    margin: 0 !important;
    text-transform: uppercase !important; /* Force uppercase */
    font-weight: 400 !important;
    letter-spacing: 1px !important; /* Increased from 0.5px */
}

/* Links - No underlines */
.custom-breadcrumbs-wrapper .breadcrumbs a,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a {
    text-decoration: none !important;
    transition: opacity 0.2s ease;
    border-bottom: none !important;
}

.custom-breadcrumbs-wrapper .breadcrumbs a:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a:hover {
    opacity: 0.7;
    text-decoration: none !important;
    border-bottom: none !important;
}

/* Separators - Force forward slash instead of » */
.custom-breadcrumbs-wrapper .breadcrumbs .breadcrumb_last,
.custom-breadcrumbs-wrapper .breadcrumbs span:not([typeof]),
.custom-breadcrumbs-wrapper .rank-math-breadcrumb .separator {
    color: var(--breadcrumb-text-color, #1E1E23) !important;
    margin: 0 1em !important; /* Increased from 0.5em */
}

/* Replace RankMath » separator with / */
.custom-breadcrumbs-wrapper .rank-math-breadcrumb .separator {
    font-size: 0 !important; /* Hide original separator */
}

.custom-breadcrumbs-wrapper .rank-math-breadcrumb .separator::before {
    content: '/' !important;
    font-size: 9px !important;
    color: var(--breadcrumb-text-color, #1E1E23) !important;
}

/* Text Color Variants - Using CSS custom property */
.custom-breadcrumbs-wrapper.text-white {
    --breadcrumb-text-color: #FFFFFF;
}

.custom-breadcrumbs-wrapper.text-black {
    --breadcrumb-text-color: #1E1E23;
}

.custom-breadcrumbs-wrapper.text-orange {
    --breadcrumb-text-color: #FF9B69;
}

.custom-breadcrumbs-wrapper.text-green {
    --breadcrumb-text-color: #326446;
}

.custom-breadcrumbs-wrapper.text-purple {
    --breadcrumb-text-color: #BE91FF;
}

.custom-breadcrumbs-wrapper.text-blue {
    --breadcrumb-text-color: #7ECDFF;
}

/* Background Colors - Using theme's existing bg__ classes */
/* Text color overrides for better contrast on dark backgrounds */
.custom-breadcrumbs-wrapper.bg__green_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__green_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__green_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__green_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__black .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__black .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__black .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__black .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__dark_fill .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__dark_fill .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__dark_fill .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__dark_fill .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__magenta_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__magenta_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__magenta_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__magenta_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__orange_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__orange_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__orange_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__orange_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__violet_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__violet_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__violet_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__violet_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__yellow_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__yellow_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__yellow_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__yellow_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__blue_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__blue_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__blue_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__blue_dark .rank-math-breadcrumb a,
.custom-breadcrumbs-wrapper.bg__red_dark .breadcrumbs,
.custom-breadcrumbs-wrapper.bg__red_dark .breadcrumbs a,
.custom-breadcrumbs-wrapper.bg__red_dark .rank-math-breadcrumb,
.custom-breadcrumbs-wrapper.bg__red_dark .rank-math-breadcrumb a {
    color: #FFFFFF !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 768px) {
    .custom-breadcrumbs-inner {
        padding: calc(var(--ss) * 0.75) 0;
    }
    
    .custom-breadcrumbs-wrapper .breadcrumbs,
    .custom-breadcrumbs-wrapper .breadcrumbs *,
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb,
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb * {
        font-size: 8px !important;
        letter-spacing: 0.8px !important; /* Slightly less on mobile */
    }
    
    .custom-breadcrumbs-wrapper .breadcrumbs .breadcrumb_last,
    .custom-breadcrumbs-wrapper .breadcrumbs span:not([typeof]),
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb .separator {
        margin: 0 0.8em !important; /* Slightly less on mobile */
    }
    
    .custom-breadcrumbs-container {
        padding: 0 15px;
    }
    
    .custom-breadcrumbs-wrapper.full-width .custom-breadcrumbs-inner {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 480px) {
    .custom-breadcrumbs-wrapper .breadcrumbs,
    .custom-breadcrumbs-wrapper .breadcrumbs *,
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb,
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb * {
        font-size: 7px !important;
        letter-spacing: 0.6px !important; /* Even less on small mobile */
    }
    
    .custom-breadcrumbs-wrapper .breadcrumbs .breadcrumb_last,
    .custom-breadcrumbs-wrapper .breadcrumbs span:not([typeof]),
    .custom-breadcrumbs-wrapper .rank-math-breadcrumb .separator {
        margin: 0 0.6em !important; /* Less on small mobile */
    }
}

/* ============================================
   SCHEMA.ORG MICRODATA SUPPORT
   ============================================ */

/* Hide schema.org attributes visually (they're for SEO only) */
.custom-breadcrumbs-wrapper [vocab],
.custom-breadcrumbs-wrapper [typeof],
.custom-breadcrumbs-wrapper [property] {
    /* Keep default styling */
}

/* ============================================
   Disable click functionality
   ============================================ */

/* Make parent page breadcrumb links unclickable (multi-language) */
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/products/"],
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/produits/"],
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/productos/"],
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/prodotti/"],
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/produkte/"],
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/expertise/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/products/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/produits/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/productos/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/prodotti/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/produkte/"],
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/expertise/"] {
    cursor: default !important;
    pointer-events: none !important;
    text-decoration: none !important;
}

.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/products/"]:hover,
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/produits/"]:hover,
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/productos/"]:hover,
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/prodotti/"]:hover,
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/produkte/"]:hover,
.custom-breadcrumbs-wrapper .breadcrumbs a[href*="/expertise/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/products/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/produits/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/productos/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/prodotti/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/produkte/"]:hover,
.custom-breadcrumbs-wrapper .rank-math-breadcrumb a[href*="/expertise/"]:hover {
    opacity: 1 !important;
    text-decoration: none !important;
}