/**

 * theme_flat_red.css - Modern Flat Red & Orange E-Commerce Theme

 * OpenCart 4 - UygunBulduk.com / Quilling Sanatı

 */



@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,400&display=swap');



:root {

  --qs-font: 'Ubuntu', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --qs-red: #7c3aed;

  --qs-red-dark: #5b21b6;

  --qs-red-light: #f5f3ff;

  --qs-orange: #9333ea;

  --qs-orange-dark: #7e22ce;

  --qs-orange-light: #faf5ff;

  --qs-purple: #7c3aed;

  --qs-purple-dark: #6d28d9;

  --qs-purple-deep: #2e0854;

  --qs-purple-light: #f5f3ff;

  --qs-lilac: #a855f7;

  --qs-lilac-light: #c084fc;

  --qs-dark-header: #3b0764;

  --qs-header-gradient: linear-gradient(105deg, #1e0538 0%, #3b0764 35%, #581c87 70%, #7e22ce 100%);

  --qs-dark-header-sub: #1e102d;

  --qs-dark-footer: #141318;

  --qs-dark-footer-sub: #1e1d24;

  --qs-text-main: #1e293b;

  --qs-text-muted: #64748b;

  --qs-text-light: #94a3b8;

  --qs-bg-body: #f8fafc;

  --qs-bg-card: #ffffff;

  --qs-border: #e2e8f0;

  --qs-border-light: #f1f5f9;

  --qs-radius: 6px;

  --qs-radius-sm: 4px;

  --qs-radius-lg: 8px;

  --qs-radius-pill: 20px;

}



/* ================= Global Reset & Typography ================= */

body {

  margin: 0 !important;

  padding-top: 0 !important;

  font-family: var(--qs-font) !important;

  background-color: var(--qs-bg-body);

  color: var(--qs-text-main);

  font-size: 14px;

  line-height: 1.5;

  -webkit-font-smoothing: antialiased;

}



#container {

  position: relative !important;

  width: 100% !important;

  min-height: auto !important;

  flex: 1 0 auto !important;

  margin-top: 0 !important;

  margin-bottom: 0 !important;

  padding-top: 0 !important;

}



.qs-trust-topbar {

  margin-top: 0 !important;

}



h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {

  font-family: var(--qs-font) !important;

  font-weight: 700;

  color: var(--qs-text-main);

  letter-spacing: -0.2px;

}



a {

  color: var(--qs-red);

  text-decoration: none;

  transition: color 0.15s ease;

}

a:hover {

  color: var(--qs-red-dark);

}



/* ================= Flat Button Styles ================= */

.btn {

  font-family: var(--qs-font);

  font-weight: 600;

  border-radius: var(--qs-radius-sm);

  padding: 8px 16px;

  font-size: 13.5px;

  border: 1px solid transparent;

  box-shadow: none !important;

  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;

}



.btn-primary, .btn-red {

  background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;

  border-color: #6d28d9 !important;

  color: #fff !important;

}

