/* Ürün Sayfası CSS - Admin panelinden oluşturulan sayfalar için */

/* Özel renk tanımları sadece bu sayfa için */
:root {
    --custom-primary-blue: #0e2675;
    --custom-dark-blue: #0a1d5a;
    --custom-light-blue: #e6eaf8;
    --custom-primary-red: #ff0000;
    --custom-dark-red: #cc0000;
}

/* Ana görsel boyutlandırma düzeltmeleri */
.main-image {
    width: 555px !important;
    height: 700px !important;
    overflow: hidden !important;
    border-radius: var(--radius-xl) !important;
    box-shadow: var(--shadow-lg) !important;
}

.product-main-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
    background: #f8f9fa !important;
}

/* Küçük resimler için düzeltme */
.product-thumb {
    width: 100% !important;
    height: 120px !important;
    object-fit: contain !important;
    border-radius: var(--radius-lg) !important;
    background: #f8f9fa !important;
}

/* İlgili ürün resimleri için düzeltme */
.related-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    background: #f8f9fa !important;
}

/* Responsive düzeltmeler */
@media (max-width: 1024px) {
    .main-image {
        width: 100% !important;
        max-width: 555px !important;
        margin: 0 auto !important;
    }
}

@media (max-width: 480px) {
    .main-image {
        width: 100% !important;
        height: 500px !important;
    }
}

/* Breadcrumb mavi renkleri */
.breadcrumb-nav a {
    color: var(--custom-primary-blue) !important;
}

.breadcrumb-nav a:hover {
    color: var(--custom-dark-blue) !important;
    background: rgba(14, 38, 117, 0.1) !important;
}

.breadcrumb-nav a::after {
    background: var(--custom-primary-blue) !important;
}

/* İletişim formu mavi renkleri */
.contact-form {
    border-color: var(--custom-primary-blue) !important;
}

.contact-form h3 {
    color: var(--custom-primary-blue) !important;
}

.product-contact-form input:focus,
.product-contact-form textarea:focus {
    border-color: var(--custom-primary-blue) !important;
    box-shadow: 0 0 0 3px rgba(14, 38, 117, 0.1) !important;
}

/* Ürün özellikleri başlıkları */
.product-features h3,
.product-description h3,
.related-products h3 {
    border-bottom-color: var(--custom-primary-blue) !important;
}

/* Özellik öğeleri */
.feature-item {
    border-left-color: var(--custom-primary-blue) !important;
}

/* Sepete ekle butonu */
.add-to-cart-btn {
    background: linear-gradient(135deg, var(--custom-primary-blue), var(--custom-dark-blue)) !important;
}

.add-to-cart-btn:hover {
    background: linear-gradient(135deg, var(--custom-dark-blue), var(--custom-primary-blue)) !important;
}

/* Miktar seçici butonları */
.quantity-selector button:hover {
    background: var(--custom-primary-blue) !important;
}

/* Görsel küçük resimleri */
.product-thumb:hover {
    border-color: var(--custom-primary-blue) !important;
}

/* Detaylar butonu */
.view-details-btn {
    background: var(--custom-primary-blue) !important;
}

.view-details-btn:hover {
    background: var(--custom-dark-blue) !important;
}

/* Kırmızı renkler - Fiyatlar */
.product-price {
    color: var(--custom-primary-red) !important;
}

.related-price {
    color: var(--custom-primary-red) !important;
}

/* İletişim formu gönder butonu */
.product-contact-form button {
    background: var(--custom-primary-red) !important;
}

.product-contact-form button:hover {
    background: var(--custom-dark-red) !important;
}

/* Mesaj durumu stilleri */
.message-status {
    margin-top: 15px;
    animation: slideDown 0.3s ease;
}

.success-message, .error-message {
    padding: 12px 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 500;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.success-message {
    background: linear-gradient(135deg, #10b981, #059669);
    color: white;
    border-left: 4px solid #047857;
}

.error-message {
    background: linear-gradient(135deg, #ef4444, #dc2626);
    color: white;
    border-left: 4px solid #b91c1c;
}

.success-message i, .error-message i {
    font-size: 1.1rem;
}

/* Animasyonlar */
@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}