/**
 * Variation Dropdown Selector - Styles
 * @version 1.0.0
 */

/* Ana wrapper */
.vds-variation-selector-wrapper {
    background: #f9f9f9;
    padding: 15px;
    margin-bottom: 20px;
    border-radius: 5px;
    border: 1px solid #e0e0e0;
    clear: both;
}

/* Label stili */
.vds-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
    font-size: 14px;
}

/* Select dropdown stili */
.vds-variation-select {
    width: 100%;
    padding: 12px 40px 12px 12px; /* Üst-sağ-alt-sol - daha fazla dikey padding */
    font-size: 14px;
    line-height: 1.5; /* Satır yüksekliğini artır */
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.3s ease;
    background-color: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 20px;
    
    /* Uzun listeler için scroll */
    max-height: 400px;
    overflow-y: auto;
    
    /* Metni tam göster */
    min-height: 45px; /* Minimum yükseklik */
}

.vds-variation-select:hover {
    border-color: #999;
}

.vds-variation-select:focus {
    outline: none;
    border-color: #666;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.vds-variation-select:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Option stili */
.vds-variation-select option {
    padding: 12px 10px;
    line-height: 1.6;
    min-height: 40px;
}

/* Custom scrollbar stilleri (Webkit tarayıcılar için) */
.vds-variation-select::-webkit-scrollbar {
    width: 8px;
}

.vds-variation-select::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

.vds-variation-select::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.vds-variation-select::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Firefox için scrollbar */
.vds-variation-select {
    scrollbar-width: thin;
    scrollbar-color: #888 #f1f1f1;
}

/* Yükleme göstergesi */
#vds-loading-indicator {
    display: inline-block;
    margin-left: 10px;
    color: #666;
    font-size: 14px;
    animation: vds-pulse 1.5s ease-in-out infinite;
}

@keyframes vds-pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

/* Flatsome teması uyumluluğu */
.product-page-wrapper .vds-variation-selector-wrapper {
    margin-top: 0;
}

.product-info .vds-variation-selector-wrapper {
    margin-top: 0;
}

/* Responsive tasarım */
@media (max-width: 768px) {
    .vds-variation-selector-wrapper {
        padding: 12px;
    }
    
    .vds-variation-select {
        font-size: 16px; /* iOS zoom'u önlemek için */
        padding: 14px 40px 14px 14px; /* Mobilde daha fazla padding */
        line-height: 1.6;
        min-height: 50px;
        /* Mobilde daha kısa liste göster */
        max-height: 300px;
    }
    
    .vds-label {
        font-size: 13px;
    }
}

/* Çok küçük ekranlar */
@media (max-width: 480px) {
    .vds-variation-select {
        max-height: 250px;
    }
}

/* Dark mode desteği */
@media (prefers-color-scheme: dark) {
    .vds-variation-selector-wrapper {
        background: #2a2a2a;
        border-color: #444;
    }
    
    .vds-label {
        color: #e0e0e0;
    }
    
    .vds-variation-select {
        background-color: #333;
        border-color: #555;
        color: #e0e0e0;
        /* Dark mode scrollbar */
        scrollbar-color: #666 #2a2a2a;
    }
    
    .vds-variation-select:hover {
        border-color: #777;
    }
    
    .vds-variation-select:focus {
        border-color: #999;
    }
    
    /* Dark mode custom scrollbar (Webkit) */
    .vds-variation-select::-webkit-scrollbar-track {
        background: #2a2a2a;
    }
    
    .vds-variation-select::-webkit-scrollbar-thumb {
        background: #666;
    }
    
    .vds-variation-select::-webkit-scrollbar-thumb:hover {
        background: #888;
    }
}

/* RTL dil desteği */
[dir="rtl"] .vds-variation-select {
    background-position: left 10px center;
    padding-left: 40px;
    padding-right: 10px;
}

/* Özel tema entegrasyonları */
.storefront .vds-variation-selector-wrapper,
.astra .vds-variation-selector-wrapper,
.oceanwp .vds-variation-selector-wrapper {
    margin-bottom: 15px;
}

/* WooCommerce varsayılan stillerle uyum */
.single-product .summary .vds-variation-selector-wrapper {
    margin-top: 0;
}

/* Varyasyon açıklaması stili */
.woocommerce-variation-description {
    margin-top: 15px;
    padding: 10px;
    background: #f0f0f0;
    border-left: 3px solid #666;
    font-size: 13px;
    line-height: 1.6;
}

/* WooCommerce'in varsayılan varyasyon formunu gizle */
.single-product .variations_form .variations {
    display: none !important;
}

/* WooCommerce varyasyon seçim tablosunu gizle */
.single-product .variations_form table.variations {
    display: none !important;
}

/* Reset variations butonunu gizle */
.single-product .reset_variations {
    display: none !important;
}

/* Flatsome uyumluluğu için ekstra gizleme */
.product-page-wrapper .variations_form .variations,
.product-info .variations_form .variations {
    display: none !important;
}