.btn-primary:hover, .btn-red:hover {

  background: linear-gradient(135deg, var(--qs-red-dark, #6d28d9) 0%, var(--qs-dark-header, #5b21b6) 100%) !important;

  border-color: var(--qs-dark-header, #5b21b6) !important;

}



.btn-orange {

  background-color: var(--qs-orange) !important;

  border-color: var(--qs-orange) !important;

  color: #fff !important;

}

.btn-orange:hover {

  background-color: var(--qs-orange-dark) !important;

  border-color: var(--qs-orange-dark) !important;

}



.btn-dark {

  background-color: #1e293b !important;

  border-color: #1e293b !important;

  color: #fff !important;

}

.btn-dark:hover {

  background-color: #0f172a !important;

  border-color: #0f172a !important;

}



.btn-success {

  background-color: #16a34a !important;

  border-color: #16a34a !important;

  color: #fff !important;

}

.btn-success:hover {

  background-color: #15803d !important;

  border-color: #15803d !important;

}



.btn-outline-primary, .btn-outline-red {

  background-color: transparent !important;

  border-color: var(--qs-red) !important;

  color: var(--qs-red) !important;

}

.btn-outline-primary:hover, .btn-outline-red:hover {

  background-color: var(--qs-red) !important;

  color: #fff !important;

}



.btn-outline-secondary {

  background-color: transparent !important;

  border-color: var(--qs-border) !important;

  color: var(--qs-text-muted) !important;

}

.btn-outline-secondary:hover {

  background-color: #f1f5f9 !important;

  color: var(--qs-text-main) !important;

}



/* ================= Top Bar (En Üst Duyuru Barı) ================= */

.qs-top-bar {

  background-color: #141219;

  color: #e2e8f0;

  font-size: 12px;

  padding: 6px 0;

  border-bottom: 1px solid rgba(255, 255, 255, 0.08);

}

.qs-top-bar a {

  color: #cbd5e1;

}

.qs-top-bar a:hover {

  color: #fff;

}

.qs-top-badge {

  background: rgba(225, 29, 72, 0.2);

  color: #ff6b8b;

  border: 1px solid rgba(225, 29, 72, 0.4);

  padding: 2px 8px;

  border-radius: var(--qs-radius-sm);

  font-weight: 700;

  font-size: 11px;

}



/* ================= Main Header (Ambient Animated Gradient & Sticky) ================= */

@keyframes qsHeaderAmbientMotion {

  0% {

    background-position: 0% 50%;

    filter: brightness(1) saturate(1);

  }

  25% {

    background-position: 50% 100%;

    filter: brightness(1.05) saturate(1.04);

  }

  50% {

    background-position: 100% 50%;

    filter: brightness(0.96) saturate(1.08);

  }

  75% {

    background-position: 50% 0%;

    filter: brightness(1.04) saturate(1.02);

  }

  100% {

    background-position: 0% 50%;

    filter: brightness(1) saturate(1);

  }

}



header.qs-header {

  background: linear-gradient(125deg, #18032e 0%, #35085c 20%, #581c87 45%, #7e22ce 70%, #4a044e 85%, #1f033a 100%) !important;

  background-size: 280% 280% !important;

  animation: qsHeaderAmbientMotion 24s ease-in-out infinite !important;

  will-change: background-position, filter;

  padding: 16px 0 14px 0;

  color: #fff;

  position: relative;

  transition: padding 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease;

}



/* Kompakt Sabit Başlık (Sticky Header) */

header.qs-header.is-sticky {

  position: fixed !important;

  top: 0 !important;

  left: 0 !important;

  right: 0 !important;

  width: 100% !important;

  z-index: 1050 !important;

  padding: 8px 0 7px 0 !important;

  box-shadow: 0 8px 28px rgba(24, 3, 46, 0.5) !important;

  backdrop-filter: blur(12px) !important;

  -webkit-backdrop-filter: blur(12px) !important;

  animation: qsHeaderSlideDown 0.32s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;

}



@keyframes qsHeaderSlideDown {

  from {

    transform: translateY(-100%);

    opacity: 0.9;

  }

  to {

    transform: translateY(0);

    opacity: 1;

  }

}



header.qs-header.is-sticky .qs-header-logo-img {

  max-height: 38px !important;

  transition: max-height 0.25s ease;

}



header.qs-header.is-sticky .qs-trend-tags {

  display: none !important;

}



header.qs-header.is-sticky .qs-header-grid {

  padding: 0 !important;

  gap: 10px 16px !important;

}



.qs-header-logo img {

  max-height: 48px;

  width: auto;

  object-fit: contain;

}

.qs-header-logo-text {

  font-size: 24px;

  font-weight: 700;

  color: #fff;

  letter-spacing: -0.5px;

}

.qs-header-logo-text span {

  color: #c084fc;

}



/* Canlı Arama Kutusu */

.qs-search-wrap {

  position: relative;

  width: 100%;

}

.qs-search-box {

  display: flex;

  background: #fff;

  border-radius: var(--qs-radius-sm);

  overflow: hidden;

  box-shadow: 0 2px 8px rgba(0,0,0,0.15);

}

.qs-search-input {

  flex-grow: 1;

  border: none;

  padding: 10px 16px;

  font-size: 13.5px;

  font-family: var(--qs-font);

  outline: none;

  color: var(--qs-text-main);

}

.qs-search-btn {

  background: linear-gradient(135deg, #7c3aed 0%, #9333ea 100%) !important;

  color: #fff !important;

  border: none;

  padding: 0 22px;

  font-weight: 700;

  font-size: 14px;

  cursor: pointer;

  border-radius: 0 !important;

  display: flex;

  align-items: center;

  gap: 6px;

  transition: background-color 0.15s;

}

.qs-search-btn:hover {

  background: linear-gradient(135deg, #6d28d9 0%, #7e22ce 100%) !important;

}



/* Trend Arama Kelimeleri */

.qs-trend-tags {

  display: flex;

  align-items: center;

  gap: 8px;

  margin-top: 6px;

  font-size: 11.5px;

  color: #94a3b8;

  overflow-x: auto;

  white-space: nowrap;

}

.qs-trend-tags a {

  color: #cbd5e1;

  text-decoration: underline;

  text-decoration-color: rgba(203, 213, 225, 0.4);

}

.qs-trend-tags a:hover {

  color: #c084fc;

  text-decoration-color: #c084fc;

}



/* Header Sağ Kullanıcı Menüsü */

.qs-user-nav {

  display: flex;

  align-items: center;

  justify-content: flex-end;

  gap: 14px;

}

.qs-user-link {

  color: #e2e8f0;

  font-size: 12.5px;

  font-weight: 500;

  display: flex;

  align-items: center;

  gap: 6px;

  padding: 6px 8px;

  border-radius: var(--qs-radius-sm);

  transition: all 0.15s;

}

.qs-user-link:hover {

  color: #fff;

  background: rgba(255, 255, 255, 0.08);

}

.qs-user-link i {

  font-size: 15px;

}



/* Header Sepet Butonu */

.qs-cart-pill {

  background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);

  color: #fff !important;

  font-weight: 700;

  font-size: 13.5px;

  padding: 8px 14px;

  border-radius: var(--qs-radius-sm);

  display: inline-flex;

  align-items: center;

  gap: 8px;

  transition: background-color 0.15s;

}

.qs-cart-pill:hover {

  background: linear-gradient(135deg, #6d28d9 0%, #5b21b6 100%);

}

.qs-cart-badge {

  background: #fff;

  color: #6d28d9;

  font-size: 11px;

  font-weight: 800;

  padding: 1px 6px;

  border-radius: 10px;

}



/* ================= Kategori Menü Barı ================= */

.qs-menu-bar {

  background-color: #fff;

  border-bottom: 1px solid var(--qs-border);

  box-shadow: 0 2px 4px rgba(0,0,0,0.03);

}

.qs-all-cats-btn {

  background-color: var(--qs-red) !important;

  color: #fff !important;

  font-weight: 700;

  font-size: 13.5px;

  padding: 10px 18px;

  border-radius: var(--qs-radius-sm) var(--qs-radius-sm) 0 0;

  display: inline-flex;

  align-items: center;

  gap: 8px;

}

.qs-nav-menu-list {

  display: flex;

  align-items: center;

  list-style: none;

  margin: 0;

  padding: 0;

  gap: 4px;

  overflow-x: auto;

}

.qs-nav-menu-list > li > a {

  color: var(--qs-text-main);

  font-weight: 600;

  font-size: 13px;

  padding: 10px 12px;

  display: block;

  border-radius: var(--qs-radius-sm);

  transition: all 0.15s;

}

.qs-nav-menu-list > li > a:hover {

  color: var(--qs-red);

  background-color: var(--qs-red-light);

}

.qs-flash-btn-link {

  color: #fff !important;

  background: linear-gradient(135deg, var(--qs-red), var(--qs-orange)) !important;

  font-weight: 700 !important;

  border-radius: var(--qs-radius-sm);

  padding: 6px 12px !important;

}



/* ================= 4 Sütunlu Modern Ürün Kartı ================= */

.qs-product-card {

  background: var(--qs-bg-card);

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  overflow: visible; /* badge dışarı çıkabilsin */

  display: flex;

  flex-direction: column;

  height: 100%;

  position: relative;

  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;

}

.qs-product-card:hover {

  transform: translateY(-3px);

  box-shadow: 0 8px 20px rgba(0,0,0,0.06);

  border-color: #cbd5e1;

}



/* ══════════════════════════════════════════════

   GÖRSEL WRAPPER

══════════════════════════════════════════════ */

.qs-card-img-wrap {

  position: relative;  /* badge için referans noktası */

  background: #ffffff;

  overflow: hidden;    /* görsel kırpılsın; badge position:absolute ile tam içeride kalır */

  width: 100%;

  display: block;

  line-height: 0;

}

.qs-card-img-wrap > a.qs-img-link {

  display: block;

  width: 100%;

  overflow: hidden;

  line-height: 0;

}

.qs-card-img-wrap img {

  width: 100%;

  height: 190px;   /* Sabit yükseklik — kart hizalanması için */

  max-width: 100%;

  object-fit: contain;

  display: block;

  margin: 0 auto;

  background: #ffffff;

  transition: transform 0.3s ease;

}

.qs-product-card:hover .qs-card-img-wrap img {

  transform: scale(1.03);

}



/* Rozetler */

.qs-badge-discount {

  position: absolute;

  top: 8px;

  left: 8px;

  background-color: var(--qs-red);

  color: #fff;

  font-weight: 800;

  font-size: 11px;

  padding: 3px 7px;

  border-radius: var(--qs-radius-sm);

  z-index: 2;

}

.qs-badge-shipping {

  position: absolute;

  bottom: 8px;

  left: 8px;

  background-color: #16a34a;

  color: #fff;

  font-weight: 700;

  font-size: 10.5px;

  padding: 2px 6px;

  border-radius: var(--qs-radius-sm);

  z-index: 2;

}

.qs-btn-wishlist {

  position: absolute;

  top: 8px;

  right: 8px;

  background: #fff;

  border: 1px solid var(--qs-border);

  width: 32px;

  height: 32px;

  border-radius: 50%;

  display: flex;

  align-items: center;

  justify-content: center;

  color: #94a3b8;

  cursor: pointer;

  z-index: 2;

  transition: all 0.15s;

}

.qs-btn-wishlist:hover {

  color: var(--qs-red);

  border-color: var(--qs-red);

  background: var(--qs-red-light);

}



.qs-card-body {

  padding: 8px 10px;

  display: flex;

  flex-direction: column;

  flex-grow: 1;

}

.qs-card-brand {

  font-size: 11px;

  font-weight: 700;

  color: var(--qs-text-light);

  text-transform: uppercase;

  letter-spacing: 0.5px;

  margin-bottom: 2px;

}

.qs-card-title {

  font-size: 13px;

  font-weight: 600;

  color: var(--qs-text-main);

  line-height: 1.35;

  height: auto;

  min-height: 4.1em;

  overflow: hidden;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  line-clamp: 3;

  -webkit-box-orient: vertical;

  margin-bottom: 6px;

}

.qs-card-title a {

  color: var(--qs-text-main);

}

.qs-card-title a:hover {

  color: var(--qs-red);

}



.qs-card-rating {

  font-size: 11px;

  color: #f59e0b;

  margin-bottom: 6px;

  display: flex;

  align-items: center;

  gap: 4px;

}

.qs-rating-count {

  color: var(--qs-text-light);

}



/* Fiyat Hiyerarşisi */

.qs-card-price-box {

  margin-top: auto;

  padding-top: 6px;

  border-top: 1px solid var(--qs-border-light);

}



/* ═══════════════════════════════════════════════════════════════

   BEDEN ROZETLERİ (Aşama 2 — varyant → ayrı ürün)

   Ürün kartının altında M L XL rozetleri gösterilir.

   Tema renkleriyle uyumlu, küçük ve sadık tasarım.

   ═══════════════════════════════════════════════════════════════ */

.qs-card-sizes {

  display: flex;

  flex-wrap: wrap;

  gap: 3px;

  margin-top: 6px;

  margin-bottom: 2px;

}

.qs-size-chip {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  min-width: 24px;

  height: 20px;

  padding: 0 6px;

  font-size: 11px;

  font-weight: 600;

  line-height: 1;

  color: var(--qs-text);

  background: var(--qs-bg-subtle, #f6f6f7);

  border: 1px solid var(--qs-border-light);

  border-radius: 4px;

  white-space: nowrap;

  transition: background-color 0.15s ease, color 0.15s ease;

}

.qs-size-chip:hover {

  background: var(--qs-primary, #e11d48);

  color: #fff;

  border-color: var(--qs-primary, #e11d48);

}

/* Tüm grubun stoğu bittiyse soluk göster */

.qs-size-chip-out {

  color: var(--qs-text-light);

  text-decoration: line-through;

  opacity: 0.6;

}

.qs-size-chip-out:hover {

  background: var(--qs-text-light);

  border-color: var(--qs-text-light);

  text-decoration: none;

}

.qs-size-chip-more {

  color: var(--qs-text-light);

  background: transparent;

  border-style: dashed;

}



/* Çok satırlı rozetlerde kart yüksekliğini sabit tut */

.qs-card-sizes + .qs-card-price-box {

  margin-top: 0;

}

.qs-price-tag-wrap {

  display: flex;

  align-items: center;

  gap: 6px;

  margin-bottom: 2px;

}

.qs-price-tag-rate {

  background: var(--qs-red-light);

  color: var(--qs-red);

  font-size: 10.5px;

  font-weight: 800;

  padding: 1px 5px;

  border-radius: var(--qs-radius-sm);

}

.qs-price-old {

  font-size: 12px;

  color: var(--qs-red) !important;

  text-decoration: line-through;

}

.qs-price-current {

  font-size: 15px;

  font-weight: 800;

  color: #6d28d9 !important;

}



.qs-card-action {

  margin-top: 8px;

}

.qs-btn-add-cart {

  width: 100%;

  background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;

  color: #fff !important;

  border: none;

  font-size: 12.5px;

  font-weight: 700;

  padding: 8px;

  border-radius: var(--qs-radius-sm);

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 6px;

  cursor: pointer;

  box-shadow: 0 2px 6px rgba(124, 58, 237, 0.25) !important;

  transition: all 0.15s ease;

}

.qs-btn-add-cart:hover {

  background-color: var(--qs-red-dark);

}



/* ================= Sol Filtre Paneli (QS Filter) ================= */

.qs-filter-panel {

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  overflow: hidden;

}

.qs-filter-header {

  padding: 12px 16px;

  border-bottom: 1px solid var(--qs-border);

  font-weight: 700;

  font-size: 15px;

  display: flex;

  align-items: center;

  justify-content: space-between;

}

.qs-filter-section {

  padding: 14px 16px;

  border-bottom: 1px solid var(--qs-border-light);

}

.qs-filter-title {

  font-weight: 700;

  font-size: 13px;

  margin-bottom: 10px;

  color: var(--qs-text-main);

  display: flex;

  align-items: center;

  justify-content: space-between;

  cursor: pointer;

}



/* Hızlı Fırsat Butonları */

.qs-opp-pills {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}

.qs-opp-pill {

  font-size: 11.5px;

  font-weight: 600;

  padding: 5px 10px;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  background: #fff;

  color: var(--qs-text-main);

  cursor: pointer;

  transition: all 0.15s;

}

.qs-opp-pill:hover, .qs-opp-pill.active {

  border-color: var(--qs-red);

  color: var(--qs-red);

  background: var(--qs-red-light);

}



/* Fiyat Aralığı */

.qs-price-pills {

  display: flex;

  flex-wrap: wrap;

  gap: 5px;

  margin-bottom: 8px;

}

.qs-price-pill {

  font-size: 11px;

  padding: 4px 8px;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  background: #f8fafc;

  color: var(--qs-text-muted);

  cursor: pointer;

}

.qs-price-inputs {

  display: flex;

  align-items: center;

  gap: 6px;

}

.qs-price-input {

  width: 70px;

  padding: 5px 8px;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  font-size: 12px;

}



/* Renk Seçenekleri */

.qs-color-swatches {

  display: flex;

  flex-wrap: wrap;

  gap: 8px;

}

.qs-color-swatch {

  width: 26px;

  height: 26px;

  border-radius: 50%;

  border: 2px solid #fff;

  box-shadow: 0 0 0 1px #cbd5e1;

  cursor: pointer;

  position: relative;

}

.qs-color-swatch.active {

  box-shadow: 0 0 0 2px var(--qs-red);

}



/* Beden / Ölçü Seçenekleri */

.qs-size-pills {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}

.qs-size-pill {

  font-size: 11.5px;

  font-weight: 600;

  padding: 4px 10px;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  background: #fff;

  cursor: pointer;

}

.qs-size-pill.active {

  border-color: var(--qs-red);

  background: var(--qs-red);

  color: #fff;

}



/* ── Ürün Detay — Yukarıda tanımlandı ── */



/* ================= Sepet Sayfası ================= */

.qs-cart-step-bar {

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  padding: 16px;

  margin-bottom: 20px;

}

.qs-free-ship-meter {

  background: #f1f5f9;

  border-radius: 20px;

  height: 8px;

  overflow: hidden;

  margin-top: 8px;

}

.qs-free-ship-fill {

  background: linear-gradient(90deg, var(--qs-orange), var(--qs-red));

  height: 100%;

}



.qs-cart-item-row {

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  padding: 14px;

  margin-bottom: 12px;

  display: flex;

  align-items: center;

  gap: 14px;

}

.qs-cart-item-img {

  width: 70px;

  height: 70px;

  object-fit: contain;

  border-radius: var(--qs-radius-sm);

  border: 1px solid var(--qs-border-light);

}

/* Product recommendations in the cart follow the active brand accent. */
.qs-cart-recommendations {
  background: #f5efff;
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 8%, #fff);
  border-color: color-mix(in srgb, var(--qs-red, #7c3aed) 20%, #fff) !important;
}
#checkout-cart .qs-cart-item-row { border-color: #1a9b58; margin-bottom: 8px; }
#qs-cart-drawer .qs-cart-item-row { margin-bottom: 0; }



.qs-checkout-summary-card {

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  padding: 20px;

  position: sticky;

  top: 20px;

}



/* Ödeme Yöntemi Tercih Kartları */

.qs-pay-methods {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 6px;

  margin-bottom: 16px;

}

.qs-pay-method-card {

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  padding: 8px 4px;

  text-align: center;

  cursor: pointer;

  font-size: 11.5px;

  font-weight: 600;

}

.qs-pay-method-card.active {

  border-color: #16a34a;

  background: #f0fdf4;

  color: #15803d;

}



/* ================= Pre-Footer & Footer ================= */

.qs-trust-bar {

  background: #fff;

  border-top: 1px solid var(--qs-border);

  border-bottom: 1px solid var(--qs-border);

  padding: 24px 0;

  margin-top: 40px;

}

.qs-trust-item {

  display: flex;

  align-items: center;

  gap: 12px;

}

.qs-trust-icon {

  width: 44px;

  height: 44px;

  border-radius: 50%;

  background: #f5f3ff !important;

  color: #7c3aed !important;

  border: 1px solid #ddd6fe !important;

  display: flex;

  align-items: center;

  justify-content: center;

  font-size: 20px;

  flex-shrink: 0;

  box-shadow: 0 2px 8px rgba(124, 58, 237, 0.08);

}

.qs-trust-text h6 {

  font-size: 13.5px;

  font-weight: 700;

  margin: 0;

}

.qs-trust-text p {

  font-size: 12px;

  color: var(--qs-text-muted);

  margin: 0;

}



/* E-Bülten */

.qs-newsletter-bar {

  background: #1e1b24;

  color: #fff;

  padding: 20px 0;

}

.qs-newsletter-form {

  display: flex;

  gap: 8px;

}

.qs-newsletter-input {

  border: 1px solid rgba(255,255,255,0.2);

  background: rgba(255,255,255,0.06);

  color: #fff;

  padding: 8px 14px;

  border-radius: var(--qs-radius-sm);

  font-size: 13px;

  width: 260px;

}

.qs-newsletter-input:focus {

  outline: none;

  border-color: var(--qs-red);

}



/* Footer mobil */

@media (max-width: 767px) {

  .qs-newsletter-form { flex-direction: column; }

  .qs-newsletter-input { width: 100%; }

  .qs-newsletter-bar .btn { width: 100%; justify-content: center; }

  footer.qs-main-footer { padding: 32px 0 calc(75px + env(safe-area-inset-bottom)) 0; } /* bottom nav için boşluk */

  .qs-footer-bottom { flex-direction: column; gap: 12px; text-align: center; }

  .qs-trust-bar { margin-top: 24px; }

}



/* 5 Sütunlu Koyu Footer */

footer,

footer.qs-main-footer {

  position: relative !important;

  bottom: auto !important;

  width: 100% !important;

  clear: both !important;

  margin-top: 0 !important;

  background-color: var(--qs-dark-footer);

  color: #94a3b8;

  padding: 48px 0 24px 0;

  font-size: 12.5px;

}

footer.qs-main-footer h5 {

  color: #fff;

  font-size: 14px;

  font-weight: 700;

  margin-bottom: 16px;

}

footer.qs-main-footer ul {

  list-style: none;

  padding: 0;

  margin: 0;

}

footer.qs-main-footer ul li {

  margin-bottom: 8px;

}

footer.qs-main-footer ul li a {

  color: #94a3b8;

  transition: color 0.15s;

}

footer.qs-main-footer ul li a:hover {

  color: #fff;

}



.qs-footer-bottom {

  border-top: 1px solid rgba(255,255,255,0.08);

  padding-top: 20px;

  margin-top: 36px;

  display: flex;

  align-items: center;

  justify-content: space-between;

  flex-wrap: wrap;

  gap: 12px;

}

.qs-payment-badges {

  display: flex;

  gap: 6px;

}

.qs-pay-badge {

  background: #fff;

  color: #1e293b;

  font-size: 10.5px;

  font-weight: 800;

  padding: 3px 8px;

  border-radius: var(--qs-radius-sm);

}



/* ================= Mobil Alt Gezinti Barı (Bottom Bar) ================= */

.qs-mobile-bottom-nav {

  display: none;

}

@media (max-width: 768px) {

  .qs-mobile-bottom-nav {

    display: flex;

    position: fixed;

    bottom: 0;

    left: 0;

    right: 0;

    height: 56px;

    background: #fff;

    border-top: 1px solid var(--qs-border);

    z-index: 9999;

    align-items: center;

    justify-content: space-around;

    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);

  }

  .qs-mob-nav-item {

    display: flex;

    flex-direction: column;

    align-items: center;

    font-size: 10.5px;

    font-weight: 600;

    color: var(--qs-text-muted);

    position: relative;

  }

  .qs-mob-nav-item i {

    font-size: 18px;

    margin-bottom: 2px;

  }

  .qs-mob-nav-item.active {

    color: var(--qs-red);

  }

  body {

    padding-bottom: 56px;

  }

}



/* ================= Ücretsiz Kargo Progress Barı (Header top) ================= */

.qs-free-shipping-topbar {

  background: linear-gradient(90deg, #3b0764 0%, #581c87 50%, #7c3aed 100%);

  color: #fff;

  font-size: 12px;

  font-weight: 600;

  padding: 6px 0;

}

.qs-free-shipping-topbar i {

  color: #fde68a;

}

.qs-fs-progress-wrap {

  width: 110px;

  height: 5px;

  background: rgba(255,255,255,0.28);

  border-radius: 10px;

  overflow: hidden;

  display: inline-block;

  vertical-align: middle;

}

.qs-fs-progress-bar {

  background: #fde68a;

  height: 100%;

  border-radius: 10px;

  transition: width 0.4s ease;

}



/* ================= Top Utility Bar link stili ================= */

.qs-top-bar-link {

  color: #cbd5e1 !important;

  font-size: 12.5px;

  font-weight: 500;

  display: inline-flex;

  align-items: center;

  gap: 5px;

  padding: 2px 0;

  transition: color 0.15s;

}

.qs-top-bar-link:hover {

  color: #fff !important;

}

.qs-top-bar .dropdown-menu {

  border-radius: var(--qs-radius);

  border: 1px solid var(--qs-border);

  box-shadow: 0 8px 24px rgba(0,0,0,0.10);

  min-width: 160px;

}



/* ================= Mevcut OpenCart Search Controller Override ================= */

header.qs-header #search {

  margin: 0;

}

header.qs-header #search .input-group {

  border-radius: var(--qs-radius-sm);

  overflow: hidden;

  box-shadow: 0 2px 8px rgba(0,0,0,0.15);

}

header.qs-header #search input[type="text"],

header.qs-header #search .form-control {

  border: none !important;

  border-radius: 0 !important;

  padding: 10px 16px !important;

  font-family: var(--qs-font) !important;

  font-size: 13.5px !important;

  color: var(--qs-text-main) !important;

  box-shadow: none !important;

  height: 42px;

}

header.qs-header #search .btn,

header.qs-header #search button[type="submit"] {

  background-color: var(--qs-orange) !important;

  border-color: var(--qs-orange) !important;

  color: #fff !important;

  border-radius: 0 var(--qs-radius-sm) var(--qs-radius-sm) 0 !important;

  padding: 0 20px !important;

  height: 42px;

  font-size: 15px;

  box-shadow: none !important;

}

header.qs-header #search .btn:hover,

header.qs-header #search button[type="submit"]:hover {

  background-color: var(--qs-orange-dark) !important;

}



/* Canlı Arama Dropdown Override */

#qs-live-search-dropdown,

.qs-search-dropdown,

#search-results {

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  box-shadow: 0 10px 30px rgba(0,0,0,0.10);

  max-height: 480px;

  overflow-y: auto;

}



/* ================= Menü Barı Override (menu.twig #menu) ================= */

/* YENİ: qs-menu-bar-outer tam genişlikte gradient — #menu override artık gerek yok */

#menu {

  background-color: transparent !important;

  background-image: none !important;

  border: none !important;

  border-radius: 0 !important;

  box-shadow: none !important;

}

#menu .navbar-nav .nav-link,

#menu .nav-item > a.nav-link {

  color: #e2e8f0 !important;

  font-family: var(--qs-font) !important;

  font-weight: 600 !important;

  font-size: 13px !important;

  padding: 10px 12px !important;

  border-radius: var(--qs-radius-sm) !important;

  transition: color 0.15s, background-color 0.15s !important;

}

#menu .navbar-nav .nav-link:hover,

#menu .navbar-nav .nav-item.show > .nav-link,

#menu .navbar-nav .nav-item:hover > .nav-link {

  color: #fff !important;

  background-color: rgba(255,255,255,0.12) !important;

}

#menu .dropdown-menu {

  border: none !important;

  border-radius: var(--qs-radius) !important;

  box-shadow: 0 8px 24px rgba(0,0,0,0.10) !important;

  padding: 8px 0 !important;

}

#menu .dropdown-menu .dropdown-item {

  font-size: 13px !important;

  font-family: var(--qs-font) !important;

  color: var(--qs-text-main) !important;

  padding: 6px 16px !important;

}

