* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html { scroll-behavior: smooth; }
body {
  font-display: swap;
  background-color: var(--body-theme);
}

.responsiveContainer {
  width: 100%;
  max-width: 1534px;
}

@media screen and (max-width:1024px) {
  .responsiveContainer {
    max-width: 98%;
  }
}

.mainContainer {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

:root {
  --body-theme: #f9f9ff;
  /* Header navigation için kullanımlar */
  --header-hover-border-gradient: linear-gradient( 105.9deg,rgb(221 198 148) 20%,rgb(255 71 31 / 88%) 60%,rgb(255 184 23) 100%);
  --header-mask-gradient: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  --header-border-color: rgb(255 184 23);
  --header-hover-mask-gradient: linear-gradient(105.9deg,rgb(255 245 238) 22.4%,rgb(255 211 175 / 88%) 165.5%);
  --header-text:#864f1a;
  --header-hover-text:#985718;
  
  /* Anasayfa, Popüler kartlar için arkaplan gradient renk kullanımları */
  --popular-card-bg-surface: rgb(245 245 245);
  --popular-card-bg-depth: rgb(23 21 21);

  /*Anasayfa, İndirimli ürün kartların gradient renk kullanımları */
  --discount-card-border-gradient: linear-gradient(181deg,rgb(255 189 98) 24.4%,rgb(255 96 55 / 88%) 80.5%);
  --discount-card-content-bg: rgb(255 255 255 / 88%);
  --discount-title-accent-gradient-left: linear-gradient(270deg,rgb(218 218 218 / 31%) 27%,#ffe5c8 100%);
  --discount-title-accent-gradient-right: linear-gradient(-270deg,rgb(218 218 218 / 31%) 27%,#ffe5c8 100%);
  --discount-title-text: #967070;

  /* Anasayfa, teknolojik ürünler kartlarının renk kullanımları içindir */
  --tech-card-surface-gradient: linear-gradient(1deg,rgb(246 246 251) 24.4%,rgba(254, 239, 239, 0.88) 80.5%);
  --image-accent-panel-gradient: linear-gradient(136deg,#5435ff,#5b7eff);
  --image-accent-panel-gradient-reverse: linear-gradient(-136deg,#5435ff,#5b7eff);

  /* Anasayfa, partnerler kısmındaki gradient renk kullanımları */
  --partners-section-background-gradient: linear-gradient(to right,rgba(255, 255, 255, 0) 0%,rgb(239 239 239) 23%,rgb(240 240 240) 77%,rgba(255, 255, 255, 0) 96%);
  --partners-slider-edge-mask: linear-gradient(90deg,transparent,white 20%,white 80%,transparent);

  --divider-accent-gradient: linear-gradient(180deg,#d6dde800,#ff8b11 38%,#ff8300 45%,#d6dde800);
  --divider-accent-gradient-two: linear-gradient(90deg, #d6dde800, #85858580 38%, #85858580 45%, #d6dde800);
  
  --title-primary-color: #454545;
  --title-secondary-color: #52506b;

  --cs-price-color: #008327;
  --cs-color-1:#864f1a;
  --cs-color-2:#985718;
  --cs-color-3:#6B718B; /* "07.01.2026" tarihinde güncellendi */
  --cs-color-4: #fff;
  --cs-color-5:#9b9292;
  --cs-color-6:#ff8d15;
  --cs-color-7: #494949ed;
  --cs-color-8:#A4685D; /* "07.01.2026" tarihinde güncellendi */
  --cs-color-9: #6c6a6a;

  --cs-border-color-1: #dddd;
  --cs-border-color-2:#B9BDD0; /* "07.01.2026" tarihinde güncellendi */
  --cs-border-color-3: #ff8d15;

  --cs-container-bg:#fff;
  --cs-footer-bg: #f3f3f5;
  --cs-sticky-footer-bg: #f3f3f5;

  --cs-box-color-1: #fff;
  /* "07.01.2026" tarihinde eklendi */
  --cs-box-color-2: rgba(233, 233, 233, 58%); 
  --cs-box-color-3: #F6F6FB;
  --cs-box-color-4: #FAFAFA;

  /*İndirim "%" gösterimi için kullanılır */
  --cs-discount-badge-bg: #c20304;
  --cs-discount-badge-text: #fff;

  /*Yansıma efekti*/
  --cs-bg-shine-gradient:linear-gradient(120deg,rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0.5) 50%,rgba(255, 255, 255, 0) 100% );

  /* İndirimli Ürün fiyat etiketi */
  --cs-discount-price-badge:linear-gradient(105.9deg, rgb(255 23 23) 29.4%, rgb(255 255 255 / 88%) 165.5%);
  --cs-discount-price-text: #fff;

  --cs-countdown-box-gradient: linear-gradient(105.9deg, #ff8d14 24.4%, #cd6a01 80.5%);
  --cs-countdown-box-text:#fff;

  /* Button ve button içersindeki text Kullanımları */
  --cs-primary-button-1:linear-gradient(145deg, #ff8a3d, #ff5f0d);
  --content-button-1-triangle: rgba(255, 255, 255, 0.5);
  --cs-primary-button-1-text: #fff;

  /*Swipper için */
  --disabled-button: linear-gradient(145deg, #e4e4e4, #cccbda);
  --disabled-text:#9b9292;

  --cs-shadow-1:rgba(0, 0, 0, 0.5);
  --cs-shadow-2:rgba(0, 0, 0, 0.2);

  /* --- Yeni eklenenler ("07.01.2026") --- */

  /* ("Accordion Button") kullanımı  */
  --cs-action-soft-button:#e7e7e7;
  --cs-action-soft-button-color:#606087;

  /* ("Filtrele, Filtre temizle) buttonu */
  --cs-filter-button:rgba(88, 78, 113);
  --cs-filter-button-hover: rgba(88, 78, 113, .8);
  --cs-filter-button-color: #fff;

  /* ("İlan Ekle, Sepet) buttonu */
  --cs-button-4: #13BF41;
  --cs-button-4-color: #FFFFFF;

  /* (silme/kaldırma) button kullanımı */
  --cs-danger-button: #FF1717;
  --cs-danger-color: #ffff;

  /* (sohbet, kullanıcı profili) button kullanımı */
  --cs-button-5: #4F5384;
  --cs-button-5-color: #ffff;

  /* (pasif) button  */
  --cs-passive-button:#B9BDD0;
  --cs-passive-button-color:#fff;
  
  /* (2. Aktif/Pasif) border button */
  --cs-active-outline-button: #FFF4EE;
  --cs-active-outline-button-border: #FF471F;
  --cs-active-outline-button-color: #F88002;
  --cs-passive-outline-button:#fff;
  --cs-passive-outline-button-border:#B9BDD0;
  --cs-passive-outline-button-color:#646393;

  /* (input checkbox: Toggle button / choices select icon ) */
  --toggle-thumb-disabled:linear-gradient(145deg, #B9BDD0, #B9BDD0);
  --toggle-track-disabled:#ffff;
  --toggle-thumb-enabled: linear-gradient(145deg, #ff8a3d, #ff5f0d);
  --toggle-track-enabled:#ffff;

  /* input ( text/checbox/radio/select/Toggle(label text) ) button */
  --input-disabled-border:#B9BDD0;
  --input-disabled-bg:#ffff;
  --input-disabled-color:#646393;
  --input-enabled-border:#fbb085;
  --input-enabled-bg:#fdf4ef;
  --input-enabled-color:#9a5414;

  /* --- Yeni eklenenler ("08.01.2026") --- */
  --ui-track-accent: #FF8D15;
  --ui-track-bg: #B9BDD0;
}