/*
 * Çay Pudrası teması: Native üzerine adaçayı yeşili, yumuşak köşeler ve hap biçimli düğmeler.
 * Yalnızca renk, tipografi ve şekil katmanıdır; işaretleme paylaşılan Native görünümlerindedir.
 */

:root {
    --primary-color: #33502d;
    --primary-hover: #26401f;
    --secondary-color: #1b2418;
    --text-color: #3b4636;
    --bg-light: #f7f8f2;
    --border-color: #d9dfcb;
    --border-radius: 16px;
    --box-shadow: 0 10px 30px rgba(51, 80, 45, 0.10);
    --cp-sage: #c9d9a8;
    --cp-tint: #e3ebd0;
    --cp-mist: #eef2e3;
    --cp-ink: #1b2418;
    --cp-muted: #4a5644;
    --cp-font: 'Manrope', 'Inter', 'Segoe UI', sans-serif;
}

body {
    font-family: var(--cp-font);
    background-color: var(--bg-light);
    color: var(--text-color);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--cp-ink);
    font-family: var(--cp-font);
    font-weight: 800;
    letter-spacing: -0.01em;
}

a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
    outline: 3px solid var(--primary-color);
    outline-offset: 3px;
}

::selection { background: var(--cp-sage); color: var(--cp-ink); }

/* Üst bilgi ve başlık */
.top-bar { background-color: var(--cp-mist); border-bottom-color: var(--border-color); }
.main-header { background-color: var(--bg-light); border-bottom-color: var(--border-color); }
.search-box { border: 2px solid var(--primary-color); border-radius: 999px; background: #fff; }
.search-box input { padding-left: 24px; }
.search-box button { background: var(--primary-color); padding: 0 28px; }
.search-box button:hover { background: var(--primary-hover); }
.action-item, .action-item i { color: var(--cp-ink); }
.action-item:hover, .action-item:hover i { color: var(--primary-color); }
.badge-count { background-color: var(--primary-color); }
.bottom-nav-wrapper { background-color: #fff; border-color: var(--border-color); }
.native-horizontal-menu > li > a { color: var(--cp-ink); font-weight: 600; }
.native-horizontal-menu > li:hover > a { color: var(--primary-color); background-color: var(--cp-mist); border-radius: 999px; }
.mega-dropdown-menu, .native-dropdown, .dropdown-menu { border-color: var(--border-color); border-radius: 16px; box-shadow: var(--box-shadow); }

/* Bölüm başlıkları */
.native-section-header { border-bottom-color: var(--border-color); }
.native-section-title { font-size: 1.5rem; font-weight: 800; border-bottom-color: var(--primary-color); }
.btn-native-link { color: var(--primary-color); font-weight: 700; }
.btn-native-link:hover { color: var(--primary-hover); }

/* Düğmeler: hap biçimi */
.btn, .btn-add-cart, .btn-options, .btn-card, .btn-out-of-stock, .btn-read-more, .btn-send-msg {
    border-radius: 999px;
    font-weight: 700;
}
.btn-add-cart { background-color: var(--primary-color); color: #fff; }
.btn-add-cart:hover { background-color: var(--primary-hover); }
.btn-primary {
    --bs-btn-bg: #33502d;
    --bs-btn-border-color: #33502d;
    --bs-btn-hover-bg: #26401f;
    --bs-btn-hover-border-color: #26401f;
    --bs-btn-active-bg: #1f3419;
    --bs-btn-active-border-color: #1f3419;
    --bs-btn-disabled-bg: #33502d;
    --bs-btn-disabled-border-color: #33502d;
}
.btn-outline-primary {
    --bs-btn-color: #33502d;
    --bs-btn-border-color: #33502d;
    --bs-btn-hover-bg: #33502d;
    --bs-btn-hover-border-color: #33502d;
    --bs-btn-active-bg: #26401f;
    --bs-btn-active-border-color: #26401f;
}
.text-primary { color: var(--primary-color) !important; }
.bg-primary { background-color: var(--primary-color) !important; }

/* Ürün kartları */
.product-card { border-radius: 20px; border-color: var(--border-color); background: #fff; }
.product-card:hover { border-color: var(--cp-sage); box-shadow: var(--box-shadow); }
.product-image-link { background: var(--cp-tint); }
.product-title, .product-title a { color: var(--cp-ink); font-weight: 700; }
.product-brand { color: var(--cp-muted); }
.current-price { color: var(--cp-ink); font-weight: 800; }
.old-price { color: #6b7561; }
.badge-new, .badge-shipping { background-color: var(--primary-color); color: #fff; border-radius: 999px; }
.badge-discount { border-radius: 999px; }

/* Ana görsel ve güven şeridi */
.hero-slider-wrapper { border-radius: 28px; overflow: hidden; }
.native-trust-bar { background-color: var(--cp-mist); border-color: var(--border-color); }
.trust-icon { color: var(--primary-color); background-color: var(--cp-tint); border-radius: 50%; }
.trust-title { color: var(--cp-ink); font-weight: 800; }

/* Formlar */
.form-control, .form-select, .filter-select, .native-form input, .native-form select, .native-form textarea {
    border-radius: 12px;
    border-color: #c5cdb4;
}
.form-control:focus, .form-select:focus, .native-form input:focus, .native-form select:focus, .native-form textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 4px rgba(51, 80, 45, 0.15);
}
.auth-card, .cart-card, .checkout-card, .summary-card, .page-card, .contact-form-card, .user-sidebar, .address-card, .bank-card {
    border-radius: 20px;
    border-color: var(--border-color);
}

/* Sayfalama */
.native-pagination .page-link, .pagination .page-link { border-radius: 999px; color: var(--primary-color); }
.native-pagination .active .page-link, .pagination .active .page-link { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }

/* Alt bilgi */
.site-footer { background-color: var(--primary-color); color: var(--cp-tint); }
.footer-title { color: #fff; font-weight: 800; }
.footer-link { color: var(--cp-tint); }
.footer-link:hover { color: #fff; }
.footer-social-btn { background-color: rgba(255, 255, 255, 0.10); border-radius: 50%; }
.footer-social-btn:hover { background-color: var(--cp-sage); color: var(--cp-ink); }
.footer-bottom { background-color: var(--primary-hover); }

/* Mobil alt gezinme */
.mobile-bottom-nav { border-top-color: var(--border-color); }
.mobile-bottom-nav .nav-item.active, .mobile-bottom-nav .nav-item:hover { color: var(--primary-color); }

@media (max-width: 768px) {
    .hero-slider-wrapper { border-radius: 18px; }
    .native-section-title { font-size: 1.25rem; }
}