#menu .dropdown-menu .dropdown-item:hover {

  background-color: var(--qs-red-light) !important;

  color: var(--qs-red) !important;

}

#menu .qs-craft-megamenu-item > .nav-link {

  color: var(--qs-red) !important;

  background: var(--qs-red-light) !important;

}

#menu .navbar-toggler {

  border-color: var(--qs-border) !important;

  color: var(--qs-text-main) !important;

}



/* ================= Responsive ================= */

@media (max-width: 991px) {

  header.qs-header {

    padding: 12px 0 10px 0;

  }

  .qs-header-logo img {

    max-height: 38px;

  }

  .qs-cart-pill {

    padding: 7px 10px;

    font-size: 13px;

  }

  #menu .navbar-collapse {

    background: #fff;

    padding: 8px 12px;

    border-radius: var(--qs-radius);

    margin-top: 4px;

    box-shadow: 0 4px 16px rgba(0,0,0,0.08);

  }

}

@media (max-width: 575px) {

  .qs-free-shipping-topbar .qs-fs-progress-wrap {

    display: none;

  }

}



/* ── Checkout Sayfası Mobil ── */

@media (max-width: 991px) {

  /* Sipariş özeti sağ kolon, sol kolona geçmeden önce sıra değiştirir */

  #checkout-checkout .col-lg-5 {

    order: -1; /* özet üste gelsin mobilde */

  }

  .qs-checkout-summary-card { position: static !important; top: auto !important; }

}

