/**
 * GW Elementos Maxime Oro - Global Container Border
 * v1.6.19
 */

.gw-emo-feature-border-yes {
    --gw-emo-feature-border-gradient-height: 3px;
    --gw-emo-feature-border-gradient-start: rgba(162, 150, 102, 0.28);
    --gw-emo-feature-border-gradient-middle: #C4BA90;
    --gw-emo-feature-border-gradient-end: rgba(162, 150, 102, 0.28);
    --gw-emo-feature-border-gradient-duration: 3.5s;
    box-sizing: border-box;
    position: relative;
    overflow: visible;
    background-color: #f5f5f0;
    border-style: solid;
    border-color: rgba(162, 150, 102, 0.3);
    border-width: 1px;
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.gw-emo-feature-border-yes::before {
    content: '';
    position: absolute;
    z-index: 2;
    top: -1px;
    left: 10px;
    right: 10px;
    height: var(--gw-emo-feature-border-gradient-height);
    border-radius: 999px;
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--gw-emo-feature-border-gradient-start) 12%,
        var(--gw-emo-feature-border-gradient-middle) 50%,
        var(--gw-emo-feature-border-gradient-end) 88%,
        transparent 100%
    );
    pointer-events: none;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-speed-slow {
    --gw-emo-feature-border-gradient-duration: 6s;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-speed-normal {
    --gw-emo-feature-border-gradient-duration: 3.5s;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-speed-fast {
    --gw-emo-feature-border-gradient-duration: 1.8s;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-classic::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(162, 150, 102, 0.28) 12%,
        #C4BA90 50%,
        rgba(162, 150, 102, 0.28) 88%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-soft::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(214, 204, 166, 0.2) 10%,
        #F5F0E0 45%,
        #D6CCA6 55%,
        rgba(184, 168, 122, 0.22) 90%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-metallic::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        #6E6444 12%,
        #A29666 28%,
        #F5F0E0 48%,
        #C4BA90 58%,
        #8A7E56 80%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-dark::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        #5F5638 15%,
        #8A7E56 35%,
        #C4BA90 50%,
        #6E6444 72%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-double::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(162, 150, 102, 0.2) 10%,
        #C4BA90 24%,
        transparent 37%,
        #F5F0E0 50%,
        transparent 63%,
        #C4BA90 76%,
        rgba(162, 150, 102, 0.2) 90%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-diagonal::before {
    background: linear-gradient(
        115deg,
        transparent 0%,
        #8A7E56 18%,
        #D6CCA6 42%,
        #F5F0E0 50%,
        #A29666 72%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-custom::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        var(--gw-emo-feature-border-gradient-start) 12%,
        var(--gw-emo-feature-border-gradient-middle) 50%,
        var(--gw-emo-feature-border-gradient-end) 88%,
        transparent 100%
    );
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-flow::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        #6E6444 12%,
        #A29666 26%,
        #F5F0E0 42%,
        #C4BA90 55%,
        #8A7E56 72%,
        transparent 100%
    );
    background-size: 240% 100%;
    animation: gw-emo-feature-border-flow var(--gw-emo-feature-border-gradient-duration) linear infinite;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-shimmer::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(162, 150, 102, 0.18) 20%,
        #C4BA90 35%,
        #FFFFFF 50%,
        #C4BA90 65%,
        rgba(162, 150, 102, 0.18) 80%,
        transparent 100%
    );
    background-size: 260% 100%;
    animation: gw-emo-feature-border-shimmer var(--gw-emo-feature-border-gradient-duration) ease-in-out infinite;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-pulse::before {
    background: linear-gradient(
        90deg,
        transparent 0%,
        #8A7E56 15%,
        #C4BA90 50%,
        #8A7E56 85%,
        transparent 100%
    );
    animation: gw-emo-feature-border-pulse var(--gw-emo-feature-border-gradient-duration) ease-in-out infinite;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-gradient-no::before {
    content: none;
    display: none;
    animation: none;
}

.gw-emo-feature-border-yes:hover {
    box-shadow: 0 3px 12px rgba(162, 150, 102, 0.15);
}

.gw-emo-feature-border-yes.gw-emo-feature-border-shadow-no {
    box-shadow: none;
}

.gw-emo-feature-border-yes.gw-emo-feature-border-shadow-no:hover {
    box-shadow: none;
}

@keyframes gw-emo-feature-border-flow {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 240% 50%;
    }
}

@keyframes gw-emo-feature-border-shimmer {
    0%,
    100% {
        background-position: 0% 50%;
        opacity: 0.75;
    }

    50% {
        background-position: 100% 50%;
        opacity: 1;
    }
}

@keyframes gw-emo-feature-border-pulse {
    0%,
    100% {
        opacity: 0.45;
        box-shadow: 0 0 0 rgba(196, 186, 144, 0);
    }

    50% {
        opacity: 1;
        box-shadow: 0 0 10px rgba(196, 186, 144, 0.45);
    }
}

@media (prefers-reduced-motion: reduce) {
    .gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-flow::before,
    .gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-shimmer::before,
    .gw-emo-feature-border-yes.gw-emo-feature-border-gradient-style-animated-pulse::before {
        animation: none;
    }
}
