@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root{
  --mavi: #000000;
  --beyaz: #ffffff;
  --mavi: #12153E;
  --mavi_hover: #202461;
  --gri_100: #F5F5F5;
  --gri_200: #EFEFEF;
  --gri_300: #E9E9E9;
  --gri_500: #D5D5D5;
  --gri_700: #ADADAD;
  --gri_800: #818181;
  --yesil: #2AB673;
  --yesil_hover: #39CC85;
  --kirmizi: #CE4646;
  --duyuru_bg: #ffffff;
  --duyuru_text: #12153E;
  --header: 100px;
}

@media(max-width:1280px){
  :root{
    --header: 80px;
  }
}
html {
  scroll-behavior: smooth;
}

*, ::before, ::after{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

::backdrop{
  --tw-border-spacing-x: 0;
  --tw-border-spacing-y: 0;
  --tw-translate-x: 0;
  --tw-translate-y: 0;
  --tw-rotate: 0;
  --tw-skew-x: 0;
  --tw-skew-y: 0;
  --tw-scale-x: 1;
  --tw-scale-y: 1;
  --tw-pan-x:  ;
  --tw-pan-y:  ;
  --tw-pinch-zoom:  ;
  --tw-scroll-snap-strictness: proximity;
  --tw-gradient-from-position:  ;
  --tw-gradient-via-position:  ;
  --tw-gradient-to-position:  ;
  --tw-ordinal:  ;
  --tw-slashed-zero:  ;
  --tw-numeric-figure:  ;
  --tw-numeric-spacing:  ;
  --tw-numeric-fraction:  ;
  --tw-ring-inset:  ;
  --tw-ring-offset-width: 0px;
  --tw-ring-offset-color: #fff;
  --tw-ring-color: rgb(59 130 246 / 0.5);
  --tw-ring-offset-shadow: 0 0 #0000;
  --tw-ring-shadow: 0 0 #0000;
  --tw-shadow: 0 0 #0000;
  --tw-shadow-colored: 0 0 #0000;
  --tw-blur:  ;
  --tw-brightness:  ;
  --tw-contrast:  ;
  --tw-grayscale:  ;
  --tw-hue-rotate:  ;
  --tw-invert:  ;
  --tw-saturate:  ;
  --tw-sepia:  ;
  --tw-drop-shadow:  ;
  --tw-backdrop-blur:  ;
  --tw-backdrop-brightness:  ;
  --tw-backdrop-contrast:  ;
  --tw-backdrop-grayscale:  ;
  --tw-backdrop-hue-rotate:  ;
  --tw-backdrop-invert:  ;
  --tw-backdrop-opacity:  ;
  --tw-backdrop-saturate:  ;
  --tw-backdrop-sepia:  ;
  --tw-contain-size:  ;
  --tw-contain-layout:  ;
  --tw-contain-paint:  ;
  --tw-contain-style:  ;
}

/*
! tailwindcss v3.4.14 | MIT License | https://tailwindcss.com
*/

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box;
  /* 1 */
  border-width: 0;
  /* 2 */
  border-style: solid;
  /* 2 */
  border-color: #e5e7eb;
  /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -moz-tab-size: 4;
  /* 3 */
  -o-tab-size: 4;
     tab-size: 4;
  /* 3 */
  font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  font-feature-settings: normal;
  /* 5 */
  font-variation-settings: normal;
  /* 6 */
  -webkit-tap-highlight-color: transparent;
  /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0;
  /* 1 */
  line-height: inherit;
  /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0;
  /* 1 */
  color: inherit;
  /* 2 */
  border-top-width: 1px;
  /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  /* 1 */
  font-feature-settings: normal;
  /* 2 */
  font-variation-settings: normal;
  /* 3 */
  font-size: 1em;
  /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0;
  /* 1 */
  border-color: inherit;
  /* 2 */
  border-collapse: collapse;
  /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  /* 1 */
  font-feature-settings: inherit;
  /* 1 */
  font-variation-settings: inherit;
  /* 1 */
  font-size: 100%;
  /* 1 */
  font-weight: inherit;
  /* 1 */
  line-height: inherit;
  /* 1 */
  letter-spacing: inherit;
  /* 1 */
  color: inherit;
  /* 1 */
  margin: 0;
  /* 2 */
  padding: 0;
  /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button;
  /* 1 */
  background-color: transparent;
  /* 2 */
  background-image: none;
  /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1;
  /* 1 */
  color: #9ca3af;
  /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
  /* 1 */
  vertical-align: middle;
  /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

*, ::after, ::before{
  box-sizing: border-box;
  outline: 2px solid transparent;
  outline-offset: 2px;
}

img{
  display: block;
}

html,body{
  height: 100%;
}

body{
  font-family: "Inter", sans-serif;
}

svg{
  display: block;
  height: 1em;
  width: 1em;
}
a{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}

.container{
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  padding-right: 1rem;
  padding-left: 1rem;
}

@media (min-width: 640px){
  .container{
    max-width: 640px;
  }
}

@media (min-width: 768px){
  .container{
    max-width: 768px;
  }
}

@media (min-width: 1024px){
  .container{
    max-width: 1024px;
  }
}

@media (min-width: 1280px){
  .container{
    max-width: 1280px;
  }
}

@media (min-width: 1400px){
  .container{
    max-width: 1400px;
  }
}

.video-circle{
  background: rgb(0,0,0);
  background: radial-gradient(circle at 65% 46%, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
  position: absolute;
  inset: 0px;
  z-index: 10;
  height: 100%;
  width: 100%;
  opacity: 0.7
}

@media(max-width:640px){
  .no-scroll {
    scrollbar-width: none;
  }

  .no-scroll::-webkit-scrollbar {
    display: none;
  }
}

/* DUYURU BAŞLADI */

.duyuru{
  background-color: var(--duyuru_bg);
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--duyuru_text);
}

.duyuru a{
  display: flex;
  height: 2.5rem;
  width: 100%;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
}

/* DUYURU BİTTİ */

/* HEADER BAŞLADI */

.header{
  position: relative;
  z-index: 999;
  display: flex;
  height: var(--header);
  width: 100%;
  align-items: center;
  gap: 1rem;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-color: var(--gri_300);
  background-color: var(--beyaz);
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 640px){
  .header{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

@media (min-width: 1280px){
  .header{
    gap: 2rem;
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

.header .logo a{
  font-size: 3rem;
  line-height: 1;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .header .logo a{
    font-size: 64px;
  }
}

.header .mac{
  display: flex;
  height: 2.75rem;
  width: 2.75rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
}

@media (min-width: 1024px){
  .header .mac{
    display: none;
  }
}

.header .mac em{
  height: 0.125rem;
  width: 1.5rem;
  border-radius: 9999px;
  background-color: var(--mavi);
}

.header .header-menu{
  height: 100%;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

@media not all and (min-width: 1024px){
  .header .header-menu{
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 30;
    width: 100%;
    max-width: 20rem;
    --tw-translate-x: -600px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    overflow: auto;
    background-color: var(--beyaz);
    padding: 1.25rem;
  }
}

@media (min-width: 1024px){
  .header .header-menu{
    flex: 1 1 0%;
  }
}

.header .header-menu > ul{
  display: flex;
  gap: 0.25rem;
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul{
    flex-direction: column;
  }
}

@media (min-width: 1024px){
  .header .header-menu > ul{
    height: 100%;
    align-items: center;
  }
}

.header .header-menu > ul > li{
  display: flex;
  height: 100%;
  align-items: center;
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul > li{
    flex-wrap: wrap;
  }
}

.header .header-menu > ul > li > a{
  position: relative;
  display: flex;
  height: 100%;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--mavi);
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul > li > a{
    flex: 1 1 0%;
  }
}

@media (min-width: 1024px){
  .header .header-menu > ul > li > a{
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}

@media (min-width: 1280px){
  .header .header-menu > ul > li > a{
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
}

.header .header-menu > ul > li > a::after{
  display: none;
  height: 1rem;
  width: 1rem;
  background-image: url('../images/aok-dark.svg');
  background-position: center;
  background-repeat: no-repeat;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: "";
  content: var(--tw-content);
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul > li > a::after{
    margin-left: auto;
  }
}

.header .header-menu > ul > li > a::before{
  position: absolute;
  left: 0.5rem;
  bottom: 1rem;
  height: 0.25rem;
  width: 0px;
  border-radius: 9999px;
  background-color: var(--mavi);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: "";
  content: var(--tw-content);
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul > li > a::before{
    display: none;
  }
}

@media (min-width: 1280px){
  .header .header-menu > ul > li > a::before{
    left: 0.75rem;
    bottom: 1.5rem;
  }
}

.header .header-menu > ul > li:has(.header-altmenu) a::after{
  display: flex;
}

.header .header-menu > ul > li .header-altmenu{
  left: 0px;
  display: none;
  width: 100%;
  align-items: flex-start;
  gap: 1.25rem;
  border-color: var(--gri_300);
  background-color: var(--beyaz);
  padding-bottom: 1rem;
}

@media not all and (min-width: 1024px){
  .header .header-menu > ul > li .header-altmenu{
    flex-direction: column;
  }
}

@media (min-width: 1024px){
  .header .header-menu > ul > li .header-altmenu{
    position: absolute;
    top: calc(var(--header) - 2px);
    width: 100vw;
    border-top-width: 1px;
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    --tw-shadow: 0 32px 32px 0 rgba(0, 0, 0, 0.25);
    --tw-shadow-colored: 0 32px 32px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

@media (min-width: 1280px){
  .header .header-menu > ul > li .header-altmenu{
    gap: 2.5rem;
    padding-left: 2.5rem;
    padding-right: 2.5rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
  }
}

.header .header-menu > ul > li .header-altmenu ul{
  display: grid;
  flex: 1 1 0%;
}

@media (min-width: 1024px){
  .header .header-menu > ul > li .header-altmenu ul{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.header .header-menu > ul > li .header-altmenu ul li a{
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--mavi);
}

.header .header-menu > ul > li .header-altmenu ul li a:hover{
  text-decoration-line: underline;
}

@media (min-width: 1280px){
  .header .header-menu > ul > li .header-altmenu ul li a{
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.header .header-menu > ul > li .header-altmenu ul li a::after{
  pointer-events: none;
  position: relative;
  left: -0.5rem;
  height: 1rem;
  width: 1rem;
  --tw-rotate: 0deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  background-image: url('../images/yok-dark.svg');
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: "";
  content: var(--tw-content);
}

.header .header-menu > ul > li .header-altmenu ul li a:hover::after{
  left: 0px;
  opacity: 1;
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: flex-start;
  gap: 0.75rem;
}
@media(max-width:1024px){
  .header .header-menu > ul > li .header-altmenu .header-altmenu-banners{
    width: 100%;
  }
}

@media (min-width: 1024px){
  .header .header-menu > ul > li .header-altmenu .header-altmenu-banners{
    grid-template-columns: 10rem 10rem;
  }
}

@media (min-width: 1280px){
  .header .header-menu > ul > li .header-altmenu .header-altmenu-banners{
    grid-template-columns: 13.375rem 13.375rem;
  }
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  width: 100%;
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner .hb-resim{
  position: relative;
  width: 100%;
  padding-bottom: 125%;
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner .hb-resim::after{
  position: absolute;
  inset: 0px;
  background-color: rgb(0 0 0 / 0.1);
  opacity: 0;
  content: var(--tw-content);
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner .hb-resim img{
  position: absolute;
  inset: 0px;
  border-radius: 0.5rem;
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner a{
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--mavi);
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner a::after{
  position: absolute;
  content: var(--tw-content);
  inset: 0px;
}

@media (min-width: 1280px){
  .header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner a{
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.header .header-menu > ul > li .header-altmenu .header-altmenu-banners .ham-banner:hover .hb-resim::after{
  content: var(--tw-content);
  opacity: 1;
}

@media (min-width: 1024px){
  .header .header-menu > ul > li:hover > a::before{
    width: 1.75rem;
  }

  .header .header-menu > ul > li:hover .header-altmenu{
    display: flex;
  }

  .header .header-menu > ul > li:hover a::after{
    --tw-rotate: 180deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.header .header-menu > ul > li.active .header-altmenu{
  display: flex;
}

.header .header-menu > ul > li.active a::after{
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@media not all and (min-width: 1024px){
  .header .header-menu.active{
    --tw-translate-x: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  }
}

.header .mgolge{
  position: fixed;
  inset: 0px;
  z-index: 20;
  display: none;
  height: 100%;
  width: 100%;
  background-color: rgb(0 0 0 / 0.6);
}

.header .arama{
  display: none;
  align-items: center;
  border-radius: 9999px;
  border-width: 1px;
  border-color: var(--gri_500);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

@media (min-width: 1280px){
  .header .arama{
    display: flex;
  }
}

.header .arama .atext{
  height: 2.25rem;
  width: 5rem;
  border-width: 0px;
  background-color: transparent;
  padding-left: 0.75rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--mavi);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.header .arama .atext::-moz-placeholder{
  color: var(--gri_800);
}

.header .arama .atext::placeholder{
  color: var(--gri_800);
}

.header .arama .atext:focus{
  width: 12rem;
}

.header .arama .atext:focus::-moz-placeholder{
  color: transparent;
}

.header .arama .atext:focus::placeholder{
  color: transparent;
}

@media (min-width: 1280px){
  .header .arama .atext{
    height: 2.75rem;
    width: 6rem;
    padding-left: 1rem;
    padding-right: 1rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.header .arama .abuton{
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .header .arama .abuton{
    padding-left: 1rem;
    padding-right: 1rem;
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.header .arama:has(.atext:focus){
  border-color: var(--gri_800);
}

.header .profil-menu{
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

@media not all and (min-width: 1024px){
  .header .profil-menu{
    margin-left: auto;
  }
}

.header .profil-menu a{
  position: relative;
  display: flex;
  height: 2.75rem;
  width: 2.75rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--mavi);
}

.header .profil-menu a:hover{
  background-color: rgb(18 21 62 / 0.05);
}

.header .profil-menu a span{
  pointer-events: none;
  position: absolute;
  right: 0.125rem;
  top: 0.125rem;
  display: flex;
  height: 1.25rem;
  width: 1.25rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: var(--kirmizi);
  text-align: center;
  font-size: 0.6875rem;
  font-weight: 700;
  color: var(--beyaz);
}

.header .profil-menu a.aac{
  display: flex;
}

@media (min-width: 1280px){
  .header .profil-menu a.aac{
    display: none;
  }
}

.home .header{
  border-width: 0px;
  background-color: transparent;
  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
  --tw-gradient-from: rgb(0 0 0 / 0.6) var(--tw-gradient-from-position);
  --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
  --tw-gradient-to: transparent var(--tw-gradient-to-position);
}

@media (min-width: 1024px){
  .home .header .header-menu > ul > li > a{
    color: var(--beyaz);
  }

  .home .header .header-menu > ul > li > a::after{
    content: var(--tw-content);
    background-image: url('../images/aok-light.svg');
  }
}

.home .header .header-menu > ul > li > a::before{
  background-color: var(--beyaz);
}

.home .logo a{
  color: var(--beyaz);
}
.home .header .mac em{
  background-color: var(--beyaz);
}

.home .arama{
  border-color: rgb(255 255 255 / 0.4);
}

.home .arama .atext{
  color: var(--beyaz);
}

.home .arama .atext::-moz-placeholder{
  color: var(--beyaz);
}

.home .arama .atext::placeholder{
  color: var(--beyaz);
}

.home .arama .abuton{
  color: var(--beyaz);
}

.home .arama:has(.atext:focus){
  border-color: var(--beyaz);
}

.home .profil-menu a{
  color: var(--beyaz);
}

.home .profil-menu a:hover{
  background-color: rgb(255 255 255 / 0.05);
}

/* HEADER BİTTİ */

/* POPUP-ARAMA BAŞLADI */

.popup-arama{
  position: fixed;
  inset: 0px;
  z-index: 9999;
  display: none;
  height: 100%;
  width: 100%;
  background-color: rgb(0 0 0 / 0.5);
  padding: 1rem;
}

@media (min-width: 640px){
  .popup-arama{
    padding: 2.5rem;
  }
}

.popup-arama .p-arama{
  display: flex;
  width: 100%;
  align-items: center;
  border-radius: 9999px;
  background-color: var(--beyaz);
}

.popup-arama .p-arama .atext{
  height: 3rem;
  flex: 1 1 0%;
  border-width: 0px;
  background-color: transparent;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--mavi);
}

@media (min-width: 640px){
  .popup-arama .p-arama .atext{
    height: 3.5rem;
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

.popup-arama .p-arama .abuton{
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  color: var(--mavi);
}

@media (min-width: 640px){
  .popup-arama .p-arama .abuton{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

/* POPUP-ARAMA BİTTİ */

/* GİRİŞ BAŞLADI */

.giris{
  position: relative;
  z-index: 0;
  margin-top: calc(var(--header) * -1);
  height: calc(100dvh - 40px);
  width: 100%;
  overflow: hidden;
  background-color: var(--mavi);
}

.giris .resimbg{
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.giris video{
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.giris .giris-icerik{
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 20;
  height: 100%;
  width: 100%;
}

.giris .giris-icerik .container{
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: flex-end;
}

@media not all and (min-width: 640px){
  .giris .giris-icerik .container{
    align-items: center;
    padding-bottom: 5rem;
  }
}

@media (min-width: 640px){
  .giris .giris-icerik .container{
    justify-content: center;
    padding-left: 5rem;
  }
}

@media (min-width: 1280px){
  .giris .giris-icerik .container{
    padding-left: 8rem;
  }
}

.giris .giris-icerik .container .gi-ic{
  display: flex;
  width: 100%;
  max-width: 13rem;
  flex-direction: column;
  align-items: center;
  gap: 1.75rem;
}

@media (min-width: 1280px){
  .giris .giris-icerik .container .gi-ic{
    gap: 2.5rem;
  }
}

.giris .giris-icerik .container .gi-ic .title{
  text-align: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 200;
  line-height: 1.5;
  letter-spacing: 0.099rem;
  color: var(--beyaz);
}

@media (min-width: 1280px){
  .giris .giris-icerik .container .gi-ic .title{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.giris .giris-icerik .container .gi-ic a{
  border-width: 1px;
  border-color: var(--beyaz);
  background-color: rgb(0 0 0 / 0.1);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--beyaz);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.giris .giris-icerik .container .gi-ic a:hover{
  background-color: var(--beyaz);
  color: var(--mavi);
}

@media (min-width: 1280px){
  .giris .giris-icerik .container .gi-ic a{
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 1.75rem;
    padding-right: 1.75rem;
    font-size: 0.8125rem;
  }
}

.giris .giris-ok{
  pointer-events: none;
  position: absolute;
  left: calc(50% - 12px);
  bottom: 1rem;
  z-index: 20;
  --tw-translate-x: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@keyframes bounce{
  0%, 100%{
    transform: translateY(-25%);
    animation-timing-function: cubic-bezier(0.8,0,1,1);
  }

  50%{
    transform: none;
    animation-timing-function: cubic-bezier(0,0,0.2,1);
  }
}

.giris .giris-ok{
  animation: bounce 1s infinite;
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--beyaz);
}

@media (min-width: 768px){
  .giris .giris-ok{
    bottom: 2rem;
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

/* GİRİŞ BİTTİ */

/* KATEGORİLER BAŞLADI */

.kategoriler{
  width: 100%;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

@media (min-width: 640px){
  .kategoriler{
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
}

@media (min-width: 1280px){
  .kategoriler{
    padding-top: 5rem;
    padding-bottom: 5rem;
  }
}

.kategoriler .kategori-icerik{
  display: flex;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: flex-start;
  gap: 0.75rem;
}

@media not all and (min-width: 640px){
  .kategoriler .kategori-icerik{
    margin-left: -1rem;
    margin-right: -1rem;
    width: calc(100% + 2rem);
    overflow: auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (min-width: 640px){
  .kategoriler .kategori-icerik{
    display: grid;
  }
}

@media (min-width: 768px){
  .kategoriler .kategori-icerik{
    display: flex;
  }
}

@media (min-width: 1280px){
  .kategoriler .kategori-icerik{
    gap: 1.25rem;
  }
}

.kategoriler .kategori-icerik .kategori{
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  background-color: var(--beyaz);
  padding-top: 0.5rem;
  padding-bottom: 0.75rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

@media not all and (min-width: 640px){
  .kategoriler .kategori-icerik .kategori{
    width: 40%;
    flex-shrink: 0;
  }
}

@media (min-width: 640px){
  .kategoriler .kategori-icerik .kategori{
    flex: 1 1 0%;
    border-radius: 9999px;
  }

  .kategoriler .kategori-icerik .kategori:hover{
    --tw-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.07);
    --tw-shadow-colored: 0 30px 30px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
  }
}

@media (min-width: 1280px){
  .kategoriler .kategori-icerik .kategori{
    gap: 0.5rem;
    padding-top: 1rem;
    padding-bottom: 1.25rem;
  }
}

.kategoriler .kategori-icerik .kategori .resim{
  display: flex;
  aspect-ratio: 1 / 1;
  width: 100%;
  max-width: 13rem;
  align-items: center;
  justify-content: center;
}

.kategoriler .kategori-icerik .kategori .resim img{
  max-height: 70%;
  max-width: 70%;
  -o-object-fit: fill;
     object-fit: fill;
}

@media (min-width: 1280px){
  .kategoriler .kategori-icerik .kategori .resim img{
    max-height: 100%;
    max-width: 100%;
  }
}

.kategoriler .kategori-icerik .kategori .title{
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--mavi);
  text-transform: uppercase;
}

@media (min-width: 1280px){
  .kategoriler .kategori-icerik .kategori .title{
    font-size: 0.875rem;
    line-height: 1.25rem;
  }
}

.kategoriler .kategori-icerik .kategori .title a::after{
  position: absolute;
  inset: 0px;
  --tw-content: "";
  content: var(--tw-content);
}

.kategoriler .kategori-icerik .kategori svg{
  pointer-events: none;
  margin-top: 0.5rem;
  font-size: 1.125rem;
  line-height: 1.75rem;
  color: var(--mavi);
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

@media (min-width: 1280px){
  .kategoriler .kategori-icerik .kategori svg{
    margin-top: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

.kategoriler .kategori-icerik .kategori:hover svg{
  opacity: 1;
}

/* KATEGORİLER BİTTİ */

/* POPÜLER BAŞLADI */

.populer-urunler{
  overflow: hidden;
  padding-top: 1.25rem;
  padding-bottom: 4rem;
}

@media (min-width: 1280px){
  .populer-urunler{
    padding-top: 2rem;
    padding-bottom: 6rem;
  }
}

.populer-urunler .populer-slider{
  width: 100%;
  overflow: visible;
}
.slider-alani{
  position: relative;
  width: 100%;
}

.populer-urunler .psi, .populer-urunler .psg{
  position: absolute;
  right: 0px;
  top: 33%;
  z-index: 10;
  display: none;
  height: 2.25rem;
  width: 2.25rem;
  --tw-translate-y: -50%;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: var(--mavi);
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--beyaz);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.populer-urunler .psi:hover, .populer-urunler .psg:hover{
  background-color: var(--mavi_hover);
}

@media (min-width: 640px){
  .populer-urunler .psi, .populer-urunler .psg{
    right: -1rem;
    top: 37%;
    display: flex;
  }
}

@media (min-width: 1280px){
  .populer-urunler .psi, .populer-urunler .psg{
    right: -1.25rem;
    top: 40%;
    height: 2.75rem;
    width: 2.75rem;
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

.populer-urunler .psi.swiper-button-disabled,.populer-urunler .psg.swiper-button-disabled{
  display: none;
}

.populer-urunler .psg{
  left: -1rem;
  right: auto;
  --tw-rotate: 180deg;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@media (min-width: 1280px){
  .populer-urunler .psg{
    left: -1.25rem;
  }
}

.populer-urunler .swiper-pagination{
  position: relative;
  bottom: 0px;
  top: 0px;
  margin-top: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

@media (min-width: 640px){
  .populer-urunler .swiper-pagination{
    margin-top: 3.5rem;
  }
}

.populer-urunler .swiper-pagination .swiper-pagination-bullet{
  margin: 0px;
  height: 0.25rem;
  width: 0.875rem;
  border-radius: 9999px;
  background-color: var(--gri_300);
  opacity: 1;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.populer-urunler .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active{
  width: 1.75rem;
  background-color: var(--mavi);
}

/* POPÜLER BİTTİ */

/* ÜSTBAŞLIK BAŞLADI */

.ust-baslik{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding-bottom: 2.5rem;
  text-align: center;
}

@media (min-width: 1280px){
  .ust-baslik{
    padding-bottom: 3.5rem;
  }
}

.ust-baslik::before{
  height: 1.75rem;
  width: 0.125rem;
  border-radius: 9999px;
  background-color: var(--mavi);
  --tw-content: "";
  content: var(--tw-content);
}

@media (min-width: 1280px){
  .ust-baslik::before{
    height: 2.5rem;
  }
}

.ust-baslik .title{
  margin-top: 0.5rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .ust-baslik .title{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.ust-baslik p{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .ust-baslik p{
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

/* ÜSTBAŞLIK BİTTİ */

/* ÜRÜN BAŞLADI */

.urun{
  position: relative;
  width: 100%;
}

.urun .resim{
  position: relative;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  padding-bottom: 120.6%;
}

.urun .resim img{
  position: absolute;
  inset: 0px;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.urun .resim::after{
  position: absolute;
  inset: 0px;
  background-color: rgb(0 0 0 / 0.05);
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: "";
  content: var(--tw-content);
}

.indirim{
  pointer-events: none;
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.125rem;
  background-color: var(--kirmizi);
  padding-top: 0.375rem;
  padding-bottom: 0.375rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  text-align: center;
  text-transform: uppercase;
  color: var(--beyaz);
}

@media (min-width: 1280px){
  .indirim{
    top: 1rem;
    left: 1rem;
    gap: 0.25rem;
  }
}

.indirim b{
  font-size: 0.875rem;
  line-height: 1rem;
  font-weight: 700;
  line-height: 1;
}

@media (min-width: 1280px){
  .indirim b{
    font-size: 1rem;
    line-height: 1rem;
  }
}

.indirim em{
  font-size: 0.6rem;
  font-weight: 700;
  font-style: normal;
  line-height: 1;
}

@media (min-width: 1280px){
  .indirim em{
    font-size: 0.6875rem;
  }
}

.urun .favori{
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 10;
  cursor: pointer;
  padding: 0.625rem;
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .urun .favori{
    padding: 1rem;
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

.urun .title{
  margin-top: 0.5rem;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .urun .title{
    margin-top: 1rem;
  }
}

.urun .title a::after{
  position: absolute;
  inset: 0px;
  --tw-content: "";
  content: var(--tw-content);
}

.urun .fiyat{
  margin-top: 0.5rem;
  display: flex;
  gap: 0.75rem;
  font-size: 0.8125rem;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .urun .fiyat{
    margin-top: 0.75rem;
  }
}

.urun .fiyat b{
  font-weight: 700;
}

.urun:hover .resim::after{
  opacity: 1;
}

/* ÜRÜN BİTTİ */

/* KOLEKSİYONLAR BAŞLADI */

.koleksiyonlar{
  display: grid;
  width: 100%;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 640px){
  .koleksiyonlar{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.koleksiyonlar .koleksiyon{
  position: relative;
  width: 100%;
}

.koleksiyonlar .koleksiyon .resim{
  position: relative;
  width: 100%;
  padding-bottom: 111%;
}

.koleksiyonlar .koleksiyon .resim img{
  position: absolute;
  inset: 0px;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.koleksiyonlar .koleksiyon .icerik{
  position: absolute;
  inset: 0px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  text-align: center;
}

.koleksiyonlar .koleksiyon .icerik::before{
  height: 1.75rem;
  width: 0.125rem;
  border-radius: 9999px;
  background-color: var(--beyaz);
  --tw-content: '';
  content: var(--tw-content);
}

@media (min-width: 1280px){
  .koleksiyonlar .koleksiyon .icerik::before{
    height: 2.5rem;
  }
}

.koleksiyonlar .koleksiyon .icerik .title{
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.5;
  color: var(--beyaz);
}

@media (min-width: 1024px){
  .koleksiyonlar .koleksiyon .icerik .title{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

@media (min-width: 1280px){
  .koleksiyonlar .koleksiyon .icerik .title{
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

.koleksiyonlar .koleksiyon .icerik a{
  margin-top: 0.75rem;
  background-color: var(--beyaz);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--mavi);
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

@media (min-width: 640px){
  .koleksiyonlar .koleksiyon .icerik a:hover{
    padding-left: 2.5rem;
    padding-right: 2.5rem;
  }
}

@media (min-width: 1280px){
  .koleksiyonlar .koleksiyon .icerik a{
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 0.8125rem;
  }
}

.koleksiyonlar .koleksiyon .icerik a::after{
  position: absolute;
  inset: 0px;
  --tw-content: '';
  content: var(--tw-content);
}

/* KOLEKSİYONLAR BİTTİ */

/* İKİLİ-ÜRÜN BAŞLADI */

.ikili-urun{
  display: flex;
  width: 100%;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2.5rem;
  padding-top: 2.5rem;
  padding-bottom: 4rem;
}

@media not all and (min-width: 1024px){
  .ikili-urun{
    flex-direction: column;
  }
}

@media (min-width: 1024px){
  .ikili-urun{
    padding-top: 5rem;
    padding-bottom: 6rem;
  }
}

@media (min-width: 1280px){
  .ikili-urun{
    padding-left: 3rem;
    padding-right: 3rem;
    padding-top: 6rem;
    padding-bottom: 7rem;
  }
}

.ikili-urun .isol{
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
  padding-top: 1.25rem;
  text-align: center;
}

@media not all and (min-width: 1024px){
  .ikili-urun .isol{
    width: 100%;
  }
}

@media (min-width: 1024px){
  .ikili-urun .isol{
    padding-top: 2rem;
  }
}

@media (min-width: 1280px){
  .ikili-urun .isol{
    max-width: 30rem;
  }
}

.ikili-urun .isol::before{
  height: 1.75rem;
  width: 0.125rem;
  border-radius: 9999px;
  background-color: var(--mavi);
  --tw-content: '';
  content: var(--tw-content);
}

@media (min-width: 1280px){
  .ikili-urun .isol::before{
    height: 2.5rem;
  }
}

.ikili-urun .isol .title{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 500;
  line-height: 1.3;
  color: var(--mavi);
}

@media (min-width: 640px){
  .ikili-urun .isol .title{
    font-size: 1.875rem;
    line-height: 2.25rem;
  }
}

@media (min-width: 1280px){
  .ikili-urun .isol .title{
    font-size: 2.25rem;
    line-height: 2.5rem;
  }
}

.ikili-urun .isol p{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--mavi);
}

@media (min-width: 1280px){
  .ikili-urun .isol p{
    font-size: 1rem;
    line-height: 1.5rem;
  }
}

.ikili-urun .isag{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

@media not all and (min-width: 1024px){
  .ikili-urun .isag{
    width: 100%;
  }
}

@media (min-width: 640px){
  .ikili-urun .isag{
    gap: 1rem;
  }
}

@media (min-width: 1024px){
  .ikili-urun .isag{
    grid-template-columns: 16rem 16rem;
  }
}

@media (min-width: 1280px){
  .ikili-urun .isag{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
  }
}

/* İKİLİ-ÜRÜN BİTTİ */

/* BANNERLAR BAŞLADI */

.bannerlar{
  display: grid;
  width: 100%;
  gap: 0.5rem;
}

@media (min-width: 640px){
  .bannerlar{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }
}

@media (min-width: 1280px){
  .bannerlar{
    gap: 1.25rem;
  }
}

.bannerlar a{
  width: 100%;
}

.bannerlar a img{
  height: auto;
  width: 100%;
}

/* BANNERLAR BİTTİ */

/* ÜRÜN-SLİDER BAŞLADI */

.urunler{
  width: 100%;
  overflow: hidden;
  padding-top: 4rem;
}

@media (min-width: 640px){
  .urunler{
    padding-top: 5rem;
  }
}

@media (min-width: 1280px){
  .urunler{
    padding-top: 6rem;
  }
}

.urunler .ust-title{
  padding-bottom: 1rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--mavi);
}

@media not all and (min-width: 640px){
  .urunler .ust-title{
    max-width: 70%;
  }
}

@media (min-width: 640px){
  .urunler .ust-title{
    padding-bottom: 1.75rem;
    font-size: 1.25rem;
    line-height: 1.75rem;
    line-height: 1.4;
  }
}

@media (min-width: 1280px){
  .urunler .ust-title{
    padding-bottom: 2.5rem;
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.urunler .urun-slider{
  position: relative;
  overflow: visible;
}

.urunler .urun-slider .butons{
  position: absolute;
  right: 0px;
  bottom: calc(100% + 1.5rem);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

@media (min-width: 1280px){
  .urunler .urun-slider .butons{
    bottom: calc(100% + 2.5rem);
    gap: 1rem;
  }
}

.urunler .urun-slider .butons .usg,
        .urunler .urun-slider .butons .usi{
  display: flex;
  height: 2rem;
  width: 2rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  border-width: 1px;
  border-color: var(--mavi);
  font-size: 1.25rem;
  line-height: 1.75rem;
  color: var(--mavi);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.urunler .urun-slider .butons .usg:hover,
        .urunler .urun-slider .butons .usi:hover{
  border-color: var(--mavi_hover);
  color: var(--mavi_hover);
}

@media (min-width: 1280px){
  .urunler .urun-slider .butons .usg,
        .urunler .urun-slider .butons .usi{
    height: 2.5rem;
    width: 2.5rem;
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.urunler .urun-slider .butons .usg.swiper-button-disabled,.urunler .urun-slider .butons .usi.swiper-button-disabled{
  pointer-events: none;
  border-color: var(--gri_700);
  color: var(--gri_700);
}

/* ÜRÜN-SLİDER BİTTİ */

/* BLOG BAŞLADI */

.bloglarim{
  padding-top: 5rem;
  padding-bottom: 4rem;
}

@media (min-width: 1024px){
  .bloglarim{
    padding-top: 7rem;
    padding-bottom: 5rem;
  }
}

@media (min-width: 1280px){
  .bloglarim{
    padding-top: 8rem;
    padding-bottom: 6rem;
  }
}

.bloglarim .blog-tumu{
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 1280px){
  .bloglarim .blog-tumu{
    margin-top: 2.5rem;
  }
}

.bloglarim .blog-tumu a{
  border-width: 1px;
  border-color: var(--gri_700);
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1rem;
  padding-right: 1rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--mavi);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.bloglarim .blog-tumu a:hover{
  border-color: var(--mavi);
  background-color: var(--mavi);
  color: var(--beyaz);
}

@media (min-width: 1280px){
  .bloglarim .blog-tumu a{
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    font-size: 0.8125rem;
  }
}

.blog-list{
  display: flex;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  -moz-column-gap: 0.5rem;
       column-gap: 0.5rem;
  row-gap: 1.5rem;
}

@media not all and (min-width: 640px){
  .blog-list{
    margin-left: -1rem;
    margin-right: -1rem;
    overflow: auto;
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

@media (min-width: 640px){
  .blog-list{
    display: grid;
  }
}

@media (min-width: 1024px){
  .blog-list{
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
  }
}

@media (min-width: 1280px){
  .blog-list{
    -moz-column-gap: 1.25rem;
         column-gap: 1.25rem;
    row-gap: 2.5rem;
  }
}

.blog-list .blog{
  position: relative;
  z-index: 0;
  width: 80%;
}
.kat-blog-list .blog{
  position: relative;
  z-index: 0;
  width: 100%;
}

@media not all and (min-width: 640px){
  .blog-list .blog{
    flex-shrink: 0;
  }
}

@media (min-width: 640px){
  .blog-list .blog{
    width: 100%;
  }
}

.kat-blog-list .blog .resim,
.blog-list .blog .resim{
  position: relative;
  z-index: -1;
  width: 100%;
  padding-bottom: 62.5%;
}

.kat-blog-list .blog .resim::after,
.blog-list .blog .resim::after{
  position: absolute;
  inset: 0px;
  height: 100%;
  width: 100%;
  background-color: rgb(0 0 0 / 0.05);
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  --tw-content: '';
  content: var(--tw-content);
}

.kat-blog-list .blog .resim img,
.blog-list .blog .resim img{
  position: absolute;
  inset: 0px;
  height: 100%;
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.kat-blog-list .blog .icerik,
.blog-list .blog .icerik{
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  margin-top: -1rem;
  background-color: var(--beyaz);
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

@media (min-width: 1024px){
  .kat-blog-list .blog .icerik,
  .blog-list .blog .icerik{
    margin-left: 1rem;
    margin-right: 1rem;
  }
}

@media (min-width: 1280px){
  .kat-blog-list .blog .icerik,
  .blog-list .blog .icerik{
    margin-left: 1.25rem;
    margin-right: 1.25rem;
    margin-top: -1.5rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
}

.kat-blog-list .blog .icerik .title,
.blog-list .blog .icerik .title{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--mavi);
}

@media (min-width: 1024px){
  .kat-blog-list .blog .icerik .title,
  .blog-list .blog .icerik .title{
    font-size: 1.25rem;
    line-height: 1.75rem;
  }
}

@media (min-width: 1280px){
  .kat-blog-list .blog .icerik .title,
  .blog-list .blog .icerik .title{
    font-size: 1.5rem;
    line-height: 2rem;
  }
}

.kat-blog-list .blog .icerik .title a::after,
.blog-list .blog .icerik .title a::after{
  position: absolute;
  inset: 0px;
  height: 100%;
  width: 100%;
  --tw-content: '';
  content: var(--tw-content);
}

.kat-blog-list .blog .icerik .blog-alt,
.blog-list .blog .icerik .blog-alt{
  margin-top: 0.375rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.625rem;
  line-height: 1rem;
  font-weight: 600;
  line-height: 1;
  color: var(--gri_700);
  text-transform: uppercase;
}

@media (min-width: 1280px){
  .kat-blog-list .blog .icerik .blog-alt,
  .blog-list .blog .icerik .blog-alt{
    margin-top: 0.625rem;
    font-size: 0.75rem;
    line-height: 1.25rem;
  }
}
.urun-slider .product{
  flex-shrink: 0;
}
.kat-blog-list .blog .icerik .blog-alt em,
.blog-list .blog .icerik .blog-alt em{
  font-style: normal;
}

.kat-blog-list .blog:hover .resim::after,
.blog-list .blog:hover .resim::after{
  opacity: 1;
}

/* BLOG BİTTİ */

/* MADDELER BAŞLADI */

.maddeler{
  width: 100%;
  background-color: var(--gri_100);
  padding-top: 1.75rem;
  padding-bottom: 2.5rem;
}

.maddeler .container{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (min-width: 640px){
  .maddeler .container{
    gap: 1.25rem;
  }
}

@media (min-width: 1024px){
  .maddeler .container{
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.maddeler .container .madde{
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  text-align: center;
}

@media (min-width: 640px){
  .maddeler .container .madde{
    padding: 1.25rem;
  }
}

.maddeler .container .madde svg{
  font-size: 44px;
  color: var(--mavi);
}

.maddeler .container .madde span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--mavi);
}

.maddeler .container .madde p{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  line-height: 1.5;
  color: var(--mavi);
}

/* MADDELER BİTTİ */

/* FOOTER BAŞLADI */

.footer{
  width: 100%;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

@media (min-width: 1024px){
  .footer{
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}

.footer .container{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  row-gap: 2.5rem;
}

@media not all and (min-width: 1024px){
  .footer .container{
    flex-wrap: wrap;
  }
}

@media not all and (min-width: 640px){
  .footer .container{
    flex-direction: column;
  }
}

@media (min-width: 1024px){
  .footer .container{
    gap: 1.5rem;
  }
}

@media (min-width: 1280px){
  .footer .container{
    gap: 2.5rem;
  }
}

.footer .container .bilgi{
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 640px){
  .footer .container .bilgi{
    gap: 1.75rem;
  }
}

@media (min-width: 1024px){
  .footer .container .bilgi{
    max-width: 20rem;
  }
}

@media (min-width: 1280px){
  .footer .container .bilgi{
    max-width: 28rem;
    gap: 2.25rem;
  }
}

.footer .container .bilgi .b-ust{
  display: flex;
  width: 100%;
  align-items: center;
  gap: 1.75rem;
}

@media not all and (min-width: 1024px){
  .footer .container .bilgi .b-ust{
    justify-content: center;
  }
}

@media (min-width: 640px){
  .footer .container .bilgi .b-ust{
    gap: 2.75rem;
  }
}

.footer .container .bilgi .b-ust .b-logo{
  font-size: 3rem;
  line-height: 1;
  color: var(--mavi);
}

.footer .container .bilgi .b-ust .b-sosyal{
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.footer .container .bilgi .b-ust .b-sosyal a{
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--mavi);
}

.footer .container .bilgi .b-ust .b-sosyal a:hover{
  color: var(--mavi_hover);
}

.footer .container .bilgi .b-not{
  width: 100%;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  line-height: 1.6;
  color: var(--gri_800);
}

@media not all and (min-width: 640px){
  .footer .container .bilgi .b-not{
    text-align: center;
  }
}

.footer .container .fmenu{
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

@media not all and (min-width: 640px){
  .footer .container .fmenu{
    width: 100%;
  }
}

@media (min-width: 640px){
  .footer .container .fmenu{
    gap: 1.5rem;
  }
}

.footer .container .fmenu .title{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--mavi);
}

.footer .container .fmenu ul{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
}

@media not all and (min-width: 640px){
  .footer .container .fmenu ul{
    width: 100%;
  }
}

@media (min-width: 640px){
  .footer .container .fmenu ul{
    display: flex;
    flex-direction: column;
  }
}

@media not all and (min-width: 640px){
  .footer .container .fmenu ul li{
    width: 100%;
  }
}

.footer .container .fmenu ul li a{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: rgb(18 21 62 / 0.6);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.footer .container .fmenu ul li a:hover{
  --tw-text-opacity: 1;
  color: rgb(18 21 62 / var(--tw-text-opacity));
}

/* FOOTER BİTTİ */

/* ALT BAŞLADI */

.alt{
  width: 100%;
  border-top-width: 1px;
  border-color: var(--gri_300);
  padding-top: 1.5rem;
  padding-bottom: 2.25rem;
}

.alt .container{
  display: flex;
  gap: 1rem;
}

@media not all and (min-width: 1024px){
  .alt .container{
    flex-direction: column;
    align-items: center;
  }
}

@media (min-width: 1024px){
  .alt .container{
    justify-content: space-between;
  }
}

.alt .container .card img{
  max-width: 14rem;
}

.alt .container p{
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 500;
  color: var(--gri_800);
}

.alt .container a{
  font-size: 35px;
  color: var(--mavi);
  opacity: 0.4;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.alt .container a:hover{
  opacity: 1;
}

/* ALT BİTTİ */

.visible{
  visibility: visible;
}

.static{
  position: static;
}

.fixed{
  position: fixed;
}

.absolute{
  position: absolute;
}

.relative{
  position: relative;
}

.sticky{
  position: sticky;
}

.block{
  display: block;
}

.inline-block{
  display: inline-block;
}

.inline{
  display: inline;
}

.table{
  display: table;
}

.grid{
  display: grid;
}

.contents{
  display: contents;
}

.hidden{
  display: none;
}

.transform{
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.resize{
  resize: both;
}

.border{
  border-width: 1px;
}

.shadow{
  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.blur{
  --tw-blur: blur(8px);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.invert{
  --tw-invert: invert(100%);
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter{
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition{
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.wpcf7 form .wpcf7-response-output{
  margin: 1rem 0 0;
  padding: 0.75rem 1.2rem;
  border-radius: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  border: 0;
  text-align: center;
}

.wpcf7 form.sent .wpcf7-response-output {
  background-color: #46b450; /* Green */
  color: #fff;
}

.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
  background-color: #dc3232; /* Red */
  color: #fff;
}

.wpcf7 form.spam .wpcf7-response-output {
  background-color: #f56e28; /* Orange */
  color: #fff;
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
  background-color: #ffb900; /* Yellow */
  color: #fff;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 90px white inset !important;
}
.wpcf7-form.sent{
  .siparis-form-form{
    display: none;
  }
}
.wc-block-components-product-badge.wc-block-components-sale-badge {
  font-size: 0px !important;
  position: relative;
}
.wc-block-components-product-badge.wc-block-components-sale-badge::before, .wc-block-components-product-badge.wc-block-components-sale-badge span {
  content: 'Kazancınız';
  font-size: 12px;
  display: inline-block;
  vertical-align: top; 
}
.wp-block-group{
  margin-top: 2rem;
}
.wc-block-components-form .wc-block-components-text-input input[type=email], .wc-block-components-form .wc-block-components-text-input input[type=number], .wc-block-components-form .wc-block-components-text-input input[type=tel], .wc-block-components-form .wc-block-components-text-input input[type=text], .wc-block-components-form .wc-block-components-text-input input[type=url], .wc-block-components-text-input input[type=email], .wc-block-components-text-input input[type=number], .wc-block-components-text-input input[type=tel], .wc-block-components-text-input input[type=text], .wc-block-components-text-input input[type=url]{
  border-color: var(--gri_300) !important;
}
.wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input, .wc-block-components-form .wc-block-components-combobox .wc-block-components-combobox-control input.components-combobox-control__input{
  border-color: var(--gri_300) !important;
}
.wc-block-components-title.wc-block-components-checkout-step__title{
  position: relative;
  &::before{
    content: "";
    width: 1.6rem;
    height: 10px;
    border-radius: 5px;
    background-color: var(--mavi);
    position: absolute;
    right: calc(100% + 1rem);
    top: 50%;
    transform: translateY(-50%);
  }
}
.wc-block-components-form .wc-block-components-checkout-step{
  padding-left: 0 !important;
}
.wc-block-components-sidebar-layout .wc-block-components-main {
  margin: 0 auto !important;
  padding-right: 0 !important;
  width: 50% !important;
  @media (max-width: 1024px) {
    width: 100% !important;
  }
}
.wp-block-woocommerce-checkout{
  margin-top: 2rem !important;
}
.wc-block-cart-items.wp-block-woocommerce-cart-line-items-block thead{
  display: none !important;
}
.wc-block-cart-item__image{
  width: 12rem;
  padding: 1rem 0 !important;
  border: 0 !important;
  @media (max-width: 1280px) {
    &{
      width: 9rem;
    }
  }
  @media (max-width: 768px) {
    &{
      display: none;
    }
  }
  & a{
    background-color: var(--gri_100);
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    aspect-ratio: 1 / 1;
    & img{
      max-width: 90%;
      max-height: 90%;
      mix-blend-mode: darken;
    }
  }
}
.wc-block-components-main.wc-block-cart__main.wp-block-woocommerce-cart-items-block{
  width: auto !important;
  flex: 1;
  .wc-block-components-product-name{
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.3;
    color: var(--mavi);
    width: 100%;
    max-width: none;
    @media (max-width: 1280px) {
      &{
        font-size: 1rem;
      }
    }
  }
  .wc-block-cart-item__prices{
    margin-top: 0.50rem;
    margin-bottom: 1.8rem;
    width: 100%;
    @media (max-width: 768px) {
      &{
        margin-bottom: 1.5rem;
      }
    }
    .price.wc-block-components-product-price{
      display: flex;
      align-items: center;
      gap: 0.75rem;
      .wc-block-components-product-price__value.is-discounted{
        font-size: 1.25rem;
        color: var(--mavi);
        font-weight: 700;
        margin-left: 0 !important;        
      }
      .wc-block-components-product-price__regular{
        order: 1;
        font-size: 1rem;
        font-weight: 500;
        color: var(--gri);
      }
    }
  }
  .wc-block-cart-item__product{
    border: 0 !important;
    padding-left: 2rem;
    @media (max-width: 768px) {
      &{
        padding: 0 !important;
      }
    }
  }
  .wc-block-components-product-badge.wc-block-components-sale-badge{
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--mavi);
    line-height: 1;
    gap: 0.25rem;
    border-color: var(--yesil);
    @media (max-width: 1280px) {
      &{
        font-size: 0.75rem;
      }
    }    
    & span{
      font-size: 1rem;
      font-weight: 700;
      color: var(--yesil);
    }
  }
  .wc-block-components-product-metadata{
    @media(max-width:768px){
      order: 3;
    }
  }
  .wc-block-cart-item__wrap{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 1.25rem;
    padding-top: 0.75rem;
    .wc-block-components-product-badge.wc-block-components-product-low-stock-badge{
      margin-top: 0.5rem;
    }
    .wc-block-cart-item__quantity{
      display: flex;
      align-items: center;
      flex: 1;
      @media (max-width: 768px) {
        &{
          padding: 0 !important;
        }
      }
      .wc-block-components-quantity-selector{
        height: 54px;
        margin-bottom: 0;
        @media (max-width: 768px) {
          &{
            height: 46.5px;
          }
        }
        & button{
          font-size: 1.5rem !important;          
        }
      }
      .wc-block-cart-item__remove-link{
        margin-left: auto;
        @media (max-width: 640px) {
          &{
            position: absolute;
            right: 0;
          }
        }
      }
    }
  }
  .wc-block-cart-item__total{
    border: 0 !important;
    .price.wc-block-components-product-price{
      font-size: 1.5rem;
      color: var(--mavi);
      font-weight: 700;
      @media (max-width: 1280px) {
        &{
          font-size: 1.2rem;
        }
      }
    }
    .wc-block-components-product-badge.wc-block-components-sale-badge{
      margin-top: 0.5rem !important;
    }
  }
}
.wc-block-components-sidebar-layout{
  align-items: flex-start;
  gap: 5rem;
  @media (max-width: 1280px) {
    &{
      gap: 2rem;
    }
  }
  @media (max-width: 1024px) {
    &{
      flex-direction: column;
    }
  }
  .wc-block-components-sidebar{
    width: 25rem !important;
    background-color: var(--gri_100);
    border-radius: 0.5rem;
    padding: 1.75rem !important;
    color: var(--mavi) !important;
    @media (max-width: 1280px) {
      &{
        width: 20rem !important;
      }
    }
    @media (max-width: 1024px) {
      &{
        width: 100% !important;
      }
    }
    .wp-block-woocommerce-cart-order-summary-heading-block.wc-block-cart__totals-title{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
      text-align: center;
      margin-bottom: 2rem;
    }
    .wp-block-woocommerce-cart-order-summary-subtotal-block.wc-block-components-totals-wrapper{
      border: 0 !important;
    }
    .wc-block-components-totals-item.wc-block-components-totals-footer-item{
      flex-direction: column;
      justify-content: center;
      text-align: center;
      align-items: center;
      .wc-block-components-totals-item__label{
        font-size: 1rem;
      }
      .wc-block-formatted-money-amount.wc-block-components-formatted-money-amount.wc-block-components-totals-item__value{
        font-size: 1.5rem;
        margin-top: 0.25rem;
      }
    }
  }
}
.wc-block-cart-items.wp-block-woocommerce-cart-line-items-block{
  border: 0 !important;
}
.wc-block-components-button{
  background-color: var(--yesil) !important;
  font-size: 1.25rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  padding-left: 1rem;
  padding-right: 1rem;
  text-align: center;
  font-weight: 600;
  color: var(--beyaz);
  border-radius: 0.25rem;
  transition: 300ms background-color !important;
  &:hover{
    background-color: var(--yesil_hover) !important;
  }
}
.wc-block-cart__submit.wp-block-woocommerce-proceed-to-checkout-block{
  margin: 0 !important;
}
.wc-block-cart-items__row{
  @media (max-width: 768px) {
    display: flex !important;
  }
}
.wc-block-components-order-summary__content{
  .wc-block-components-product-metadata{
    display: none;
  }
  .wc-block-components-order-summary-item__quantity{
    background: var(--mavi) !important;
    color: var(--beyaz) !important;
    width: 1.3rem;
    height: 1.3rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-size: 0.75rem;
    font-weight: 700;
    border: 0 !important;
    box-shadow: 0 0 0 #fff !important;
  }
}
.woocommerce-order{
  max-width: 62rem;
  width: 100%;
  margin-inline: auto;
  .woocommerce-order-details{
    margin-top: 2.75rem;
    .woocommerce-order-details__title{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
      text-align: center;
    }
    .woocommerce-table.woocommerce-table--order-details{
      margin-top: 1.25rem;
    }
    .woocommerce-table.woocommerce-table--order-details.shop_table.order_details{
      border: 0;
      border-collapse: collapse;
      & thead{
        display: none;
      }
      & tr td{
        border: 0;
      }
      & tr th{
        border: 0;
      }
      & tbody{
        background-color: var(--gri_100);
        border-radius: 0.5rem;
        overflow: hidden;
        & tr{
          border-bottom: 1px solid var(--gri_300);
          & td{
            padding-top: 1.25rem;
            padding-bottom: 1.25rem;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1rem;
            font-weight: 500;
            color: var(--mavi);
            .product-quantity{
              color: var(--mavi);
            }
            &.woocommerce-table__product-total.product-total{
              text-align: right;
              font-weight: 700;
            }
          }
          &:last-child{
            border: 0;
          }
        }
      }
      & tfoot{
        color: var(--mavi);
        white-space: nowrap;
        & tr td{
          padding: 4px 8px;
        }
        & tr th{
          text-align: right;
          font-weight: 500;
          padding: 0 2rem 0 0;
          width: 100%;
        }
      }
    }
  }
}
.icerik-alani:has(.woocommerce-order){
  .ust-title{
    display: none;    
  }
}
.woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received{
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1.25rem;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--yesil);
  margin-top: 40px;
  @media (max-width: 1024px) {
    &{
      font-size: 1.3rem;
      gap: 0.75rem;
    }    
  }
  &::before{
    content: "";
    width: 4.125rem;
    height: 4.125rem;
    background: url(../images/check.png) center center no-repeat;
    background-size: 100%;
  }
}
@media (max-width: 1024px) {
  .woocommerce-notice.woocommerce-notice--success.woocommerce-thankyou-order-received::before{
    width: 3rem;
    height: 3rem;
  }
}
.woocommerce-order-overview.woocommerce-thankyou-order-details.order_details{
  margin: 0;
  width: 100%;
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  border: 2px solid var(--yesil);
  display: flex;
  align-items: flex-start;
  margin-top: 3.75rem;
  border-radius: 0.5rem;
  &::before, &::after{
    display: none;
  }
  @media (max-width: 1024px) {
    &{
      margin-top: 2rem;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      row-gap: 2rem;
    }
  }
  @media (max-width: 640px) {
    &{
      grid-template-columns: repeat(1, minmax(0, 1fr));
      row-gap: 1.2rem;
    }
  }
  & li{
    flex: 1;
    float: none;
    padding-right: 0;
    border: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--gri);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
    gap: 0.5rem;
    & strong{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
    }
    &.woocommerce-order-overview__email.email{
      display: none;
    }
  }
  & + p{
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    border-radius: 0.5rem;
    background-color: #cc680a;
    color: var(--beyaz);
    font-size: 1rem;
    font-weight: 500;
    margin-top: 2rem;
    text-align: center;
  }
}
.woocommerce-customer-details{
  .woocommerce-columns--addresses{
    width: 100%;
    display: flex;
    gap: 1.3rem;
    @media (max-width: 640px) {
      flex-direction: column;
    }
    &::before, &::after{
      display: none;
    }
  }
  .woocommerce-column--shipping-address,
  .woocommerce-column--billing-address{
    flex: 1 1 0%;
    display: flex;
    flex-direction: column;
  }
  .woocommerce-column__title{
    font-size: 1.25rem;
    text-align: center;
    color: var(--mavi);
    margin-bottom: 1.25rem;
    font-weight: 600;
  }
  & address{
    border: 0 !important;
    background-color: var(--gri_100);
    flex: 1;
    padding-top: 1.25rem !important;
    padding-bottom: 1.25rem !important;
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    color: var(--mavi);
  }
}
.woocommerce-bacs-bank-details{
  margin-top: 1.5rem;
  .wc-bacs-bank-details-heading{
    font-size: 1.25rem;
    text-align: center;
    font-weight: 600;
    color: var(--mavi);
    margin-bottom: 1.5rem;
  }
  .wc-bacs-bank-details-account-name{
    font-size: 1rem;
    font-weight: 700;
    color: var(--mavi);
    margin-bottom: 0.5rem;
    display: none;
  }
  .wc-bacs-bank-details.order_details.bacs_details{
    margin: 0;
    margin-bottom: 1rem;
    display: flex;
    align-items: flex-start;
    padding: 1rem;
    border: 1px solid var(--gri_300);
    border-radius: 0.5rem;
    @media (max-width: 1024px) {
      &{
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        row-gap: 1rem;
      }
    }
    @media (max-width: 640px) {
      &{
        display: grid;
        grid-template-columns: repeat(1, minmax(0, 1fr));
        row-gap: 1rem;
      }
    }
    &::before, &::after{
      display: none;
    }
    & li{
      border: 0;
      flex: 1;
      color: var(--mavi);
      display: flex;
      flex-direction: column;
      gap: 0.25rem;
      &:last-child{
        flex: 2;
      }
    }
  }
}
.woocommerce-account{
  .ust-title{
    width: 100%;
  }
  .shop-icerikler{
    .woocommerce{
      display: grid;
      align-items: flex-start;
      grid-template-columns: 20rem 1fr;
      margin-top: 2rem;
      gap: 5rem;
      @media (max-width: 1024px) {
        &{
          grid-template-columns: repeat(1, minmax(0, 1fr));
          gap: 1rem;
        }
      }
      &::before, &::after{
        display: none;
      }
      .woocommerce-MyAccount-navigation{
        background-color: var(--gri_100);
        width: 100%;
        border-radius: 0.5rem;
        padding: 1.25rem;
        @media (max-width: 640px) {
          &{
            padding: 0.75rem;
          }
        }
        & ul{
          display: flex;
          flex-direction: column;
          gap: 0.5rem;
          & li{
            & a{
              padding-top: 1rem;
              padding-bottom: 1rem;
              padding-left: 1.25rem;
              padding-right: 1.25rem;
              border-radius: 0.50rem;
              font-size: 1rem;
              font-weight: 600;
              color: var(--mavi);
              width: 100%;
              display: flex;
              align-items: center;
              line-height: 1;
            }
            &:hover{
              & a{
                color: var(--mavi);
              }
            }
            &.is-active{
              & a{
                background-color: var(--mavi);
                color: var(--beyaz);
              }
            }
            &.woocommerce-MyAccount-navigation-link.woocommerce-MyAccount-navigation-link--downloads{
              display: none;
            }
          }
        }
      }
      .woocommerce-MyAccount-content{
        padding-top: 1rem;
        width: 100%;
        color: var(--mavi);
        .woocommerce-info{
          & a{
            display: none;
          }
        }
        & p{
          color: var(--mavi);
          font-size: 1rem;
          font-weight: 600;
          margin-bottom: 1.25rem;
          line-height: 1.6;
          text-wrap: balance;
          & a{
            text-decoration: underline;
            &:hover{
              color: var(--mavi);
            }
          }
        }
        .woocommerce-MyAccount-orders{
          border: 0;
          border-spacing: 0 10px;
          & thead{
            & tr{
              padding: 0 1.25rem;
              & th{
                font-size: 1rem;
                font-weight: 600;
                color: var(--gri);
              }
            }
          }
          & tbody{
            & tr{
              background-color: var(--gri_100);
              padding: 1.25rem;
              border-radius: 0.5rem;
              @media (max-width: 1024px) {
                &{
                  padding: 0.5rem;
                  margin-bottom: 0.75rem;
                }
              }
              &.woocommerce-orders-table__row--status-completed{
                background: rgba(60, 174, 119, 0.20);
                border: 1px solid var(--mavi);
              }
              & td{
                border: 0;
                font-size: 1rem;
                font-weight: 600;
                color: var(--mavi);
                background-color: transparent !important;
              }
            }
          }
          .woocommerce-button.button.view{
            padding-top: 0.75rem;
            padding-bottom: 0.75rem;
            padding-left: 1rem;
            padding-right: 1rem;
            border-radius: 0.25rem;
            background-color: var(--mavi);
            color: var(--beyaz);
            font-weight: 600;
            transition: 300ms background-color;
            &:hover{
              background-color: var(--mavi_hover);
            }
          }
        }
      }
    }
  }
}
.woocommerce table.my_account_orders td, .woocommerce table.my_account_orders th{
  padding: inherit;
}



.woocommerce-view-order{
  width: 100%;
  margin-inline: auto;
  .woocommerce-MyAccount-content{
    & > p{
      text-align: center;
    }
    .order-again{
      display: flex;
      justify-content: center;
      & a{
        padding: 1rem;
        border-radius: 0.5rem;
        background-color: var(--mavi);
        color: var(--beyaz);
        font-size: 1rem;
        font-weight: 600;
        transition: 300ms background-color;
        display: block;
        text-decoration: none !important;
        &:hover{
          background-color: var(--mavi_hover) !important;
          color: var(--beyaz) !important;
        }
      }
    }    
  }
  .woocommerce-order-details{
    margin-top: 2.75rem;
    .woocommerce-order-details__title{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
      text-align: center;
    }
    .woocommerce-table.woocommerce-table--order-details{
      margin-top: 1.25rem;
    }
    .woocommerce-table.woocommerce-table--order-details{
      border: 0;
      border-collapse: collapse;
      & thead{
        display: none;
      }
      & tr td{
        border: 0;
      }
      & tr th{
        border: 0;
      }
      & tbody{
        background-color: var(--gri_100);
        border-radius: 0.5rem;
        overflow: hidden;
        & tr{
          border-bottom: 1px solid var(--gri_300);
          & td{
            padding-top: 1.25rem;
            padding-bottom: 1.25rem;
            padding-left: 1.5rem;
            padding-right: 1.5rem;
            font-size: 1rem;
            font-weight: 500;
            color: var(--mavi);
            .product-quantity{
              color: var(--mavi);
            }
            &.woocommerce-table__product-total.product-total{
              text-align: right;
              font-weight: 700;
            }
          }
          &:last-child{
            border: 0;
          }
        }
      }
      & tfoot{
        color: var(--mavi);
        white-space: nowrap;
        & tr td{
          padding: 4px 8px;
        }
        & tr th{
          text-align: right;
          font-weight: 500;
          padding: 0 2rem 0 0;
          width: 100%;
        }
      }
    }
  }
}
.woocommerce-edit-address{
  .woocommerce-Addresses{
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 1.25rem;
    &::after, &::before{
      display: none;
    }
    .woocommerce-Address{
      width: 100%;
      display: flex;
      flex-direction: column;
      background-color: var(--gri_100);
      border-radius: 0.5rem;
      padding: 1.5rem;
      gap: 1.25rem;
      .woocommerce-Address-title{
        display: flex;
        align-items: flex-start;
        & h2{
          font-size: 1.2rem;
          font-weight: 600;
          color: var(--mavi);
          flex: 1;
          line-height: 1.2;
        }
        .edit{
          padding-top: 0.75rem;
          padding-bottom: 0.75rem;
          padding-left: 1rem;
          padding-right: 1rem;
          border-radius: 0.25rem;
          background-color: var(--mavi);
          color: var(--beyaz);
          font-size: 0.75rem;
          font-weight: 700;
          transition: 300ms background-color;
          text-transform: uppercase;
          &:hover{
            background-color: var(--mavi_hover);
          }
        }
      }
      & address{
        font-size: 1rem;
        font-weight: 600;
        line-height: 1.6;
        color: var(--mavi);
        font-style: normal;
      }
    }
  }
}
.woocommerce-edit-address{
  & h3{
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--mavi);
  }
  .woocommerce-MyAccount-content{
    max-width: 39rem;
  }
  .woocommerce-address-fields{
    margin-top: 2rem;
    .button{
      padding-top: 1rem;
      padding-bottom: 1rem;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
      background-color: var(--mavi);
      color: var(--beyaz) !important;
      font-size: 1.125rem;
      font-weight: 600;
      border-radius: 0.25rem;
      transition: 300ms background-color;
      &:hover{
        background-color: var(--mavi_hover) !important;
      }
    }
    .woocommerce-input-wrapper{
      & strong{
        padding-left: 0.5rem;
      }
    }
    & label{
        margin-bottom: 0.50rem;
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    .input-text{
      height: 3.125rem;
      border: 2px solid var(--gri_300);
      border-radius: 0.5rem;
      font-size: 0.875rem;
      font-weight: 500;
      color: var(--mavi);
      padding: 0 1rem;
    }
    .select2-selection.select2-selection--single{
      padding: 0.75rem;
      height: auto;
      border-color: var(--gri_300);
      border-radius: 0.5rem;
      .select2-selection__arrow{
        top: 50%;
        transform: translateY(-50%);
      }
    }
  }
}
.woocommerce-edit-account{
  .woocommerce-MyAccount-content{
    max-width: 39rem;
  }
}
.woocommerce-EditAccountForm{
  .input-text{
    height: 3.125rem;
    border: 2px solid var(--gri_300);
    border-radius: 0.5rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--mavi);
    padding: 0 1rem;
  }
  .button{
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    padding-left: 1.2rem !important;
    padding-right: 1.2rem !important;
    background-color: var(--mavi) !important;
    color: var(--beyaz) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
    border-radius: 0.25rem !important;
    transition: 300ms background-color !important;
    &:hover{
      background-color: var(--mavi_hover) !important;
    }
  }
  & label{
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--mavi);
    margin-bottom: 0.50rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  .woocommerce-form-row{    
    & span em{
      font-style: normal;
      font-size: 12px;
    }
  }
  & fieldset{
    & legend{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
      margin-bottom: 2rem;
      margin-top: 2rem;
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    & label{
      font-size: 0.9375rem;
      font-weight: 600;
      color: var(--mavi);
      margin-bottom: 0.50rem;
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
  }
}
.woocommerce-edit-address:has(.woocommerce-Address){
  .woocommerce-MyAccount-content{
    max-width: none;
  }
}
.woocommerce-account:has(.woocommerce-form-login){
  .woocommerce{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
}
.woocommerce-account:has(.woocommerce-ResetPassword){
  .woocommerce{
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
    margin-top: 0 !important;
  }
}
.woocommerce-account{
  #customer_login{
    display: grid;
    grid-template-columns: 34rem 34rem;
    gap: 3rem;
    justify-content: center;
    @media (max-width: 1280px) {
      &{
        grid-template-columns: 28rem 28rem;
        gap: 2rem;
      }
    }
    @media (max-width: 1024px) {
      &{
        grid-template-columns: 1fr;
        gap: 2rem;
      }
    }
    & > div{
      width: 100%;
      display: flex;
      flex-direction: column;
      color: var(--mavi);
      & h2{
        font-size: 2rem;
        font-weight: 600;
        color: var(--mavi);
        margin-bottom: 2.5rem;
        text-align: center;
        width: 100%;
      }
      .woocommerce-form-login{
        border-radius: 0.5rem;
        border: 1px solid var(--gri_300);
        padding: 2.5rem;
        flex: 1;
        margin: 0;
        @media (max-width: 640px) {
          &{
            padding: 1rem;
          }
        }
        & label{
          margin-bottom: 0.50rem;
          padding-left: 0.5rem;
          padding-right: 0.5rem;
        }
        .input-text{
          height: 3.125rem;
          border: 2px solid var(--gri_300);
          border-radius: 0.5rem;
          font-size: 0.875rem;
          font-weight: 500;
          color: var(--mavi);
          padding: 0 1rem;
        }
        .button{
          padding-top: 1rem;
          padding-bottom: 1rem;
          padding-left: 1.5rem;
          padding-right: 1.5rem;
          background-color: var(--mavi);
          color: var(--beyaz) !important;
          font-size: 1.125rem;
          font-weight: 600;
          border-radius: 0.25rem;
          transition: 300ms background-color;
          &:hover{
            background-color: var(--mavi_hover) !important;
          }
        }
        .form-row:has(.button){
          display: flex;
          align-items: center;
          & label{
            margin: 0;
            flex: 1;
          }
          .button{
            margin-right: 0;
          }
          .woocommerce-form__label-for-checkbox{
            display: flex;
            align-items: center;
            gap: 0.75rem;
            font-size: 0.8125rem;
            font-weight: 600;
            color: var(--mavi);
            & input{
              width: 1.5rem;
              height: 1.5rem;
              border-radius: 0.25rem;
              border: 2px solid var(--gri_300);              
            }
          }
        }
        .woocommerce-LostPassword{
          text-align: center;
          margin-top: 2rem;
          font-size: 0.9375rem;
          font-weight: 600;
          color: var(--mavi);
          & a:hover{
            color: var(--mavi);
          }
        }
      }
      .woocommerce-form-register{
        flex: 1;
        border-radius: 0.5rem;
        border: 1px solid var(--gri_300);
        padding: 2.5rem;
        margin: 0;
        @media (max-width: 640px) {
          &{
            padding: 1rem;
          }
        }
        .woocommerce-privacy-policy-text{
          display: none;
        }
        & p{
          font-size: 0.9375rem;
          font-weight: 500;
          line-height: 1.4;
          margin-bottom: 1rem;
          &:last-child{
            margin-bottom: 0;
          }
        }
        & label{
          margin-bottom: 0.50rem;
          padding-left: 0.5rem;
          padding-right: 0.5rem;
        }
        .input-text{
          height: 3.125rem;
          border: 2px solid var(--gri_300);
          border-radius: 0.5rem;
          font-size: 0.875rem;
          font-weight: 500;
          color: var(--mavi);
          padding: 0 1rem;
        }
        .button{
          padding-top: 1rem;
          padding-bottom: 1rem;
          padding-left: 1.5rem;
          padding-right: 1.5rem;
          background-color: var(--mavi);
          color: var(--beyaz) !important;
          font-size: 1.125rem;
          font-weight: 600;
          border-radius: 0.25rem;
          transition: 300ms background-color;
          margin-left: auto;
          &:hover{
            background-color: var(--mavi_hover) !important;
          }
        }
        .form-row:has(.button){
          display: flex;
          align-items: center;
          margin-top: 1rem;
          .button{
            margin-left: auto;
          }
        }
      }      
    }
    &::before, &::after{
      display: none;
    }
  }
  .woocommerce-ResetPassword{
    max-width: 34rem;
    margin: auto;
    padding: 2.5rem;
    border: 1px solid var(--gri_300);
    border-radius: 0.5rem;
    @media (max-width: 640px) {
      padding: 1rem;
    }
    & label{
      margin-bottom: 0.50rem;
      padding-left: 0.5rem;
      padding-right: 0.5rem;
    }
    .input-text{
      height: 3.125rem;
      border: 2px solid var(--gri_300);
      border-radius: 0.5rem;
      font-size: 0.875rem;
      font-weight: 500;
      color: var(--mavi);
      padding: 0 1rem;
    }
    .button{
      padding-top: 1rem;
      padding-bottom: 1rem;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
      background-color: var(--mavi);
      color: var(--beyaz) !important;
      font-size: 1.125rem;
      font-weight: 600;
      border-radius: 0.25rem;
      transition: 300ms background-color;
      &:hover{
        background-color: var(--mavi_hover) !important;
      }
    }
    .woocommerce-form-row{
      width: 100% !important;
    }
    & > p{
      text-align: center;
      font-size: 0.9375rem;
      font-weight: 500;
      color: var(--mavi);
      margin-bottom: 2rem;
      @media (max-width: 640px) {
        margin-bottom: 1rem;
      }
      & label{
        text-align: left;
      }
    }
  }
}
.bloglarim .container .listeleme:has(.urun){
  grid-template-columns: repeat(5, minmax(0, 1fr));
  @media (max-width: 1280px) {
    &{
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  @media (max-width: 1024px) {
    &{
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
  }
  @media (max-width: 640px) {
    &{
      gap: 0.5rem;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

}
.yeni-img{
  position: absolute;
  left: 0.75rem;
  top: 0.75rem;
  @media (max-width: 640px) {
    &{
      left: 0.5rem;
      top: 0.5rem;
    }
  }
  & img{
    max-width: 3.5rem !important;
    position: relative !important;
    left: 0 !important;
    top: 0 !important;
    transform: translate(0, 0) !important;
  }
  @media (max-width: 640px) {
    & img{
      max-width: 2.5rem !important;
    }
  }
}
.ykargo{
  order: 5;
  margin-top: 1.5rem;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border-radius: 0.25rem;
  border: 1px solid rgb(0 114 188);
  background: rgb(0 114 188 / 8%);
  & img{
    max-width: 110px;
  }
  & span{
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--mavi);
  }
  & a{
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--beyaz);
    background-color: rgb(0 114 188);
    padding: 0.5rem 1rem;
    width: 100%;
    transition: 300ms background-color;
    border-radius: 0.25rem;
    &:hover{
      background-color: rgb(12, 127, 204);
    }
  }
}
.footer{
  .ykargo{
    max-width: 13rem;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    @media (max-width: 768px) {
      &{
        max-width: 100%;
        width: 100%;
      }
    }
  }
}
.postid-393 .urun-detay-fiyat, .postid-396 .urun-detay-fiyat{
  .yuzde-ekle{
    display: none !important;
  }
  .price bdi{
    font-size: 2rem;
    font-weight: 700;
    color: var(--mavi);
  }
}
.stock.out-of-stock{
  background-color: #dc323215 !important;
  border: 1px solid #dc3232 !important;
  color: #dc3232 !important;
  padding: 0.75rem 2rem;
  order: 5;
}
.stock.available-on-backorder{
  background-color: #479c7415 !important;
  border: 1px solid #479c74 !important;
  color: #479c74 !important;
  padding: 0.75rem 2rem;
  order: 5;
  margin-bottom: 1rem;
}
.icerikler .woocommerce ul.order_details{
  margin: 0;
  width: 100%;
  padding-top: 1.75rem;
  padding-bottom: 1.75rem;
  padding-left: 2.5rem;
  padding-right: 2.5rem;
  border: 2px solid var(--mavi);
  display: flex;
  align-items: flex-start;
  margin-top: 3.75rem;
  border-radius: 0.5rem;
  &::before, &::after{
    display: none;
  }
  @media (max-width: 1024px) {
    &{
      margin-top: 2rem;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      row-gap: 2rem;
    }
  }
  @media (max-width: 640px) {
    &{
      grid-template-columns: repeat(1, minmax(0, 1fr));
      row-gap: 1.2rem;
    }
  }
  & li{
    flex: 1;
    float: none;
    padding-right: 0;
    border: 0;
    font-size: 0.875rem;
    font-weight: 700;
    color: var(--gri);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
    gap: 0.5rem;
    & strong{
      font-size: 1.25rem;
      font-weight: 600;
      color: var(--mavi);
    }
    &.woocommerce-order-overview__email.email{
      display: none;
    }
  }
  & + p{
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    border-radius: 0.5rem;
    background-color: #cc680a;
    color: var(--beyaz);
    font-size: 1rem;
    font-weight: 500;
    margin-top: 2rem;
    text-align: center;
  }
}
#infoBox{
	font-size: 1.1rem;
    font-weight: 600;
    color: var(--mavi);
	width: 100%;
	text-align: center;
}
#iyz-checkout-form-button{
	font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: var(--beyaz) !important;
	background: var(--mavi) !important;
	border-radius: 0.5rem !important;
	margin: 0 auto!important;
	padding: 15px 25px !important;
}
#iyzipay-checkout-form{
	width: 100%;
	display: flex!important;
	align-items: center;
	justify-content: center;
}
#order_review{
	margin: 2rem auto;
}

.y-popup{
  position: fixed;
  inset: 0px;
  z-index: 99999;
  display: none;
  height: 100%;
  width: 100%;
  align-items: center;
  justify-content: center;
  background-color: rgb(0 0 0 / 0.5);
  &.active{
    display: flex;
  }
  .yp-icerik{
    display: flex;
  }
  .yp-icerik{
    width: 100%;
  }
  .yp-icerik{
    max-width: 34rem;
  }
  .yp-icerik{
    flex-direction: column;
  }
  .yp-icerik{
    align-items: center;
  }
  .yp-icerik{
    justify-content: center;
  }
  .yp-icerik{
    gap: 1rem;
  }
  .yp-icerik{
    border-radius: 0.75rem;
  }
  .yp-icerik{
    --tw-bg-opacity: 1;
    background-color: rgb(60 174 119 / var(--tw-bg-opacity));
  }
  .yp-icerik{
    padding-left: 1rem;
    padding-right: 1rem;
  }
  .yp-icerik{
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }
  .yp-icerik{
    text-align: center;
  }
  @media not all and (min-width: 640px){
    .yp-icerik{
      max-width: 90%;
    }
  }
  @media (min-width: 640px){
    .yp-icerik{
      gap: 1.25rem;
    }
  }
  @media (min-width: 640px){
    .yp-icerik{
      padding-left: 1.5rem;
      padding-right: 1.5rem;
    }
  }
  .yp-icerik{
    svg{
      height: 3rem;
    }
    svg{
      width: 3rem;
    }
    svg{
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity));
    }
    @media (min-width: 640px){
      svg{
        height: 4rem;
      }
    }
    @media (min-width: 640px){
      svg{
        width: 4rem;
      }
    }
    .yp-title{
      font-size: 1.5rem;
      line-height: 2rem;
    }
    .yp-title{
      font-weight: 700;
    }
    .yp-title{
      line-height: 1.3;
    }
    .yp-title{
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity));
    }
    @media (min-width: 640px){
      .yp-title{
        font-size: 2rem;
      }
    }
    p{
      font-size: 1rem;
      line-height: 1.5rem;
    }
    p{
      font-weight: 600;
    }
    p{
      line-height: 1.6;
    }
    p{
      --tw-text-opacity: 1;
      color: rgb(255 255 255 / var(--tw-text-opacity));
    }
    @media (min-width: 640px){
      p{
        font-size: 1.125rem;
        line-height: 1.75rem;
      }
    }
    p{
      b{
        font-weight: 600;
      }
      b{
        text-decoration-line: underline;
      }
    }
    .yp-buton{
      margin-top: 0.75rem;
    }
    .yp-buton{
      border-radius: 0.25rem;
    }
    .yp-buton{
      --tw-bg-opacity: 1;
      background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    }
    .yp-buton{
      padding-left: 1.75rem;
      padding-right: 1.75rem;
    }
    .yp-buton{
      padding-top: 1rem;
      padding-bottom: 1rem;
    }
    .yp-buton{
      font-size: 0.875rem;
      line-height: 1.25rem;
    }
    .yp-buton{
      font-weight: 600;
    }
    .yp-buton{
      line-height: 1;
    }
    .yp-buton{
      --tw-text-opacity: 1;
      color: rgb(0 0 0 / var(--tw-text-opacity));
    }
    @media (min-width: 640px){
      .yp-buton{
        font-size: 1rem;
        line-height: 1.5rem;
      }
    }
  }
}

/* popup gölge */

.popup-golge{
  pointer-events: none;
  position: fixed;
  left: 0px;
  top: 0px;
  z-index: 99998;
  height: 100%;
  width: 100%;
  background-color: rgb(0 0 0 / 0.3);
  opacity: 0;
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 300ms;
}

.popup-golge.aktif{
  pointer-events: auto;
  opacity: 1;
}

/* popup sepet */

.sepetim{
  position: fixed;
  right: 0px;
  top: 0px;
  z-index: 99999;
  display: flex;
  height: 100%;
  width: 100%;
  max-width: 25rem;
  --tw-translate-x: 700px;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  flex-direction: column;
  gap: 1rem;
  overflow: auto;
  background-color: var(--beyaz);
  padding: 1.25rem;
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 500ms;
}

.sepetim.aktif{
  --tw-translate-x: 0;
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.sepetim .ust{
  display: flex;
  width: 100%;
  align-items: center;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 600;
  color: var(--mavi);
}

.sepetim .ust span{
  flex: 1 1 0%;
}

.sepetim .ust .sepet-kapat{
  font-size: 1.75rem;
  color: var(--mavi);
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.sepetim .ust .sepet-kapat:hover{
  color: var(--mavi);
}

.sepetim .listeleme{
  margin-top: 2rem;
  display: flex;
  width: 100%;
  flex-direction: column;
  gap: 2rem;
}

.sepetim .listeleme .sepet{
  display: flex;
  width: 100%;
  align-items: center;
  gap: 1rem;
}

.sepetim .listeleme .sepet .resim{
  position: relative;
  display: flex;
  height: 5rem;
  width: 5rem;
  align-items: center;
  justify-content: center;
  border-radius: 0.5rem;
  background-color: var(--gri_100);
}

.sepetim .listeleme .sepet .resim img{
  max-height: 80%;
  max-width: 80%;
  mix-blend-mode: darken;
  width: auto !important;
}

.sepetim .listeleme .sepet .resim span{
  position: absolute;
  right: -0.625rem;
  top: -0.625rem;
  display: flex;
  height: 1.6875rem;
  width: 1.6875rem;
  align-items: center;
  justify-content: center;
  border-radius: 9999px;
  background-color: var(--mavi);
  text-align: center;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  color: var(--beyaz);
}

.sepetim .listeleme .sepet .icerik{
  flex: 1 1 0%;
}

.sepetim .listeleme .sepet .icerik .sust{
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 0.75rem;
}

.sepetim .listeleme .sepet .icerik .sust .suic{
  flex: 1 1 0%;
}

.sepetim .listeleme .sepet .icerik .sust .suic .title{
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .sust .suic .fiyat{
  margin-top: 0.375rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.sepetim .listeleme .sepet .icerik .sust .suic .fiyat b{
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .sust .suic .fiyat del{
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--gri);
}

.sepetim .listeleme .sepet .icerik .sust .tfiyat{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .salt{
  margin-top: 0.75rem;
  display: flex;
  width: 100%;
  align-items: center;
}

.sepetim .listeleme .sepet .icerik .salt .setext{
  pointer-events: none;
  height: 1.5rem;
  width: 1.25rem;
  text-align: center;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .salt .adet{
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.sepetim .listeleme .sepet .icerik .salt .adet button{
  font-size: 1.5rem;
  line-height: 2rem;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.sepetim .listeleme .sepet .icerik .salt .adet button.minus{
  color: var(--gri);
}

.sepetim .listeleme .sepet .icerik .salt .adet button.minus:hover{
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .salt .adet button.plus{
  color: var(--mavi);
}

.sepetim .listeleme .sepet .icerik .salt .adet button.plus:hover{
  color: var(--yesil_hover);
}

.sepetim .listeleme .sepet .kaldir{
  width: auto !important;
  height: auto !important;
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  color: var(--kirmizi) !important;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.sepetim .listeleme .sepet .kaldir:hover{
  color: var(--mavi) !important;
  background-color: transparent !important;
}

.sepetim .listeleme .sepet .kaldir svg{
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.sepetim .sepet-toplam{
  margin-top: auto;
  width: 100%;
  border-top-width: 2px;
  border-color: var(--gri_100);
  padding-top: 1rem;
}

.sepetim .sepet-toplam .stust{
  display: flex;
  width: 100%;
  align-items: flex-start;
  gap: 1rem;
}

.sepetim .sepet-toplam .stust .sol{
  display: flex;
  flex: 1 1 0%;
  flex-direction: column;
  gap: 0.25rem;
}

.sepetim .sepet-toplam .stust .sol span{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
  color: var(--mavi);
}

.sepetim .sepet-toplam .stust .sol p{
  font-size: 0.75rem;
  line-height: 1rem;
  font-weight: 500;
  line-height: 1.4;
  color: var(--mavi);
}

.sepetim .sepet-toplam .stust .sag{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  color: var(--mavi);
  flex: 1;
  text-align: center;
  padding-bottom: 0.5rem;
}

.sepetim .sepet-toplam .butonlar{
  margin-top: 0.75rem;
  display: flex;
  width: 100%;
  align-items: center;
  gap: 0.75rem;
}

.sepetim .sepet-toplam .butonlar a{
  display: flex;
  flex: 1 1 0%;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 600;
  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
}

.sepetim .sepet-toplam .butonlar a:nth-child(1){
  background-color: var(--gri_100);
  color: var(--mavi);
}

.sepetim .sepet-toplam .butonlar a:nth-child(1):hover{
  color: var(--mavi_hover);
}

.sepetim .sepet-toplam .butonlar a:nth-child(2){
  background-color: var(--yesil);
  color: var(--beyaz);
}

.sepetim .sepet-toplam .butonlar a:nth-child(2):hover{
  background-color: var(--yesil_hover);
}
li.product .price,
.woocommerce ul.products li.product .price{
  margin-bottom: 0;
  margin-top: 10px;
  color: var(--mavi);
  display: flex;
  gap: 12px;
  font-weight: 700;
  font-size: .857em;
}
li.product .price del,
.woocommerce ul.products li.product .price del{
  opacity: 1;
  font-weight: 500;
  order: 2;
}
li.product .price ins,
.woocommerce ul.products li.product .price ins{
  text-decoration: none;
  order: 1;
}
li.product .woocommerce-loop-category__title,
li.product .woocommerce-loop-product__title,
li.product h3,
.wp-block-cart-cross-sells-product__product-title,
.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3{
  font-size: 13px;
  font-weight: 500;
  color: var(--mavi);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  padding: 0;
}
.wc-block-components-product-name{
  font-size: 13px !important;
  width: 100%;
  line-height: 1 !important;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
  text-align: left !important;
}
li.product .button,
.woocommerce ul.products li.product .button{
  display: none;
}
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  margin: 0;
}
li.product a img,
.woocommerce ul.products li.product a img{
  margin-bottom: 16px;
}
.yith-add-to-wishlist-button-block{
  margin: 0;
}
li{
  list-style: none;
}
.yith-wcwl-add-to-wishlist-button.yith-wcwl-add-to-wishlist-button-over-image--top-left{
  right: 0;
  left: auto;
}
.woocommerce span.onsale,
li.product .onsale,
.woocommerce ul.products li.product .onsale{
  display: none;
}
.yith-wcwl-add-to-wishlist-button:is(button){
  padding: 12px;
}
.yith-wcwl-add-to-wishlist-button.yith-wcwl-add-to-wishlist-button-over-image{
  margin: 0;
}
.wc-block-components-product-badge.wc-block-components-sale-badge{
  margin-bottom: 0 !important;
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt{
  background-color: var(--mavi);
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:hover{
  background-color: var(--mavi_hover);
}
.woocommerce:where(body:not(.woocommerce-uses-block-theme)) ul.products li.product .price{
  color: var(--mavi);
  display: flex;
  gap: 12px;
}
body:not(.home) .woocommerce .products ul,
body:not(.home) .woocommerce ul.products{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  row-gap: 40px;
  column-gap: 20px;
  margin: 0;
  @media(max-width:640px){
    &{
      column-gap: 12px;
    }
  }
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  width: calc(25% - 15px);
  flex-shrink: 0;
  @media(max-width:640px){
    &{
      width: calc(50% - 6px);
    }
  }
}
.woocommerce .products ul::after, .woocommerce .products ul::before, .woocommerce ul.products::after, .woocommerce ul.products::before{
  display: none;
}
.populer-slider .product{
  flex-shrink: 0;
}

.icerikler{
  width: 100%;
  padding-bottom: 140px;
}
@media(max-width:768px){
  .icerikler{
    padding-bottom: 90px;
  }
}
@media(max-width:640px){
  .icerikler{
    padding-bottom: 60px;
  }
}
.icerikler .ust-title{
  font-size: 30px;
  font-weight: 700;
  color: var(--mavi);
  text-transform: uppercase;
}
@media(max-width:768px){
  .icerikler .ust-title{
    font-size: 24px;
  }
}
.band{
  width: 100%;
  padding-block: 16px;
}
@media(max-width:768px){
  .band{
    padding-block: 8px;
  }
}
.band ul{
  max-width: 100%;
  display: flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  gap: 8px;
}
.band ul li{
  font-size: 13px;
  font-weight: 500;
  color: var(--mavi);
  display: flex;
  gap: 8px;
}
.band ul li::after{
  content: "/";
  color: var(--gri_500);
}
.band ul li:last-child::after{
  display: none;
}
.kat-blog-list{
  margin-top: 32px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 20px;
  row-gap: 70px;
}
@media(max-width:768px){
  .kat-blog-list{
    margin-top: 24px;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 12px;
    row-gap: 40px;
  }
}
@media(max-width:640px){
  .kat-blog-list{
    margin-top: 12px;
    grid-template-columns: repeat(1, 1fr);
    row-gap: 32px;
  }
}
.sayfalama{
  width: 100%;
  margin-top: 60px;
}
.sayfalama ul{
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 12px;
}
.sayfalama ul li a{
  padding: 12px 20px;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
}
.sayfalama ul li.onceki a{
  background-color: var(--gri_100);
  color: var(--mavi);
  &:hover{
    background-color: var(--gri_300);
  }
}
.sayfalama ul li.sonraki a{
  background-color: var(--mavi);
  color: var(--beyaz);
  &:hover{
    background-color: var(--mavi_hover);
  }
}
.woocommerce-breadcrumb{
  white-space: nowrap;
  width: 100%;
  overflow: hidden;
  color: var(--mavi) !important;
  font-size: 13px !important;
  font-weight: 500;
  padding: 16px 0 !important;
  a{
    font-weight: 500;
    color: var(--mavi) !important;
  }
}
.blog-detay-ust-baslik{
  width: 100%;
  font-size: 24px;
  font-weight: 700;
  color: var(--mavi);
  margin-bottom: 32px;
}
@media(max-width:768px){
  .blog-detay-ust-baslik{
    font-size: 18px;
    margin-bottom: 24px;
  }
}
@media(max-width:640px){
  .blog-detay-ust-baslik{
    font-size: 16px;
    margin-bottom: 18px;
  }
}
.icerikler .bloglarim{
  padding-bottom: 0;
}

@media not all and (min-width: 640px){
  .bloglar .blog-list .blogs .title{
    margin-top: 0.75rem;
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .bloglar .blog-list .blogs p{
    margin-top: 0.5rem;
  }
}

.bloglar .blog-detay{
  margin-left: auto;
  margin-right: auto;
  margin-top: 2rem;
  width: 100%;
}

@media (min-width: 640px){
  .bloglar .blog-detay{
    margin-top: 2.75rem;
    max-width: 49rem;
  }
}

.bloglar .blog-detay .blog-detay-ust{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  text-align: center;
}

.bloglar .blog-detay .blog-detay-ust .title{
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--siyah);
}

@media (min-width: 640px){
  .bloglar .blog-detay .blog-detay-ust .title{
    font-size: 2rem;
  }
}

.bloglar .blog-detay .blog-detay-ust span{
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 600;
  color: var(--gri_700);
}

.bloglar .blog-detay .blog-detay-resim{
  margin-top: 2.25rem;
}

.bloglar .blog-detay .blog-detay-resim img{
  height: auto;
  width: 100%;
  border-radius: 0.5rem;
}

/* tipo */
.tipo{
  margin-top: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

@media (min-width: 640px){
  .tipo{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

.tipo h1,.tipo h2,.tipo h3,.tipo h4,.tipo h5,.tipo h6{
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  line-height: 1.8;
  color: var(--mavi);
}

.tipo p{
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 500;
  line-height: 1.8;
  color: var(--mavi);
}

.tipo ul li{
  list-style-position: inside;
  list-style-type: disc;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.8rem;
  color: var(--mavi);
}

.shop-icerikler{
  width: 100%;
}
.icerik-alani{
  width: 100%;
  padding-bottom: 140px;
}
@media(max-width:768px){
  .icerik-alani{
    padding-bottom: 100px;
  }
}
@media(max-width:640px){
  .icerik-alani{
    padding-bottom: 60px;
  }
}
.woocommerce-mini-cart__empty-message{
  font-size: 14px;
  font-weight: 600;
  color: var(--gri_700);
  text-align: center;
  width: 100%;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
}
.icerik-alani .ust-title{
  font-size: 30px;
  font-weight: 700;
  color: var(--mavi);
  text-transform: uppercase;
  width: 100%;
  margin-bottom: 37px;
}
@media(max-width:768px){
  .icerik-alani .ust-title{
    font-size: 24px;
    margin-bottom: 20px;
  }
}
@media(max-width:640px){
  .icerik-alani .ust-title{
    font-size: 20px;
  }
}
.woocommerce .woocommerce-breadcrumb{
  margin: 0;
}
.wc-block-components-totals-coupon__form .wc-block-components-totals-coupon__button{
  padding: 8px 16px !important;
  min-height: auto !important;
  font-size: 1rem;
}
.wcs-golge{
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.25);
  z-index: 9998;
  display: none;
}
#woocommerce-custom-sidebar{
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  overflow: hidden;
  background-color: var(--beyaz);
  width: 100%;
  max-width: 400px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  transform: translateX(-600px);
  transition: 500ms transform;
}
@media(max-width:640px){
  #woocommerce-custom-sidebar{
    max-width: 320px;
    transform: translateX(-450px);
  }
}
#woocommerce-custom-sidebar.aktif{
  transform: translateX(0);
}
.wcs-icerikler{
  width: 100%;
  overflow: auto;
  flex: 1;
}
.p-sidebar-ust{
  width: 100%;
  display: flex;
  align-items: center;
  padding: 20px;
  border-bottom: 1px solid var(--gri_300);
  span{
    flex: 1;
    font-size: 14px;
    font-weight: 600;
    color: var(--mavi);
  }
  button{
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mavi);
    svg{
      font-size: 16px;
    }
    em{
      font-style: normal;
    }
  }
}
.widget.widget_block{
  width: 100%;
  padding: 24px 20px;
  border-top: 1px solid var(--gri_300);
}
.wc-block-components-price-slider--is-input-inline .wc-block-components-price-slider__controls .wc-block-components-price-slider__amount{
  max-width: 70px;
}
.wc-block-active-filters .wc-block-active-filters__list{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.wc-block-active-filters .wc-block-active-filters__list--chips li, 
.wc-block-active-filters .wc-block-active-filters__list--chips ul{
  flex-wrap: nowrap;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  color: var(--mavi);
  border: 1px solid var(--gri_300);
  border-radius: 999px;
  padding: 4px 8px;
}
.wc-block-active-filters .wc-block-active-filters__list--chips .wc-block-components-chip{
  display: flex;
  gap: 4px;
}
.wc-block-components-chip__remove{
  font-size: 20px;
}
#block-16:has(.wp-block-woocommerce-active-filters:empty){
  display: none;
}
#block-16:has(.wp-block-woocommerce-active-filters){
  padding: 12px 20px;
}
.wc-block-active-filters .wc-block-active-filters__clear-all{
  margin-top: 8px;
  font-size: 12px;
  text-decoration: none;
  color: var(--kirmizi);
  background-color: rgba(219, 71, 71, 0.10);
  padding: 4px 8px;
  transition: 300ms background-color;
}
.wc-block-active-filters .wc-block-active-filters__clear-all:hover{
  background-color: rgba(219, 71, 71, 0.20);
  color: var(--kirmizi);
}
.page .icerik-alani .ust-title{
  text-align: center;
  padding-top: 46px;
  padding-bottom: 40px;
}
@media(max-width:1200px){
  .page .icerik-alani .ust-title{
    padding-top: 20px;
    padding-bottom: 0;
  }
}
.custom-shop-controls{
  width: 100%;
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
}
@media(max-width:640px){
  .custom-shop-controls{
    gap: 8px;
    margin-bottom: 20px;
  }
}
.fac{
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 45px;
  border: 1px solid var(--mavi);
  font-size: 14px;
  font-weight: 600;
  color: var(--mavi);
  gap: 12px;
  em{
    font-style: normal;
  }
  svg{
    font-size: 24px;
  }
}
.custom-ordering-container{
  flex: 1;
  .woocommerce-ordering{
    margin-bottom: 0;
    width: 100%;
    select{
      width: 100%;
      border: 1px solid var(--mavi);
      height: 45px;
      font-size: 14px;
      font-weight: 600;
      color: var(--mavi);
      text-align: center;
      padding: 0 20px;
    }
  }
}
@media(max-width:640px){
  .custom-ordering-container{
    .woocommerce-ordering{
      select{
        height: 40px;
        font-size: 13px;
        padding: 0;
      }
    }
  }
  .fac{
    height: 40px;
    font-size: 13px;
    gap: 8px;
    svg{
      font-size: 20px;
    }
  }
}
.shop-icerikler .products.swiper-wrapper.columns-4{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  column-gap: 20px;
  row-gap: 40px;
  .product{
    width: calc(25% - 15px);
  }
}
@media(max-width:1280px){
  .shop-icerikler .products.swiper-wrapper.columns-4{
    column-gap: 15px;
    .product{
      width: calc(33.3333% - 10px);
    }
  }
}
@media(max-width:768px){
  .shop-icerikler .products.swiper-wrapper.columns-4{
    column-gap: 10px;
    .product{
      width: calc(50% - 5px);
      margin-bottom: 0;
    }
  }
}
.woocommerce nav.woocommerce-pagination ul{
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  margin: 0;
  margin-top: 80px;
  border: 0;
}
.woocommerce nav.woocommerce-pagination ul li{
  border: 0;
  font-size: 13px;
  font-weight: 700;
}
.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current{
  background-color: var(--mavi);
  color: var(--beyaz);
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span{
  padding: 12px 16px;
  background-color: var(--gri_100);
  color: var(--mavi);
}
.iletisim .ust-title{
  text-align: center;
  margin-top: 20px;
}
.adres-form{
  width: 100%;
  display: flex;
  align-items: flex-start;
  padding-top: 70px;
  padding-inline: 80px;
  gap: 100px;
  @media(max-width:640px){
    &{
      gap: 40px;
    }
  }
  .af-sol{
    flex: 1;
    display: flex;
    align-items: flex-start;
    gap: 32px;
    @media(max-width:640px){
      &{
        gap: 20px;
      }
    }
    .icon{
      width: 67px;
      height: 67px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 32px;
      background-color: var(--mavi);
      color: var(--beyaz);
      border-radius: 999px;
      @media(max-width:640px){
        &{
          width: 40px;
          height: 40px;
          font-size: 24px;
        }
      }
    }
    .af-adres{
      flex: 1;
      display: flex;
      flex-direction: column;
      padding-top: 6px;
      @media(max-width:640px){
        &{
          padding-top: 0;
        }
      }
      .af-ust{
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 4px;
        @media(max-width:640px){
          &{
            gap: 0;
          }
        }
        span{
          font-size: 16px;
          color: var(--mavi);
          font-weight: 700;
          @media(max-width:640px){
            &{
              font-size: 14px;
            }
          }
        }
        b{
          font-size: 20px;
          font-weight: 700;
          color: var(--mavi);
          @media(max-width:640px){
            &{
              font-size: 18px;
            }
          }
        }
      }
      .af-adres-bilgi{
        margin-top: 28px;
        display: flex;
        flex-direction: column;
        gap: 12px;
        max-width: 345px;
        @media(max-width:640px){
          &{
            margin-top: 20px;
            max-width: 100%;
          }
        }
        p{
          font-size: 16px;
          font-weight: 500;
          color: var(--mavi);
          @media(max-width:640px){
            &{
              font-size: 14px;
            }
          }
        }
      }
      ul{
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        margin-top: 24px;
        @media(max-width:640px){
          &{
            gap: 16px;
            margin-top: 20px;
          }
        }
        li{
          width: 100%;
          display: flex;
          align-items: center;
          gap: 12px;
          font-size: 16px;
          font-weight: 600;
          color: var(--mavi);
          @media(max-width:640px){
            &{
              font-size: 14px;
            }
          }
          svg{
            font-size: 28px;
            @media(max-width:640px){
              &{
                font-size: 24px;
              }
            }
          }
        }
      }
      .bizi-takip{
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        margin-top: 80px;
        @media(max-width:640px){
          &{
            gap: 16px;
            margin-top: 32px;
          }
        }
        .bt-title{
          font-size: 18px;
          font-weight: 600;
          color: var(--mavi);
          @media(max-width:640px){
            &{
              font-size: 16px;
            }
          }
        }
        .b-sosyal{
          width: 100%;
          display: flex;
          align-items: center;
          gap: 24px;
          @media(max-width:640px){
            &{
              gap: 18px;
            }
          }
          a{
            font-size: 32px;
            color: var(--mavi);
            @media(max-width:640px){
              &{
                font-size: 28px;
              }
            }
            &:hover{
              color: var(--mavi_hover);
            }
          }
        }
      }
    }
  }
  .af-sag{
    flex: 1;
    .igrup{
      width: 100%;
      display: flex;
      column-gap: 16px;
      @media(max-width:640px){
        &{
          column-gap: 0;
          flex-direction: column;
        }
      }
    }
    .ialan{
      width: 100%;
      margin-bottom: 16px;
      @media(max-width:640px){
        &{
          margin-bottom: 8px;
        }
      }
      .itext,
      .iarea{
        width: 100%;
        height: 60px;
        border: 2px solid var(--gri_300);
        padding: 0 20px;
        font-size: 16px;
        font-weight: 500;
        color: var(--mavi);
        transition: 300ms border-color;
        &:user-valid{
          border-color: var(--yesil);
          color: var(--yesil);
        }
        @media(max-width:640px){
          &{
            height: 44px;
            padding: 0 16px;
            font-size: 14px;
          }
        }
        &::placeholder{
          opacity: 1;
          color: var(--gri_700);
          transition: 300ms opacity;
        }
        &:focus::placeholder{
          opacity: 0.3;
        }
        &:focus{
          border-color: var(--mavi);
        }
      }
      .iarea{
        height: 140px;
        padding: 20px;
        @media(max-width:640px){
          &{
            padding: 16px;
            height: 100px;
          }
        }
      }
      &:has(.ibuton){
        p{
          display: flex;
          align-items: center;
          span.wpcf7-spinner{
            order: 1;
            margin-left: auto;
          }
        }
      }
      &:has(.wpcf7-not-valid-tip){
        .itext,
        .iarea{
          border-color: var(--kirmizi);
          color: var(--kirmizi);
          &::placeholder{
            color: var(--kirmizi);
          }
        }
      }
      .ibuton{
        margin-top: 4px;
        padding: 20px 40px;
        background-color: var(--mavi);
        color: var(--beyaz);
        font-size: 16px;
        font-weight: 700;
        transition: 300ms background-color;
        order: 2;
        @media(max-width:640px){
          &{
            font-size: 14px;
            padding: 12px 28px;
            width: 100%;
            text-align: center;
          }
        }
        &:hover{
          background-color: var(--mavi_hover);
        }
      }
    }
    &:has(.wpcf7-form.sent){
      .igrup,
      .ialan{
        display: none;
      }
    }
  }
}
@media(max-width:1280px){
  .adres-form{
    padding-inline: 0;
  }
}
@media(max-width:1024px){
  .adres-form{
    flex-direction: column;
    > div{
      width: 100%;
    }
  }
}
@media(max-width:640px){
  .adres-form{
    padding-top: 30px;
  }
}
.harita{
  width: 100%;
  padding-bottom: 35%;
  position: relative;
  @media(max-width:640px){
    &{
      padding-bottom: 80%;
    }
  }
  iframe{
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
  }
}
.wpcf7-not-valid-tip{
  font-size: 13px;
  font-weight: 700;
}
.wp-block-woocommerce-cart-cross-sells-block{
  margin-top: 80px;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .wp-block-heading{
  font-weight: 600;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product div .wp-block-cart-cross-sells-product__product-title{
  margin-bottom: 0 !important;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product div .wc-block-components-product-image{
  margin-bottom: 8px !important;
}
.editor-styles-wrapper .wc-block-grid__products .wc-block-grid__product .wc-block-components-product-image .wc-block-components-product-sale-badge--align-left, .wc-block-components-product-image .wc-block-components-product-sale-badge--align-left{
  display: none;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product div .wc-block-components-product-price{
  margin-top: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--mavi);
}
.wp-block-woocommerce-cart-cross-sells-block{
  > div{
    width: 100%;
    display: flex;
    gap: 10px;
    @media(max-width:640px){
      &{
        gap: 8px;
        flex-wrap: wrap;
      }
    }
  }
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
  margin-right: 0 !important;
  width: 100% !important;
  padding-right: 0 !important;
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product .wc-block-components-product-button__button{
  background-color: var(--mavi);
  font-size: 12px;
  font-weight: 600;
  color: var(--beyaz);
  text-transform: uppercase;
  &:hover{
    background-color: var(--mavi_hover);
  }
}
.wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
  flex-shrink: 0;
  width: calc(33.3333% - 15px) !important;
}
@media(max-width:640px){
  .wp-block-woocommerce-cart .wp-block-woocommerce-cart-cross-sells-block .cross-sells-product{
    width: calc(50% - 4px) !important;
  }
}
.arama-ust{
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 40px;
  gap: 24px;
  align-items: flex-start;
  @media(max-width:640px){
    &{
      gap: 12px;
      margin-bottom: 28px;
    }
  }
  .title{
    font-size: 24px;
    @media(max-width:640px){
      &{
        font-size: 18px;
      }
    }
  }
}
.kat-arama{
  border: 1px solid var(--gri_300);
  border-radius: 999px;
  display: flex;
  align-items: center;
  overflow: hidden;
  @media(max-width:640px){
    &{
      width: 100%;
    }
  }
  .atext{
    height: 50px;
    padding: 0 20px;
    font-size: 16px;
    font-weight: 600;
    color: var(--mavi);
    flex: 1;
  }
  button{
    color: var(--mavi);
    font-size: 24px;
    width: 50px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.urunler:has(.arama-ust){
  padding-top: 20px;
  .products.columns-4{
    @media(max-width:640px){
      column-gap: 8px;
    }
    li{
      @media(max-width:640px){
        margin-bottom: 0 !important;
        width: calc(50% - 4px) !important;
      }
    }
  }
}
.wishlist-title-container{
  display: none;
}
table.wishlist_table.shop_table{
  border: 0;
  border-spacing: 0 8px;
  thead{
    display: none;
  }
  tbody{
    tr{
      background-color: var(--gri_100) !important;
      td{
        border: 0;
        background-color: transparent !important;
      }
    }
  }
}
.woocommerce table.shop_table.wishlist_table tr td.product-name{
  @media(min-width:768px){
    font-size: 16px;
    font-weight: 600;
    color: var(--mavi);
  }
}
.woocommerce table.shop_table.wishlist_table tr td.product-price{
  @media(min-width:768px){
    font-size: 13px;
    font-weight: 600;
    color: var(--mavi);
    ins{
      margin-left: 8px;
      text-decoration: none;
    }
  }
}
.woocommerce table.shop_table.wishlist_table tr td.product-stock-status{
  @media(min-width:768px){
    font-weight: 700;
  }
}
.woocommerce table.shop_table.wishlist_table tr td.product-add-to-cart{
  .remove_from_wishlist.button{
    @media(min-width:768px){
      background-color: var(--kirmizi);
      color: var(--beyaz);
    }
  }
}
.remove_from_wishlist::after{
  @media(max-width:768px){
    content: "Kaldır";
    font-size: 12px;
    font-weight: 600;
    color: var(--kirmizi);
  }
}
.additional-info{
  @media(max-width:768px){
    display: none;
  }
}
.item-details-table .label{
  @media(max-width:768px){
    display: none;
  }
}
.item-details-table .value{
  ins{
    @media(max-width:768px){
      text-decoration: none;
      font-weight: 600;
      color: var(--mavi);
    }
  }
  del{
    @media(max-width:768px){
      font-weight: 500;
      color: var(--gri_700);
    }
  }
}
.wishlist_table.modern_grid li .item-details h3, .wishlist_table.images_grid li .item-details h3, .wishlist_table.mobile li .item-details h3{
  @media(max-width:768px){
    font-size: 14px;
    font-weight: 600;
    color: var(--mavi);
  }
}
.wishlist_table.mobile li{
  @media(max-width:768px){
    display: flex;
    gap: 12px;
  }
}
.wc-block-attribute-filter .wc-block-attribute-filter-list{
  max-height: 280px;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.editor-styles-wrapper .wc-block-components-checkbox-list li, .wc-block-components-checkbox-list li{
  margin-bottom: 0;
}
.wc-block-components-checkbox{
  margin-top: 0;
}
.wp-block-woocommerce-attribute-filter{
  margin-top: 20px;
}
.wp-block-heading{
  font-weight: 600;
  font-size: 18px;
}
.berocket_single_filter_widget{
  width: 100%;
  padding: 20px;
  border-bottom: 1px solid var(--gri_300);
}
.bapf_sfilter{
  margin-bottom: 0;
}
.bapf_head h3{
  font-weight: 600;
  font-size: 18px;
  color: var(--mavi);
}
.bapf_body{
  margin-top: 20px;
  max-height: 280px;
  overflow: auto;
}
.bapf_body:has(.bapf_slidr_all){
  overflow: visible;
}
.bapf_head{
  cursor: pointer;
  user-select: none;
}
.bapf_slidr_main.ui-widget-content .ui-slider-handle, .berocket_filter_price_slider.ui-widget-content .ui-slider-handle, .slide.default .bapf_slidr_main .ui-state-default, .slide.default .bapf_slidr_main .ui-widget-header .ui-state-default, .slide.default .bapf_slidr_main.ui-widget-content .ui-state-default, .slide.default .berocket_filter_price_slider .ui-state-default, .slide.default .berocket_filter_price_slider .ui-widget-header .ui-state-default, .slide.default .berocket_filter_price_slider.ui-widget-content .ui-state-default{
  font-size: 32px;
  background-color: var(--beyaz);
  border: 1px solid var(--mavi);
  transform: translateY(-50%);
  top: 50%;
}
.bapf_slidr_jqrui .bapf_slidr_main{
  margin: 12px;
}
.bapf_slidr_all{
  margin-bottom: 20px;
}
.bapf_sfilter ul li{
  display: flex;
  align-items: center;
  column-gap: 16px;
  flex-wrap: wrap;
  ul{
    width: 100%;
  }
  label{
    flex: 1;
    padding-block: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--mavi);
  }
}
.bapf_sfilter.bapf_ckbox input[type=checkbox]{
  margin-right: 0;
  width: 17px;
  height: 17px;
  border-color: var(--gri_700);
  &:checked{
    accent-color: var(--mavi);
  }
}
.berocket_aapf_widget_selected_filter{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  .bapf_sfa_taxonomy{
    display: flex;
    flex-direction: column;
    ul{
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }
    span{
      font-size: 14px;
      font-weight: 500;
      color: var(--gri_700);
    }
  }
}
.bapf_sfa_inline .berocket_aapf_widget_selected_area ul li{
  margin: 0 !important;
  .braapf_unselect_all,
  .braapf_unselect{
    font-size: 14px;
    font-weight: 500;
    color: var(--mavi);
    i{
      color: var(--kirmizi);
    }
  }
}
.bapf_sfa_unall{
  li{
    width: 100%;
    display: flex !important;
    gap: 12px;
    a{
      margin-left: auto;
    }
  }
}
.single-product > .product{
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 440px;
  gap: 60px;
  @media(max-width:1280px){
    &{
      grid-template-columns: 1fr 350px;
      gap: 40px;
    }
  }
  @media(max-width:640px){
    &{
      gap: 20px;
    }
  }
  @media(max-width:1024px){
    &{
      display: flex;
      flex-direction: column;
    }
  }
}
.woocommerce #content div.product div.summary, .woocommerce div.product div.summary, .woocommerce-page #content div.product div.summary, .woocommerce-page div.product div.summary{
  width: 100%;
}
.up-sells.upsells.products{
  width: 100%;
  grid-column: span 2;
  margin-top: 80px;
  @media(max-width:1024px){
    &{
      margin-top: 50px;
    }
  }
  @media(max-width:640px){
    &{
      margin-top: 30px;
    }
  }
  h2{
    font-size: 24px;
    font-weight: 600;
    color: var(--mavi);
    margin-bottom: 28px;
    @media(max-width:640px){
      &{
        font-size: 20px;
        margin-bottom: 20px;
      }
    }
  }
  .products.swiper-wrapper.columns-4{
    li{
      display: flex;
      a{
        width: 100%;
      }
    }
  }
}
.related.products{
  width: 100%;
  grid-column: span 2;
  margin-top: 80px;
  @media(max-width:1024px){
    &{
      margin-top: 50px;
    }
  }
  @media(max-width:640px){
    &{
      margin-top: 0;
    }
  }
  h2{
    font-size: 24px;
    font-weight: 600;
    color: var(--mavi);
    margin-bottom: 28px;
    @media(max-width:640px){
      &{
        font-size: 20px;
        margin-bottom: 20px;
      }
    }
  }
  .products.swiper-wrapper.columns-4{
    li{
      display: flex;
      > a{
        width: 100%;
      }
    }
  }
}
.detay-resimler{
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(40%, 1fr));
  gap: 24px;
  grid-template-rows: max-content max-content;
  @media(max-width:1024px){
    grid-template-columns: repeat(auto-fit, minmax(28%, 1fr));   
    gap: 12px; 
  }
  @media(max-width:640px){
    & {
      scrollbar-width: none;
    }
  
    &::-webkit-scrollbar {
      display: none;
    }
  }
  @media(max-width:640px){
    &{
      display: flex;
      overflow: auto;
      width: calc(100% + 2rem);
      margin: 0 -1rem;
      padding: 0 1rem;
    }
  }
  .d-resim{
    width: 100%;
    max-height: max-content;
    cursor: pointer;
    @media(max-width:640px){
      &{
        width: 85%;
        flex-shrink: 0;
      }
    }
    img{
      width: 100%;
      height: auto;
    }
  }
}
.akordionlar{
  width: 100%;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--gri_300);
  position: sticky;
  top: 0;
  .detay-acilir{
    width: 100%;
    border-bottom: 1px solid var(--gri_300);
    .da-header{
      width: 100%;
      display: flex;
      align-items: center;
      padding: 24px 0;
      font-size: 14px;
      text-transform: uppercase;
      font-weight: 700;
      color: var(--mavi);
      cursor: pointer;
      svg{
        margin-left: auto;
        font-size: 32px;
      }
      &.aktif{
        svg{
          transform: rotate(-180deg);
        }
      }
    }
    .da-icerik{
      padding-bottom: 20px;
      display: none;
      .da-bilgi{
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        p{
          font-size: 12px;
          line-height: 1.6;
          color: var(--mavi);
        }
        ul{
          width: 100%;
          li{
            width: 100%;
            display: flex;
            align-items: flex-start;
            font-size: 12px;
            font-weight: 700;
            color: var(--mavi);
            margin-bottom: 8px;
            strong,
            b{
              font-weight: 400;
              width: 30%;
              flex-shrink: 0;
            }
          }
        }
      }
    }
  }
}
.woocommerce div.product div.summary{
  margin-bottom: 0;
}
.qty{
  width: 24px;
  height: 24px;
  text-align: center;
  font-size: 1.25rem;
  line-height: 24px;
  color: var(--siyah);
}
.quantity{
  margin-right: 0 !important;
}
.plus{
  font-size: 2rem;
  color: var(--yesil_koyu);
  transition: 300ms color;
  &:hover{
    color: var(--yesil_koyu_1);
  }
}
.detayt-title h1{
  font-size: 24px;
  font-weight: 700;
  color: var(--mavi);
  @media(max-width:640px){
    &{
      font-size: 20px;
    }
  }
}
.summary.entry-summary{
  .price{
    margin-top: 20px;
    display: flex;
    gap: 12px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--gri_300);
    margin-bottom: 28px;
    @media(max-width:640px){
      &{
        padding-bottom: 24px;
        margin-bottom: 20px;
        margin-top: 12px;
      }
    }
    del{
      order: 2;
      font-size: 14px;
      font-weight: 500;
      color: var(--mavi);
    }
    ins{
      text-decoration: none;
      font-size: 16px;
      font-weight: 700;
      color: var(--mavi);
    }
    &:has(.woocommerce-Price-amount){
      font-size: 14px;
      font-weight: 700;
      color: var(--mavi);
    }
  }
}
.cfvsw-label-none table.variations tr th.label{
  display: block !important;
}
.variations.cfvsw-variation-disable-logic{
  tbody{
    display: flex;
    flex-direction: column;
    gap: 12px;
    tr{
      display: flex;
      flex-direction: column;
      gap: 4px;
      .label{
        text-align: left;
        color: var(--mavi);
        label{
          font-size: 14px !important;
          font-weight: 600 !important;
        }
      }
    }
  }
}
.cfvsw-label-option{
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0;
  border: 0;
  background-color: var(--gri_100);
  color: var(--mavi);
  font-size: 13px;
  font-weight: 700;
  border-radius: 0 !important;
  &.cfvsw-selected-swatch{
    background-color: var(--mavi);
    color: var(--beyaz);
  }
}
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) #respond input#submit.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) a.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt:disabled[disabled]:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt.disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled:hover, .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled], .woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) input.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce #respond input#submit.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce a.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce button.button.alt:disabled[disabled]:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt.disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt.disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled:hover, :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled[disabled], :where(body:not(.woocommerce-block-theme-has-button-styles)):where(:not(.edit-post-visual-editor*)) .woocommerce input.button.alt:disabled[disabled]:hover{
  background-color: var(--mavi);
  color: var(--beyaz);
}
.cfvsw-swatches-option{
  padding: 0;
  border: 0;
}
.cfvsw-swatches-option:not( .cfvsw-label-option, .cfvsw-image-option ) .cfvsw-swatch-inner{
  border: 0;
}
.cfvsw-swatches-option .cfvsw-swatch-inner{
  width: 100%;
  height: 100%;
}
.cfvsw-swatches-option:not( .cfvsw-swatches-disabled, .cfvsw-swatches-out-of-stock ):hover{
  border: 0;
}
.cfvsw-selected-swatch{
  border: 3px solid var(--mavi) !important;
}
.reset_variations{
  padding: 6px 8px;
  background-color: rgba(206, 70, 70, .1);
  color: var(--kirmizi);
  font-size: 13px !important;
  font-weight: 600;
  margin-top: 12px;
  display: inline-block;
  line-height: 1.3;
}
.cfvsw-swatches-container{
  grid-gap: 7px;
}
.single-product{
  .single_add_to_cart_button{
    padding: 18px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
  }
  .stock.in-stock{
    font-size: 13px !important;
    font-weight: 600;
    color: var(--kirmizi) !important;
    padding-bottom: 6px;
  }
}
.yith-add-to-wishlist-button-block.yith-add-to-wishlist-button-block--single{
  width: 100%;
  margin-bottom: 48px;
  margin-top: 8px;
}
.woocommerce div.product form.cart{
  margin-bottom: 0;
  position: relative;
}
.summary .yith-wcwl-add-to-wishlist-button{
  width: 100%;
  justify-content: center !important;
  height: 40px;
  align-items: center;
  font-size: 13px !important;
  font-weight: 500;
  color: var(--mavi);
  border: 1px solid var(--mavi);
  padding: 0 !important;
  &.yith-wcwl-add-to-wishlist-button--added{
    border-color: var(--gri_300);
    svg{
      color: var(--kirmizi) !important;
    }
  }
}
.woocommerce-table__product-name{
  ul{
    margin-top: 8px;
    li{
      font-size: 13px;
      font-weight: 500;
      color: var(--mavi);
    }
  }
}
.taki-isim{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 30px;
  label{
    font-size: 14px;
    font-weight: 600;
    color: var(--mavi);
  }
  input{
    width: 100%;
    height: 45px;
    padding: 0 20px;
    font-size: 14px;
    font-weight: 500;
    color: var(--mavi);
    background-color: var(--gri_100);
  }
}
.beden-buton{
  display: none;
  font-size: 12px;
  font-weight: 600;
  color: var(--gri_800);
  position: absolute;
  right: 0;
  top: 12px;
}
body:has(.klavuz) {
  .beden-buton{
    display: flex;
  }
}
.olculer{
  width: 100%;
  .olcu-baslik{
    width: 100%;
    p{
      font-size: 12px;
      font-weight: 400;
      color: var(--mavi);
      line-height: 1.6;
    }
    .olcu-title{
      font-size: 14px;
      font-weight: 700;
      color: var(--mavi);
      text-transform: uppercase;
      margin-top: 20px;
    }
    span{
      margin-top: 16px;
      font-size: 12px;
      font-weight: 500;
      color: var(--mavi);
      display: block;
    }
  }
  ol{
    width: 100%;
    margin-top: 8px;
    display: flex;
    li{
      flex: 1;
      padding: 2.5px 12px;
      text-align: center;
      font-size: 12px;
      font-weight: 700;
      color: var(--mavi);
      background-color: var(--gri_100);
      cursor: pointer;
      &.aktif{
        background-color: var(--mavi);
        color: var(--beyaz);
      }
    }
  }
  ul{
    width: 100%;
    margin-top: 20px;
    display: none;
    flex-direction: column;
    gap: 2px;
    overflow: auto;
    li{
      width: 100%;
      display: flex;
      align-items: center;
      padding: 5px 0;
      font-size: 12px;
      font-weight: 400;
      color: var(--mavi);
      &:first-child{
        font-weight: 600;
      }
      &:nth-child(2n+2){
        background-color: var(--gri_100);
      }
      span{
        flex: 1;
      }
    }
    &.aktif{
      display: flex;
    }
  }
}
.ti-alan{
  width: 100%;
  h3{
    font-size: 14px;
    font-weight: 700;
    color: var(--mavi);
    margin-bottom: 20px;
  }
  p{
    font-size: 12px;
    color: var(--mavi);
    font-weight: 400;
    margin-bottom: 8px;
  }
}
#global-kargo-bar{
  width: 100%;
  max-width: 280px;
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 1000;
  background-color: #FBF1DD;
  color: var(--mavi);
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  padding: 12px;
  box-shadow: 0 0 30px rgb(0 0 0 / 0.1);
  border: 1px solid #FFC247;
  @media(max-width:640px){
    &{
      max-width: none;
      right: 0;
      bottom: 0;
      font-size: 12px;
      padding: 8px;
      border: 0;
    }
  }
}
.woocommerce-checkout .free-shipping-hs{
  display: none;
}
.wc-block-cart .wc-block-cart__submit-container--sticky{
  display: none;
}
.wc-block-components-checkbox{
  label{
    align-items: center !important;
    span{
      line-height: 1.4;
      a{
        text-decoration: underline;
        text-underline-offset: 3px;
        &:hover{
          text-decoration: none;
        }
      }
    }
  }
}
li.product a img, .woocommerce ul.products li.product a img{width:100%}
.wc-item-meta p{
font-size: 14px !important;
	line-height: inherit !important;
	margin-bottom: 0 !important;
}
.wc-item-meta-label{
	color: var(--gri_700);
}
.free-shipping-hs{
background-color: #EEFAEF !important;
	border-color: #57CF5F !important;
}