@media (max-width: 575px) {

  #checkout-checkout .card-body { padding: 12px !important; }

  .address-card { padding: 10px !important; }

  .shipping-card, .payment-card { padding: 10px !important; }

}

/* ================= Sosyal Medya Butonları (Footer) ================= */

.qs-social-btn {

  width: 34px;

  height: 34px;

  border-radius: var(--qs-radius-sm);

  background: rgba(255,255,255,0.08);

  color: #94a3b8 !important;

  display: inline-flex;

  align-items: center;

  justify-content: center;

  font-size: 15px;

  transition: all 0.15s;

}

.qs-social-btn:hover {

  background: var(--qs-red);

  color: #fff !important;

}



/* ── Ek Ürün Kartı Rozetleri ── */

/* .qs-badge-color-count kaldırıldı — swatch badge ile değiştirildi */

.qs-badge-stock-out {

  position: absolute;

  bottom: 8px;

  left: 8px;

  background: #6b7280;

  color: #fff;

  font-size: 10.5px;

  font-weight: 700;

  padding: 2px 7px;

  border-radius: var(--qs-radius-sm);

  z-index: 2;

}

.qs-badge-lowstock {

  position: absolute;

  top: 8px;

  right: 8px;

  background: #ea580c;

  color: #fff;

  font-size: 11px;

  font-weight: 700;

  padding: 3px 8px;

  border-radius: 4px;

  z-index: 20;

  animation: qs-pulse-lowstock 2s ease-in-out infinite;

}

@keyframes qs-pulse-lowstock {

  0%, 100% { opacity: 1; }

  50% { opacity: 0.75; }

}

.qs-img-out-of-stock {

  opacity: 0.7;

  filter: grayscale(40%);

}



/* ── Palette Badge + Panel — görsel içi sağ alt köşe ── */

.qs-palette-wrap {

  position: absolute;

  bottom: 8px;

  right: 8px;

  z-index: 25;

  display: flex;

  flex-direction: row;

  align-items: center;

  justify-content: flex-end;

  gap: 5px;

  pointer-events: auto;

}



/* Palette Badge — hafif saydam antrasit siyah */

.qs-palette-badge {

  background: rgba(30, 32, 38, 0.82);

  backdrop-filter: blur(4px);

  -webkit-backdrop-filter: blur(4px);

  color: #ffffff;

  border: 1px solid rgba(255, 255, 255, 0.2);

  border-radius: 6px;

  padding: 4px 8px;

  font-size: 11px;

  font-weight: 700;

  cursor: pointer;

  display: inline-flex;

  align-items: center;

  gap: 5px;

  white-space: nowrap;

  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);

  line-height: 1;

  transition: all 0.2s ease;

  flex-shrink: 0;

  outline: none;

}

.qs-palette-badge:hover,

.qs-palette-wrap:hover .qs-palette-badge {

  background: rgba(20, 22, 28, 0.95);

  border-color: rgba(255, 255, 255, 0.4);

}

.qs-palette-badge .qs-palette-icon,

.qs-palette-badge i {

  color: #f59e0b !important;

  font-size: 12px;

}

.qs-palette-badge span {

  color: #ffffff;

  font-size: 11px;

  font-weight: 800;

}



/* Renk kutucukları paneli — sola doğru açılır */

.qs-palette-panel {

  display: flex;

  flex-direction: row;

  align-items: center;

  gap: 4px;

  background: rgba(24, 26, 32, 0.88);

  backdrop-filter: blur(6px);

  -webkit-backdrop-filter: blur(6px);

  border: 1px solid rgba(255, 255, 255, 0.2);

  border-radius: 6px;

  padding: 3px 6px;

  opacity: 0;

  pointer-events: none;

  transform: translateX(8px) scale(0.95);

  transform-origin: right center;

  transition: opacity 0.22s ease, transform 0.22s ease;

  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.4);

  white-space: nowrap;

}

.qs-palette-wrap:hover .qs-palette-panel,

.qs-palette-panel.qs-panel-open {

  opacity: 1;

  pointer-events: auto;

  transform: translateX(0) scale(1);

}



/* Renk kare kutucukları */

.qs-palette-dot {

  display: inline-block;

  width: 16px;

  height: 16px;

  border-radius: 4px;

  border: 1.5px solid rgba(255, 255, 255, 0.75);

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);

  cursor: pointer;

  transition: transform 0.15s ease, border-color 0.15s ease;

  flex-shrink: 0;

  text-decoration: none;

}

.qs-palette-dot:hover {

  transform: scale(1.3);

  border-color: #ffffff;

  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.8), 0 2px 6px rgba(0,0,0,0.5);

  z-index: 5;

  position: relative;

}

.qs-palette-dot.qs-dot-active {

  border-color: #f59e0b;

  box-shadow: 0 0 0 2px #ffffff;

}

.qs-dot-more {

  font-size: 10px;

  font-weight: 700;

  color: #cbd5e1;

  padding: 0 2px;

}



/* Görsel ilerleme noktaları — alt ortada */

.qs-img-dots {

  position: absolute;

  bottom: 6px;

  left: 50%;

  transform: translateX(-50%);

  display: flex;

  gap: 4px;

  z-index: 5;

  pointer-events: none;

}

.qs-img-dot {

  width: 5px;

  height: 5px;

  border-radius: 50%;

  background: rgba(255,255,255,.45);

  transition: background .2s, transform .2s;

}

.qs-img-dot.active {

  background: rgba(255,255,255,.95);

  transform: scale(1.4);

}



/* ── btn-red / btn-orange / btn-outline-red yardımcı sınıflar ── */

.btn-red {

  background-color: var(--qs-red);

  border-color: var(--qs-red);

  color: #fff;

  border-radius: var(--qs-radius-sm);

  font-weight: 700;

  transition: background-color 0.15s, border-color 0.15s;

}

.btn-red:hover, .btn-red:focus {

  background-color: #c81834;

  border-color: #c81834;

  color: #fff;

}

.btn-orange {

  background-color: var(--qs-orange);

  border-color: var(--qs-orange);

  color: #fff;

  border-radius: var(--qs-radius-sm);

  font-weight: 700;

  transition: background-color 0.15s;

}

.btn-orange:hover, .btn-orange:focus {

  background-color: var(--qs-orange-dark);

  border-color: var(--qs-orange-dark);

  color: #fff;

}

.btn-outline-red {

  background-color: transparent;

  border: 1px solid var(--qs-red);

  color: var(--qs-red);

  border-radius: var(--qs-radius-sm);

  font-weight: 600;

  transition: all 0.15s;

}

.btn-outline-red:hover {

  background-color: var(--qs-red);

  color: #fff;

}



/* ── Ürün Detay Galeri ── */

.qs-gallery-main {

  position: relative;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  overflow: hidden;

  background: #fff;

  cursor: zoom-in;

}

.qs-gallery-main img {

  width: 100%;

  display: block;

  object-fit: contain;

  max-height: auto;

  transition: transform 0.3s ease;

}

.qs-gallery-main:hover img {

  transform: scale(1.02);

}

.qs-gallery-thumbs {

  display: grid;

  gap: 6px;

  grid-template-columns: repeat(5, 1fr);

  margin-top: 8px;

}

