/**
 * sellx_portlets Compatibility CSS
 * Provides ONLY missing CSS classes for OPC portlets
 * All Bootstrap/Cartzilla classes are inherited from theme
 */

/* Ratio utility with custom aspect ratio support (if not in theme) */
.opc-portlet .ratio {
    position: relative;
    width: 100%;
}

.opc-portlet .ratio::before {
    display: block;
    padding-top: var(--cz-aspect-ratio, var(--bs-aspect-ratio, 100%));
    content: "";
}

.opc-portlet .ratio > * {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Blinking animation for countdown separator */
.animate-blinking {
    animation: blinking 1.5s ease-in-out infinite;
}

@keyframes blinking {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.3;
    }
}

/* Dark mode utilities (if needed) */
.d-none-dark {
    display: block !important;
}

.d-block-dark {
    display: none !important;
}

[data-bs-theme="dark"] .d-none-dark {
    display: none !important;
}

[data-bs-theme="dark"] .d-block-dark {
    display: block !important;
}