/*=====================================
  ARNHOPİA — Genel Stiller
  Versiyon: 9.0.0
  
  Bu dosya sadece şunları içerir:
  - Ürün grid stili (kategori/anasayfa)
  - Ürün detay sayfası stili
  - Genel WC bildirim stilleri
  
  Sepet / Ödeme / Hesabım sayfaları
  artık kendi sayfa template'leri
  üzerinden yönetilmektedir.
=====================================*/

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;1,400&family=Poppins:wght@300;400;500;600;700&family=Open+Sans:wght@300;400;500;600&display=swap');

:root {
    --ap: #C2185B;
    --ap2: #e91e8c;
    --gold: #D4AF37;
    --cream: #FFF6F9;
    --powder: #FDECEF;
    --border-light: rgba(248, 200, 220, 0.4);
    --shadow: 0 2px 16px rgba(194, 24, 91, 0.07);
    --shadow-md: 0 8px 32px rgba(194, 24, 91, 0.12);
    --r-lg: 20px;
    --r-md: 12px;
    --r-sm: 8px;
    --r-pill: 50px;
    --font-head: 'Playfair Display', serif;
    --font-body: 'Open Sans', sans-serif;
    --font-ui: 'Poppins', sans-serif;
    --text: #1a0d14;
    --text-2: #5a3a48;
    --text-3: #9a7a88;
}

/* ─── GENEL ─────────────────── */
body {
    font-family: var(--font-body);
    color: var(--text);
}


/* ══════════════════════════════════════
   ÜRÜN GRİDİ (Kategori / Anasayfa)
   ══════════════════════════════════════ */

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: rgba(255, 255, 255, 0.95);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow);
    border: 1px solid var(--border-light);
    padding: 0 0 20px;
    transition: transform .35s, box-shadow .35s;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-md);
}

/* ÜRÜN GÖRSELİ - PEMBE ARKAPLAN KALDIRILDI, TAM ALAN KAPLAMA */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link {
    display: block;
    position: relative;
}

.woocommerce ul.products li.product .woocommerce-LoopProduct-link .attachment-woocommerce_thumbnail,
.woocommerce ul.products li.product img {
    border-radius: var(--r-lg) var(--r-lg) 0 0;
    width: 100%;
    height: auto;
    aspect-ratio: 1;
    display: block;
    object-fit: cover;
    background: #fff; /* Pembe değil, beyaz arkaplan */
}

/* Ürün görseli container'ı */
.woocommerce ul.products li.product .woocommerce-loop-product__link {
    background: transparent;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-family: var(--font-ui);
    font-weight: 600;
    font-size: 14px;
    padding: 12px 16px 4px;
    color: var(--text);
}
.woocommerce ul.products li.product .price {
    color: var(--ap);
    font-family: var(--font-ui);
    font-weight: 700;
    padding: 0 16px 12px;
}
.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button {
    margin: 0 16px;
    background: linear-gradient(135deg, var(--ap), var(--ap2));
    color: #fff;
    border: none;
    border-radius: var(--r-pill);
    font-family: var(--font-ui);
    font-weight: 600;
    font-size: 13px;
    padding: 10px 20px;
    transition: all .3s;
}
.woocommerce ul.products li.product .button:hover {
    opacity: .88;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(194, 24, 91, .3);
}

@media (max-width: 768px) {
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product {
        border-radius: 14px;
    }
    .woocommerce ul.products li.product .woocommerce-LoopProduct-link .attachment-woocommerce_thumbnail,
    .woocommerce ul.products li.product img {
        border-radius: 14px 14px 0 0;
    }
}


/* ══════════════════════════════════════
   ÜRÜN DETAY SAYFASI
   ══════════════════════════════════════ */

.woocommerce div.product div.images .woocommerce-product-gallery__image img {
    border-radius: var(--r-lg);
    background: #fff;
}
.woocommerce div.product div.images .flex-control-thumbs li img {
    border-radius: var(--r-sm);
    background: #fff;
}
.woocommerce div.product .product_title {
    font-family: var(--font-head);
    color: var(--text);
}
.woocommerce div.product .price {
    color: var(--ap);
    font-family: var(--font-ui);
    font-weight: 700;
}
.woocommerce div.product form.cart .quantity input[type="number"] {
    border: 1.5px solid var(--border-light);
    border-radius: var(--r-pill);
    padding: 0 14px;
    font-family: var(--font-ui);
}
.woocommerce div.product form.cart .single_add_to_cart_button {
    background: linear-gradient(135deg, var(--ap), var(--ap2)) !important;
    border: none !important;
    border-radius: var(--r-pill) !important;
    font-family: var(--font-ui) !important;
    font-weight: 600 !important;
    font-size: 16px !important;
    padding: 14px 40px !important;
    transition: all .3s !important;
}
.woocommerce div.product form.cart .single_add_to_cart_button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(194, 24, 91, .38) !important;
}

@media (max-width: 768px) {
    .woocommerce div.product div.images .woocommerce-product-gallery__image img {
        border-radius: 14px;
    }
}


/* ══════════════════════════════════════
   GENEL WC BİLDİRİMLER
   (her sayfada çıkabilir)
   ══════════════════════════════════════ */

.woocommerce-message {
    background: rgba(248, 200, 220, .15) !important;
    border-left: 3px solid var(--ap) !important;
    border-radius: 0 var(--r-sm) var(--r-sm) 0 !important;
    font-family: var(--font-body);
}
.woocommerce-message a.button {
    background: linear-gradient(135deg, var(--ap), var(--ap2)) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--r-pill) !important;
    font-family: var(--font-ui) !important;
    font-weight: 600 !important;
}
.woocommerce-error {
    border-left: 3px solid #e53935 !important;
    border-radius: 0 var(--r-sm) var(--r-sm) 0 !important;
    font-family: var(--font-body);
}
.woocommerce-info {
    border-left: 3px solid var(--border-light) !important;
    border-radius: 0 var(--r-sm) var(--r-sm) 0 !important;
    font-family: var(--font-body);
}