.qs-gallery-thumb {

  width: 100%;

  height: auto;

  aspect-ratio: 2 / 3;

  object-fit: cover;

  border-radius: var(--qs-radius-sm);

  border: 2px solid var(--qs-border);

  cursor: pointer;

  transition: border-color 0.15s;

  flex-shrink: 0;

}

.qs-gallery-thumb:hover,

.qs-gallery-thumb.active {

  border-color: var(--qs-red);

}



/* ── Detay Sayfası Fiyat Kutusu ── */

.qs-detail-price-box {

  background: #fff5f5;

  border: 1.5px solid #fecdd3;

  border-radius: var(--qs-radius);

  padding: 14px 18px;

  margin-bottom: 16px;

}

.qs-detail-price {

  font-size: 30px;

  font-weight: 800;

  color: var(--qs-red);

  font-family: var(--qs-font);

  line-height: 1.1;

}

.qs-detail-installment-note {

  font-size: 12px;

  color: var(--qs-text-muted);

  margin-top: 4px;

}



/* ── Renk Swatch Kartı ── */

.qs-color-swatch-item {

  border-radius: 6px;

  padding: 3px;

  display: inline-flex;

  align-items: center;

  gap: 6px;

  transition: all 0.2s;

  text-decoration: none;

}

.qs-color-swatch-item:hover {

  box-shadow: 0 2px 8px rgba(0,0,0,.15);

  transform: translateY(-1px);

}

