/**
 * Fix for WPC Variations Radio Buttons - Display variation name and price on same line
 * This CSS ensures that the variation name and price appear horizontally instead of vertically
 */

/* Target the WPC Variations plugin layout */
.woovr-variations .woovr-variation .woovr-variation-info {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
}

/* Alternative selector in case the above doesn't work */
.woovr-variations .woovr-variation-radio .woovr-variation-info {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex-wrap: nowrap !important;
}

/* Make sure variation name and price are inline */
.woovr-variations .woovr-variation .woovr-variation-name,
.woovr-variations .woovr-variation .woovr-variation-price,
.woovr-variations .woovr-variation-radio .woovr-variation-name,
.woovr-variations .woovr-variation-radio .woovr-variation-price {
    display: inline-block !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

/* Specific styling for the variation name */
.woovr-variations .woovr-variation .woovr-variation-name,
.woovr-variations .woovr-variation-radio .woovr-variation-name {
    font-weight: 600 !important;
    margin-right: 8px !important;
}

/* Specific styling for the variation price */
.woovr-variations .woovr-variation .woovr-variation-price,
.woovr-variations .woovr-variation-radio .woovr-variation-price {
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* Ensure the radio button and variation info are properly aligned */
.woovr-variations .woovr-variation {
    align-items: center !important;
    padding: 8px 5px !important;
}

/* Make sure the variation selector (radio button) is properly positioned */
.woovr-variations .woovr-variation .woovr-variation-selector {
    margin-right: 10px !important;
    flex-shrink: 0 !important;
}

/* For RTL support (Arabic) */
[dir="rtl"] .woovr-variations .woovr-variation .woovr-variation-name,
[dir="rtl"] .woovr-variations .woovr-variation-radio .woovr-variation-name {
    margin-right: 0 !important;
    margin-left: 8px !important;
}

[dir="rtl"] .woovr-variations .woovr-variation .woovr-variation-selector,
[dir="rtl"] .woovr-variations .woovr-variation-radio .woovr-variation-selector {
    margin-right: 0 !important;
    margin-left: 10px !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .woovr-variations .woovr-variation .woovr-variation-info,
    .woovr-variations .woovr-variation-radio .woovr-variation-info {
        gap: 8px !important;
    }
    
    .woovr-variations .woovr-variation .woovr-variation-name,
    .woovr-variations .woovr-variation-radio .woovr-variation-name {
        margin-right: 6px !important;
        font-size: 14px !important;
    }
    
    .woovr-variations .woovr-variation .woovr-variation-price,
    .woovr-variations .woovr-variation-radio .woovr-variation-price {
        font-size: 13px !important;
    }
}

/* Additional styling to ensure proper layout */
.woovr-variations .woovr-variation > div {
    display: flex !important;
    align-items: center !important;
}

/* Override any conflicting styles from the plugin */
.woovr-variations .woovr-variation-radio .woovr-variation-info .woovr-variation-price,
.woovr-variations .woovr-variation-radio .woovr-variation-info .woovr-variation-availability {
    margin-right: 0 !important;
    display: inline-block !important;
}

/* Ensure the variation info container doesn't break the layout */
.woovr-variation-info {
    flex: 1 !important;
    min-width: 0 !important;
}

/* Fix for any potential line breaks */
.woovr-variations .woovr-variation .woovr-variation-name p,
.woovr-variations .woovr-variation .woovr-variation-price p {
    margin: 0 !important;
    display: inline !important;
}