.qs-color-swatch-item.qs-swatch-current {

  border: 2px solid var(--qs-red, #7c3aed) !important;

  box-shadow: 0 0 0 2px rgba(124,58,237,.18);

}



/* ── Adet Seçici ── */

.qs-purchase-actions {

  display: flex;

  align-items: center;

  gap: 10px;

  margin-bottom: 10px;

  flex-wrap: wrap;

}

.qs-qty-picker {
  display: grid;
  grid-template-columns: 36px 44px 36px;
  border: 1.5px solid color-mix(in srgb, var(--qs-red, #7c3aed) 22%, #cbd5e1);
  border-radius: 8px;
  overflow: hidden;
  height: 38px;
  width: 116px;
  flex-shrink: 0;
  background: #ffffff;
}

.qs-qty-btn {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 4%, #f8fafc);
  border: none;
  width: 100%;
  height: 100%;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  color: var(--qs-red, #7c3aed);
  transition: all 0.15s ease-in-out;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.qs-qty-btn:hover {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 14%, #ffffff);
  color: var(--qs-red, #7c3aed);
}

.qs-qty-input {
  border: none;
  border-left: 1px solid color-mix(in srgb, var(--qs-red, #7c3aed) 15%, #e2e8f0);
  border-right: 1px solid color-mix(in srgb, var(--qs-red, #7c3aed) 15%, #e2e8f0);
  text-align: center;
  font-weight: 700;
  font-size: 13px;
  width: 100%;
  height: 100%;
  outline: none;
  font-family: var(--qs-font);
  color: var(--qs-text-main);
  background: #ffffff;
  padding: 0;
  margin: 0;
}

.qs-qty-input::-webkit-inner-spin-button { -webkit-appearance: none; }



/* ── Büyük Sepete Ekle Butonu ── */

.qs-btn-big-cart {

  flex: 1;

  min-width: 160px;

  height: 46px;

  background: linear-gradient(90deg, #7c3aed 0%, #5b21b6 100%);

  border: none;

  border-radius: var(--qs-radius-sm);

  color: #fff;

  font-size: 15px;

  font-weight: 800;

  font-family: var(--qs-font);

  letter-spacing: 0.3px;

  cursor: pointer;

  transition: opacity 0.15s;

  display: flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

}

.qs-btn-big-cart:hover { opacity: 0.92; color: #fff; }



/* Ürün detayındaki ücretsiz kargo eşiği ve hızlı satın alma */

.qs-free-shipping-progress {

  border: 1px solid #facc15;

  border-radius: 8px;

  padding: 11px 13px;

  background: #fffbeb;

  color: #854d0e;

  font-size: 13px;

}

.qs-free-shipping-progress:not(.has-cart-items) .qs-free-shipping-cart-only { display: none !important; }

.qs-free-shipping-line {

  display: flex;

  align-items: center;

  justify-content: space-between;

  gap: 12px;

}

.qs-free-shipping-threshold {

  display: inline-flex;

  align-items: center;

  gap: 7px;

  font-weight: 700;

}

.qs-free-shipping-threshold i { color: #d97706; }

.qs-free-shipping-percent {

  flex: 0 0 auto;

  min-width: 42px;

  padding: 2px 8px;

  border-radius: 20px;

  background: rgba(217, 119, 6, .12);

  color: #92400e;

  text-align: center;

  font-size: 12px;

  font-weight: 800;

}

.qs-free-shipping-message {

  margin-top: 5px;

  font-weight: 600;

}

.qs-free-shipping-track {

  height: 7px;

  margin-top: 9px;

  overflow: hidden;

  border-radius: 999px;

  background: rgba(217, 119, 6, .16);

}

.qs-free-shipping-fill {

  height: 100%;

  border-radius: inherit;

  background: #eab308;

  transition: width .25s ease;

}

.qs-free-shipping-progress.is-reached {

  border-color: #22c55e;

  background: #f0fdf4;

  color: #166534;

}

.qs-free-shipping-progress.is-reached .qs-free-shipping-threshold i { color: #16a34a; }

.qs-free-shipping-progress.is-reached .qs-free-shipping-percent {

  background: rgba(22, 163, 74, .12);

  color: #166534;

}

.qs-free-shipping-progress.is-reached .qs-free-shipping-track { background: rgba(22, 163, 74, .16); }

.qs-free-shipping-progress.is-reached .qs-free-shipping-fill { background: #22c55e; }

.qs-btn-buy-now {

  display: flex;

  width: 100%;

  min-height: 46px;

  margin-top: 2px;

  align-items: center;

  justify-content: center;

  border: 1px solid #eab308;

  border-radius: var(--qs-radius-sm);

  background: linear-gradient(90deg, #facc15, #fbbf24);

  color: #422006;

  font-family: var(--qs-font);

  font-size: 15px;

  font-weight: 800;

  letter-spacing: .2px;

  transition: background .15s ease, transform .15s ease;

}

.qs-btn-buy-now:hover,

.qs-btn-buy-now:focus {

  border-color: #ca8a04;

  background: #eab308;

  color: #422006;

}

.qs-btn-buy-now:disabled { cursor: wait; opacity: .65; }



/* ── Bundle Kutusu ── */

.qs-bundle-box {

  border: 2px dashed var(--qs-orange);

  border-radius: var(--qs-radius);

  padding: 18px;

  margin-bottom: 24px;

  background: #fff9f5;

}

.qs-bundle-title {

  font-size: 14px;

  font-weight: 800;

  color: var(--qs-orange-dark);

  margin-bottom: 14px;

}



/* ── Varyant Grubu (Beden / Renk) ── */

.qs-variant-group { margin-bottom: 16px; }

.qs-variant-label {

  font-size: 12px;

  font-weight: 700;

  color: var(--qs-text-muted);

  text-transform: uppercase;

  letter-spacing: 0.5px;

  margin-bottom: 8px;

}

.qs-variant-options {

  display: flex;

  flex-wrap: wrap;

  gap: 6px;

}

.qs-variant-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 7px 16px;
  border: 1.5px solid color-mix(in srgb, var(--qs-red, #7c3aed) 20%, #cbd5e1);
  border-radius: var(--qs-radius-sm);
  font-size: 13px;
  font-weight: 600;
  color: var(--qs-text-main);
  text-decoration: none;
  transition: all 0.15s ease-in-out;
  cursor: pointer;
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 3%, #ffffff);
  min-width: 46px;
  min-height: 44px;
  text-align: center;
}

.qs-variant-btn:hover {
  border-color: var(--qs-red, #7c3aed);
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 8%, #ffffff);
  color: var(--qs-red, #7c3aed);
}

.qs-variant-btn.active {
  border-color: var(--qs-red, #7c3aed);
  background-color: var(--qs-red, #7c3aed);
  color: #fff;
  font-weight: 700;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--qs-red, #7c3aed) 35%, transparent);
}



/* ── Ürün Detay Mobil ── */

@media (max-width: 575px) {

  /* .qs-gallery-main img { max-height: 320px; } - mobilde dikey formatin tam sigmasi icin kaldirildi */

  .qs-gallery-thumbs { gap: 4px; } .qs-gallery-thumb { width: 100%; height: auto; aspect-ratio: 2 / 3; }

  .qs-detail-price { font-size: 24px; }

  .qs-purchase-actions { flex-direction: column; align-items: stretch; }

  .qs-qty-picker { width: 100%; height: 48px; }

  .qs-qty-input { flex: 1; }

  .qs-btn-big-cart { width: 100%; min-width: unset; height: 48px; }

  .qs-btn-buy-now { min-height: 48px; }

  .qs-free-shipping-progress { padding: 10px 11px; font-size: 12.5px; }

  .qs-detail-price-box { padding: 12px 14px; }

  .qs-bundle-box { padding: 12px; }

  .qs-share-box { flex-direction: column; align-items: flex-start; gap: 8px !important; }

}

@media (max-width: 767px) {

  .qs-color-swatches-box .d-flex { gap: 6px !important; }

}



/* ── Sepet Ürün Satırı ── */

.qs-cart-item-row {

  display: flex;

  align-items: flex-start;

  gap: 14px;

  background: #fff;

  border: 1px solid var(--qs-border);

  border-radius: var(--qs-radius);

  padding: 14px;

  margin-bottom: 10px;

}

.qs-cart-item-img {

  width: 80px;

  height: 80px;

  object-fit: contain;

  border-radius: var(--qs-radius-sm);

  border: 1px solid var(--qs-border-light);

  flex-shrink: 0;

}

@media (max-width: 575px) {

  .qs-cart-item-row { flex-wrap: wrap; }

  .qs-cart-item-img { width: 60px; height: 60px; }

  .qs-checkout-summary-card { position: static; } /* mobilde sticky kaldır */

  .qs-pay-methods { grid-template-columns: repeat(3, 1fr); }

  .qs-cart-step-bar { padding: 10px; }

}



/* ── Ödeme Yöntemi Kartları (Sepet) ── */

.qs-pay-methods {

  display: grid;

  grid-template-columns: repeat(3, 1fr);

  gap: 6px;

  margin-bottom: 12px;

}

.qs-pay-method-card {

  border: 1.5px solid var(--qs-border);

  border-radius: var(--qs-radius-sm);

  padding: 8px 4px;

  text-align: center;

  cursor: pointer;

  font-size: 11.5px;

  font-weight: 700;

  transition: all 0.15s;

  color: var(--qs-text-main);

}

.qs-pay-method-card:hover {

  border-color: var(--qs-red);

  background: var(--qs-red-light);

  color: var(--qs-red);

}

.qs-pay-method-card.active {

  border-color: #16a34a;

  background: #f0fdf4;

  color: #15803d;

}





/* ═══════════════════════════════════════════════════════

   MOBİL GENEL İYİLEŞTİRMELER — Tüm Sayfalar

═══════════════════════════════════════════════════════ */



/* Anasayfa vitrin bölümleri mobil padding */

@media (max-width: 575px) {

  #common-home .container { padding-left: 12px; padding-right: 12px; }

  .flash-deal-wrapper { margin: 12px 0 !important; }

  .qs-daire-wrapper { margin-bottom: 16px !important; }

  /* Tab sekmeler mobilde scroll edilebilir */

  .nav-tabs { flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; scrollbar-width: none; }

  .nav-tabs::-webkit-scrollbar { display: none; }

  .nav-tabs .nav-link { padding: 6px 12px; font-size: 13px; }

}



/* Ürün kartı grid — anasayfada row-cols override */

@media (max-width: 575px) {

  .row-cols-sm-2 > * { flex: 0 0 50%; max-width: 50%; }

  .qs-product-card { border-radius: 6px; }

  .qs-card-body { padding: 8px; }

  .qs-card-title a { font-size: 12px; }

  .qs-price-current {

  font-size: 15px;

  font-weight: 800;

  color: #6d28d9 !important;

}

  .qs-btn-add-cart { height: 38px; font-size: 13px; }

}



/* Breadcrumb mobilde kısalt */

@media (max-width: 575px) {

  .breadcrumb { font-size: 12px; flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; }

  .breadcrumb-item + .breadcrumb-item::before { padding: 0 4px; }

}



/* Alert mobil */

@media (max-width: 575px) {

  #alert .alert { font-size: 13px; padding: 10px 12px; }

}



/* Tablo responsive */

@media (max-width: 767px) {

  .table-responsive table { font-size: 13px; }

}



/* Checkout adım kartları mobil */

@media (max-width: 575px) {

  #checkout-checkout .card { margin-bottom: 12px; }

  #checkout-checkout .card-header { padding: 10px 14px; }

  #checkout-checkout .sticky-top { position: static !important; }

  #checkout-checkout .col-lg-5 { order: -1; }

}



/* Footer mobil bottom nav için içerik padding */

@media (max-width: 768px) {

  main { padding-bottom: 60px; } /* bottom nav yüksekliği kadar */

}



/* Ürün detayında hızlı satın alma, fiyat bildirimi ve güven kutuları */

#button-buy-now.qs-btn-buy-now {

  position: relative;

  display: flex;

  box-sizing: border-box;

  width: 100%;

  min-height: 48px;

  margin: 0;

  align-items: center;

  justify-content: center;

  gap: 10px;

  border: 1px solid #d99a00;

  border-radius: 8px;

  background: linear-gradient(135deg, #ffdf62 0%, #ffc928 100%);

  box-shadow: 0 3px 8px rgba(180, 126, 0, .16);

  color: #3f2d00;

  font-size: 15px;

  font-weight: 800;

  letter-spacing: .15px;

  transition: background .15s ease, box-shadow .15s ease, transform .15s ease;

}

#button-buy-now.qs-btn-buy-now:hover,

#button-buy-now.qs-btn-buy-now:focus-visible {

  border-color: #bf8500;

  background: linear-gradient(135deg, #ffd83d 0%, #f7b900 100%);

  box-shadow: 0 4px 11px rgba(180, 126, 0, .23);

  color: #342500;

}

#button-buy-now.qs-btn-buy-now:active { transform: translateY(1px); }

#button-buy-now.qs-btn-buy-now:disabled { cursor: wait; opacity: .65; }

.qs-buy-now-arrow {

  position: absolute;

  right: 17px;

  font-size: 12px;

}

.qs-price-alert-wrap { margin-top: 9px; }

.qs-price-alert-button {

  display: flex;

  box-sizing: border-box;

  width: 100%;

  min-height: 42px;

  align-items: center;

  justify-content: center;

  gap: 9px;

  border: 1px solid #fecdd3;

  border-radius: 8px;

  background: #fff5f6;

  color: #a71936;

  font-size: 13px;

  font-weight: 700;

  transition: border-color .15s ease, background .15s ease, color .15s ease;

}

.qs-price-alert-button > i:first-child { color: #e11d48; }

.qs-price-alert-button:hover,

.qs-price-alert-button:focus-visible {

  border-color: #fb7185;

  background: #ffe4e8;

  color: #881337;

}

.qs-price-alert-arrow {

  margin-left: auto;

  color: #be123c;

  font-size: 11px;

}

.qs-product-promises {

  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  gap: 9px;

  margin: 16px 0 12px;

}

.qs-product-promise {

  --promise-color: #e11d48;

  --promise-bg: #fff1f2;

  --promise-border: #fecdd3;

  display: flex;

  min-width: 0;

  min-height: 82px;

  box-sizing: border-box;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  gap: 7px;

  padding: 9px 6px;

  border: 1px solid var(--promise-border);

  border-radius: 9px;

  background: var(--promise-bg);

  text-align: center;

}

.qs-product-promise--secure { --promise-color: #e11d48; --promise-bg: #fff5f6; --promise-border: #fecdd3; }

.qs-product-promise--shipping { --promise-color: #ea580c; --promise-bg: #fff7ed; --promise-border: #fed7aa; }

.qs-product-promise--return { --promise-color: #16a34a; --promise-bg: #f0fdf4; --promise-border: #bbf7d0; }

.qs-product-promise-icon {

  display: inline-flex;

  width: 32px;

  height: 32px;

  flex: 0 0 32px;

  align-items: center;

  justify-content: center;

  border: 1px solid var(--promise-border);

  border-radius: 50%;

  background: rgba(255, 255, 255, .72);

  color: var(--promise-color);

  font-size: 16px;

}

.qs-product-promise-label {

  color: #263244;

  font-size: 11.5px;

  font-weight: 700;

  line-height: 1.25;

}

@media (max-width: 575px) {

  #button-buy-now.qs-btn-buy-now { min-height: 48px; }

  .qs-buy-now-arrow { right: 14px; }

  .qs-product-promises { gap: 6px; margin-top: 13px; }

  .qs-product-promise { min-height: 76px; padding: 8px 4px; gap: 6px; }

  .qs-product-promise-label { font-size: 10.5px; }

}





/* ================= Universal Product Card Expanding Badges & Showcase Styles ================= */

.qs-pcard-badges, .fd-badges-left, .qs-card-badges {

  position: absolute !important;

  top: 8px !important;

  left: 8px !important;

  z-index: 30 !important;

  display: flex !important;

  flex-direction: column !important;

  align-items: flex-start !important;

  gap: 4px !important;

  pointer-events: auto !important;

  line-height: 1 !important;

}



.qs-pcard-badge {

  display: inline-flex !important;

  align-items: center !important;

  justify-content: flex-start !important;

  gap: 0 !important;

  box-sizing: border-box !important;

  width: 26px !important;

  min-width: 26px !important;

  max-width: 26px !important;

  height: 24px !important;

  overflow: hidden !important;

  color: #ffffff !important;

  border-radius: 4px !important;

  padding: 0 6px !important;

  font-size: 10px !important;

  font-weight: 700 !important;

  line-height: 24px !important;

  white-space: nowrap !important;

  cursor: pointer !important;

  box-shadow: 0 2px 6px rgba(0,0,0,0.22) !important;

  transition: max-width 0.28s cubic-bezier(0.16, 1, 0.3, 1), width 0.28s cubic-bezier(0.16, 1, 0.3, 1), gap 0.2s ease !important;

}



.qs-pcard-badge > i {

  flex: 0 0 14px !important;

  width: 14px !important;

  text-align: center !important;

  font-size: 11px !important;

  line-height: 24px !important;

}



.qs-pcard-badge-label {

  display: inline-block !important;

  max-width: 0 !important;

  overflow: hidden !important;

  opacity: 0 !important;

  font-size: 10.5px !important;

  font-weight: 700 !important;

  letter-spacing: 0.2px !important;

  line-height: 24px !important;

  transition: max-width 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease !important;

  pointer-events: none !important;

}



.qs-pcard-badge:hover,

.qs-pcard-badge:focus-within {

  width: max-content !important;

  min-width: 26px !important;

  max-width: 190px !important;

  gap: 5px !important;

  padding-right: 8px !important;

}



.qs-pcard-badge:hover .qs-pcard-badge-label,

.qs-pcard-badge:focus-within .qs-pcard-badge-label {

  max-width: 160px !important;

  opacity: 1 !important;

}



/* Badge Renkleri */

.qs-pcard-stock      { background: #16a34a !important; }

.qs-pcard-shipping   { background: #0284c7 !important; }

.qs-pcard-discount   { background: #7c3aed !important; }

.qs-pcard-campaign   { background: #9333ea !important; }

.qs-pcard-lowstock   { background: #ea580c !important; animation: qsLowStockPulse 2s infinite ease-in-out !important; }

.qs-pcard-stock-out  { background: #64748b !important; }

.qs-pcard-bestseller { background: #d946ef !important; }



@keyframes qsLowStockPulse {

  0%, 100% { opacity: 1; transform: scale(1); }

  50% { opacity: 0.88; transform: scale(1.04); }

}



/* Mor - Lila - Mürdüm Vitrin Buton & Fiyat Standartları */

.qs-btn-add-cart,

.qs-vb-btn-cart,

.fd-btn-cart,

.qs-card-cart-button,

.qs-card-btn:not(.qs-card-btn--ghost) {

  background: linear-gradient(135deg, var(--qs-red, #7c3aed) 0%, var(--qs-red-dark, #6d28d9) 100%) !important;

  color: #ffffff !important;

  border: none !important;

  box-shadow: 0 2px 8px rgba(109, 40, 217, 0.28) !important;

  transition: all 0.2s ease !important;

}



.qs-btn-add-cart:hover,

.qs-vb-btn-cart:hover,

.fd-btn-cart:hover,

.qs-card-cart-button:hover,

.qs-card-btn:not(.qs-card-btn--ghost):hover {

  background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%) !important;

  box-shadow: 0 4px 14px rgba(124, 58, 237, 0.42) !important;

  color: #ffffff !important;

  transform: translateY(-1px);

}



.qs-price-current,

.qs-vb-price-new,

.fd-price-new,

.qs-card-price-new {

  color: #6d28d9 !important;

  font-weight: 800 !important;

}



.qs-price-old,

.qs-vb-price-old,

.fd-price-old,

.qs-card-price-old {

  color: #94a3b8 !important;

  text-decoration: line-through !important;

}



.qs-badge-discount,

.qs-pcard-discount,

.fd-discount-badge {

  background: #7c3aed !important;

  color: #ffffff !important;

}



.qs-trust-icon {

  background: #f5f3ff !important;

  color: #7c3aed !important;

}



/* ══════════════════════════════════════════════════════════════════════
   KOMPAKT SABİT BAŞLIK (%30-35 KÜÇÜLTME & AKICI YUMUŞAK ANİMASYON)
   ══════════════════════════════════════════════════════════════════════ */
header.qs-header {
  transition: padding 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease !important;
}
.qs-header-logo-img,
#qs-search-input,
#qs-search-form .btn,
.qs-cart-pill,
.qs-user-link,
.qs-account-avatar,
.qs-header-grid {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

header.qs-header.is-sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  z-index: 1050 !important;
  padding: 5px 0 4px 0 !important;
  box-shadow: 0 8px 26px rgba(24, 3, 46, 0.5) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  animation: qsHeaderSlideDown 0.32s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

header.qs-header.is-sticky .qs-header-grid { padding: 0 !important; gap: 8px 14px !important; }
header.qs-header.is-sticky .qs-header-logo-img { max-height: 32px !important; }
header.qs-header.is-sticky .qs-header-logo-text { font-size: 17px !important; }
header.qs-header.is-sticky #qs-search-input { height: 32px !important; font-size: 12.5px !important; }
header.qs-header.is-sticky #qs-search-form .btn { height: 32px !important; padding: 0 14px !important; font-size: 13px !important; }
header.qs-header.is-sticky .qs-cart-pill { height: 32px !important; padding: 4px 12px !important; font-size: 12px !important; gap: 5px !important; }
header.qs-header.is-sticky .qs-user-link { padding: 3px 6px !important; font-size: 11px !important; gap: 4px !important; }
header.qs-header.is-sticky .qs-user-link i { font-size: 14px !important; }
header.qs-header.is-sticky .qs-account-avatar { width: 26px !important; height: 26px !important; font-size: 11px !important; }
header.qs-header.is-sticky .qs-account-icon { font-size: 20px !important; }
header.qs-header.is-sticky .qs-account-name { font-size: 11.5px !important; }
header.qs-header.is-sticky .qs-account-sub { font-size: 9.5px !important; }
header.qs-header.is-sticky .qs-trend-tags { display: none !important; }


/* ==========================================================================
   Modern Geniş Ekran Konteyner Standardı (1480px / 1520px)
   Tüm ön yüz sayfalarını ferah ve modern pazar yeri genişliğine taşır
   ========================================================================== */
@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1480px !important;
  }
}

@media (min-width: 1600px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1520px !important;
  }
}

/* ==========================================================================
   Ürün Özellikleri Tablosu (4 Sütun Soft Tasarım & Tema Uyumu)
   ========================================================================== */
.qs-product-specs-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 18px 22px;
  margin-bottom: 24px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
}

.qs-specs-header {
  border-bottom: 1px dashed #e2e8f0;
  padding-bottom: 12px;
}

.qs-specs-icon {
  color: var(--qs-red, #7c3aed);
  font-size: 16px;
}

.qs-specs-title {
  font-size: 15px;
  font-weight: 700;
  color: #1e293b;
  letter-spacing: -0.2px;
}

.qs-specs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

@media (max-width: 1200px) {
  .qs-specs-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 991px) {
  .qs-specs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .qs-specs-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
}

.qs-spec-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 4%, #f8fafc);
  border: 1px solid color-mix(in srgb, var(--qs-red, #7c3aed) 12%, #e2e8f0);
  border-radius: 8px;
  min-height: 44px;
  transition: all 0.2s ease-in-out;
}

.qs-spec-item:hover {
  background: #ffffff;
  border-color: var(--qs-red, #7c3aed);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.qs-spec-label {
  color: #64748b;
  font-size: 12.5px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 0 0 auto;
  max-width: 48%;
}

.qs-spec-value {
  color: #0f172a;
  font-size: 13px;
  font-weight: 700;
  text-align: right;
  word-break: break-word;
  flex: 1 1 auto;
}

/* Karanlık Mod Desteği */
html[data-bs-theme='dark'] .qs-product-specs-box,
body.dark-mode .qs-product-specs-box {
  background: #1e2922 !important;
  border-color: #2e3e34 !important;
}

html[data-bs-theme='dark'] .qs-specs-header,
body.dark-mode .qs-specs-header {
  border-bottom-color: #2e3e34 !important;
}

html[data-bs-theme='dark'] .qs-specs-title,
body.dark-mode .qs-specs-title {
  color: #f8fafc !important;
}

html[data-bs-theme='dark'] .qs-spec-item,
body.dark-mode .qs-spec-item {
  background: #16201a !important;
  border-color: #2e3e34 !important;
}

html[data-bs-theme='dark'] .qs-spec-item:hover,
body.dark-mode .qs-spec-item:hover {
  background: #1e2922 !important;
  border-color: var(--qs-red, #7c3aed) !important;
}

html[data-bs-theme='dark'] .qs-spec-label,
body.dark-mode .qs-spec-label {
  color: #94a3b8 !important;
}

html[data-bs-theme='dark'] .qs-spec-value,
body.dark-mode .qs-spec-value {
  color: #f8fafc !important;
}

html[data-bs-theme='dark'] .qs-variant-btn,
body.dark-mode .qs-variant-btn {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 8%, #1e2922) !important;
  border-color: color-mix(in srgb, var(--qs-red, #7c3aed) 25%, #2e3e34) !important;
  color: #f8fafc !important;
}

html[data-bs-theme='dark'] .qs-variant-btn:hover,
body.dark-mode .qs-variant-btn:hover {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 16%, #1e2922) !important;
  border-color: var(--qs-red, #7c3aed) !important;
  color: #ffffff !important;
}

html[data-bs-theme='dark'] .qs-variant-btn.active,
body.dark-mode .qs-variant-btn.active {
  background: var(--qs-red, #7c3aed) !important;
  border-color: var(--qs-red, #7c3aed) !important;
  color: #ffffff !important;
}

html[data-bs-theme='dark'] .qs-qty-picker,
body.dark-mode .qs-qty-picker {
  background: #16201a !important;
  border-color: color-mix(in srgb, var(--qs-red, #7c3aed) 25%, #2e3e34) !important;
}

html[data-bs-theme='dark'] .qs-qty-btn,
body.dark-mode .qs-qty-btn {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 8%, #1e2922) !important;
  color: var(--qs-red, #7c3aed) !important;
}

html[data-bs-theme='dark'] .qs-qty-input,
body.dark-mode .qs-qty-input {
  background: #16201a !important;
  border-left-color: #2e3e34 !important;
  border-right-color: #2e3e34 !important;
  color: #f8fafc !important;
}

/* ==========================================================================
   Ürün Detay Sekme Başlıkları & Ürün Açıklaması Kartı (Tema Font & İkon Uyumu)
   ========================================================================== */
.qs-product-tabs {
  border-bottom: 1.5px solid #e2e8f0 !important;
  gap: 6px;
  margin-bottom: 20px !important;
}

.qs-product-tabs .nav-link {
  font-family: var(--qs-font-heading, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -0.2px !important;
  color: #475569 !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2.5px solid transparent !important;
  padding: 12px 18px !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.2s ease !important;
}

.qs-product-tabs .nav-link:hover {
  color: #0f172a !important;
  background: #f8fafc !important;
  border-radius: 10px 10px 0 0 !important;
}

.qs-product-tabs .nav-link.active {
  color: #0f172a !important;
  border-bottom: 2.5px solid var(--qs-red, #7c3aed) !important;
  background: transparent !important;
}

.qs-tab-icon {
  color: var(--qs-red, #7c3aed) !important;
  font-size: 15px !important;
}

.qs-product-desc-box {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  padding: 20px 24px;
  margin-bottom: 24px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02);
}

.qs-product-desc-content {
  font-size: 14px;
  line-height: 1.75;
  color: #334155;
}

.qs-product-desc-content h1,
.qs-product-desc-content h2,
.qs-product-desc-content h3,
.qs-product-desc-content h4 {
  font-family: var(--qs-font-heading, 'Plus Jakarta Sans', sans-serif);
  font-weight: 700;
  color: #0f172a;
  margin-top: 12px;
  margin-bottom: 10px;
}

html[data-bs-theme='dark'] .qs-product-tabs,
body.dark-mode .qs-product-tabs {
  border-bottom-color: #2e3e34 !important;
}

html[data-bs-theme='dark'] .qs-product-tabs .nav-link,
body.dark-mode .qs-product-tabs .nav-link {
  color: #94a3b8 !important;
}

html[data-bs-theme='dark'] .qs-product-tabs .nav-link.active,
body.dark-mode .qs-product-tabs .nav-link.active {
  color: #f8fafc !important;
}

html[data-bs-theme='dark'] .qs-product-desc-box,
body.dark-mode .qs-product-desc-box {
  background: #1e2922 !important;
  border-color: #2e3e34 !important;
}

html[data-bs-theme='dark'] .qs-product-desc-content,
body.dark-mode .qs-product-desc-content,
html[data-bs-theme='dark'] .qs-product-desc-content h1,
html[data-bs-theme='dark'] .qs-product-desc-content h2,
html[data-bs-theme='dark'] .qs-product-desc-content h3,
html[data-bs-theme='dark'] .qs-product-desc-content h4 {
  color: #e2e8f0 !important;
}


/* ═══════════════════════════════════════════════════════════════════
   MODERN FLOATING GLASS COOKIE CONSENT BANNER (YÜZEN CAM ÇEREZ KUTUSU)
   ═══════════════════════════════════════════════════════════════════ */
#cookie.qs-cookie-banner {
  position: fixed !important;
  bottom: 24px !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: auto !important;
  z-index: 99999 !important;
  pointer-events: none !important;
  padding: 0 16px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  transition: opacity 0.35s cubic-bezier(0.16, 1, 0.3, 1), transform 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

#cookie.qs-cookie-banner.qs-cookie-closing {
  opacity: 0 !important;
  transform: translateY(20px) scale(0.97) !important;
}

.qs-cookie-container {
  pointer-events: auto !important;
  width: 100% !important;
  max-width: 960px !important;
  background: rgba(15, 23, 42, 0.88) !important;
  backdrop-filter: blur(14px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 35px -6px rgba(0, 0, 0, 0.5), 0 0 25px -4px var(--qs-red, rgba(124, 58, 237, 0.35)) !important;
  padding: 14px 20px !important;
  animation: qsCookieBannerPop 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards !important;
}

@keyframes qsCookieBannerPop {
  0% {
    opacity: 0;
    transform: translateY(30px) scale(0.96);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

.qs-cookie-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}

.qs-cookie-content {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  flex: 1 1 520px !important;
}

.qs-cookie-icon-wrap {
  width: 42px !important;
  height: 42px !important;
  min-width: 42px !important;
  min-height: 42px !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--qs-red, #7c3aed) !important;
  font-size: 20px !important;
  box-shadow: 0 0 12px var(--qs-red, rgba(124, 58, 237, 0.25)) !important;
}

.qs-cookie-text {
  font-family: var(--qs-font, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 13.5px !important;
  line-height: 1.5 !important;
  color: #f1f5f9 !important;
}

.qs-cookie-text a,
.qs-cookie-text .alert-link,
.qs-cookie-text .modal-link {
  color: var(--qs-red, #a78bfa) !important;
  font-weight: 700 !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  transition: all 0.2s ease !important;
}

.qs-cookie-text a:hover,
.qs-cookie-text .modal-link:hover {
  filter: brightness(1.25) !important;
  text-shadow: 0 0 8px var(--qs-red, rgba(124, 58, 237, 0.5)) !important;
}

.qs-cookie-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}

.qs-cookie-btn {
  font-family: var(--qs-font, 'Plus Jakarta Sans', sans-serif) !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  min-height: 44px !important;
  padding: 0 18px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
  white-space: nowrap !important;
}

/* Ana Onay Butonu (Tema Renkli & Işımalı) */
.qs-cookie-btn-agree {
  background: var(--qs-red, linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%)) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px var(--qs-red, rgba(124, 58, 237, 0.4)) !important;
}

.qs-cookie-btn-agree:hover {
  transform: translateY(-1px) scale(1.02) !important;
  filter: brightness(1.1) !important;
  box-shadow: 0 6px 20px var(--qs-red, rgba(124, 58, 237, 0.6)) !important;
}

/* Reddet / İkincil Buton (Yarı Saydam & Çerçeveli) */
.qs-cookie-btn-disagree {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #cbd5e1 !important;
}

.qs-cookie-btn-disagree:hover {
  background: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
  transform: translateY(-1px) !important;
}

/* Mobil Cihazlar İçin Ergonomi */
@media (max-width: 767px) {
  #cookie.qs-cookie-banner {
    bottom: calc(75px + env(safe-area-inset-bottom, 10px)) !important;
    padding: 0 10px !important;
  }
  .qs-cookie-container {
    padding: 12px 14px !important;
    border-radius: 14px !important;
  }
  .qs-cookie-content {
    flex: 1 1 100% !important;
    gap: 10px !important;
  }
  .qs-cookie-icon-wrap {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    font-size: 17px !important;
  }
  .qs-cookie-text {
    font-size: 12.5px !important;
  }
  .qs-cookie-actions {
    width: 100% !important;
    display: flex !important;
    gap: 8px !important;
  }
  .qs-cookie-btn {
    flex: 1 1 50% !important;
    padding: 0 10px !important;
    font-size: 12.5px !important;
  }
}

/* ==========================================================================
   Fiyatı Düşünce Haber Ver Modal & Hedef Butonları (Tema Senkronizasyonu)
   ========================================================================== */
.qs-target-btn {
  border: 1px solid color-mix(in srgb, var(--qs-red, #7c3aed) 28%, #cbd5e1) !important;
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 4%, #ffffff) !important;
  color: var(--qs-red, #7c3aed) !important;
  font-weight: 600 !important;
  transition: all 0.2s ease-in-out !important;
  border-radius: 6px !important;
}

.qs-target-btn:hover {
  background: var(--qs-red, #7c3aed) !important;
  border-color: var(--qs-red, #7c3aed) !important;
  color: #ffffff !important;
}

#modal-price-alert .form-check-input:checked {
  background-color: var(--qs-red, #7c3aed) !important;
  border-color: var(--qs-red, #7c3aed) !important;
}

#modal-price-alert .form-check-input:focus {
  border-color: var(--qs-red, #7c3aed) !important;
  box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--qs-red, #7c3aed) 25%, transparent) !important;
}

#modal-price-alert .form-control:focus {
  border-color: var(--qs-red, #7c3aed) !important;
  box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--qs-red, #7c3aed) 20%, transparent) !important;
}

html[data-bs-theme='dark'] .qs-target-btn,
body.dark-mode .qs-target-btn {
  background: color-mix(in srgb, var(--qs-red, #7c3aed) 12%, #1e2922) !important;
  border-color: color-mix(in srgb, var(--qs-red, #7c3aed) 30%, #2e3e34) !important;
  color: #f8fafc !important;
}

html[data-bs-theme='dark'] .qs-target-btn:hover,
body.dark-mode .qs-target-btn:hover {
  background: var(--qs-red, #7c3aed) !important;
  border-color: var(--qs-red, #7c3aed) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   QS Cart Toast - Garantili Beyaz Kart & Tema Moru Bildirim (FTP Uyumlu)
   ========================================================================== */
#alert .alert.qs-cart-toast,
#alert .alert.alert-success.qs-cart-toast,
#alert .qs-cart-toast,
.qs-cart-toast {
  position: relative !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 16px !important;
  background-color: #ffffff !important;
  background-image: none !important;
  border: 1px solid rgba(var(--theme-primary-rgb, 124, 58, 237), 0.22) !important;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.14), 0 3px 10px rgba(0, 0, 0, 0.05), 0 0 0 3px rgba(var(--theme-primary-rgb, 124, 58, 237), 0.08) !important;
  width: 380px !important;
  max-width: calc(100vw - 24px) !important;
  color: #0f172a !important;
  pointer-events: auto !important;
}
.qs-cart-toast-heading {
  min-height: 44px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 10px 44px 10px 16px !important;
  border-bottom: 1px solid rgba(var(--theme-primary-rgb, 124, 58, 237), 0.12) !important;
  color: var(--theme-primary, #7c3aed) !important;
  background: linear-gradient(135deg, rgba(var(--theme-primary-rgb, 124, 58, 237), 0.09) 0%, rgba(var(--theme-primary-rgb, 124, 58, 237), 0.02) 100%) !important;
  font-size: 0.92rem !important;
  position: relative !important;
}
.qs-cart-toast-icon {
  color: var(--theme-primary, #7c3aed) !important;
  font-size: 1.2rem !important;
  flex-shrink: 0 !important;
}
.qs-cart-toast-title {
  font-weight: 700 !important;
  color: var(--theme-primary, #7c3aed) !important;
  letter-spacing: -0.01em !important;
}
.qs-cart-toast-price {
  color: var(--theme-primary, #7c3aed) !important;
  font-size: 0.98rem !important;
  font-weight: 800 !important;
}
.qs-cart-toast-go {
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  padding: 0 16px !important;
  font-size: 0.86rem !important;
  font-weight: 700 !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  color: #ffffff !important;
  background: linear-gradient(135deg, var(--theme-primary, #7c3aed) 0%, var(--theme-primary-dark, #581c87) 100%) !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(var(--theme-primary-rgb, 124, 58, 237), 0.35) !important;
}
.qs-cart-toast-progress {
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 5px !important;
  background: rgba(var(--theme-primary-rgb, 124, 58, 237), 0.16) !important;
  overflow: hidden !important;
  border-bottom-left-radius: 16px !important;
  border-bottom-right-radius: 16px !important;
  z-index: 20 !important;
}
.qs-cart-toast-progress-bar {
  display: block !important;
  height: 100% !important;
  width: 100% !important;
  background: linear-gradient(90deg, var(--theme-primary, #7c3aed) 0%, var(--qs-orange, #9333ea) 100%) !important;
  transform-origin: left center !important;
}