/* Özgür İletişim header — logo + menü aynı satır; kaydırınca alt şerit yok */

/* Site içeriği — Bootstrap container'dan biraz daha geniş */
@media (min-width: 1400px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1400px;
  }
}
@media (min-width: 1600px) {
  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    max-width: 1480px;
  }
}

.oi-site-header {
  --oi-ink: #212529;
  --oi-muted: #6c757d;
  --oi-line: #e9ecef;
  --oi-bg: #ffffff;
  --oi-soft: #f8f9fa;
  --oi-hot: #dc3545;
  --oi-primary: #0d6efd;

  position: sticky;
  top: 0;
  z-index: 1050;
  background: var(--oi-bg);
  font-family: "Cabin", sans-serif;
  border-bottom: 1px solid transparent;
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.oi-site-header.is-compact {
  border-bottom-color: var(--oi-line);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.06);
}

/* 1) Üst yardımcı linkler — kendi temamız */
.oi-toplinks {
  background: var(--oi-soft);
  border-bottom: 1px solid var(--oi-line);
  font-size: 12px;
  max-height: 40px;
  opacity: 1;
  overflow: hidden;
  transition: max-height 0.28s ease, opacity 0.2s ease, border 0.28s ease;
}
.oi-toplinks .oi-toplinks-inner {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 4px 18px;
  flex-wrap: wrap;
  min-height: 34px;
  padding: 6px 0;
}
.oi-toplinks a {
  color: var(--oi-muted);
  text-decoration: none;
  white-space: nowrap;
}
.oi-toplinks a:hover { color: var(--oi-ink); }
.oi-toplinks a.is-hot { color: var(--oi-hot); font-weight: 600; }

.oi-site-header.is-compact .oi-toplinks {
  max-height: 0;
  opacity: 0;
  border-bottom-width: 0;
  pointer-events: none;
}

/* 2) Ana satır: logo | arama | aksiyonlar */
.oi-mainbar {
  position: relative;
  z-index: 70;
  padding: 12px 0;
  transition: padding 0.28s ease;
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(90deg, #212529, #0d6efd, #20c997, #fd7e14, #6f42c1, #212529) 1;
}
.oi-site-header.is-compact .oi-mainbar {
  padding: 6px 0;
}

.oi-mainbar-inner {
  display: flex;
  align-items: center;
  gap: 18px 24px;
  min-height: 52px;
}

.oi-brand {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: var(--oi-ink);
  flex: 0 0 auto;
  line-height: 0;
  background: transparent;
  padding: 0;
  border-radius: 0;
}
.oi-brand-logo,
.oi-brand img {
  display: block;
  height: 80px;
  width: auto;
  max-width: 280px;
  object-fit: contain;
  background: transparent;
  transition: height 0.28s ease, max-width 0.28s ease;
}
.oi-site-header.is-compact .oi-brand-logo,
.oi-site-header.is-compact .oi-brand img {
  height: 60px;
  max-width: 240px;
}

.oi-brand-name,
.oi-brand-tag { display: none !important; }
.oi-inline-nav { display: none !important; }

/* Arama — ortada geniş, kendi tema stili */
.oi-search {
  flex: 1 1 auto;
  max-width: 560px;
  margin: 0 auto;
  min-width: 0;
  position: relative;
  z-index: 80;
}
.oi-search-box {
  display: flex;
  align-items: center;
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 4px;
  overflow: hidden;
  position: relative;
  z-index: 1;
}
.oi-search-box::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 2px;
  background: linear-gradient(90deg, #212529 0%, #0d6efd 40%, #20c997 70%, #fd7e14 100%);
}
.oi-search-box .oi-search-icon {
  padding: 0 0 0 12px;
  color: var(--oi-muted);
  font-size: 14px;
}
.oi-search-box input {
  flex: 1;
  border: 0;
  outline: 0;
  padding: 11px 10px;
  font-size: 13px;
  background: transparent;
  color: var(--oi-ink);
  min-width: 0;
}
.oi-search-box input::placeholder { color: #adb5bd; }
.oi-search-box input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; appearance: none; }
.oi-search-box button[type="submit"] {
  border: 0;
  background: #212529;
  color: #fff;
  padding: 11px 16px;
  font-weight: 600;
  font-size: 13px;
  cursor: pointer;
}
.oi-search-box button[type="submit"]:hover { background: #000; }

.oi-search-suggest {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  z-index: 90;
  background: #fff;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.12);
  max-height: min(420px, 70vh);
  overflow: auto;
  padding: 6px 0;
}
.oi-search-suggest[hidden] {
  display: none !important;
}
.oi-search-suggest-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  text-decoration: none;
  color: inherit;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
  cursor: pointer;
}
.oi-search-suggest-item:hover,
.oi-search-suggest-item.is-active {
  background: var(--oi-soft);
}
.oi-search-suggest-thumb {
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border-radius: 6px;
  overflow: hidden;
  background: var(--oi-soft);
  border: 1px solid var(--oi-line);
}
.oi-search-suggest-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.oi-search-suggest-meta {
  min-width: 0;
  flex: 1 1 auto;
}
.oi-search-suggest-name {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-ink);
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.oi-search-suggest-sub {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--oi-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.oi-search-suggest-price {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 700;
  color: var(--oi-primary);
  white-space: nowrap;
}
.oi-search-suggest-empty,
.oi-search-suggest-status {
  margin: 0;
  padding: 14px 16px;
  font-size: 13px;
  color: var(--oi-muted);
}
.oi-search-suggest-more {
  display: block;
  padding: 11px 14px;
  border-top: 1px solid var(--oi-line);
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-primary);
  text-decoration: none;
  text-align: center;
}
.oi-search-suggest-more:hover {
  background: var(--oi-soft);
}
.oi-search-suggest-section {
  padding: 8px 14px 4px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--oi-muted);
}
.oi-search-suggest-thumb--icon {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--oi-primary);
  font-size: 16px;
}
.oi-search-suggest-go {
  flex: 0 0 auto;
  color: #adb5bd;
  font-size: 12px;
}

/* Arama merkezi: sonuçları küçük bir tooltip yerine odaklı, geniş panelde sunar. */
.oi-search-clear {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  margin-right: 4px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #64748b;
  cursor: pointer;
}
.oi-search-clear:hover { background: #f1f5f9; color: #172033; }
.oi-search-backdrop {
  position: fixed;
  z-index: 75;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(15, 23, 42, .48);
  cursor: default;
}
.oi-search-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 24px 15px;
  border-bottom: 1px solid #edf0f5;
  color: #475569;
  font-size: 14px;
}
.oi-search-result-head b { color: #172033; }
.oi-search-result-head button {
  border: 0;
  background: transparent;
  padding: 4px;
  color: #64748b;
  font-size: 13px;
  cursor: pointer;
}
.oi-search-result-head button:hover { color: var(--oi-primary); }
.oi-search-result-layout {
  display: grid;
  grid-template-columns: minmax(190px, .72fr) minmax(0, 1.7fr);
  min-height: 245px;
}
.oi-search-result-layout--products-only { grid-template-columns: minmax(0, 1fr); }
.oi-search-result-group { padding: 20px 24px; }
.oi-search-result-categories { background: #f8fafc; border-right: 1px solid #edf0f5; }
.oi-search-result-group h3 {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 0 0 12px;
  color: #172033;
  font-size: 14px;
  font-weight: 700;
}
.oi-search-result-group h3 i { color: var(--oi-primary); font-size: 14px; }
.oi-search-result-group h3 small { color: #94a3b8; font-size: 11px; font-weight: 600; }
.oi-search-result-categories .oi-search-suggest-item { padding: 8px 7px; border-radius: 8px; }
.oi-search-result-categories .oi-search-suggest-thumb { width: 32px; height: 32px; flex-basis: 32px; border: 0; background: #eaf1ff; font-size: 12px; }
.oi-search-result-categories .oi-search-suggest-name { font-size: 12px; }
.oi-search-result-categories .oi-search-suggest-sub { font-size: 11px; }
.oi-search-product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.oi-search-product-grid .oi-search-product {
  min-width: 0;
  padding: 10px;
  border: 1px solid #edf0f5;
  border-radius: 10px;
}
.oi-search-product-grid .oi-search-product:hover,
.oi-search-product-grid .oi-search-product.is-active { border-color: #bcd2f4; background: #f7faff; }
.oi-search-product-grid .oi-search-suggest-thumb { width: 52px; height: 52px; flex-basis: 52px; border-radius: 8px; }
.oi-search-product-grid .oi-search-suggest-name { font-size: 12px; }
.oi-search-product-grid .oi-search-suggest-sub { font-size: 11px; }
.oi-search-product-grid .oi-search-suggest-price { font-size: 12px; }
.oi-search-discover { padding: 24px; }
.oi-search-discover-title { display: flex; flex-direction: column; gap: 4px; margin-bottom: 16px; color: #172033; font-size: 16px; font-weight: 700; }
.oi-search-discover-title small { color: #64748b; font-size: 12px; font-weight: 400; }
.oi-search-terms { display: flex; flex-wrap: wrap; gap: 8px; }
.oi-search-term {
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #fff;
  padding: 8px 12px;
  color: #334155;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.oi-search-term i { margin-right: 5px; color: #94a3b8; font-size: 10px; }
.oi-search-term:hover { border-color: #a8c2f3; background: #f7faff; color: var(--oi-primary); }
.oi-search-discover-cats { margin-top: 23px; padding-top: 16px; border-top: 1px solid #edf0f5; }
.oi-search-discover-cats > span { display: block; margin-bottom: 9px; color: #64748b; font-size: 12px; font-weight: 700; }
.oi-search-discover-cats > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.oi-search-discover-cat { display: flex; align-items: center; gap: 8px; min-width: 0; padding: 10px; border: 1px solid #edf0f5; border-radius: 9px; color: #334155; font-size: 12px; font-weight: 600; }
.oi-search-discover-cat > i:first-child { color: var(--oi-primary); }
.oi-search-discover-cat span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oi-search-discover-cat > i:last-child { margin-left: auto; color: #94a3b8; font-size: 10px; }
.oi-search-discover-cat:hover { border-color: #bcd2f4; color: var(--oi-primary); }

@media (min-width: 768px) {
  /* Header'daki kutu kendi yerinde kalır; yalnızca sonuç paneli ayrı katmanda açılır. */
  body.oi-search-open .oi-search-box {
    border-color: var(--oi-primary);
    box-shadow: 0 0 0 3px rgba(13, 110, 253, .10);
  }
  body.oi-search-open .oi-search-suggest {
    position: fixed;
    z-index: 80;
    top: var(--oi-search-panel-top, 204px);
    left: 50%;
    width: min(1040px, calc(100vw - 48px));
    max-height: min(610px, calc(100vh - var(--oi-search-panel-top, 204px) - 24px));
    border: 1px solid var(--oi-line);
    border-radius: 14px;
    box-shadow: 0 20px 45px rgba(15, 23, 42, .18);
    transform: translateX(-50%);
  }
}

@media (max-width: 767px) {
  .oi-search-result-layout { grid-template-columns: 1fr; }
  .oi-search-result-categories { border-right: 0; border-bottom: 1px solid #edf0f5; }
  .oi-search-product-grid { grid-template-columns: 1fr; }
  .oi-search-discover-cats > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.oi-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}
.oi-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  color: var(--oi-ink);
  padding: 8px 10px;
  border-radius: 4px;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.2;
}
.oi-action i { font-size: 17px; color: var(--oi-ink); }
.oi-action-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.oi-action-text small {
  color: var(--oi-muted);
  font-size: 11px;
}
.oi-action-text strong {
  font-size: 13px;
  font-weight: 600;
}
.oi-action:hover {
  background: var(--oi-soft);
  border-color: var(--oi-line);
}
.oi-action-cart {
  border-color: var(--oi-line);
  background: var(--oi-soft);
  position: relative;
  padding-right: 14px;
}

/* Hesabım açılır menü */
.oi-account-menu {
  position: relative;
}
.oi-account-menu .oi-action-account {
  gap: 6px;
}
.oi-account-caret {
  display: none;
  font-size: 10px;
  color: var(--oi-muted);
  margin-left: 2px;
  transition: transform 0.15s ease;
}
.oi-account-menu.is-auth .oi-account-caret {
  display: inline-block;
}
.oi-account-menu.is-open .oi-account-caret {
  transform: rotate(180deg);
}
.oi-account-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  z-index: 1200;
  min-width: 220px;
  padding: 12px 0 0; /* hover köprüsü: tetikleyici ile menü arası boşluk */
  background: transparent;
  border: 0;
  box-shadow: none;
}
.oi-account-dropdown::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 12px;
}
.oi-account-dropdown-inner {
  position: relative;
  padding: 8px 0;
  background: #fff;
  border: 1px solid var(--oi-line, #e9ecef);
  border-radius: 10px;
  box-shadow: 0 14px 36px rgba(15, 23, 42, 0.14);
}
.oi-account-dropdown-inner::before {
  content: "";
  position: absolute;
  top: -6px;
  right: 22px;
  width: 12px;
  height: 12px;
  background: #fff;
  border-left: 1px solid var(--oi-line, #e9ecef);
  border-top: 1px solid var(--oi-line, #e9ecef);
  transform: rotate(45deg);
}
.oi-account-dropdown[hidden] {
  display: none !important;
}
.oi-account-dropdown a,
.oi-account-dropdown button {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 10px 16px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
  text-decoration: none;
  cursor: pointer;
  line-height: 1.3;
}
.oi-account-dropdown a:hover,
.oi-account-dropdown button:hover {
  background: var(--oi-soft, #f8f9fa);
  color: var(--oi-primary, #0d6efd);
}
.oi-account-dropdown-sep {
  height: 1px;
  margin: 6px 0;
  background: var(--oi-line, #e9ecef);
}
.oi-account-dropdown [data-oi-logout] {
  color: #b02a37;
}
.oi-account-dropdown [data-oi-logout]:hover {
  background: #fff5f5;
  color: #b02a37;
}
.oi-drawer-account {
  display: grid;
  gap: 0;
}
.oi-drawer-account[hidden] {
  display: none !important;
}
.oi-cart-badge {
  position: absolute;
  top: 2px;
  right: 2px;
  min-width: 18px;
  height: 18px;
  border-radius: 999px;
  background: #212529;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 4px;
}

.oi-action-loc { display: none !important; }

.oi-mobile-toggle {
  display: none;
  border: 1px solid var(--oi-line);
  background: #fff;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  align-items: center;
  justify-content: center;
  color: var(--oi-ink);
  flex: 0 0 auto;
}

/* 3) Alt kategori şeridi + profesyonel mega menü */
.oi-catbar {
  position: relative;
  background: var(--oi-soft);
  border-bottom: 1px solid var(--oi-line);
  z-index: 40;
}
.oi-catbar-inner {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: 0;
  min-height: 60px;
  padding: 0;
  width: 100%;
}
.oi-catbar-loading {
  display: block;
  width: 100%;
  text-align: center;
  padding: 16px;
  color: var(--oi-muted);
  font-size: 14px;
}
.oi-mega-item {
  flex: 1 1 0;
  position: static;
  display: flex;
  align-items: stretch;
  justify-content: center;
}
.oi-mega-link {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  position: relative;
  padding: 14px 12px;
  text-decoration: none;
  color: var(--oi-ink);
  font-size: 15px;
  font-weight: 600;
  white-space: nowrap;
  text-align: center;
  transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  width: 100%;
  border-radius: 4px 4px 0 0;
}
.oi-mega-item:not(:last-child) .oi-mega-link::after {
  content: "";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 22px;
  background: linear-gradient(180deg, transparent, #212529 20%, #0d6efd 50%, #20c997 80%, transparent);
  opacity: 0.45;
  pointer-events: none;
}
.oi-mega-item.is-open .oi-mega-link::after,
.oi-mega-item.is-open + .oi-mega-item .oi-mega-link::after {
  opacity: 0;
}
.oi-mega-caret {
  font-size: 11px;
  opacity: 0.65;
  transition: transform 0.2s ease;
}
.oi-mega-item.is-open .oi-mega-caret {
  transform: rotate(180deg);
}
.oi-mega-link:hover,
.oi-mega-link.is-active,
.oi-mega-item.is-open > .oi-mega-link {
  color: var(--oi-primary);
  background: #fff;
  z-index: 2;
  box-shadow: 0 -1px 0 #fff;
}
.oi-mega-panel {
  position: absolute;
  left: 0;
  right: 0;
  top: 100%;
  background: #fff;
  border-top: 2px solid transparent;
  border-image: linear-gradient(90deg, #212529, #0d6efd, #20c997, #fd7e14, #6f42c1, #212529) 1;
  border-bottom: 1px solid var(--oi-line);
  box-shadow: 0 18px 40px rgba(33, 37, 41, 0.1);
  padding: 0;
  z-index: 50;
  animation: oiMegaIn 0.18s ease;
}
.oi-mega-panel[hidden] {
  display: none !important;
}
@keyframes oiMegaIn {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
.oi-mega-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  min-height: 280px;
  gap: 0;
}
.oi-mega-layout.has-banner {
  grid-template-columns: 220px minmax(0, 1fr) 280px;
}
.oi-mega-rail {
  background: var(--oi-soft);
  border-right: 1px solid var(--oi-line);
  padding: 16px 10px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.oi-mega-rail-top {
  display: block;
  margin: 0 6px 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--oi-line);
  font-size: 13px;
  font-weight: 700;
  color: var(--oi-primary);
  text-decoration: none;
}
.oi-mega-rail-top:hover { color: var(--oi-ink); }
.oi-mega-rail-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  border: 0;
  background: transparent;
  text-align: left;
  padding: 11px 12px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
  color: var(--oi-ink);
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}
.oi-mega-rail-item i {
  font-size: 11px;
  color: var(--oi-muted);
}
.oi-mega-rail-item:hover,
.oi-mega-rail-item.is-active {
  background: #fff;
  color: var(--oi-primary);
  border: 1px solid var(--oi-line);
  padding: 10px 11px;
}
.oi-mega-rail-item.is-active i { color: var(--oi-primary); }
.oi-mega-main {
  padding: 22px 28px;
}
.oi-mega-cols {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 6px 20px;
}
.oi-mega-leaf {
  display: block;
  padding: 10px 6px;
  text-decoration: none;
  color: var(--oi-ink);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  border-radius: 4px;
  transition: color 0.15s ease, padding-left 0.15s ease;
}
.oi-mega-leaf:hover {
  color: var(--oi-primary);
  padding-left: 6px;
}
.oi-mega-all-link {
  display: inline-block;
  margin-top: 18px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oi-primary);
  text-decoration: none;
}
.oi-mega-all-link:hover { color: var(--oi-ink); }
.oi-mega-empty {
  color: var(--oi-muted);
  font-size: 14px;
}
.oi-mega-cta {
  display: inline-flex;
  margin-top: 10px;
  padding: 8px 14px;
  border-radius: 4px;
  background: #212529;
  color: #fff;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
}
.oi-mega-cta:hover {
  background: #000;
  color: #fff;
}
.oi-mega-promo {
  padding: 16px;
  border-left: 1px solid var(--oi-line);
  background: var(--oi-soft);
}
.oi-mega-banner {
  position: relative;
  display: block;
  height: 100%;
  min-height: 280px;
  border-radius: 8px;
  overflow: hidden;
  background: #f4f6f8;
  text-decoration: none;
  color: #fff;
}
.oi-mega-banner img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.oi-mega-banner-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(17, 24, 39, 0.78) 0%, rgba(17, 24, 39, 0) 58%);
}
.oi-mega-banner-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 14px;
  height: 100%;
  min-height: 240px;
  padding: 20px;
}
.oi-mega-banner-title {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  max-width: 14em;
  font-family: "Cabin", sans-serif;
}
.oi-mega-banner-btn {
  display: inline-flex;
  align-self: flex-start;
  padding: 9px 16px;
  border-radius: 4px;
  background: #fff;
  color: #212529;
  font-size: 13px;
  font-weight: 700;
}
.oi-mega-banner:hover .oi-mega-banner-btn {
  background: #212529;
  color: #fff;
}
.oi-drawer-sub {
  padding-left: 12px !important;
  font-weight: 500 !important;
  color: #6c757d !important;
}
.oi-drawer-sub2 {
  padding-left: 22px !important;
  font-weight: 500 !important;
  color: #9aa3af !important;
  font-size: 13px !important;
}

/* Mobil menü */
.oi-drawer {
  position: fixed;
  inset: 0;
  z-index: 1300;
}
.oi-drawer[hidden] { display: none !important; }
.oi-drawer.is-open { display: block; }
.oi-drawer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.5);
}
.oi-drawer-panel {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(340px, 90vw);
  background: #fff;
  display: flex;
  flex-direction: column;
  box-shadow: 8px 0 32px rgba(15, 23, 42, 0.18);
  font-family: "Cabin", sans-serif;
}
.oi-drawer-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 14px 12px;
  border-bottom: 1px solid var(--oi-line, #e9ecef);
  flex: 0 0 auto;
}
.oi-drawer-brand img {
  height: 40px;
  width: auto;
  display: block;
}
.oi-drawer-close {
  width: 36px;
  height: 36px;
  border: 1px solid var(--oi-line, #e9ecef);
  border-radius: 8px;
  background: #fff;
  color: var(--oi-ink, #212529);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.oi-drawer-close:hover {
  background: var(--oi-soft, #f8f9fa);
}
.oi-drawer-body {
  flex: 1 1 auto;
  overflow: auto;
  padding: 8px 10px 20px;
  -webkit-overflow-scrolling: touch;
}
.oi-drawer-section {
  padding: 10px 4px 6px;
}
.oi-drawer-section + .oi-drawer-section {
  border-top: 1px solid #eef0f2;
  margin-top: 4px;
}
.oi-drawer-section--foot {
  padding-bottom: 8px;
}
.oi-drawer-label {
  margin: 0 8px 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #98a2b3;
}
.oi-drawer-link {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 0;
  padding: 12px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--oi-ink, #212529);
  text-decoration: none;
  font-weight: 600;
  font-size: 15px;
  text-align: left;
  cursor: pointer;
  font-family: inherit;
}
.oi-drawer-link i {
  width: 18px;
  text-align: center;
  color: var(--oi-primary, #0d6efd);
  font-size: 15px;
  flex: 0 0 auto;
}
.oi-drawer-link:hover {
  background: #f5f7fa;
  color: var(--oi-ink, #212529);
  text-decoration: none;
}
.oi-drawer-link--muted {
  color: #667085;
  font-weight: 600;
  font-size: 14px;
}
.oi-drawer-link--muted i {
  color: #98a2b3;
}
.oi-drawer-link--child {
  padding-left: 18px;
  font-size: 14px;
  font-weight: 600;
  color: #344054;
}
.oi-drawer-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #d0d5dd;
  margin: 0 6px;
  flex: 0 0 auto;
}
.oi-drawer-acc {
  margin: 0;
}
.oi-drawer-acc-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 40px;
  align-items: center;
  gap: 2px;
}
.oi-drawer-acc-row .oi-drawer-link {
  min-width: 0;
}
.oi-drawer-acc-toggle {
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #667085;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.oi-drawer-acc-toggle:hover {
  background: #f5f7fa;
  color: var(--oi-primary, #0d6efd);
}
.oi-drawer-acc-toggle i {
  transition: transform 0.2s ease;
  font-size: 12px;
}
.oi-drawer-acc.is-open > .oi-drawer-acc-row .oi-drawer-acc-toggle i {
  transform: rotate(180deg);
  color: var(--oi-primary, #0d6efd);
}
.oi-drawer-acc-panel {
  margin: 0 0 4px;
  padding: 2px 0 6px 8px;
  border-left: 2px solid #e7ebf0;
  margin-left: 18px;
}
.oi-drawer-acc-panel[hidden] {
  display: none !important;
}
.oi-drawer-acc-panel .oi-drawer-acc {
  margin-top: 2px;
}
.oi-drawer-account {
  display: grid;
  gap: 0;
}
.oi-drawer-account[hidden] {
  display: none !important;
}
.oi-drawer-logout {
  color: #b02a37 !important;
}
.oi-drawer-logout i {
  color: #b02a37 !important;
}

@media (max-width: 1100px) {
  .oi-catbar-inner {
    flex-wrap: wrap;
    justify-content: stretch;
  }
  .oi-mega-item {
    flex: 1 1 auto;
    min-width: 120px;
  }
  .oi-mega-layout,
  .oi-mega-layout.has-banner {
    grid-template-columns: 1fr;
  }
  .oi-mega-promo { border-left: 0; border-top: 1px solid var(--oi-line); }
  .oi-mega-rail { border-right: 0; border-bottom: 1px solid var(--oi-line); }
}

/* Şablon demo artıkları — asla gösterme */
.popup-mobile-menu,
.oi-offcanvas-cat-side-menu,
.oi-category-sidemenu,
.oi-toolbar,
.oi-toolbar.oi-toolbar--bottom,
.oi-toolbar.d-block,
.oi-toolbar.visible,
.oi-toolbar.d-xl-none,
#signinModal,
#signupModal,
#demos-modal,
#wishlistModal {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
  height: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  transform: none !important;
}

/* Mobil alt hızlı menü */
.oi-mobile-toolbar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1200;
  display: none;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  gap: 0;
  min-height: 58px;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border-top: 1px solid var(--oi-line, #e9ecef);
  box-shadow: 0 -6px 20px rgba(33, 37, 41, 0.08);
  font-family: "Cabin", sans-serif;
}
.oi-mobile-toolbar-item {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  margin: 0;
  padding: 4px 2px;
  border: 0;
  background: transparent;
  color: var(--oi-ink, #212529);
  text-decoration: none;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
}
.oi-mobile-toolbar-item i {
  font-size: 18px;
  color: var(--oi-primary, #0d6efd);
}
.oi-mobile-toolbar-item span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.oi-mobile-toolbar-item:hover,
.oi-mobile-toolbar-item:focus {
  color: var(--oi-primary, #0d6efd);
  text-decoration: none;
}
.oi-mobile-toolbar-badge {
  position: absolute;
  top: 0;
  right: calc(50% - 22px);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--oi-hot, #dc3545);
  color: #fff;
  font-size: 10px;
  font-style: normal;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}
.oi-mobile-toolbar-badge:empty,
.oi-mobile-toolbar-badge[data-empty="1"] {
  display: none;
}
@media (max-width: 1199.98px) {
  .oi-mobile-toolbar {
    display: grid;
  }
  body.oi-header-sticky,
  body {
    padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px));
  }
  .oi-footer {
    margin-bottom: 0;
  }
}

@media (max-width: 1100px) {
  .oi-action-text { display: none; }
  .oi-search { max-width: 420px; }
}

@media (max-width: 991px) {
  .oi-toplinks { display: none; }
  .oi-catbar { display: none; }
  .oi-mobile-toggle { display: inline-flex; }
  .oi-mainbar-inner {
    flex-wrap: wrap;
    gap: 10px;
  }
  .oi-brand-logo,
  .oi-brand img {
    height: 52px;
    max-width: 200px;
  }
  .oi-search {
    flex: 1 1 100%;
    max-width: none;
    order: 5;
  }
  .oi-actions { margin-left: auto; }
}

/* Ana sayfa hero banner — container ile sınırlı, oran korunur (kırpılmaz) */
.oi-products-banner-area {
  padding-bottom: 0;
}
.oi-hero-banner-wrap {
  padding-top: 20px;
  padding-bottom: 4px;
}
.oi-hero-banner-wrap .oi-hero-banner-activation-3 {
  border-radius: 6px;
  overflow: hidden;
  background: #f3f4f6;
}
.oi-hero-banner-figure {
  margin: 0;
  line-height: 0;
  aspect-ratio: 1920 / 780;
  background: #f3f4f6;
}
.oi-hero-banner-figure picture {
  display: block;
  width: 100%;
  height: 100%;
}
.oi-hero-banner-activation-3 .swiper-wrapper { align-items: stretch; }
.oi-hero-banner-activation-3 .swiper-slide { height: auto; overflow: hidden; }
.oi-hero-banner-activation-3 .swiper-slide > a { display: block; height: 100%; }
/* Fade geçişinde yalnızca aktif slayt görünür; klon slaytlar geçiş anında
   bannerların üst üste binmiş gibi görünmesine yol açmaz. */
.oi-hero-banner-activation-3.swiper-fade .swiper-slide { opacity: 0 !important; pointer-events: none; }
.oi-hero-banner-activation-3.swiper-fade .swiper-slide.swiper-slide-active { opacity: 1 !important; pointer-events: auto; }
.oi-hero-banner-figure img,
.oi-hero-banner-activation-3 .swiper-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  object-position: center;
  max-height: none;
}
@media (max-width: 767px) {
  .oi-hero-banner-wrap {
    padding-top: 14px;
    padding-bottom: 2px;
  }
  .oi-hero-banner-wrap .oi-hero-banner-activation-3 {
    border-radius: 4px;
  }
  .oi-hero-banner-figure {
    aspect-ratio: 1920 / 780;
  }
  .oi-hero-banner-figure.has-mobile-image {
    aspect-ratio: 16 / 10;
  }
  .oi-hero-banner-figure.has-mobile-image img {
    object-fit: cover;
  }
  .oi-hero-banner-activation-3 .swiper-button-prev,
  .oi-hero-banner-activation-3 .swiper-button-next {
    width: 34px;
    height: 34px;
    margin-top: -17px;
    border-radius: 50%;
    background: rgba(255,255,255,.92);
    box-shadow: 0 2px 10px rgba(15,23,42,.14);
  }
  .oi-hero-banner-activation-3 .swiper-button-prev { left: 8px; }
  .oi-hero-banner-activation-3 .swiper-button-next { right: 8px; }
}

/* Görsel öncelikli kompakt kart ölçeği. */
@media (min-width: 768px) {
  .oi-product-card.has-hover-box-shadow .oi-card-img,
  #oi-shop-products .oi-card-img {
    height: 220px;
    min-height: 220px;
  }
}
.oi-product-card.has-hover-box-shadow .oi-card-meta {
  min-height: 26px;
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .oi-card-subtitle {
  font-size: 12px;
}
.oi-product-card.has-hover-box-shadow .oi-card-title {
  min-height: 38px;
  margin: 4px 0;
  font-size: 14px;
  line-height: 19px;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating {
  min-height: 17px;
  margin: 0 0 2px;
}
.oi-product-card.has-hover-box-shadow .oi-rated-icon {
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .pricing-part .price-text {
  font-size: 18px;
}
.oi-product-card.has-hover-box-shadow .pricing-part del.price-text,
.oi-product-card.has-hover-box-shadow .oi-card-promo {
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 12px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  line-height: 1;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp {
  margin-top: 4px;
  padding-top: 4px;
}

/* Özgür İletişim katalog kartı: temiz ürün vitrini, teslimat ve fırsat bilgisi. */
.oi-product-card.has-hover-box-shadow {
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  box-shadow: 0 2px 7px rgba(19, 49, 89, .06);
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.oi-product-card.has-hover-box-shadow:hover {
  border-color: #9ec0ee;
  box-shadow: 0 10px 24px rgba(21, 73, 139, .13);
  transform: translateY(-3px);
}
.oi-product-card.has-hover-box-shadow .oi-card-img,
.oi-product-card.has-hover-box-shadow .oi-card-img.oi-bg-color-default,
#oi-shop-products .oi-card-img {
  background: #fff !important;
  border-bottom: 1px solid #edf1f6;
}
.oi-product-card.has-hover-box-shadow .oi-quick-btn-grp {
  top: 10px;
  right: 10px;
  bottom: auto;
  z-index: 3;
}
.oi-product-card.has-hover-box-shadow .oi-search-btn {
  display: none;
}
.oi-product-card.has-hover-box-shadow .oi-wishlisted-btn.oi-quick-btn {
  width: 34px;
  height: 34px;
  border: 1px solid #e1e8f2;
  border-radius: 50%;
  background: #fff;
  color: #173a67;
  box-shadow: 0 2px 6px rgba(17, 43, 78, .08);
}
.oi-product-card.has-hover-box-shadow .oi-wishlisted-btn.oi-quick-btn:hover {
  border-color: #215ada;
  background: #edf4ff;
  color: #215ada;
}
.oi-product-card.has-hover-box-shadow .oi-card-meta {
  display: flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  color: #47647f;
  font-size: 12px;
  font-weight: 600;
}
.oi-product-card.has-hover-box-shadow .oi-card-delivery {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.oi-product-card.has-hover-box-shadow .oi-card-delivery i {
  color: #215ada;
  font-size: 13px;
}
.oi-product-card.has-hover-box-shadow .oi-card-delivery.is-out,
.oi-product-card.has-hover-box-shadow .oi-card-delivery.is-out i {
  color: #8a98a8;
}
.oi-product-card.has-hover-box-shadow .oi-card-body {
  padding-top: 4px;
}
.oi-product-card.has-hover-box-shadow .oi-card-title a {
  color: #18212e;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating {
  margin: 2px 0 4px;
}
.oi-product-card.has-hover-box-shadow .oi-rating-icon-list {
  gap: 2px;
}
.oi-product-card.has-hover-box-shadow .oi-rated-icon {
  color: #f3b31a;
  font-size: 12px;
}
.oi-product-card.has-hover-box-shadow .pricing-part {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  min-height: 46px;
}
.oi-product-card.has-hover-box-shadow .pricing-part del.price-text {
  color: #8b96a4;
  font-size: 12px;
  font-weight: 600;
}
.oi-product-card.has-hover-box-shadow .pricing-part .price-text {
  color: #153f78;
  font-size: 19px;
  font-weight: 800;
  line-height: 1.15;
}
.oi-product-card.has-hover-box-shadow .oi-card-promo {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  width: fit-content;
  margin: 2px 0 5px;
  padding: 4px 7px;
  border-radius: 6px;
  background: #eaf2ff;
  color: #1e5bb8;
  font-size: 12px;
  font-weight: 700;
}
.oi-product-card.has-hover-box-shadow .oi-card-promo i {
  color: #e8891e;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn {
  border-color: #2a64bd;
  border-radius: 8px;
  background: #fff;
  color: #1e57ad;
  font-weight: 700;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp {
  margin-top: 2px;
  padding-top: 4px;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn:hover {
  border-color: #215ada;
  background: #215ada;
  color: #fff;
}
@media (max-width: 767px) {
  .oi-product-card.has-hover-box-shadow .oi-card-meta {
    min-height: 28px;
    padding: 0 10px;
    font-size: 11px;
  }
  .oi-product-card.has-hover-box-shadow .pricing-part .price-text {
    font-size: 17px;
  }
  .oi-product-card.has-hover-box-shadow .oi-card-promo {
    font-size: 11px;
  }
}

/* Footer */
.oi-footer {
  --oi-ink: #212529;
  --oi-muted: #6c757d;
  --oi-line: #e9ecef;
  --oi-soft: #f8f9fa;
  background: var(--oi-soft);
  font-family: "Cabin", sans-serif;
  color: var(--oi-muted);
  margin-top: 48px;
}
.oi-footer-main {
  padding: 56px 0 40px;
}
.oi-footer-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.1fr) minmax(0, 1.6fr);
  gap: 40px 48px;
  align-items: start;
}
.oi-footer-logo img {
  height: 72px;
  width: auto;
  display: block;
}
.oi-footer-desc {
  margin: 20px 0 0;
  max-width: 380px;
  font-size: 16px;
  line-height: 1.7;
  color: var(--oi-muted);
}
.oi-footer-social {
  display: flex;
  gap: 10px;
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
}
.oi-footer-social a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff;
  border: 1px solid var(--oi-line);
  color: var(--oi-ink);
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.oi-footer-social a:hover {
  background: var(--oi-ink);
  border-color: var(--oi-ink);
  color: #fff;
}
.oi-footer-menus {
  display: flex;
  justify-content: flex-end;
  gap: 24px 40px;
  flex-wrap: wrap;
}
.oi-footer-col {
  min-width: 130px;
}
.oi-footer-title {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 700;
  color: var(--oi-ink);
}
.oi-footer-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.oi-footer-col li + li {
  margin-top: 8px;
}
.oi-footer-col a {
  color: var(--oi-muted);
  text-decoration: none;
  font-size: 15px;
  transition: color 0.15s ease;
}
.oi-footer-col a:hover {
  color: var(--oi-ink);
}
.oi-footer-bottom {
  border-top: 1px solid var(--oi-line);
  padding: 18px 0;
}
.oi-footer-bottom-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  flex-wrap: wrap;
}
.oi-footer-bottom p {
  margin: 0;
  font-size: 14px;
  color: var(--oi-muted);
}
.oi-footer-bottom a {
  color: var(--oi-ink);
  font-weight: 600;
  text-decoration: none;
}
.oi-footer-legal {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.oi-footer-legal a {
  font-size: 13px;
  font-weight: 500;
  color: var(--oi-muted);
}
.oi-footer-legal a:hover {
  color: var(--oi-ink);
}
@media (max-width: 991px) {
  .oi-footer-grid {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .oi-footer-menus {
    justify-content: flex-start;
  }
}
@media (max-width: 575px) {
  .oi-footer-main {
    padding: 40px 0 28px;
  }
  .oi-footer-menus {
    gap: 24px 32px;
  }
}

/* Ana sayfa ürün bölümleri */
.oi-home-main {
  background: #fff;
}
.oi-home-main > .oi-home-section:first-child {
  padding-top: 28px;
}
.oi-home-section {
  padding: 56px 0;
}
.oi-home-section--alt {
  background: #f8f9fa;
}
.oi-home-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}
.oi-home-eyebrow {
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 600;
  color: #6c757d;
  letter-spacing: 0.02em;
}
.oi-home-title {
  margin: 0;
  font-size: clamp(1.4rem, 2.2vw, 1.85rem);
  font-weight: 700;
  color: #212529;
  font-family: "Cabin", sans-serif;
}
.oi-home-more {
  font-size: 14px;
  font-weight: 600;
  color: #0d6efd;
  text-decoration: none;
  white-space: nowrap;
}
.oi-home-more:hover {
  color: #212529;
}
@media (max-width: 575px) {
  .oi-home-section {
    padding: 36px 0;
  }
}

/* Yasal sayfalar */
.oi-legal-page {
  background: #fff;
  font-family: "Cabin", sans-serif;
}
.oi-legal-hero {
  background: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  padding: 36px 0 28px;
}
.oi-legal-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
  font-size: 13px;
  color: #6c757d;
  margin-bottom: 12px;
}
.oi-legal-breadcrumb a {
  color: #6c757d;
  text-decoration: none;
}
.oi-legal-breadcrumb a:hover { color: #212529; }
.oi-legal-hero h1 {
  margin: 0;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 700;
  color: #212529;
}
.oi-legal-updated {
  margin: 10px 0 0;
  font-size: 13px;
  color: #6c757d;
}
.oi-legal-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 40px;
  padding-top: 40px;
  padding-bottom: 56px;
  align-items: start;
}
.oi-legal-nav {
  position: sticky;
  top: 100px;
  background: #f8f9fa;
  border: 1px solid #e9ecef;
  border-radius: 8px;
  padding: 18px 16px;
}
.oi-legal-nav h2 {
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 700;
  color: #212529;
}
.oi-legal-nav ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.oi-legal-nav li + li { margin-top: 4px; }
.oi-legal-nav a {
  display: block;
  padding: 8px 10px;
  border-radius: 6px;
  text-decoration: none;
  color: #6c757d;
  font-size: 14px;
  font-weight: 500;
}
.oi-legal-nav a:hover,
.oi-legal-nav a.is-active {
  background: #fff;
  color: #212529;
  font-weight: 600;
}
.oi-legal-content {
  max-width: 760px;
  color: #495057;
  font-size: 15px;
  line-height: 1.75;
}
.oi-legal-section + .oi-legal-section {
  margin-top: 28px;
  padding-top: 24px;
  border-top: 1px solid #e9ecef;
}
.oi-legal-section h2 {
  margin: 0 0 12px;
  font-size: 1.15rem;
  font-weight: 700;
  color: #212529;
}
.oi-legal-section p { margin: 0 0 12px; }
.oi-legal-section ul {
  margin: 0 0 12px;
  padding-left: 1.2rem;
}
.oi-legal-section li + li { margin-top: 6px; }
.oi-legal-section a { color: #0d6efd; }
.oi-legal-note {
  margin-top: 36px;
  padding: 14px 16px;
  background: #f8f9fa;
  border-radius: 8px;
  font-size: 13px;
  color: #6c757d;
  line-height: 1.55;
}
@media (max-width: 991px) {
  .oi-legal-layout {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .oi-legal-nav {
    position: static;
  }
}

/* Filtre sayfayla birlikte kayar; görünen alana sığınca üstte sabit kalır. */
@media (min-width: 992px) {
  .oi-shop-filter-area > .container > .row,
  .oi-hb-layout {
    align-items: flex-start;
  }
  .oi-shop-sidebar-col {
    position: sticky !important;
    top: 118px;
    align-self: flex-start;
    height: auto;
    max-height: none;
    overflow: visible;
    z-index: 20;
  }
  .oi-shop-sticky-sidebar {
    position: static !important;
    top: auto !important;
  }
}
.oi-cat-box.is-active .title,
.oi-shop-filter-tag-list a.active {
  color: var(--color-primary, #215ADA);
  font-weight: 700;
}
.oi-filter-back a {
  display: inline-flex;
  align-items: center;
  font-weight: 600;
  color: var(--color-heading, #1a1a1a);
  margin-bottom: 4px;
}
.oi-filter-back a:hover {
  color: var(--color-primary, #215ADA);
}

/* Kategori ağacı (desktop + mobil filtre) */
.oi-cat-tree-wrap {
  display: grid;
  gap: 6px;
}
.oi-cat-tree {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.oi-cat-tree--nested {
  margin: 6px 0 2px;
  padding-left: 10px;
  border-left: 2px solid #e8eef7;
}
.oi-cat-tree-item {
  margin: 0;
}
.oi-cat-tree-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 36px;
  align-items: center;
  gap: 4px;
}
.oi-cat-tree-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 10px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
  min-width: 0;
}
.oi-cat-tree-label input {
  width: 16px;
  height: 16px;
  accent-color: var(--oi-primary, #0d6efd);
  flex: 0 0 auto;
}
.oi-cat-tree-label span {
  min-width: 0;
  line-height: 1.3;
}
.oi-cat-tree-label:hover {
  background: #f5f7fa;
}
.oi-cat-tree-label--all {
  border: 1px solid #e8eaed;
  background: #fff;
  margin-bottom: 4px;
}
.oi-cat-tree-item.is-active > .oi-cat-tree-row > .oi-cat-tree-label {
  background: rgba(13, 110, 253, 0.08);
  color: var(--oi-primary, #0d6efd);
}
.oi-cat-tree-toggle {
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #667085;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.oi-cat-tree-toggle:hover {
  background: #eef2f7;
  color: var(--oi-primary, #0d6efd);
}
.oi-cat-tree-toggle i {
  font-size: 12px;
  transition: transform 0.2s ease;
}
.oi-cat-tree-item.is-open > .oi-cat-tree-row > .oi-cat-tree-toggle i {
  transform: rotate(180deg);
  color: var(--oi-primary, #0d6efd);
}
.oi-cat-tree-panel[hidden] {
  display: none !important;
}
.oi-shop-filter-block .oi-cat-tree-row {
  grid-template-columns: minmax(0, 1fr) 40px;
}
.oi-shop-filter-block .oi-cat-tree-label.oi-shop-filter-choice {
  margin: 0;
}
.oi-shop-filter-block .oi-cat-tree--nested {
  margin-left: 8px;
  padding-left: 8px;
}
.oi-shop-sticky-sidebar .oi-cat-tree-wrap {
  max-height: none;
}

/* Mağaza sıralama (Trendyol tarzı) */
.oi-sort {
  position: relative;
  z-index: 5;
}
.oi-sort-btn {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-width: 190px;
  height: 40px;
  padding: 0 14px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
  color: #1f2937;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.oi-sort-btn:hover,
.oi-sort.is-open .oi-sort-btn {
  border-color: #d1d5db;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.oi-sort-btn-text {
  flex: 1 1 auto;
  text-align: left;
  white-space: nowrap;
}
.oi-sort-btn i {
  color: #6b7280;
  font-size: 13px;
  flex: 0 0 auto;
}
.oi-sort-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  width: max-content;
  min-width: 220px;
  padding: 8px 0;
  margin: 0;
  border: 1px solid #eef0f3;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 10px 28px rgba(16, 24, 40, 0.12);
  z-index: 30;
}
.oi-sort-menu[hidden] {
  display: none !important;
}
.oi-sort-option {
  display: block;
  width: 100%;
  border: 0;
  background: transparent;
  padding: 11px 16px;
  text-align: left;
  font-size: 13px;
  font-weight: 500;
  color: #374151;
  cursor: pointer;
  line-height: 1.3;
}
.oi-sort-option:hover {
  background: #f8fafc;
}
.oi-sort-option.is-active {
  color: var(--oi-primary, #0d6efd);
  font-weight: 600;
  background: rgba(13, 110, 253, 0.06);
}
.oi-sort--mobile .oi-sort-btn {
  min-width: 0;
  max-width: 200px;
  height: 44px;
}
.oi-sort--mobile .oi-sort-btn-text {
  overflow: hidden;
  text-overflow: ellipsis;
}
#oi-shop-count {
  font-size: 13px !important;
  font-weight: 600;
  color: #667085;
  margin: 0;
}

/* Mobil mağaza filtre çekmecesi */
.oi-shop-filter-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 12px 0 8px;
}
.oi-shop-filter-open {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 44px;
  padding: 0 16px;
  border: 1px solid #dde1e6;
  border-radius: 10px;
  background: #fff;
  color: var(--oi-ink, #212529);
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}
.oi-shop-filter-open i {
  color: var(--oi-primary, #0d6efd);
}
.oi-shop-filter-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: var(--oi-primary, #0d6efd);
  color: #fff;
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
}
.oi-shop-filter-drawer {
  position: fixed;
  inset: 0;
  z-index: 1250;
}
.oi-shop-filter-drawer[hidden] {
  display: none !important;
}
.oi-shop-filter-drawer.is-open {
  display: block;
}
.oi-shop-filter-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
}
.oi-shop-filter-panel {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(380px, 94vw);
  background: #f6f8fb;
  display: flex;
  flex-direction: column;
  box-shadow: 8px 0 28px rgba(15, 23, 42, 0.2);
  font-family: "Cabin", sans-serif;
}
.oi-shop-filter-form {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
.oi-shop-filter-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px 14px;
  background: #fff;
  border-bottom: 1px solid #e8eaed;
  flex: 0 0 auto;
}
.oi-shop-filter-head h2 {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 700;
}
.oi-shop-filter-hint {
  margin: 4px 0 0;
  font-size: 12px;
  color: #667085;
  line-height: 1.4;
}
.oi-shop-filter-x {
  width: 36px;
  height: 36px;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  background: #fff;
  color: #495057;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex: 0 0 auto;
}
.oi-shop-filter-body {
  flex: 1 1 auto;
  overflow: auto;
  padding: 12px;
  -webkit-overflow-scrolling: touch;
}
.oi-shop-filter-block {
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 12px;
  padding: 14px;
  margin-bottom: 10px;
}
.oi-shop-filter-block h3 {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
}
.oi-shop-filter-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  color: var(--oi-primary, #0d6efd);
  font-weight: 700;
  font-size: 13px;
  text-decoration: none;
}
.oi-shop-filter-choices {
  display: grid;
  gap: 8px;
}
.oi-shop-filter-choice {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 12px 12px;
  border: 1.5px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.oi-shop-filter-choice input {
  width: 18px;
  height: 18px;
  accent-color: var(--oi-primary, #0d6efd);
  flex: 0 0 auto;
}
.oi-shop-filter-choice span {
  flex: 1 1 auto;
  line-height: 1.3;
}
.oi-shop-filter-choice:hover {
  border-color: #c5d4eb;
}
.oi-shop-filter-choice.is-active {
  border-color: var(--oi-primary, #0d6efd);
  background: rgba(13, 110, 253, 0.06);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
  color: var(--oi-ink, #212529);
}
.oi-shop-filter-price {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
}
.oi-shop-filter-price input {
  height: 44px;
  border: 1.5px solid #dde1e6;
  border-radius: 10px;
  padding: 0 12px;
  font-family: inherit;
  font-size: 14px;
  background: #fff;
}
.oi-shop-filter-price input:focus {
  outline: 0;
  border-color: var(--oi-primary, #0d6efd);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
}
.oi-shop-filter-price-sep {
  color: #98a2b3;
  font-weight: 700;
}
.oi-shop-filter-price-note {
  margin: 8px 0 0;
  font-size: 12px;
  color: #667085;
  line-height: 1.4;
}
.oi-shop-filter-foot {
  display: grid;
  grid-template-columns: 1fr 1.4fr;
  gap: 8px;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid #e8eaed;
  background: #fff;
  flex: 0 0 auto;
}
.oi-shop-filter-foot-clear {
  height: 48px;
  border: 1px solid #e8eaed;
  border-radius: 10px;
  background: #fff;
  color: #495057;
  font-family: inherit;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
}
.oi-shop-filter-foot-done {
  height: 48px;
  border: 0;
  border-radius: 10px;
  background: var(--oi-primary, #0d6efd);
  color: #fff;
  font-family: inherit;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}
.oi-shop-filter-foot-done:hover {
  background: #0b5ed7;
}
@media (min-width: 992px) {
  .oi-shop-filter-bar,
  .oi-shop-filter-drawer {
    display: none !important;
  }
}

.oi-shop-tools-wrapper-var-one {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
}
.oi-shop-tools-wrapper-var-one .oi-inner-search-field {
  min-width: 220px;
}
.oi-tools-select-single {
  display: flex;
  align-items: center;
  gap: 8px;
}
.oi-price-input-grp {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.oi-price-input-grp input {
  width: calc(50% - 28px);
  min-width: 70px;
  height: 40px;
  border: 1px solid var(--color-gray-200, #e5e7eb);
  border-radius: 6px;
  padding: 0 10px;
}
.oi-price-input-grp .oi-btn {
  height: 40px;
  padding: 0 14px;
  line-height: 40px;
}
#oi-shop-products .oi-product-card.has-hover-box-shadow {
  height: 100%;
  border: 1px solid var(--color-gray-200, #eceff3);
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  transition: box-shadow .25s ease, transform .25s ease;
}
#oi-shop-products .oi-product-card.has-hover-box-shadow:hover {
  box-shadow: 0 12px 32px rgba(15, 23, 42, .12);
  transform: translateY(-2px);
}
#oi-shop-products .oi-card-img {
  position: relative;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
#oi-shop-products .oi-prd-img {
  max-height: 200px;
  width: auto;
  object-fit: contain;
}
#oi-shop-products .prd-btn-grp {
  margin-top: 12px;
}
#oi-shop-products .pricing-part {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
#oi-shop-products .prd-details-area {
  padding: 0 16px 16px;
  border-top: 1px solid var(--color-gray-200, #eceff3);
}
#oi-shop-products .product-details-list {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
}
#oi-shop-products .product-details-list li {
  font-size: 13px;
  margin-bottom: 4px;
}

/* Standart katalog kartı: ürün görselleri ve içerik satırları her listede aynı ölçüde kalır. */
@media (min-width: 1200px) {
  .oi-product-col {
    flex: 0 0 auto;
    width: 20%;
  }
}
.oi-product-card.has-hover-box-shadow {
  height: 100%;
  overflow: hidden;
}
.oi-product-card.has-hover-box-shadow .inner {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.oi-product-card.has-hover-box-shadow .oi-card-img,
#oi-shop-products .oi-card-img {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 180px;
  min-height: 180px;
  padding: 6px;
}
.oi-product-card.has-hover-box-shadow .oi-card-img {
  overflow: hidden;
}
.oi-product-card.has-hover-box-shadow .oi-card-img > a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.oi-product-card.has-hover-box-shadow .oi-prd-img,
.oi-product-card.has-hover-box-shadow .oi-hover-img,
#oi-shop-products .oi-prd-img,
#oi-shop-products .oi-hover-img {
  width: 100%;
  height: 100%;
  max-height: none;
  object-fit: contain;
  transform: scale(1.08);
  transform-origin: center center;
}
.oi-product-card.has-hover-box-shadow .oi-card-img.oi-has-hover-img .oi-hover-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: auto;
}
.oi-product-card.has-hover-box-shadow .oi-card-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 12px;
}
.oi-product-card.has-hover-box-shadow .oi-card-subtitle {
  min-height: 18px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.oi-product-card.has-hover-box-shadow .oi-card-title {
  display: -webkit-box;
  min-height: 42px;
  margin: 6px 0;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 15px;
  line-height: 21px;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating {
  min-height: 20px;
}
.oi-product-card.has-hover-box-shadow .pricing-part {
  min-height: 44px;
  margin-top: 4px;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp {
  margin-top: auto;
  padding-top: 8px;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn {
  min-height: 36px;
  padding: 7px 8px;
  font-size: 13px;
}
@media (max-width: 767px) {
  .oi-product-card.has-hover-box-shadow .oi-card-img,
  #oi-shop-products .oi-card-img {
    height: 140px;
    min-height: 140px;
    padding: 4px;
  }
  .oi-product-card.has-hover-box-shadow .oi-prd-img,
  .oi-product-card.has-hover-box-shadow .oi-hover-img,
  #oi-shop-products .oi-prd-img,
  #oi-shop-products .oi-hover-img {
    transform: scale(1.1);
  }
  .oi-product-card.has-hover-box-shadow .oi-card-body {
    padding: 10px;
  }
  .oi-product-card.has-hover-box-shadow .oi-card-title {
    min-height: 38px;
    font-size: 14px;
    line-height: 19px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .oi-shop-sidebar-col {
    top: 120px !important;
    max-height: calc(100vh - 130px);
  }
}

/* ---- Product detail (OI theme) ---- */
.oi-pd-breadcrumb.oi-breadcrumb-two {
  padding-top: 18px;
  padding-bottom: 8px;
}
.oi-pd-breadcrumb .oi-breadcrumb-inner {
  min-height: auto;
  padding: 0;
}
.oi-pd-breadcrumb .oi-breadcrumb-page-list {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  list-style: none;
  margin: 0 !important;
  padding: 0;
  gap: 8px 10px;
  row-gap: 4px;
}
.oi-pd-breadcrumb .oi-breadcrumb-page-list > li {
  display: inline-flex;
  align-items: center;
  margin: 0;
}
.oi-pd-breadcrumb .oi-breadcrumb-item,
.oi-pd-breadcrumb .oi-breadcrumb-item a {
  font-family: "Cabin", sans-serif;
  font-size: 13px;
  line-height: 1.4;
}
.oi-pd-breadcrumb .oi-breadcrumb-item.active {
  max-width: min(420px, 55vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.oi-pd.oi-product-detail {
  --oi-ink: #212529;
  --oi-muted: #6c757d;
  --oi-line: #e9ecef;
  --oi-soft: #f8f9fa;
  --oi-primary: #0d6efd;
  font-family: "Cabin", sans-serif;
  color: var(--oi-ink);
}
.oi-pd .container > .row {
  --bs-gutter-x: 2rem;
  align-items: flex-start;
}
.oi-pd-buybox {
  padding-top: 4px;
}
@media (min-width: 992px) {
  /* Büyük görselin tabanı ile satın alma alanının tabanını aynı hizada tutar. */
  .oi-pd-buybox {
    display: flex;
    flex-direction: column;
    min-height: 520px;
  }
  .oi-pd-buybox .oi-pd-utils {
    margin-top: auto;
  }
}

.oi-product-gallery {
  position: sticky;
  top: 120px;
}
.oi-product-gallery-main {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid var(--oi-line);
  background: #fff;
}
.oi-product-zoom {
  display: block;
  cursor: zoom-in;
  touch-action: pan-y;
  user-select: none;
}
.oi-product-gallery-main img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;
  margin: 0 auto;
  object-fit: contain;
  aspect-ratio: 1 / 1;
  vertical-align: middle;
  pointer-events: none;
}
/* Ürün görseli sayfa zeminiyle bütünleşsin; gereksiz yan boşluklar daralsın. */
.oi-product-gallery-main,
.oi-product-gallery-main .oi-product-zoom,
.oi-product-gallery-main img {
  background: #fff;
}
.oi-product-gallery {
  width: min(100%, 760px);
}
.oi-product-gallery-main img {
  max-height: 500px;
}
.oi-gal-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #212529;
  box-shadow: 0 2px 12px rgba(33, 37, 41, 0.16);
  transform: translateY(-50%);
  cursor: pointer;
  line-height: 1;
}
.oi-gal-nav[hidden] {
  display: none;
}
.oi-gal-nav:hover {
  box-shadow: 0 4px 16px rgba(33, 37, 41, 0.22);
}
.oi-gal-prev { left: 12px; }
.oi-gal-next { right: 12px; }
.oi-gal-nav i {
  font-size: 14px;
  pointer-events: none;
}
.oi-wishlisted-btn.is-favorite,
.oi-pd-util.is-favorite {
  color: #d83457;
}
.oi-wishlisted-btn.is-favorite {
  background: #fff1f3;
}
.oi-pd-util.is-favorite {
  border-color: #f2b8c3;
  background: #fff7f8;
}
.oi-product-thumbs {
  display: flex;
  flex-wrap: nowrap;
  gap: 8px;
  min-width: 0;
  margin-top: 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  scroll-behavior: smooth;
  scroll-snap-type: x proximity;
  overscroll-behavior-inline: contain;
}
.oi-product-thumbs::-webkit-scrollbar { display: none; }
.oi-product-thumb {
  position: relative;
  box-sizing: border-box;
  flex: 0 0 64px;
  width: 64px;
  height: 64px;
  padding: 0;
  margin: 0;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
  cursor: pointer;
  line-height: 0;
  appearance: none;
  -webkit-appearance: none;
  scroll-snap-align: start;
}
.oi-product-thumb::after,
.oi-product-thumb::before {
  content: none !important;
  display: none !important;
}
.oi-product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  pointer-events: none;
}
.oi-product-thumb.is-active {
  border-color: var(--oi-primary);
  box-shadow: 0 0 0 1px var(--oi-primary);
}
.oi-product-thumb:hover {
  border-color: var(--oi-primary);
}

body.oi-lightbox-open {
  overflow: hidden;
}
.oi-lightbox {
  position: fixed;
  inset: 0;
  z-index: 15000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.oi-lightbox[hidden] {
  display: none !important;
}
.oi-lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(10px);
}
.oi-lightbox-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(1080px, calc(100vw - 120px));
  height: min(760px, calc(100vh - 48px));
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.7);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.45);
  font-family: "Cabin", sans-serif;
}
.oi-lightbox-stage {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  min-height: 0;
  margin: 0;
  background: #f7f9fc;
  border-radius: 0;
  overflow: hidden;
}
.oi-lightbox-zoom {
  width: 100%;
  height: 100%;
  overflow: hidden;
  cursor: zoom-in;
  display: flex;
  align-items: center;
  justify-content: center;
}
.oi-lightbox-zoom.is-zooming {
  cursor: move;
}
.oi-lightbox-zoom img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  pointer-events: none;
  transform: scale(1);
  transform-origin: center center;
}
.oi-lightbox-side {
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 18px;
  min-height: 86px;
  overflow: hidden;
  padding: 12px 18px;
  border-top: 1px solid #e5eaf2;
  background: #fff;
  color: #172033;
}
.oi-lightbox-side-head {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 76px;
  margin: 0;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #718096;
}
.oi-lightbox-count {
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: #2563eb;
  font-size: 13px;
}
.oi-lightbox-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 3;
  width: 40px;
  height: 40px;
  border: 1px solid #dbe3ef;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.95);
  color: #334155;
  cursor: pointer;
  font-size: 16px;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
}
.oi-lightbox-close:hover {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}
.oi-lightbox-thumbs {
  display: flex;
  flex: 1 1 auto;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  padding: 2px;
}
.oi-lightbox-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  flex: 0 0 60px;
  aspect-ratio: 1;
  margin: 0;
  padding: 4px;
  border: 1px solid #dce4f0;
  border-radius: 9px;
  background: #f8fafc;
  cursor: pointer;
  line-height: 0;
}
.oi-lightbox-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.oi-lightbox-thumb:hover {
  border-color: #93c5fd;
  background: #fff;
}
.oi-lightbox-thumb.is-active {
  border-color: #2563eb;
  background: #fff;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.16);
}
.oi-lightbox-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 64px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 12px;
  border: 1px solid #dbe3ef;
  background: rgba(255, 255, 255, 0.94);
  color: #334155;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.12);
  transform: translateY(-50%);
  cursor: pointer;
}
.oi-lightbox-nav:hover {
  border-color: #2563eb;
  background: #2563eb;
  color: #fff;
}
.oi-lightbox-nav[hidden] {
  display: none;
}
.oi-lb-prev { left: 12px; }
.oi-lb-next { right: 12px; }
@media (max-width: 767px) {
  .oi-lightbox-dialog {
    flex-direction: column;
    width: calc(100vw - 16px);
    height: calc(100vh - 16px);
    border-radius: 16px;
  }
  .oi-lightbox-stage {
    margin: 0;
  }
  .oi-lightbox-side {
    gap: 12px;
    min-height: 78px;
    padding: 10px 12px;
  }
  .oi-lightbox-side-head {
    min-width: 60px;
    font-size: 9px;
  }
  .oi-lightbox-thumbs {
    gap: 7px;
  }
  .oi-lightbox-thumb {
    width: 54px;
    flex: 0 0 54px;
  }
  .oi-lb-prev { left: 8px; }
  .oi-lb-next { right: 8px; }
}

.oi-pd-brand {
  margin: 0 0 8px;
}
.oi-pd-brand-text {
  display: inline-block;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--oi-muted);
  line-height: 1.2;
}
.oi-pd-title {
  margin: 0;
  padding: 0;
  font-family: "Cabin", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.3;
  color: var(--oi-ink);
}
.oi-pd-rating {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 9px;
  min-height: 24px;
}
.oi-pd-stars {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #ced4da;
  font-size: 13px;
  line-height: 1;
}
.oi-pd-stars.has-rating {
  color: #f59e0b;
}
.oi-pd-rating-value {
  color: var(--oi-ink);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.oi-pd-rating-count {
  color: var(--oi-muted);
  font-size: 13px;
  line-height: 1;
}

.oi-pd-specs {
  width: 100%;
  margin: 18px 0 0;
  border-collapse: collapse;
  border-spacing: 0;
  table-layout: fixed;
}
.oi-pd-specs th,
.oi-pd-specs td {
  box-sizing: border-box;
  padding: 14px 12px;
  border-top: 1px solid var(--oi-line);
  border-bottom: 0;
  vertical-align: middle;
  font-size: 14px;
  line-height: 1.5;
}
.oi-pd-specs tr:last-child th,
.oi-pd-specs tr:last-child td {
  border-bottom: 1px solid var(--oi-line);
}
.oi-pd-specs th {
  width: 132px;
  padding-left: 0;
  padding-right: 16px;
  font-weight: 600;
  color: var(--oi-muted);
  text-align: left;
}
.oi-pd-specs td {
  padding-left: 8px;
  padding-right: 0;
  color: var(--oi-ink);
  word-break: break-word;
}
.oi-pd-specs a {
  color: var(--oi-primary);
  text-decoration: none;
  font-weight: 500;
}
.oi-pd-specs a:hover {
  text-decoration: underline;
}
.oi-pd-sep {
  color: var(--oi-muted);
  margin: 0 2px;
}
.oi-pd-stock.is-in {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #e8f5ee;
  color: #198754;
  font-size: 11px;
  line-height: 1;
}
.oi-pd-stock.is-out {
  color: var(--oi-hot, #dc3545);
  font-weight: 600;
}

.oi-pd-price-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  margin-top: 14px;
  min-height: 0;
}
.oi-pd-price-values {
  display: inline-flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 8px;
}
.oi-pd-compare {
  display: block;
  margin: 0;
  color: var(--oi-muted);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: line-through;
}
.oi-pd-price-values .oi-pd-compare {
  font-size: 17px;
  font-weight: 700;
  color: #6b7280;
  white-space: nowrap;
}
.oi-pd-price {
  margin: 0;
  font-size: 1.85rem;
  font-weight: 700;
  line-height: 1.15;
  color: var(--oi-primary);
  letter-spacing: -0.01em;
}

.oi-pd-variants {
  margin-top: 18px;
}
.oi-pd-options {
  margin-top: 18px;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.oi-pd-opt-group .oi-pd-label {
  margin-bottom: 8px;
}
.oi-pd-opt-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.oi-pd-opt-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  background: #fff;
  font-family: "Cabin", sans-serif;
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-ink);
  cursor: pointer;
}
.oi-pd-opt-btn.has-img {
  padding: 4px 12px 4px 4px;
}
.oi-pd-opt-img {
  width: 36px;
  height: 36px;
  object-fit: contain;
  border-radius: 6px;
  background: #f8fafc;
  border: 1px solid #eef1f5;
  flex: 0 0 auto;
}
.oi-pd-opt-btn.is-active,
.oi-pd-opt-btn:hover {
  border-color: var(--oi-primary);
  color: var(--oi-primary);
}
.oi-pd-opt-btn.is-active {
  background: rgba(33, 90, 218, 0.06);
}.oi-pd-swatch {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 2px solid #e5e7eb;
  border-radius: 999px;
  cursor: pointer;
  box-shadow: inset 0 0 0 1px rgba(0,0,0,.08);
}
.oi-pd-swatch.is-active {
  border-color: var(--oi-primary);
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--oi-primary);
}
.oi-pd-label {
  display: flex;
  align-items: baseline;
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-muted);
  line-height: 1.2;
}
.oi-pd-opt-current:not(:empty)::before {
  content: ": ";
  color: var(--oi-muted);
  font-weight: 600;
}
.oi-pd-opt-current {
  color: var(--oi-ink);
  font-weight: 700;
}
.oi-pd-stockline {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  position: relative;
  margin-left: 4px;
  padding-left: 12px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
.oi-pd-stockline::before {
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 14px;
  content: "";
  background: var(--oi-line);
  transform: translateY(-50%);
}
.oi-pd-stockline.is-in { color: #168447; }
.oi-pd-stockline.is-out { color: var(--oi-hot, #c52a3a); }
.oi-pd-select.form-select {
  max-width: 280px;
  height: 44px;
  padding: 0.5rem 2.25rem 0.5rem 0.85rem;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  color: var(--oi-ink);
  background-color: #fff;
  box-shadow: none;
}
.oi-pd-select.form-select:focus {
  border-color: var(--oi-primary);
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.15);
}

.oi-pd-cart-row {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 10px;
  margin-top: 18px;
}
.oi-pd .oi-qty-wrap {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  height: 48px;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}
.oi-pd .oi-qty-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: 18px;
  line-height: 1;
  color: var(--oi-ink);
  cursor: pointer;
}
.oi-pd .oi-qty-btn:hover {
  background: var(--oi-soft);
}
.oi-pd .oi-qty-input.form-control {
  box-sizing: border-box;
  width: 48px !important;
  min-width: 48px;
  max-width: 48px;
  height: 48px !important;
  margin: 0;
  padding: 0 !important;
  border: 0 !important;
  border-left: 1px solid var(--oi-line) !important;
  border-right: 1px solid var(--oi-line) !important;
  border-radius: 0 !important;
  text-align: center;
  font-family: "Cabin", sans-serif;
  font-size: 15px;
  font-weight: 600;
  line-height: 48px;
  color: var(--oi-ink);
  box-shadow: none !important;
  appearance: textfield;
  -moz-appearance: textfield;
}
.oi-pd .oi-qty-input.form-control::-webkit-outer-spin-button,
.oi-pd .oi-qty-input.form-control::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.oi-pd-add-cart {
  box-sizing: border-box;
  flex: 1 1 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  min-height: 48px;
  max-height: 48px;
  margin: 0;
  padding: 0 20px;
  border: 0;
  border-radius: 8px;
  background: var(--oi-primary);
  color: #fff !important;
  font-family: "Cabin", sans-serif;
  font-weight: 700;
  font-size: 15px;
  line-height: 1;
  text-decoration: none !important;
  white-space: nowrap;
}
.oi-pd-add-cart:hover {
  background: #0b5ed7;
  color: #fff !important;
}
.oi-pd-add-cart.disabled,
.oi-pd-add-cart[aria-disabled="true"] {
  opacity: 0.55;
  pointer-events: none;
}

.oi-pd-utils {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 10px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--oi-line);
}
.oi-pd-util {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 28px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--oi-ink);
  font-family: "Cabin", sans-serif;
  font-size: 12px;
  font-weight: 500;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.25;
}
.oi-pd-util i {
  color: var(--oi-primary);
  font-size: 14px;
  width: 16px;
  text-align: center;
  flex-shrink: 0;
  line-height: 1;
}
.oi-pd-util:hover {
  color: var(--oi-primary);
}

.oi-pd-safety-entry{scroll-margin-top:110px;margin-top:28px}
.oi-pd-safety-trigger{display:grid;grid-template-columns:42px minmax(0,1fr) auto 14px;align-items:center;gap:14px;width:100%;min-height:76px;padding:14px 18px;text-align:left;border:1px solid #dce5f0;border-radius:13px;background:#fff;color:var(--oi-ink);box-shadow:0 4px 14px rgba(28,49,83,.035);cursor:pointer;transition:border-color .18s,box-shadow .18s,transform .18s}
.oi-pd-safety-trigger:hover{transform:translateY(-1px);border-color:#b8c9e9;box-shadow:0 9px 24px rgba(33,75,154,.08)}
.oi-pd-safety-trigger:focus-visible{outline:3px solid rgba(40,99,232,.2);outline-offset:2px}
.oi-pd-safety-trigger-icon{display:grid;width:42px;height:42px;place-items:center;border-radius:11px;background:#edf3ff;color:var(--oi-primary);font-size:17px}
.oi-pd-safety-trigger-copy{display:grid;gap:3px;min-width:0}
.oi-pd-safety-trigger-copy strong{font-size:15px;line-height:1.3}
.oi-pd-safety-trigger-copy small{color:#738096;font-size:12px;line-height:1.45}
.oi-pd-safety-trigger-meta{padding:5px 9px;border-radius:999px;background:#f1f5fb;color:#596981;font-size:11px;font-weight:700;white-space:nowrap}
.oi-pd-safety-trigger-arrow{color:#8c99aa;font-size:12px}
.oi-safety-modal[hidden]{display:none!important}
.oi-safety-modal{position:fixed;inset:0;z-index:10070;display:grid;place-items:center;padding:20px}
.oi-safety-modal-backdrop{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:rgba(15,23,42,.58);backdrop-filter:blur(3px);cursor:default}
body.oi-safety-modal-open{overflow:hidden}
.oi-safety-modal-dialog{position:relative;width:min(680px,100%);max-height:calc(100vh - 40px);overflow:hidden;border:1px solid rgba(255,255,255,.6);border-radius:20px;background:#fff;box-shadow:0 30px 90px rgba(15,23,42,.28);outline:0}
.oi-safety-modal-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:21px 24px;border-bottom:1px solid #e8edf4;background:#fff}
.oi-safety-modal-heading{display:flex;align-items:center;gap:13px;min-width:0}
.oi-safety-modal-heading>div>span{display:block;margin-bottom:3px;color:var(--oi-primary);font-size:9px;font-weight:800;letter-spacing:.12em}
.oi-safety-modal-heading h2{margin:0;color:#172033;font-size:21px;line-height:1.25}
.oi-safety-modal-icon{display:grid;flex:0 0 42px;width:42px;height:42px;place-items:center;border-radius:12px;background:#edf3ff;color:var(--oi-primary);font-size:17px}
.oi-safety-modal-close{display:grid;flex:0 0 38px;width:38px;height:38px;place-items:center;padding:0;border:1px solid #dfe6ef;border-radius:50%;background:#f8fafc;color:#536176;font-size:15px;cursor:pointer}
.oi-safety-modal-close:hover{border-color:#c9d6e7;background:#f1f5f9;color:#172033}
.oi-safety-modal-close:focus-visible{outline:3px solid rgba(40,99,232,.18);outline-offset:2px}
.oi-safety-modal-body{max-height:calc(100vh - 126px);overflow:auto;padding:22px 24px 26px}
.oi-safety-modal-intro{margin:0 0 18px;padding:13px 15px;border-left:3px solid var(--oi-primary);border-radius:0 9px 9px 0;background:#f5f8ff;color:#57667b;font-size:13px;line-height:1.55}
.oi-safety-party-list{display:grid;gap:12px}
.oi-safety-party{overflow:hidden;border:1px solid #dfe6ef;border-radius:13px;background:#fff}
.oi-safety-party>header{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid #edf1f5;background:#fafcff}
.oi-safety-party>header>span{display:grid;flex:0 0 34px;width:34px;height:34px;place-items:center;border-radius:9px;background:#eef3fb;color:#476692}
.oi-safety-party>header small{display:block;margin-bottom:2px;color:#6d7b90;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.oi-safety-party>header h3{margin:0;color:#1d2d45;font-size:15px;line-height:1.35}
.oi-safety-party dl{margin:0;padding:3px 16px}
.oi-safety-party dl>div{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px;padding:11px 0;border-bottom:1px solid #edf1f5}
.oi-safety-party dl>div:last-child{border-bottom:0}
.oi-safety-party dt{color:#788598;font-size:12px;font-weight:700}
.oi-safety-party dd{min-width:0;margin:0;color:#2b3a50;font-size:13px;line-height:1.55;overflow-wrap:anywhere}
.oi-safety-party dd a{color:var(--oi-primary);text-decoration:none}
.oi-safety-party dd a:hover{text-decoration:underline}
.oi-safety-party-empty{display:flex;align-items:flex-start;gap:12px;padding:18px;border:1px dashed #cbd6e5;border-radius:12px;background:#fbfcfe;color:#6c7a8d}
.oi-safety-party-empty>i{margin-top:2px;color:#6f87ad}
.oi-safety-party-empty p{display:grid;gap:3px;margin:0}
.oi-safety-party-empty strong{color:#33445b;font-size:13px}
.oi-safety-party-empty span{font-size:12px;line-height:1.5}
@media(max-width:600px){.oi-pd-safety-entry{margin-top:22px}.oi-pd-safety-trigger{grid-template-columns:38px minmax(0,1fr) 12px;gap:11px;min-height:70px;padding:12px 14px}.oi-pd-safety-trigger-icon{width:38px;height:38px}.oi-pd-safety-trigger-meta{display:none}.oi-safety-modal{place-items:end center;padding:0}.oi-safety-modal-dialog{width:100%;max-height:92vh;border-radius:20px 20px 0 0;border-bottom:0}.oi-safety-modal-head{padding:17px 18px}.oi-safety-modal-heading h2{font-size:19px}.oi-safety-modal-body{max-height:calc(92vh - 76px);padding:17px 16px calc(22px + env(safe-area-inset-bottom,0px))}.oi-safety-modal-intro{margin-bottom:14px}.oi-safety-party dl>div{grid-template-columns:1fr;gap:3px;padding:10px 0}}

.oi-pd-tabs {
  margin-top: 36px;
}
.oi-pd-tab-nav {
  border-bottom: 1px solid var(--oi-line);
  gap: 4px;
}
.oi-pd-tab-nav .nav-link {
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  margin-bottom: -1px;
  padding: 12px 16px;
  color: var(--oi-muted);
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: transparent;
}
.oi-pd-tab-nav .nav-link:hover {
  color: var(--oi-ink);
  border-color: transparent;
}
.oi-pd-tab-nav .nav-link.active {
  color: var(--oi-primary);
  border-bottom-color: var(--oi-primary);
  background: transparent;
}
.oi-pd-tab-count{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:5px;padding:0 5px;border-radius:999px;background:#eef2f7;color:#627086;font-size:10px}.oi-pd-tab-nav .nav-link.active .oi-pd-tab-count{background:#e7efff;color:#215ada}.oi-od-reviewed.is-pending{color:#946200}.oi-od-reviewed.is-rejected{color:#b42318}.oi-review-card-meta{display:flex;align-items:center;justify-content:space-between;gap:10px}.oi-review-card-meta b{padding:4px 7px;border-radius:999px;font-size:10px}.oi-review-card-meta b.is-pending{background:#fff5d8;color:#946200}.oi-review-card-meta b.is-approved{background:#e8f8ee;color:#197044}.oi-review-card-meta b.is-rejected{background:#fff0f0;color:#b42318}
.oi-pd-tab-content {
  padding: 22px 4px 8px;
}
.oi-product-desc {
  white-space: pre-wrap;
  margin: 0;
  font-size: 15px;
  line-height: 1.75;
  color: #495057;
}
.oi-product-desc-html {
  white-space: normal;
}
.oi-product-desc-html p { margin: 0 0 .75em; }
.oi-product-desc-html ul, .oi-product-desc-html ol { margin: 0 0 .75em 1.2em; }
.oi-product-desc-html table { width: 100%; border-collapse: collapse; margin: 0 0 1em; }
.oi-product-desc-html th, .oi-product-desc-html td { border: 1px solid #e5e7eb; padding: 8px 10px; vertical-align: top; }
.oi-product-desc-html img { display: block; max-width: 100%; height: auto; margin-inline: auto; }
.oi-pd-feature-table {
  width: 100%;
  border-collapse: collapse;
}
.oi-pd-feature-table th,
.oi-pd-feature-table td {
  padding: 12px 14px;
  border-bottom: 1px solid var(--oi-line);
  font-size: 14px;
  vertical-align: top;
  text-align: left;
}
.oi-pd-feature-table tr:last-child th,
.oi-pd-feature-table tr:last-child td {
  border-bottom: 0;
}
.oi-pd-feature-table th {
  width: 34%;
  max-width: 220px;
  font-weight: 700;
  color: var(--oi-ink);
  background: var(--oi-soft);
}
.oi-pd-feature-table td {
  color: #495057;
}
.oi-pd-empty {
  margin: 0;
  color: var(--oi-muted);
  font-size: 14px;
}

@media (max-width: 991px) {
  .oi-product-gallery {
    position: static;
    top: auto;
  }
  .oi-pd .container > .row {
    --bs-gutter-x: 1rem;
  }
  .oi-pd-breadcrumb {
    display: none;
  }
  .oi-pd.oi-product-detail {
    padding-top: 8px;
  }
  .oi-product-gallery-main {
    border: 0;
    border-radius: 0;
    background: #fff;
  }
  .oi-product-gallery-main img {
    max-height: 320px;
  }
  .oi-gal-nav {
    width: 36px;
    height: 36px;
  }
  .oi-gal-prev { left: 8px; }
  .oi-gal-next { right: 8px; }
  .oi-product-thumbs { margin-top: 8px; }
  .oi-pd-buybox {
    display: flex;
    flex-direction: column;
    padding-top: 8px;
  }
  .oi-pd-brand { order: 1; margin-bottom: 4px; }
  .oi-pd-title { order: 2; font-size: 1.15rem; }
  .oi-pd-rating { order: 3; margin-top: 6px; }
  .oi-pd-price-block { order: 4; margin-top: 10px; }
  .oi-pd-options, .oi-pd-variants { order: 5; margin-top: 14px; }
  .oi-pd-cart-row { order: 6; margin-top: 12px; }
  .oi-pd-cart-row .oi-pd-add-cart { display: none; }
  .oi-pd-specs { display: none; }
  .oi-pd-utils { order: 8; margin-top: 14px; }
  .oi-pd-opt-btn.has-img {
    flex-direction: column;
    width: 76px;
    min-height: 0;
    padding: 4px;
    gap: 4px;
    align-items: center;
  }
  .oi-pd-opt-btn.has-img .oi-pd-opt-img {
    width: 64px;
    height: 64px;
  }
  .oi-pd-opt-btn.has-img .oi-pd-opt-name {
    font-size: 11px;
    line-height: 1.2;
    text-align: center;
  }
}
.oi-pd-buybar {
  display: none;
}
@media (max-width: 991px) {
  body:has(.oi-pd-buybar) {
    padding-bottom: calc(64px + 76px + env(safe-area-inset-bottom, 0px));
  }
  .oi-pd-buybar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    z-index: 1190;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 14px;
    background: #fff;
    border-top: 1px solid var(--oi-line, #e9ecef);
    box-shadow: 0 -8px 24px rgba(33, 37, 41, 0.1);
  }
  .oi-pd-buybar-price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    flex: 1 1 auto;
    gap: 2px;
  }
  .oi-pd-buybar .oi-pd-compare {
    font-size: 12px;
  }
  .oi-pd-buybar .oi-pd-price {
    font-size: 1.2rem;
    line-height: 1.1;
  }
  .oi-pd-buybar .oi-pd-add-cart {
    flex: 0 0 auto;
    min-width: 148px;
    height: 46px;
    min-height: 46px;
    max-height: 46px;
    padding: 0 18px;
  }
}
@media (max-width: 575px) {
  .oi-pd-cart-row {
    flex-wrap: wrap;
  }
  .oi-pd-cart-row .oi-pd-add-cart {
    flex: 1 1 100%;
  }
  .oi-pd-buybar .oi-pd-add-cart {
    flex: 0 0 auto;
    width: auto;
  }
  .oi-pd-utils {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .oi-pd-specs th {
    width: 108px;
  }
  .oi-pd-title {
    font-size: 1.3rem;
  }
  .oi-pd-price {
    font-size: 1.55rem;
  }
  .oi-pd-tab-nav .nav-link {
    padding: 10px 12px;
    font-size: 13px;
  }
  .oi-pd-feature-table th {
    width: 42%;
  }
}

/* ---- Minicart + cart page ---- */
.oi-minicart .inner-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.oi-minicart .inner-top {
  flex: 1 1 auto;
  overflow: auto;
}
.oi-minicart .oi-minicart-footer {
  flex: 0 0 auto;
  padding-bottom: 8px;
}
.oi-minicart .oi-cart-subttotal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 12px;
  font-family: "Cabin", sans-serif;
}
.oi-minicart .oi-cart-subttotal .price {
  font-weight: 700;
  color: var(--oi-primary, #0d6efd);
}
.oi-minicart .oi-minicart-goto {
  background: var(--oi-primary, #0d6efd);
  border-radius: 8px;
}
.oi-minicart .minicart-item {
  align-items: flex-start;
}
.oi-minicart .oi-minicart-wrapper .minicart-item > .thumbnail {
  box-sizing: border-box;
  flex: 0 0 104px;
  width: 104px;
  min-width: 104px;
  max-width: 104px;
  height: 104px;
  padding: 6px;
  border: 1px solid #edf0f4;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.oi-minicart .oi-minicart-wrapper .minicart-item > .thumbnail > a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.oi-minicart .oi-minicart-wrapper .minicart-item > .thumbnail img {
  display: block;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  border-radius: 6px;
  object-fit: contain;
  object-position: center;
  scale: 1;
  background: #fff;
}
.oi-minicart .oi-minicart-wrapper .minicart-item:hover > .thumbnail img {
  scale: 1;
}
.oi-minicart .oi-minicart-wrapper .minicart-item > .product-content {
  min-width: 0;
  padding-left: 14px;
}
@media (max-width: 767px) {
  .oi-minicart .oi-minicart-wrapper .minicart-item > .thumbnail {
    flex-basis: 92px;
    width: 92px;
    min-width: 92px;
    max-width: 92px;
    height: 92px;
    padding: 5px;
  }
  .oi-minicart .oi-minicart-wrapper .minicart-item > .product-content {
    padding-left: 12px;
  }
}
.oi-minicart .bottom-part {
  margin-top: 8px;
}
.oi-minicart .oi-cart-qty,
.oi-cart-page .oi-qty-area.oi-cart-qty {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center;
  flex: 0 0 auto;
  box-sizing: border-box;
  width: 110px !important;
  min-width: 110px !important;
  max-width: 110px !important;
  height: 36px !important;
  margin: 0;
  padding: 0 !important;
  border: 1px solid #e9ecef !important;
  border-radius: 8px !important;
  overflow: hidden;
  background: #fff;
}
.oi-minicart .oi-cart-qty .qty-item-btn,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn,
.oi-cart-page .oi-qty-area.oi-cart-qty button {
  box-sizing: border-box;
  flex: 0 0 34px;
  width: 34px !important;
  min-width: 34px !important;
  max-width: 34px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #212529 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer;
  position: relative !important;
  z-index: 1;
  overflow: hidden;
}
.oi-minicart .oi-cart-qty .qty-item-btn::after,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn::after,
.oi-cart-page .oi-qty-area.oi-cart-qty button::after {
  content: none !important;
  display: none !important;
}
.oi-minicart .oi-cart-qty .qty-item-btn:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty button:hover {
  background: #f8f9fa !important;
}
.oi-minicart .oi-cart-qty .qty-item-btn.is-locked,
.oi-minicart .oi-cart-qty .qty-item-btn:disabled,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn.is-locked,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn:disabled,
.oi-cart-page .oi-qty-area.oi-cart-qty button.is-locked,
.oi-cart-page .oi-qty-area.oi-cart-qty button:disabled {
  opacity: .35 !important;
  cursor: not-allowed !important;
  color: #adb5bd !important;
  background: #f8f9fa !important;
}
.oi-minicart .oi-cart-qty .qty-item-btn.is-locked:hover,
.oi-minicart .oi-cart-qty .qty-item-btn:disabled:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn.is-locked:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty .qty-item-btn:disabled:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty button.is-locked:hover,
.oi-cart-page .oi-qty-area.oi-cart-qty button:disabled:hover {
  background: #f8f9fa !important;
}
.oi-minicart .oi-cart-qty .items-qty-input,
.oi-cart-page .oi-qty-area.oi-cart-qty .items-qty-input,
.oi-cart-page .oi-qty-area.oi-cart-qty input {
  box-sizing: border-box;
  flex: 0 0 42px;
  width: 42px !important;
  min-width: 42px !important;
  max-width: 42px !important;
  height: 36px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-left: 1px solid #e9ecef !important;
  border-right: 1px solid #e9ecef !important;
  border-radius: 0 !important;
  text-align: center !important;
  font-family: "Cabin", sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 36px !important;
  color: #212529 !important;
  background: #fff !important;
  box-shadow: none !important;
  -moz-appearance: textfield;
  appearance: textfield;
}
.oi-minicart .oi-cart-qty .items-qty-input::-webkit-outer-spin-button,
.oi-minicart .oi-cart-qty .items-qty-input::-webkit-inner-spin-button,
.oi-cart-page .oi-qty-area.oi-cart-qty .items-qty-input::-webkit-outer-spin-button,
.oi-cart-page .oi-qty-area.oi-cart-qty .items-qty-input::-webkit-inner-spin-button,
.oi-cart-page .oi-qty-area.oi-cart-qty input::-webkit-outer-spin-button,
.oi-cart-page .oi-qty-area.oi-cart-qty input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.oi-cart-page {
  --oi-ink: #212529;
  --oi-muted: #6c757d;
  --oi-line: #e9ecef;
  --oi-soft: #f8f9fa;
  --oi-primary: #0d6efd;
  font-family: "Cabin", sans-serif;
  color: var(--oi-ink);
}
.oi-cart-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}
.oi-cart-title {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
}
.oi-cart-subtitle {
  margin: 6px 0 0;
  color: var(--oi-muted);
  font-size: 14px;
}
.oi-cart-continue {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--oi-primary);
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
}
.oi-cart-continue:hover {
  text-decoration: underline;
  color: var(--oi-primary);
}

.oi-cart-panel {
  border: 1px solid var(--oi-line);
  border-radius: 12px;
  background: #fff;
  overflow: hidden;
}
.oi-cart-panel-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px 160px;
  gap: 12px;
  padding: 12px 20px;
  background: var(--oi-soft);
  border-bottom: 1px solid var(--oi-line);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--oi-muted);
}
.oi-cart-list {
  min-height: 120px;
}
.oi-cart-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 48px 20px;
  color: var(--oi-muted);
}
.oi-cart-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 140px 160px;
  gap: 12px;
  align-items: center;
  padding: 18px 20px;
  border-bottom: 1px solid var(--oi-line);
}
.oi-cart-row:last-child {
  border-bottom: 0;
}
.oi-cart-col-product {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.oi-cart-row-img {
  flex: 0 0 84px;
  display: block;
  width: 84px;
  height: 84px;
  border-radius: 10px;
  overflow: hidden;
  background: var(--oi-soft);
  border: 1px solid var(--oi-line);
}
.oi-cart-row-img img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.oi-gallery-image-changing {
  animation: oi-gallery-image-in 220ms ease-out both;
}
@keyframes oi-gallery-image-in {
  from { opacity: 0; transform: translateY(4px) scale(0.992); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .oi-gallery-image-changing { animation: none; }
}
.oi-cart-row-body {
  min-width: 0;
}
.oi-cart-row-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.35;
}
.oi-cart-row-title a {
  color: var(--oi-ink);
  text-decoration: none;
}
.oi-cart-row-title a:hover {
  color: var(--oi-primary);
}
.oi-cart-row-meta {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oi-muted);
}
.oi-cart-unit {
  font-weight: 700;
  font-size: 15px;
  color: var(--oi-ink);
}
.oi-cart-col-qty {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 14px;
}
.oi-cart-col-qty .oi-cart-remove-icon {
  flex: 0 0 32px;
  margin-left: 2px;
}
.oi-cart-col-total {
  display: none;
}
.oi-cart-remove-icon {
  box-sizing: border-box;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--oi-line);
  border-radius: 50%;
  background: #fff;
  color: var(--oi-muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  line-height: 1;
}
.oi-cart-remove-icon:hover {
  color: #dc3545;
  border-color: #f1aeb5;
  background: #fff5f5;
}
.oi-cart-remove-link {
  border: 0;
  background: transparent;
  color: #dc3545;
  font-size: 13px;
  padding: 0;
  margin-top: 8px;
  cursor: pointer;
}
.oi-cart-panel-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding: 14px 20px;
  border-top: 1px solid var(--oi-line);
  background: #fff;
}
.oi-cart-clear {
  border: 0;
  background: transparent;
  color: #dc3545;
  font-size: 13px;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  cursor: pointer;
}
.oi-cart-shop-link {
  color: var(--oi-primary);
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.oi-cart-shop-link:hover {
  text-decoration: underline;
}

.oi-cart-empty {
  text-align: center;
  padding: 56px 24px;
}
.oi-cart-empty-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: var(--oi-soft);
  color: var(--oi-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
}
.oi-cart-empty h3 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
}
.oi-cart-empty p {
  margin: 8px auto 20px;
  max-width: 360px;
  color: var(--oi-muted);
  font-size: 14px;
}

.oi-cart-summary {
  position: sticky;
  top: 120px;
  padding: 22px;
  border: 1px solid var(--oi-line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(33, 37, 41, 0.05);
}
.oi-cart-summary-title {
  margin: 0 0 18px;
  font-size: 1.05rem;
  font-weight: 700;
}
.oi-cart-summary-rows {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--oi-line);
}
.oi-cart-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}
.oi-cart-summary-row strong {
  font-weight: 700;
}
.oi-cart-shipping {
  color: var(--oi-muted);
  font-weight: 600 !important;
}
.oi-cart-summary-total {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  margin-top: 14px;
  font-size: 15px;
  font-weight: 700;
}
.oi-cart-summary-total strong {
  font-size: 1.35rem;
  color: var(--oi-primary);
}
.oi-cart-summary-note {
  margin: 10px 0 18px;
  font-size: 12px;
  color: var(--oi-muted);
  line-height: 1.45;
}
.oi-cart-freeship {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 14px 0 0;
  padding: 12px 14px;
  border: 1px solid #d9e6fb;
  border-radius: 8px;
  background: #f4f8ff;
  color: #1e3a5f;
  font-size: 13px;
  line-height: 1.45;
}
.oi-cart-freeship[hidden] {
  display: none !important;
}
.oi-cart-freeship > i {
  margin-top: 2px;
  color: #215ada;
}
.oi-cart-freeship > p {
  margin: 0;
}
.oi-cart-freeship.is-ok {
  border-color: #c8e6c9;
  background: #f3faf3;
  color: #1b4332;
}
.oi-cart-freeship.is-ok > i {
  color: #2e7d32;
}
.oi-cart-shipping-old {
  margin-right: 6px;
  color: #adb5bd;
  font-weight: 600;
  text-decoration: line-through;
}
.oi-cart-shipping-free-label {
  color: #198754;
  font-weight: 700;
}
.oi-cart-coupons-bar {
  margin-bottom: 16px;
  padding: 14px 16px 16px;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  background: #fff;
}
.oi-cart-coupons-bar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.oi-cart-coupons-bar-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--oi-primary, #0d6efd);
  font-family: "Cabin", sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.oi-cart-coupons-bar-title .fa-chevron-right {
  font-size: 11px;
  opacity: 0.85;
}
.oi-cart-coupons-add-code {
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--oi-primary, #0d6efd);
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.oi-cart-coupon-manual-panel {
  margin-bottom: 12px;
  padding: 12px;
  border-radius: 8px;
  background: #f6f8fb;
}
.oi-cart-coupon-manual-hint {
  margin: 8px 0 0;
  font-size: 12px;
  color: var(--oi-muted, #6c757d);
}
.oi-cart-coupons-scroller {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 2px;
}
.oi-cart-cpcards {
  display: flex;
  gap: 12px;
  min-width: min-content;
  padding: 2px 0;
}
.oi-cart-cpcard {
  --oi-cpcard-border: rgba(13, 110, 253, 0.45);
  --oi-cpcard-notch: 7px;
  flex: 0 0 260px;
  width: 260px;
  position: relative;
  border: 1px solid var(--oi-cpcard-border);
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}
.oi-cart-cpcard.is-selected {
  --oi-cpcard-border: var(--oi-primary, #0d6efd);
  border-color: var(--oi-cpcard-border);
  box-shadow: 0 0 0 1px rgba(13, 110, 253, 0.15);
}
.oi-cart-cpcard.is-disabled {
  opacity: 0.62;
  --oi-cpcard-border: #d0d5dd;
  border-color: var(--oi-cpcard-border);
}
.oi-cart-cpcard-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 14px 12px;
}
.oi-cart-cpcard-value strong {
  display: block;
  font-family: "Cabin", sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #212529;
  line-height: 1.15;
}
.oi-cart-cpcard-value span {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: #6c757d;
}
.oi-cart-cpcard-btn {
  flex-shrink: 0;
  height: 32px;
  padding: 0 14px;
  border: 1px solid var(--oi-primary, #0d6efd);
  border-radius: 6px;
  background: #fff;
  color: var(--oi-primary, #0d6efd);
  font-family: "Cabin", sans-serif;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.oi-cart-cpcard-btn:hover:not(:disabled):not(.is-disabled) {
  background: rgba(13, 110, 253, 0.06);
}
.oi-cart-cpcard-btn.is-active {
  background: var(--oi-primary, #0d6efd);
  color: #fff;
}
.oi-cart-cpcard-btn.is-disabled,
.oi-cart-cpcard-btn:disabled {
  border-color: #ced4da;
  color: #adb5bd;
  cursor: not-allowed;
}
.oi-cart-cpcard-perforation {
  position: relative;
  height: 0;
  margin: 0 calc(var(--oi-cpcard-notch) + 6px);
  border-top: 1px dashed var(--oi-cpcard-border);
}
.oi-cart-cpcard-perforation::before,
.oi-cart-cpcard-perforation::after {
  content: "";
  position: absolute;
  top: 50%;
  width: calc(var(--oi-cpcard-notch) * 2);
  height: calc(var(--oi-cpcard-notch) * 2);
  border-radius: 50%;
  background: #fff;
  transform: translateY(-50%);
  pointer-events: none;
  z-index: 2;
}
.oi-cart-cpcard-perforation::before {
  left: calc(-1 * (var(--oi-cpcard-notch) + 6px) - var(--oi-cpcard-notch));
}
.oi-cart-cpcard-perforation::after {
  right: calc(-1 * (var(--oi-cpcard-notch) + 6px) - var(--oi-cpcard-notch));
}
.oi-cart-cpcard-foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px 12px;
  background: #f7faff;
}
.oi-cart-cpcard-desc {
  margin: 0;
  flex: 1;
  min-width: 0;
  font-size: 12px;
  line-height: 1.35;
  color: var(--oi-primary, #0d6efd);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.oi-cart-cpcard-detail {
  flex-shrink: 0;
  border: 0;
  background: transparent;
  padding: 0;
  color: var(--oi-primary, #0d6efd);
  font-family: "Cabin", sans-serif;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.oi-cart-coupons-loading,
.oi-cart-coupons-empty {
  margin: 0;
  font-size: 13px;
  color: var(--oi-muted, #6c757d);
  line-height: 1.45;
}
.oi-cart-coupons-empty a {
  color: var(--oi-primary, #0d6efd);
  font-weight: 600;
  text-decoration: underline;
}
.oi-cart-coupon-applied-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border-radius: 8px;
  background: rgba(13, 110, 253, 0.08);
  font-size: 13px;
  font-weight: 600;
}
.oi-cart-coupon-row {
  display: flex;
  gap: 8px;
}
.oi-cart-coupon-input {
  flex: 1;
  min-width: 0;
  height: 42px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 8px;
  padding: 0 12px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
}
.oi-cart-coupon-btn {
  height: 42px;
  padding: 0 14px;
  border: 0;
  border-radius: 8px;
  background: #1a1a1a;
  color: #fff;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  cursor: pointer;
}
.oi-cart-coupon-remove {
  border: 0;
  background: transparent;
  color: #c62828;
  font-family: "Cabin", sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  padding: 0;
}
.oi-coupon-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.oi-coupon-detail-modal[hidden] {
  display: none !important;
}
.oi-coupon-detail-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
}
.oi-coupon-detail-dialog {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 420px;
  background: #fff;
  border-radius: 12px;
  padding: 18px 18px 16px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
}
.oi-coupon-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.oi-coupon-detail-head h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
}
.oi-coupon-detail-x {
  border: 0;
  background: transparent;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  color: #666;
}
.oi-coupon-detail-body p {
  margin: 0 0 8px;
  font-size: 14px;
  line-height: 1.45;
}
.oi-coupon-detail-note {
  margin-top: 12px !important;
  padding-top: 10px;
  border-top: 1px solid #eee;
  font-size: 12px !important;
  color: #6c757d;
}
.oi-cart-discount-val {
  color: #198754 !important;
}
.oi-cart-shipping--free {
  color: #198754 !important;
}
.oi-coupon-tickets {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.oi-coupon-tickets--cart {
  flex-direction: row;
  gap: 12px;
  min-width: min-content;
  padding: 2px 0;
}
.oi-coupon-tickets--cart .oi-coupon-ticket {
  flex: 0 0 420px;
  width: 420px;
}
.oi-coupon-ticket {
  position: relative;
  width: 100%;
  max-width: 520px;
  overflow: hidden;
}
.oi-coupon-ticket-inner {
  position: relative;
  display: flex;
  align-items: stretch;
  min-height: 112px;
  padding: 16px;
  border: 2px dashed var(--oi-primary, #0d6efd);
  border-radius: 8px;
  background: #d3e1f8;
  font-family: "Cabin", sans-serif;
}
.oi-coupon-ticket-stub {
  position: relative;
  flex: 0 0 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 16px;
  padding-right: 12px;
  border-right: 2px dashed var(--oi-primary, #0d6efd);
}
.oi-coupon-ticket-stub::before,
.oi-coupon-ticket-stub::after {
  content: "";
  position: absolute;
  left: 100%;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  border: 2px dashed var(--oi-primary, #0d6efd);
  z-index: 4;
  transform: translateX(-50%);
  pointer-events: none;
}
.oi-coupon-ticket-stub::before {
  top: 100%;
}
.oi-coupon-ticket-stub::after {
  bottom: 100%;
  top: auto;
}
.oi-coupon-ticket-code {
  display: block;
  color: var(--oi-primary, #0d6efd);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.04em;
  white-space: nowrap;
  writing-mode: vertical-lr;
  transform: rotate(180deg);
  max-height: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
  border: 0;
  background: transparent;
  padding: 0;
}
.oi-coupon-ticket-details {
  flex: 1;
  min-width: 0;
  padding-right: 88px;
}
.oi-coupon-ticket-title {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
  color: #111;
  text-transform: uppercase;
}
.oi-coupon-ticket-sub {
  margin: 4px 0 0;
  font-size: 13px;
  font-weight: 600;
  color: #333;
}
.oi-coupon-ticket-list {
  margin: 10px 0 0;
  padding-left: 1.1em;
  color: #555;
  font-size: 12px;
  line-height: 1.45;
}
.oi-coupon-ticket-list li {
  margin: 4px 0;
}
.oi-coupon-ticket-list li::marker {
  color: var(--oi-primary, #0d6efd);
}
.oi-coupon-ticket-actions {
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 8px;
  z-index: 5;
}
.oi-coupon-ticket-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: var(--oi-primary, #0d6efd);
  color: #fff;
  cursor: pointer;
  font-size: 14px;
}
.oi-coupon-ticket-copy:hover {
  filter: brightness(1.05);
}
.oi-coupon-ticket-apply {
  height: 32px;
  padding: 0 12px;
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font-family: "Cabin", sans-serif;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
.oi-coupon-ticket-apply:hover {
  background: #000;
}
.oi-coupon-ticket-expired {
  display: inline-block;
  max-width: 140px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #e6e6e6;
  color: #888;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
}
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-inner {
  border-color: #c1c1c1;
  background: #eff1f4;
}
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-stub {
  border-color: #c1c1c1;
}
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-stub::before,
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-stub::after {
  border-color: #c1c1c1;
}
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-code,
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-title,
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-sub,
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-list {
  color: #888;
}
.oi-coupon-ticket.is-disabled .oi-coupon-ticket-list li::marker {
  color: #888;
}
@media (max-width: 575px) {
  .oi-coupon-tickets--cart .oi-coupon-ticket {
    flex-basis: calc(100vw - 64px);
    width: calc(100vw - 64px);
  }
  .oi-coupon-ticket-inner {
    padding: 12px 10px;
  }
  .oi-coupon-ticket-stub {
    flex-basis: 40px;
    margin-right: 10px;
  }
  .oi-coupon-ticket-details {
    padding-right: 72px;
  }
  .oi-coupon-ticket-title {
    font-size: 14px;
  }
}
.oi-cart-checkout {
  width: 100%;
  height: 48px;
  margin-top: 16px;
  border: 0;
  border-radius: 8px;
  background: var(--oi-primary);
  color: #fff;
  font-family: "Cabin", sans-serif;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.oi-cart-checkout:hover:not(:disabled) {
  background: #0b5ed7;
}
.oi-cart-checkout:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.oi-cart-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  margin-top: 10px;
  border: 1px solid var(--oi-line);
  border-radius: 8px;
  background: #fff;
  color: var(--oi-ink);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}
.oi-cart-secondary:hover {
  background: var(--oi-soft);
  color: var(--oi-ink);
}
.oi-cart-perks {
  list-style: none;
  margin: 18px 0 0;
  padding: 16px 0 0;
  border-top: 1px solid var(--oi-line);
}
.oi-cart-perks li {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 13px;
  color: var(--oi-muted);
}
.oi-cart-perks li:last-child {
  margin-bottom: 0;
}
.oi-cart-perks i {
  color: var(--oi-primary);
  width: 16px;
  text-align: center;
}

@media (max-width: 991px) {
  .oi-cart-summary {
    position: static;
    top: auto;
    margin-top: 8px;
  }
  .oi-cart-panel-top {
    grid-template-columns: minmax(0, 1fr) 120px 140px;
  }
  .oi-cart-row {
    grid-template-columns: minmax(0, 1fr) 120px 140px;
  }
}
@media (max-width: 767px) {
  .oi-cart-title {
    font-size: 1.4rem;
  }
  .oi-cart-row {
    grid-template-columns: 1fr 1fr;
    gap: 10px 12px;
    padding: 16px;
  }
  .oi-cart-col-product {
    grid-column: 1 / -1;
  }
  .oi-cart-col-price,
  .oi-cart-col-qty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  .oi-cart-col-price::before,
  .oi-cart-col-qty::before {
    content: attr(data-label);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--oi-muted);
  }
  .oi-cart-col-qty {
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }
  .oi-cart-row-img {
    flex-basis: 72px;
    width: 72px;
    height: 72px;
  }
}


/* ---- Auth / hesap ---- */
.oi-auth-area {
  background: var(--oi-soft, #f8f9fa);
}
.oi-auth-card {
  background: #fff;
  border: 1px solid var(--oi-line, #e9ecef);
  border-radius: 12px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}
.oi-auth-card-inner {
  padding: 28px 24px 26px;
}
.oi-auth-brand {
  text-align: center;
  margin-bottom: 18px;
}
.oi-auth-brand img {
  height: 78px;
  width: auto;
  max-width: 260px;
  object-fit: contain;
}
.oi-auth-title {
  margin: 0 0 8px;
  font-family: "Cabin", sans-serif;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--oi-ink, #212529);
  text-align: center;
}
.oi-auth-lead {
  margin: 0 0 22px;
  text-align: center;
  font-size: 14px;
  color: var(--oi-muted, #6c757d);
  line-height: 1.5;
}
.oi-auth-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.oi-auth-form[hidden] { display: none !important; }
.oi-auth-captcha-modal[hidden] { display: none !important; }
.oi-auth-captcha-modal { position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 18px; }
.oi-auth-captcha-backdrop { position: absolute; inset: 0; background: rgba(15, 28, 54, .62); backdrop-filter: blur(5px); }
.oi-auth-captcha-panel { position: relative; width: min(100%, 440px); max-height: calc(100vh - 36px); overflow-y: auto; padding: 30px 28px 25px; border: 1px solid #dce6f5; border-radius: 20px; background: #fff; box-shadow: 0 28px 80px rgba(14, 32, 67, .22); text-align: center; }
.oi-auth-captcha-close { position: absolute; top: 15px; right: 15px; width: 34px; height: 34px; display: grid; place-items: center; border: 0; border-radius: 9px; background: #f1f4f9; color: #52647e; cursor: pointer; }
.oi-auth-captcha-close:hover { background: #e8effc; color: #315fd1; }
.oi-auth-captcha-badge { display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 17px; background: #edf3ff; color: #315fd1; font-size: 24px; }
.oi-auth-captcha-step { color: #315fd1; font-size: 11px; font-weight: 800; letter-spacing: .11em; }
.oi-auth-captcha-panel h2 { margin: 8px 0 8px; color: #172b4b; font-size: 25px; line-height: 1.2; }
.oi-auth-captcha-description { margin: 0 0 21px; color: #65758d; font-size: 14px; line-height: 1.6; }
.oi-auth-captcha { display: flex; justify-content: center; min-height: 78px; }
.oi-auth-captcha-status { margin: 13px 0 0; color: #65758d; font-size: 13px; font-weight: 700; }
.oi-auth-captcha-note { display: block; margin-top: 19px; padding-top: 15px; border-top: 1px solid #e8edf5; color: #718099; line-height: 1.5; font-size: 11px; }
.oi-auth-captcha-note a { color: #315fd1; }
body.oi-auth-modal-open { overflow: hidden; }
@media (max-width: 420px) { .oi-auth-captcha-panel { padding: 27px 14px 20px; } }
.oi-auth-code-form { text-align: center; }
.oi-auth-code-form h3 { margin: 0; font-size: 1.2rem; color: #17223a; }
.oi-auth-code-form p { margin: 0; color: #627087; line-height: 1.6; }
.oi-auth-code-step { align-self: center; padding: 7px 12px; border-radius: 999px; background: #edf3ff; color: #315fd1; font-size: 11px; font-weight: 800; letter-spacing: .07em; }
.oi-auth-code-icon { width: 62px; height: 62px; margin: 3px auto 0; display: grid; place-items: center; border-radius: 18px; background: #eef3ff; color: #345bd6; font-size: 26px; }
.oi-auth-code-form .oi-auth-field { text-align: left; }
.oi-auth-code-boxes { display: flex; justify-content: center; gap: clamp(6px, 1.5vw, 11px); margin-top: 9px; }
.oi-auth-code-boxes .oi-auth-code-digit { width: clamp(40px, 10vw, 58px); height: clamp(50px, 11vw, 62px); padding: 0; border: 1.5px solid #d4deed; border-radius: 11px; background: #f9fbff; color: #142a4b; text-align: center; font-size: 25px; font-weight: 800; font-variant-numeric: tabular-nums; box-shadow: none; }
.oi-auth-code-boxes .oi-auth-code-digit:focus { border-color: #315fd1; outline: 3px solid rgba(49, 95, 209, .16); background: #fff; box-shadow: none; }
.oi-auth-code-actions { display: flex; justify-content: space-between; gap: 12px; }
.oi-auth-resend-wrap { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.oi-auth-resend-timer { color: #61718a; font-size: 12px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.oi-auth-code-actions button { border: 0; background: none; color: var(--oi-primary, #0d6efd); font-size: 13px; font-weight: 700; cursor: pointer; }
.oi-auth-code-actions button:disabled { opacity: .5; cursor: not-allowed; }
.oi-auth-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.oi-auth-field {
  margin: 0;
  border: 0;
  padding: 0;
  min-width: 0;
}
.oi-auth-label {
  display: block;
  margin: 0 0 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
}
.oi-auth-label span {
  color: #dc3545;
}
.oi-auth-input {
  width: 100%;
  box-sizing: border-box;
  border: 1px solid #ced4da;
  border-radius: 6px;
  padding: 11px 12px;
  font-size: 14px;
  font-family: "Cabin", sans-serif;
  color: var(--oi-ink, #212529);
  background: #fff;
  outline: 0;
}
select.oi-auth-input {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236c757d' d='M6 8L0 0h12z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  background-size: 10px 7px;
  padding-right: 34px;
  cursor: pointer;
}
select.oi-auth-input:disabled {
  background-color: #f1f3f5;
  color: #868e96;
  cursor: not-allowed;
}
.oi-auth-input:focus {
  border-color: var(--oi-primary, #0d6efd);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
}
.oi-auth-radio-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.oi-auth-radio-list li {
  margin: 0;
}
.oi-auth-radio-list input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.oi-auth-radio-list label {
  display: inline-block;
  padding: 8px 12px;
  border: 1px solid #ced4da;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  color: var(--oi-muted, #6c757d);
  background: #fff;
}
.oi-auth-radio-list input:checked + label {
  border-color: var(--oi-primary, #0d6efd);
  color: var(--oi-primary, #0d6efd);
  background: rgba(13, 110, 253, 0.06);
}

.oi-auth-gender-seg {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.oi-auth-gender-opt {
  margin: 0;
  cursor: pointer;
}
.oi-auth-gender-opt input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.oi-auth-gender-opt span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 8px 10px;
  border: 1px solid #ced4da;
  border-radius: 8px;
  background: #fff;
  color: var(--oi-muted, #6c757d);
  font-size: 13px;
  font-weight: 600;
  text-align: center;
  line-height: 1.25;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.oi-auth-gender-opt:hover span {
  border-color: #adb5bd;
  color: var(--oi-ink, #212529);
}
.oi-auth-gender-opt input:checked + span {
  border-color: var(--oi-primary, #0d6efd);
  color: var(--oi-primary, #0d6efd);
  background: rgba(13, 110, 253, 0.08);
  box-shadow: inset 0 0 0 1px var(--oi-primary, #0d6efd);
}
.oi-auth-gender-opt input:focus-visible + span {
  outline: 2px solid rgba(13, 110, 253, 0.35);
  outline-offset: 2px;
}

.oi-auth-pass-wrap {
  position: relative;
}
.oi-auth-pass-wrap .oi-auth-input {
  padding-right: 44px;
}
.oi-auth-pass-toggle {
  position: absolute;
  top: 50%;
  right: 6px;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--oi-muted, #6c757d);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.oi-auth-pass-toggle:hover {
  color: var(--oi-ink, #212529);
  background: var(--oi-soft, #f8f9fa);
}
.oi-auth-pass-toggle::after,
.oi-auth-pass-toggle::before {
  content: none !important;
  display: none !important;
}
.oi-auth-pass-meter {
  margin-top: -2px;
  padding: 12px 12px 10px;
  border: 1px solid var(--oi-line, #e9ecef);
  border-radius: 8px;
  background: #fafbfc;
}
.oi-auth-pass-bar {
  height: 6px;
  border-radius: 999px;
  background: #e9ecef;
  overflow: hidden;
}
.oi-auth-pass-bar-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: #adb5bd;
  transition: width 0.2s ease, background 0.2s ease;
}
.oi-auth-pass-bar-fill.is-weak { background: #dc3545; }
.oi-auth-pass-bar-fill.is-fair { background: #fd7e14; }
.oi-auth-pass-bar-fill.is-good { background: #ffc107; }
.oi-auth-pass-bar-fill.is-strong { background: #198754; }
.oi-auth-pass-meter-label {
  margin: 8px 0 6px;
  font-size: 12px;
  font-weight: 700;
  color: var(--oi-muted, #6c757d);
}
.oi-auth-pass-rules {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 12px;
}
.oi-auth-pass-rules li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #868e96;
  line-height: 1.35;
}
.oi-auth-pass-rules li i {
  font-size: 8px;
  width: 12px;
  text-align: center;
}
.oi-auth-pass-rules li.is-ok {
  color: #198754;
  font-weight: 600;
}
.oi-auth-pass-rules li.is-ok i {
  font-size: 11px;
}
.oi-auth-error {
  margin: 0;
  padding: 10px 12px;
  border-radius: 6px;
  background: #fff5f5;
  border: 1px solid #f1aeb5;
  color: #b02a37;
  font-size: 13px;
}
.oi-auth-submit {
  display: block;
  width: 100%;
  border: 0;
  border-radius: 6px;
  padding: 12px 16px;
  background: var(--oi-primary, #0d6efd);
  color: #fff;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
}

.oi-auth-consent {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin: 0;
  padding: 11px 12px;
  border: 1px solid #e0e6ef;
  border-radius: 9px;
  background: #fbfcfe;
  color: #4b5565;
  font-size: 13px;
  line-height: 1.45;
  cursor: pointer;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.oi-auth-consent + .oi-auth-consent { margin-top: 9px; }
.oi-auth-consent:hover { border-color: #a8bef0; background: #f7f9ff; }
.oi-auth-consent input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
}
.oi-auth-consent-box {
  display: grid;
  place-items: center;
  width: 21px;
  height: 21px;
  margin-top: 1px;
  border: 1.5px solid #bac4d3;
  border-radius: 6px;
  background: #fff;
  color: transparent;
  font-size: 11px;
  transition: all .18s ease;
}
.oi-auth-consent-copy { min-width: 0; }
.oi-auth-consent-copy a { color: #245edb; font-weight: 700; text-decoration: none; }
.oi-auth-consent-copy a:hover { text-decoration: underline; }
.oi-auth-consent-copy b { color: #d23d4d; }
.oi-auth-consent input:checked + .oi-auth-consent-box {
  border-color: #2f6df3;
  background: #2f6df3;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(47,109,243,.12);
}
.oi-auth-consent input:focus-visible + .oi-auth-consent-box { outline: 3px solid rgba(47,109,243,.2); outline-offset: 2px; }
.oi-auth-submit:hover {
  filter: brightness(0.95);
  color: #fff;
}
.oi-auth-submit:disabled {
  opacity: .65;
  cursor: not-allowed;
  filter: none;
}
.oi-auth-submit--ghost {
  background: #fff;
  color: var(--oi-ink, #212529);
  border: 1px solid #ced4da;
}
.oi-auth-submit--ghost:hover {
  background: var(--oi-soft, #f8f9fa);
  color: var(--oi-ink, #212529);
  filter: none;
}
.oi-auth-switch {
  margin: 18px 0 0;
  text-align: center;
  font-size: 14px;
  color: var(--oi-muted, #6c757d);
}
.oi-auth-switch a {
  color: var(--oi-primary, #0d6efd);
  font-weight: 700;
  text-decoration: none;
}
.oi-auth-switch a:hover {
  text-decoration: underline;
}
.oi-account-meta {
  margin: 0 0 20px;
  display: grid;
  gap: 12px;
}
.oi-account-meta > div {
  display: grid;
  gap: 2px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--oi-line, #e9ecef);
}
.oi-account-meta dt {
  margin: 0;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--oi-muted, #6c757d);
}
.oi-account-meta dd {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
}
.oi-account-actions {
  display: grid;
  gap: 10px;
}

/* ---- Müşteri paneli ---- */
.oi-account-area {
  background: #f3f4f6;
}
.oi-account {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.oi-account-side {
  position: sticky;
  top: 96px;
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  padding: 20px 12px 12px;
}
.oi-account-side-scroll {
  display: grid;
  gap: 0;
}
.oi-account-user {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 0 8px 18px;
  margin-bottom: 8px;
  border-bottom: 1px solid #eef0f2;
}
.oi-account-avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, #0d6efd, #0a58ca);
  color: #fff;
  font-family: "Cabin", sans-serif;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.02em;
  flex: 0 0 auto;
}
.oi-account-user-text {
  min-width: 0;
  display: grid;
  gap: 2px;
}
.oi-account-user-text strong {
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.oi-account-user-text span {
  font-size: 12px;
  color: var(--oi-muted, #6c757d);
}
.oi-account-nav,
.oi-account-nav-group,
.oi-account-nav-foot {
  display: grid;
  gap: 2px;
}
.oi-account-nav-group {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #eef0f2;
}
.oi-account-nav-foot {
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #eef0f2;
}
.oi-account-nav-label {
  margin: 0 8px 6px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #9aa0a6;
}
.oi-account-nav-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: 0;
  background: transparent;
  color: #484848;
  border-radius: 8px;
  padding: 11px 12px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
}
.oi-account-nav-btn i {
  width: 18px;
  text-align: center;
  color: #6c757d;
  font-size: 15px;
}
.oi-account-nav-btn span {
  min-width: 0;
  white-space: nowrap;
}
.oi-account-nav-btn:hover {
  background: #f5f7fa;
  color: var(--oi-ink, #212529);
}
.oi-account-nav-btn.is-active {
  background: rgba(13, 110, 253, 0.08);
  color: var(--oi-primary, #0d6efd);
}
.oi-account-nav-btn.is-active i {
  color: var(--oi-primary, #0d6efd);
}
.oi-account-nav-btn--sub {
  position: relative;
  padding-left: 16px;
}
.oi-account-nav-btn--sub::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 10px;
  bottom: 10px;
  width: 2px;
  border-radius: 2px;
  background: transparent;
}
.oi-account-nav-btn--sub:hover::before,
.oi-account-nav-btn--sub.is-active::before {
  background: var(--oi-primary, #0d6efd);
}
.oi-account-nav-btn--danger {
  color: #6c757d;
}
.oi-account-nav-btn--danger:hover {
  background: #fff5f5;
  color: #b02a37;
}
.oi-account-nav-btn--danger:hover i {
  color: #b02a37;
}
.oi-account-main {
  min-width: 0;
}
.oi-account-dashboard { display: grid; gap: 18px; }
.oi-account-welcome { display: flex; align-items: end; justify-content: space-between; gap: 18px; }
.oi-account-eyebrow { margin: 0 0 5px; color: #2f66e8; font-size: 11px; font-weight: 800; letter-spacing: .1em; }
.oi-account-welcome h2 { margin: 0; color: #13213d; font-size: 32px; line-height: 1.08; letter-spacing: -.04em; }
.oi-account-welcome p:not(.oi-account-eyebrow) { margin: 7px 0 0; color: #718096; font-size: 14px; }
.oi-account-profile-quick, .oi-account-dashboard-card header button, .oi-account-completion > button { border: 0; background: transparent; color: #2863e8; font: 700 13px "Cabin", sans-serif; cursor: pointer; white-space: nowrap; }
.oi-account-profile-quick { display: inline-flex; align-items: center; gap: 8px; padding: 10px 13px; border: 1px solid #dce7ff; border-radius: 9px; background: #fff; }
.oi-account-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.oi-account-summary-card { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 13px; min-width: 0; padding: 16px; text-align: left; border: 1px solid #e8edf5; border-radius: 14px; background: #fff; color: #1d2b48; cursor: pointer; transition: transform .18s ease, box-shadow .18s ease; }
.oi-account-summary-card:hover { transform: translateY(-2px); box-shadow: 0 10px 22px rgba(28, 54, 103, .09); }
.oi-account-summary-card > i { color: #9aa8bf; font-size: 12px; }
.oi-account-summary-card > span:nth-child(2) { display: grid; gap: 2px; }
.oi-account-summary-card small { color: #6f7f98; font-size: 13px; font-weight: 600; }
.oi-account-summary-card strong { font-size: 25px; line-height: 1; }
.oi-account-summary-icon { display: grid; width: 46px; height: 46px; place-items: center; border-radius: 12px; font-size: 19px; }
.is-orders .oi-account-summary-icon { background:#eaf1ff; color:#2863e8; }.is-coupons .oi-account-summary-icon { background:#e7f9ed; color:#238547; }.is-favorites .oi-account-summary-icon { background:#fff0f3; color:#e34361; }
.oi-account-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.75fr) minmax(260px, .85fr); gap: 16px; }
.oi-account-dashboard-card { min-width: 0; padding: 19px; border: 1px solid #e8edf5; border-radius: 14px; background: #fff; }
.oi-account-dashboard-card > header { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; padding-bottom: 14px; border-bottom: 1px solid #edf0f5; }
.oi-account-dashboard-card h3 { margin: 0; color:#17243e; font-size: 17px; font-weight: 700; }.oi-account-dashboard-card header p { margin: 3px 0 0; color:#8290a5; font-size: 12px; }
.oi-account-completion { display: grid; align-content: start; gap: 15px; }.oi-account-completion-top { display:flex; align-items:center; gap:14px; }.oi-account-completion-top p { margin:0; color:#65748b; font-size:13px; line-height:1.45; }
.oi-account-completion-ring { --oi-completion: 65%; display:grid; width:72px; height:72px; flex:0 0 auto; place-items:center; border-radius:50%; background:conic-gradient(#2f66e8 var(--oi-completion), #e8eef9 0); position:relative; }.oi-account-completion-ring::after { content:""; position:absolute; inset:7px; border-radius:50%; background:#fff; }.oi-account-completion-ring b { position:relative; z-index:1; color:#1e3f86; font-size:15px; }
.oi-account-completion > button { justify-self:start; padding:0; }
.oi-account-dashboard-favorites { display:grid; gap:14px; }.oi-account-favorites-preview { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.oi-account-favorites-shop { margin: -8px; }
.oi-account-favorites-shop .oi-product-col { padding: 8px; }
.oi-account-favorites-shop .oi-product-card { height: 100%; }
.oi-dashboard-favorite { position:relative; display:grid; grid-template-columns:68px minmax(0,1fr); align-items:center; gap:11px; min-width:0; padding:9px; border:1px solid #edf0f4; border-radius:11px; text-decoration:none; color:#1b2943; }.oi-dashboard-favorite img { width:68px; height:68px; object-fit:contain; border-radius:8px; background:#f8fafc; }.oi-dashboard-favorite small { display:block; overflow:hidden; color:#718096; font-size:11px; white-space:nowrap; text-overflow:ellipsis; }.oi-dashboard-favorite strong { display:block; margin:4px 18px 0 0; overflow:hidden; font-size:13px; line-height:1.3; white-space:nowrap; text-overflow:ellipsis; }.oi-dashboard-favorite b { display:block; margin-top:5px; color:#2760de; font-size:13px; }.oi-dashboard-favorite i { position:absolute; top:10px; right:10px; color:#e34361; font-size:13px; }
.oi-dashboard-order { display:grid; grid-template-columns:58px minmax(0,1fr) auto; align-items:center; gap:12px; padding-top:14px; }.oi-dashboard-order img,.oi-dashboard-order-blank { width:58px; height:58px; border-radius:10px; background:#f4f7fb; object-fit:contain; }.oi-dashboard-order-blank { display:grid; place-items:center; color:#8aa1ca; }.oi-dashboard-order strong,.oi-dashboard-order small { display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }.oi-dashboard-order small { margin-top:4px; color:#7b889d; font-size:12px; }.oi-dashboard-order-status { padding:6px 9px; border-radius:20px; background:#ecf9f0; color:#278649; font-size:12px; font-weight:700; white-space:nowrap; }
@media (max-width: 991px) { .oi-account-welcome { align-items:flex-start; flex-direction:column; }.oi-account-dashboard-grid { grid-template-columns:1fr; } }
@media (max-width: 640px) { .oi-account-welcome h2 { font-size:27px; }.oi-account-summary-grid { grid-template-columns:1fr; }.oi-account-favorites-preview { grid-template-columns:1fr; }.oi-account-summary-card { padding:13px; }.oi-account-dashboard-card { padding:15px; } }
.oi-account-panel[hidden] {
  display: none !important;
}
.oi-account-panel-head {
  margin: 0 0 14px;
}
.oi-account-panel-head h2 {
  margin: 0;
  font-family: "Cabin", sans-serif;
  font-size: 1.65rem;
  font-weight: 700;
  color: var(--oi-ink, #212529);
  letter-spacing: -0.02em;
}
.oi-account-panel-head p {
  margin: 6px 0 0;
  font-size: 14px;
  color: var(--oi-muted, #6c757d);
}
.oi-account-toolbar {
  display: grid;
  gap: 12px;
  margin-bottom: 14px;
}
.oi-account-search {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid #e0e3e8;
  border-radius: 8px;
  padding: 0 14px;
  min-height: 46px;
}
.oi-account-search i {
  color: #9aa0a6;
  font-size: 14px;
}
.oi-account-search input {
  flex: 1;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  color: var(--oi-ink, #212529);
  min-width: 0;
}
.oi-account-search input::placeholder {
  color: #9aa0a6;
}
.oi-account-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.oi-account-filter {
  border: 1px solid #e0e3e8;
  background: #fff;
  color: #5f6368;
  border-radius: 999px;
  padding: 7px 14px;
  font-family: "Cabin", sans-serif;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.oi-account-filter:hover {
  border-color: #cfe2ff;
  color: var(--oi-primary, #0d6efd);
}
.oi-account-filter.is-active {
  border-color: var(--oi-primary, #0d6efd);
  background: rgba(13, 110, 253, 0.08);
  color: var(--oi-primary, #0d6efd);
}
.oi-account-card {
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  padding: 20px;
}
.oi-account-field-hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--oi-muted, #6c757d);
}
.oi-auth-submit--fit {
  width: auto;
  min-width: 200px;
  margin-top: 4px;
}
.oi-auth-submit--inline {
  width: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  margin-top: 4px;
}
.oi-account-loading,
.oi-account-empty {
  text-align: center;
  padding: 48px 16px;
  color: var(--oi-muted, #6c757d);
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 8px;
}
.oi-account-empty-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 12px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(13, 110, 253, 0.08);
  color: var(--oi-primary, #0d6efd);
  font-size: 22px;
}
.oi-account-empty p {
  margin: 0 0 14px;
  font-size: 14px;
}
.oi-account-empty-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid #2f66e8;
  border-radius: 9px;
  background: #2f66e8;
  color: #fff;
  font-size: 13px;
  font-weight: 750;
  line-height: 1;
  box-shadow: 0 5px 14px rgba(47, 102, 232, .18);
  cursor: pointer;
  transition: background-color .18s, border-color .18s, box-shadow .18s, transform .18s;
}
.oi-account-empty-action:hover {
  transform: translateY(-1px);
  border-color: #2457cb;
  background: #2457cb;
  box-shadow: 0 8px 18px rgba(47, 102, 232, .23);
}
.oi-account-empty-action:focus-visible {
  outline: 3px solid rgba(47, 102, 232, .2);
  outline-offset: 3px;
}
.oi-account-empty-action > i:last-child { font-size: 11px; }
.oi-account-orders {
  display: grid;
  gap: 10px;
}
.oi-account-order {
  background: #fff;
  border: 1px solid #e8eaed;
  border-radius: 8px;
  overflow: hidden;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.oi-account-order:hover {
  border-color: #d4daf0;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.04);
}
.oi-account-order-row {
  display: grid;
  grid-template-columns: 64px minmax(0, 1.2fr) minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  width: 100%;
  padding: 14px 16px;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.oi-account-order-thumb {
  width: 64px;
  height: 64px;
  border-radius: 8px;
  overflow: hidden;
  background: #f5f7fa;
  border: 1px solid #eef0f2;
  display: flex;
  align-items: center;
  justify-content: center;
}
.oi-account-order-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.oi-account-order-thumb i {
  color: #adb5bd;
  font-size: 20px;
}
.oi-account-order-info {
  min-width: 0;
}
.oi-account-order-no {
  display: block;
  font-size: 13px;
  color: #5f6368;
  margin-bottom: 4px;
}
.oi-account-order-title {
  display: block;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.oi-account-order-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
}
.oi-account-order-status i {
  font-size: 16px;
}
.oi-account-order-status.is-ok { color: #198754; }
.oi-account-order-status.is-warn { color: #fd7e14; }
.oi-account-order-status.is-info { color: var(--oi-primary, #0d6efd); }
.oi-account-order-status.is-bad { color: #dc3545; }
.oi-account-order-meta {
  text-align: right;
  display: grid;
  gap: 2px;
  justify-items: end;
}
.oi-account-order-date {
  font-size: 13px;
  color: #5f6368;
}
.oi-account-order-total {
  font-family: "Cabin", sans-serif;
  font-weight: 700;
  font-size: 15px;
  color: #198754;
  white-space: nowrap;
}
.oi-account-order-chevron {
  color: #9aa0a6;
  font-size: 14px;
  transition: transform 0.2s ease;
}
.oi-account-order.is-open .oi-account-order-chevron {
  transform: rotate(180deg);
}
.oi-account-order-detail {
  border-top: 1px solid #eef0f2;
  padding: 14px 16px 16px;
  background: #fafbfc;
}
.oi-account-order-detail[hidden] {
  display: none !important;
}
.oi-account-order-items {
  display: grid;
  gap: 10px;
  margin-bottom: 12px;
}
.oi-account-order-item {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
}
.oi-account-order-item img,
.oi-account-order-item-ph {
  width: 44px;
  height: 44px;
  border-radius: 6px;
  object-fit: contain;
  background: #fff;
  border: 1px solid #eef0f2;
}
.oi-account-order-item-ph {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #adb5bd;
}
.oi-account-order-item strong {
  display: block;
  font-size: 13px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
}
.oi-account-order-item span {
  font-size: 12px;
  color: #6c757d;
}
.oi-account-order-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  font-size: 13px;
  color: #5f6368;
  padding-top: 10px;
  border-top: 1px dashed #e0e3e8;
}
.oi-account-order-summary strong {
  color: var(--oi-ink, #212529);
}
.oi-account-order-detail {
  background: #fff;
}
.oi-od-products {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(220px, 0.75fr);
  gap: 12px;
  align-items: stretch;
}
.oi-od-items {
  display: grid;
  gap: 10px;
  align-content: start;
}
.oi-od-item {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  background: #fff;
}
.oi-od-item img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  border-radius: 10px;
  background: #f8f9fa;
}
.oi-od-item-copy strong,
.oi-od-item-copy span,
.oi-od-item-copy em {
  display: block;
}
.oi-od-item-copy strong {
  font-size: 14px;
  line-height: 1.35;
}
.oi-od-item-copy span,
.oi-od-item-copy em {
  margin-top: 2px;
  font-style: normal;
  color: #6c757d;
  font-size: 13px;
}
.oi-od-item > b {
  color: #0d6efd;
  font-size: 15px;
  white-space: nowrap;
}
.oi-od-state {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px;
  border-radius: 14px;
  border: 1px solid #e5eaf2;
  background: #f8fafc;
}
.oi-od-state i {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  background: #fff;
  color: #0d6efd;
}
.oi-od-state strong {
  display: block;
  margin-bottom: 6px;
  font-size: 16px;
}
.oi-od-state > div > span {
  display: block;
  color: #495057;
  font-size: 13px;
  line-height: 1.45;
}
.oi-od-state.is-ok {
  background: #eefbf3;
  border-color: #cfeedd;
}
.oi-od-state.is-ok i { color: #157347; }
.oi-od-state.is-warn {
  background: #fff8ef;
  border-color: #f5e0c4;
}
.oi-od-state.is-warn i { color: #b76e00; }
.oi-od-state.is-bad {
  background: #fef2f2;
  border-color: #f5c2c7;
}
.oi-od-state.is-bad i { color: #b42318; }
.oi-od-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 18px;
}
.oi-od-grid h3 {
  margin: 0 0 10px;
  font-size: 18px;
  font-weight: 700;
}
.oi-od-card,
.oi-od-pay {
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  background: #fff;
  padding: 14px 16px;
}
.oi-od-card + .oi-od-card { margin-top: 10px; }
.oi-od-card h4 {
  margin: 0 0 8px;
  font-size: 14px;
}
.oi-od-card p {
  margin: 0;
  color: #495057;
  font-size: 14px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.oi-od-who {
  margin-top: 8px !important;
  font-weight: 700;
  color: #212529 !important;
}
.oi-od-pay {
  display: grid;
  gap: 10px;
}
.oi-od-pay div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
}
.oi-od-pay span { color: #6c757d; }
.oi-od-pay b { font-weight: 700; text-align: right; }
.oi-od-pay .is-total {
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid #e9ecef;
  font-size: 16px;
}
.oi-od-pay .is-total span,
.oi-od-pay .is-total b { color: #212529; }
.oi-cargo-track {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  margin-top: 12px;
}
.oi-cargo-track a {
  display: inline-flex;
  align-items: center;
  height: 38px;
  padding: 0 14px;
  border-radius: 10px;
  background: #0d6efd;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.oi-cargo-track a:hover { color: #fff; background: #0b5ed7; }
.oi-cargo-track span { color: #495057; font-size: 14px; }
.oi-cargo-track .oi-cargo-track-note { color: #748094; font-size: 13px; }
.oi-cargo-track b { color: #212529; }
.oi-od-note {
  margin: 14px 0 0;
  padding: 12px 14px;
  border-radius: 14px;
  background: #f8fafc;
  border: 1px solid #e5eaf2;
  color: #495057;
  font-size: 14px;
}
@media (max-width: 720px) {
  .oi-od-products,
  .oi-od-grid { grid-template-columns: 1fr; }
  .oi-od-item { grid-template-columns: 56px minmax(0, 1fr); }
  .oi-od-item > b { grid-column: 2; }
  .oi-od-item img { width: 56px; height: 56px; }
}

/* Adreslerim */
.oi-addr-tabs {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  background: #e9ecef;
  border-radius: 10px;
  margin-bottom: 14px;
}
.oi-addr-tab {
  border: 0;
  background: transparent;
  color: #5f6368;
  border-radius: 8px;
  padding: 10px 16px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.oi-addr-tab.is-active {
  background: #fff;
  color: var(--oi-ink, #212529);
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.08);
}
.oi-addr-note {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin: 0 0 16px;
  padding: 12px 14px;
  background: rgba(13, 110, 253, 0.06);
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.45;
  color: #495057;
}
.oi-addr-note i {
  color: var(--oi-primary, #0d6efd);
  margin-top: 2px;
  flex: 0 0 auto;
}
.oi-addr-add {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  padding: 10px 16px;
  border: 1px solid var(--oi-primary, #0d6efd);
  border-radius: 8px;
  background: #fff;
  color: var(--oi-primary, #0d6efd);
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
}
.oi-addr-add:hover {
  background: rgba(13, 110, 253, 0.06);
}
.oi-addr-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.oi-addr-card {
  position: relative;
  background: #fff;
  border: 1px solid #e0e3e8;
  border-radius: 8px;
  padding: 16px 16px 14px;
  min-height: 120px;
}
.oi-addr-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.oi-addr-card-title {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: "Cabin", sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: var(--oi-ink, #212529);
}
.oi-addr-card-title i {
  color: var(--oi-primary, #0d6efd);
}
.oi-addr-card-title .is-star {
  color: #adb5bd;
  font-size: 12px;
}
.oi-addr-card-title .is-star.is-on {
  color: #ffc107;
}
.oi-addr-card-actions {
  display: inline-flex;
  gap: 4px;
}
.oi-addr-icon-btn {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--oi-primary, #0d6efd);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.oi-addr-icon-btn:hover {
  background: rgba(13, 110, 253, 0.08);
}
.oi-addr-icon-btn--danger {
  color: #b02a37;
}
.oi-addr-icon-btn--danger:hover {
  background: #fff5f5;
}
.oi-addr-card-body {
  font-size: 13px;
  line-height: 1.5;
  color: #6c757d;
  word-break: break-word;
}
.oi-addr-card-meta {
  margin-top: 8px;
  font-size: 12px;
  color: #868e96;
}
.oi-addr-efatura-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 6px;
  border-radius: 5px;
  background: #eaf6ef;
  color: #247a43;
  font-size: 11px;
  font-weight: 700;
}
.oi-addr-textarea {
  resize: vertical;
  min-height: 84px;
}
.oi-addr-checks {
  display: grid;
  gap: 12px;
  margin-top: 6px;
}
.oi-addr-check {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  padding: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
  cursor: pointer;
  line-height: 1.35;
}
.oi-addr-check input[type="checkbox"] {
  /* Tema checkbox'ları opacity:0 yapıyor; burada görünür native checkbox kullan */
  opacity: 1 !important;
  position: static !important;
  appearance: auto !important;
  -webkit-appearance: checkbox !important;
  -moz-appearance: checkbox !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  margin: 1px 0 0 !important;
  padding: 0 !important;
  flex: 0 0 18px;
  accent-color: var(--oi-primary, #0d6efd);
  cursor: pointer;
  z-index: 1;
}
.oi-addr-check input[type="checkbox"] ~ span,
.oi-addr-check span {
  display: block;
  padding-left: 0 !important;
  margin: 0;
  font-weight: 600;
  color: var(--oi-ink, #212529);
}
.oi-addr-check input[type="checkbox"] ~ span::before,
.oi-addr-check input[type="checkbox"] ~ span::after,
.oi-addr-check::before,
.oi-addr-check::after {
  content: none !important;
  display: none !important;
}
.oi-addr-also-billing {
  margin-top: 0;
}
.oi-addr-efatura {
  margin-top: 2px;
  padding: 10px;
  border: 1px solid #dbe6fb;
  border-radius: 8px;
  background: #fff;
}
.oi-addr-efatura strong,
.oi-addr-efatura small { display: block; }
.oi-addr-efatura small { margin-top: 2px; color: #718096; font-size: 12px; font-weight: 400; }
.oi-addr-billing-box {
  margin-top: 14px;
  padding: 14px 14px 12px;
  border: 1px solid #cfe2ff;
  border-radius: 10px;
  background: rgba(13, 110, 253, 0.04);
  display: grid;
  gap: 12px;
}
.oi-addr-billing-box[hidden] {
  display: none !important;
}
.oi-addr-billing-box-title {
  margin: 0;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: var(--oi-primary, #0d6efd);
}
.oi-addr-billing-box .oi-auth-field,
.oi-addr-billing-box .oi-auth-row {
  margin: 0;
}
.oi-addr-invoice-seg {
  grid-template-columns: 1fr 1fr;
}
.oi-addr-modal {
  position: fixed;
  inset: 0;
  z-index: 11000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.oi-addr-modal[hidden] {
  display: none !important;
}
.oi-addr-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
}
.oi-addr-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(560px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.22);
  padding: 18px 18px 16px;
}
.oi-addr-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}
.oi-addr-modal-head h3 {
  margin: 0;
  font-family: "Cabin", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
}
.oi-addr-modal-x {
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  color: #868e96;
  cursor: pointer;
  padding: 0 4px;
}
.oi-addr-modal-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 8px;
}
.oi-addr-modal-actions .oi-auth-submit {
  width: 100%;
}

@media (max-width: 991px) {
  .oi-account-area.oi-section-gapTop {
    padding-top: 12px !important;
  }
  .oi-account-area.oi-section-gapBottom {
    padding-bottom: 20px !important;
  }
  .oi-account {
    grid-template-columns: 1fr;
    gap: 0;
  }

  /* Hub: önce menü, seçince içerik */
  .oi-account:not(.is-panel-open) .oi-account-main {
    display: none;
  }
  .oi-account.is-panel-open .oi-account-side {
    display: none;
  }

  .oi-account-side {
    position: static;
    padding: 16px 14px;
    border-radius: 12px;
  }
  .oi-account-user {
    padding: 4px 2px 16px;
    margin-bottom: 4px;
  }
  .oi-account-avatar {
    width: 52px;
    height: 52px;
    font-size: 16px;
  }
  .oi-account-user-text strong {
    font-size: 15px;
    white-space: normal;
  }
  .oi-account-side-scroll {
    display: block;
    overflow: visible;
    margin: 0;
    padding: 0;
  }
  .oi-account-nav,
  .oi-account-nav-group,
  .oi-account-nav-foot {
    display: grid;
    gap: 4px;
  }
  .oi-account-nav-group,
  .oi-account-nav-foot {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid #eef0f2;
  }
  .oi-account-nav-label {
    display: block;
    margin: 0 4px 8px;
  }
  .oi-account-nav-btn {
    width: 100%;
    justify-content: flex-start;
    padding: 14px 12px;
    border: 1px solid #eef0f2;
    border-radius: 10px;
    background: #fff;
    font-size: 15px;
    gap: 12px;
    position: relative;
  }
  .oi-account-nav-btn[data-oi-panel-tab]::after {
    content: "\f054";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-left: auto;
    color: #adb5bd;
    font-size: 12px;
  }
  .oi-account-nav-btn--sub {
    padding-left: 12px;
  }
  .oi-account-nav-btn--sub::before {
    display: none;
  }
  .oi-account-nav-btn.is-active {
    border-color: rgba(13, 110, 253, 0.35);
    background: rgba(13, 110, 253, 0.06);
    color: var(--oi-primary, #0d6efd);
  }
  .oi-account-nav-btn--danger {
    border-color: #f1aeb5;
    color: #b02a37;
  }
  .oi-account-nav-btn--danger i {
    color: #b02a37;
  }

  .oi-account-back {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 14px;
    padding: 8px 0;
    border: 0;
    background: transparent;
    color: var(--oi-primary, #0d6efd);
    font-family: "Cabin", sans-serif;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
  }
  .oi-account-back:hover {
    color: var(--oi-ink, #212529);
  }

  .oi-account-panel-head {
    margin-bottom: 12px;
  }
  .oi-account-panel-head h2 {
    font-size: 1.35rem;
  }
  .oi-account-card {
    padding: 16px;
  }
  .oi-account-order-row {
    grid-template-columns: 56px minmax(0, 1fr) auto;
    grid-template-areas:
      "thumb info chevron"
      "thumb status chevron"
      "thumb meta chevron";
    gap: 8px 12px;
    padding: 12px;
  }
  .oi-account-order-thumb { grid-area: thumb; width: 56px; height: 56px; }
  .oi-account-order-info { grid-area: info; }
  .oi-account-order-status { grid-area: status; font-size: 13px; }
  .oi-account-order-meta {
    grid-area: meta;
    text-align: left;
    justify-items: start;
  }
  .oi-account-order-chevron { grid-area: chevron; align-self: start; margin-top: 4px; }
  .oi-account-order-detail {
    padding: 12px;
  }
  .oi-account-order-item {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 8px;
  }
  .oi-addr-grid {
    grid-template-columns: 1fr;
  }
  .oi-addr-add {
    width: 100%;
    justify-content: center;
  }
  .oi-addr-modal {
    padding: 0;
    align-items: stretch;
  }
  .oi-addr-modal-dialog {
    width: 100%;
    max-height: 100%;
    min-height: 100%;
    border-radius: 0;
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom, 0px));
  }
}

/* Masaüstünde geri butonu yok */
@media (min-width: 992px) {
  .oi-account-back {
    display: none !important;
  }
}

@media (max-width: 575px) {
  .oi-auth-submit--fit {
    width: 100%;
  }
  .oi-account-filters {
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 2px;
    -webkit-overflow-scrolling: touch;
  }
  .oi-account-filter {
    flex: 0 0 auto;
  }
  .oi-account-order-title {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .oi-account-order-summary {
    flex-direction: column;
    gap: 6px;
  }
  .oi-addr-tabs {
    display: flex;
    width: 100%;
  }
  .oi-addr-tab {
    flex: 1;
    text-align: center;
    padding: 10px 8px;
    font-size: 13px;
  }
  .oi-addr-note {
    font-size: 12px;
    padding: 10px 12px;
  }
  .oi-addr-modal-actions {
    grid-template-columns: 1fr;
  }
  .oi-account-loading,
  .oi-account-empty {
    padding: 32px 14px;
  }
}
@media (max-width: 575px) {
  .oi-auth-row {
    grid-template-columns: 1fr;
  }
  .oi-auth-gender-seg {
    grid-template-columns: 1fr;
  }
  .oi-auth-pass-rules {
    grid-template-columns: 1fr;
  }
  .oi-auth-card-inner {
    padding: 22px 16px 20px;
  }
  .oi-auth-brand img {
    height: 64px;
    max-width: 220px;
  }
}

.oi-auth-submit {
  position: relative;
}
.oi-auth-submit::after,
.oi-auth-submit::before {
  content: none !important;
  display: none !important;
}

/* ---- Toast ---- */
.oi-toast-host {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 10050;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(360px, calc(100vw - 24px));
  pointer-events: none;
}
.oi-toast {
  pointer-events: auto;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #212529;
  color: #fff;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.22);
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  line-height: 1.4;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.oi-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.oi-toast.is-hiding {
  opacity: 0;
  transform: translateY(-8px);
}
.oi-toast > i {
  margin-top: 2px;
  flex: 0 0 auto;
}
.oi-toast-msg {
  flex: 1 1 auto;
  min-width: 0;
}
.oi-toast-close {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: inherit;
  opacity: 0.75;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}
.oi-toast-close:hover { opacity: 1; }
.oi-toast-close::after,
.oi-toast-close::before {
  content: none !important;
  display: none !important;
}
.oi-toast--success { background: #198754; }
.oi-toast--error { background: #dc3545; }
.oi-toast--warning { background: #e8590c; }
.oi-toast--info { background: #0d6efd; }

/* ——— Checkout ——— */
.oi-checkout-page {
  --oi-ink: #212529;
  --oi-muted: #6c757d;
  --oi-line: #e9ecef;
  --oi-soft: #f8f9fa;
  --oi-primary: #0d6efd;
  padding-top: 8px;
  font-family: "Cabin", sans-serif;
  color: var(--oi-ink);
  background: linear-gradient(180deg, #f4f7fb 0%, #fff 220px);
}
.oi-checkout-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 64px 16px;
  color: var(--oi-muted);
}
.oi-co-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.oi-co-page-title {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.25;
}
.oi-co-page-sub {
  margin: 6px 0 0;
  color: var(--oi-muted);
  font-size: 14px;
  max-width: 520px;
}
.oi-co-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--oi-primary);
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
}
.oi-co-back:hover {
  color: var(--oi-ink);
  text-decoration: underline;
}
.oi-co-block {
  margin-bottom: 16px;
  padding: 22px;
  border: 1px solid var(--oi-line);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 6px 22px rgba(33, 37, 41, 0.04);
}
.oi-co-block-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 16px;
}
.oi-co-step {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(13, 110, 253, 0.1);
  color: var(--oi-primary);
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
}
.oi-co-title {
  margin: 0;
  font-family: "Cabin", sans-serif;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.3;
}
.oi-co-sub {
  margin: 4px 0 0;
  font-size: 13px;
  color: var(--oi-muted);
}
.oi-co-delivery-types {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.oi-co-choice {
  margin: 0;
  cursor: pointer;
}
.oi-co-choice input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.oi-co-choice-inner {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 78px;
  padding: 14px 16px;
  border: 1.5px solid var(--oi-line);
  border-radius: 12px;
  background: #fff;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.oi-co-choice-inner > i {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oi-soft);
  color: var(--oi-primary);
  font-size: 16px;
}
.oi-co-choice-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.oi-co-choice-text strong {
  font-size: 14px;
  font-weight: 700;
}
.oi-co-choice-text small {
  font-size: 12px;
  color: var(--oi-muted);
  line-height: 1.35;
}
.oi-co-choice:hover .oi-co-choice-inner {
  border-color: #c5d4eb;
}
.oi-co-choice input:checked + .oi-co-choice-inner {
  border-color: var(--oi-primary);
  background: rgba(13, 110, 253, 0.05);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
}
.oi-co-choice input:checked + .oi-co-choice-inner > i {
  background: var(--oi-primary);
  color: #fff;
}
.oi-co-card {
  border: 1px solid var(--oi-line);
  border-radius: 12px;
  padding: 16px;
  background: #fff;
}
.oi-co-card--soft {
  margin-top: 12px;
  background: var(--oi-soft);
}
.oi-co-card--pickup {
  border-color: rgba(13, 110, 253, 0.25);
  background: linear-gradient(180deg, rgba(13, 110, 253, 0.04), #fff);
}
.oi-co-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.oi-co-card-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.oi-co-card-label i {
  color: var(--oi-primary);
  font-size: 14px;
}
.oi-co-card-label strong {
  font-size: 14px;
}
.oi-co-card-head a {
  color: var(--oi-primary);
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.oi-co-card-head a:hover {
  text-decoration: underline;
  color: var(--oi-ink);
}
.oi-co-card-text {
  margin: 0 0 12px;
  font-size: 13px;
  color: #495057;
  line-height: 1.5;
}
.oi-co-select {
  width: 100%;
  height: 44px;
  border: 1px solid var(--oi-line);
  border-radius: 10px;
  padding: 0 12px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  color: var(--oi-ink);
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.oi-co-select:focus {
  outline: 0;
  border-color: var(--oi-primary);
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.15);
}
.oi-co-hint {
  margin: 10px 0 0;
  font-size: 12px;
  color: var(--oi-muted);
}
.oi-co-hint--ok {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #198754;
  font-weight: 600;
}
.oi-co-pay-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.oi-co-pay-option {
  display: flex;
  gap: 12px;
  align-items: center;
  margin: 0;
  padding: 14px 16px;
  border: 1.5px solid var(--oi-line);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.oi-co-pay-option:hover {
  border-color: #c5d4eb;
}
.oi-co-pay-option:has(input:disabled) {
  opacity: 0.55;
  cursor: not-allowed;
  background: #f6f7f9;
}
.oi-co-pay-option:has(input:disabled):hover {
  border-color: var(--oi-line);
}
.oi-co-pay-option:has(input:checked) {
  border-color: var(--oi-primary);
  background: rgba(13, 110, 253, 0.05);
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
}
.oi-co-pay-option input {
  flex: 0 0 auto;
  accent-color: var(--oi-primary);
  width: 18px;
  height: 18px;
}
.oi-co-pay-icon {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--oi-soft);
  color: var(--oi-primary);
  font-size: 15px;
}
.oi-co-pay-option:has(input:checked) .oi-co-pay-icon {
  background: var(--oi-primary);
  color: #fff;
}

.oi-co-test-badge{display:inline-flex;align-items:center;margin-left:7px;padding:2px 7px;border-radius:999px;background:#fff0cc;color:#9a6500;font-size:10px;font-style:normal;font-weight:800;letter-spacing:.06em;vertical-align:2px}
.oi-co-pay-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.oi-co-pay-body strong {
  font-size: 14px;
}
.oi-co-pay-body small {
  color: var(--oi-muted);
  font-size: 12px;
  line-height: 1.35;
}
.oi-co-ship-items {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.oi-co-ship-item {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  gap: 14px;
  align-items: center;
  padding: 14px;
  border: 1px solid var(--oi-line);
  border-radius: 12px;
  background: var(--oi-soft);
}
.oi-co-ship-item-img {
  width: 64px;
  height: 64px;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--oi-line);
  display: flex;
  align-items: center;
  justify-content: center;
}
.oi-co-ship-item-img img,
.oi-co-ship-item img {
  width: 100%;
  height: 100%;
  max-width: 64px;
  max-height: 64px;
  object-fit: contain;
}
.oi-co-ship-item-body {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.oi-co-ship-item-body strong {
  font-size: 14px;
  line-height: 1.35;
}
.oi-co-ship-item-body span {
  font-size: 12px;
  color: var(--oi-muted);
}
.oi-co-ship-item em {
  font-style: normal;
  font-size: 12px;
  font-weight: 700;
  color: #198754;
  white-space: nowrap;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(25, 135, 84, 0.1);
}
.oi-co-legal .oi-co-block-head {
  margin-bottom: 8px;
}
.oi-co-accordion {
  border-top: 1px solid var(--oi-line);
}
.oi-co-accordion:last-of-type {
  border-bottom: 1px solid var(--oi-line);
}
.oi-co-accordion summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 2px;
  cursor: pointer;
  font-weight: 700;
  font-size: 14px;
  color: var(--oi-ink);
}
.oi-co-accordion summary::-webkit-details-marker {
  display: none;
}
.oi-co-accordion summary:hover {
  color: var(--oi-primary);
}
.oi-co-accordion summary i {
  color: var(--oi-primary);
  transition: transform 0.2s ease;
}
.oi-co-accordion[open] summary i {
  transform: rotate(180deg);
}
.oi-co-accordion-body {
  padding: 0 2px 16px;
  font-size: 13px;
  line-height: 1.6;
  color: #495057;
  max-height: 320px;
  overflow: auto;
}
.oi-co-accordion-body h4 {
  margin: 12px 0 8px;
  font-size: 14px;
  color: var(--oi-ink);
}
.oi-co-legal-table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0 14px;
  font-size: 12px;
}
.oi-co-legal-table th,
.oi-co-legal-table td {
  border: 1px solid var(--oi-line);
  padding: 8px 10px;
  text-align: left;
  vertical-align: top;
}
.oi-co-legal-table th {
  background: var(--oi-soft);
  color: var(--oi-ink);
}
.oi-co-accept {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  margin-top: 16px;
  padding: 14px;
  border-radius: 12px;
  background: rgba(13, 110, 253, 0.05);
  border: 1px solid rgba(13, 110, 253, 0.15);
  font-size: 13px;
  line-height: 1.45;
  cursor: pointer;
}
.oi-co-accept input {
  margin-top: 2px;
  accent-color: var(--oi-primary);
  width: 16px;
  height: 16px;
  flex: 0 0 auto;
}
.oi-co-legal-consent {
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: start;
  gap: 10px;
  margin-top: 12px;
  padding: 12px 13px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  background: #fff;
}
.oi-co-legal-consent > input {
  appearance: none;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin: 1px 0 0;
  border: 2px solid #d1d5db;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.oi-co-legal-consent > input:checked {
  border-color: #2f6df3;
  background: #2f6df3;
}
.oi-co-legal-consent > input:checked::after {
  content: "";
  width: 10px;
  height: 6px;
  margin-top: -2px;
  border-bottom: 2px solid #fff;
  border-left: 2px solid #fff;
  transform: rotate(-45deg);
}
.oi-co-legal-consent > input:focus-visible {
  outline: 3px solid rgba(47, 109, 243, .2);
  outline-offset: 2px;
}
.oi-co-legal-consent-copy {
  margin: 0;
  color: #737780;
  font-size: 13px;
  line-height: 1.5;
}
.oi-co-legal-consent-copy a {
  color: #565b64;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.oi-co-legal-consent-copy a:hover {
  color: var(--oi-primary);
}
.oi-co-legal-consent-copy b {
  color: #d23d4d;
}
.oi-co-summary {
  position: sticky;
  top: 110px;
}
.oi-co-summary-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 12px 0 0;
  font-size: 12px;
  color: var(--oi-muted);
}
.oi-co-summary-note i {
  color: var(--oi-primary);
}
@media (max-width: 767px) {
  .oi-co-delivery-types {
    grid-template-columns: 1fr;
  }
  .oi-co-page-title {
    font-size: 1.45rem;
  }
  .oi-co-block {
    padding: 16px;
  }
  .oi-co-ship-item {
    grid-template-columns: 56px minmax(0, 1fr);
  }
  .oi-co-ship-item em {
    grid-column: 2;
    justify-self: start;
  }
}
@media (max-width: 991px) {
  .oi-co-summary {
    position: static;
    margin-top: 8px;
  }
}

/* Kartların eşit yüksekliği aksiyon butonunu aşağı itmesin. */
.oi-product-card.has-hover-box-shadow .prd-btn-grp {
  margin-top: 4px;
  padding-top: 4px;
}

/* Ana ürün görselini kartın asıl odağı yap; bilgi alanı kompakt kalsın. */
@media (min-width: 768px) {
  .oi-product-card.has-hover-box-shadow .oi-card-img,
  #oi-shop-products .oi-card-img {
    height: 220px;
    min-height: 220px;
    padding: 4px;
  }
}
.oi-product-card.has-hover-box-shadow .oi-card-meta {
  min-height: 26px;
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .oi-card-subtitle {
  font-size: 12px;
}
.oi-product-card.has-hover-box-shadow .oi-card-title {
  min-height: 38px;
  margin: 4px 0;
  font-size: 14px;
  line-height: 19px;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating {
  min-height: 17px;
  margin: 0 0 2px;
}
.oi-product-card.has-hover-box-shadow .oi-rated-icon {
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .pricing-part .price-text {
  font-size: 18px;
}
.oi-product-card.has-hover-box-shadow .pricing-part del.price-text,
.oi-product-card.has-hover-box-shadow .oi-card-promo {
  font-size: 11px;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn {
  min-height: 34px;
  padding: 6px 8px;
  font-size: 12px;
}

/* Sepet ikonu ve metni, düğmenin tam merkezinde birlikte hizalanır. */
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-btn {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  line-height: 1;
}
.oi-product-card.has-hover-box-shadow .prd-btn-grp .oi-card-out-stock {
  width: 100%;
  border-color: #d8dee8 !important;
  background: #f3f5f8 !important;
  color: #7b8796 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
  opacity: 1;
}

/* Ürün kartlarında puan bilgisi: sayısal veri yoksa yıldızları yanıltıcı gösterme. */
.oi-product-card.has-hover-box-shadow .oi-card-rating {
  display: flex;
  align-items: center;
  gap: 5px;
  min-height: 20px;
  margin: 3px 0 5px;
  color: #6b7280;
  font-size: 12px;
  line-height: 1;
}
.oi-product-card.has-hover-box-shadow .oi-card-stars {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #c7ced8;
  font-size: 12px;
}
.oi-product-card.has-hover-box-shadow .oi-card-stars.has-rating {
  color: #f3ad26;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating strong {
  color: #202938;
  font-size: 12px;
  font-weight: 700;
}
.oi-product-card.has-hover-box-shadow .oi-card-rating-count {
  color: #758195;
  white-space: nowrap;
}

/* Kategori özellik filtreleri */
.oi-hb-attr-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.oi-hb-attr-list {
  max-height: 208px;
  overflow-y: auto;
  padding-right: 3px;
}
.oi-hb-attr-apply {
  width: 100%;
  min-height: 34px;
  border: 1px solid #2f67ea;
  border-radius: 8px;
  background: #fff;
  color: #285fdc;
  font-size: 12px;
  font-weight: 700;
  transition: background .18s ease, color .18s ease;
}
.oi-hb-attr-apply:hover {
  background: #2f67ea;
  color: #fff;
}
.oi-hb-picks .oi-hb-spec-pick {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  border: 1px solid #d9e2f1;
  border-radius: 8px;
  background: #fff;
}
.oi-hb-picks .oi-hb-spec-pick button {
  border: 0;
  border-right: 1px solid #d9e2f1;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}
.oi-hb-picks .oi-hb-spec-pick a {
  min-width: 30px;
  justify-content: center;
}
@media (min-width: 992px) {
  .oi-hb-picks .oi-hb-spec-pick {
    display: none;
  }
  .oi-hb-selected-filters {
    margin: 12px 0 4px;
    padding: 12px;
    border: 1px solid #dce6f7;
    border-radius: 10px;
    background: #f8fbff;
  }
  .oi-hb-selected-filters > span {
    display: block;
    margin-bottom: 8px;
    color: #516075;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  .oi-hb-selected-filters > div {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .oi-hb-selected-filters button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 27px;
    padding: 0 8px;
    border: 1px solid #cad9f7;
    border-radius: 99px;
    background: #fff;
    color: #285fdc;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    cursor: pointer;
  }
  .oi-desktop-filter-apply {
    position: sticky;
    z-index: 4;
    bottom: 16px;
    margin-top: 16px;
    padding: 10px;
    border: 1px solid #dce6f7;
    border-radius: 10px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 8px 20px rgba(31, 66, 135, .14);
  }
  .oi-desktop-filter-apply button {
    width: 100%;
    min-height: 42px;
    border: 0;
    border-radius: 8px;
    background: #2f67ea;
    color: #fff;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
  }
  .oi-hb-attr-apply {
    display: none;
  }
}

/* Mobil: e-ticaret uygulamalarındaki gibi alttan açılan, tek elle kullanılabilir filtre alanı. */
@media (max-width: 991px) {
  .oi-shop-filter-bar {
    position: sticky;
    z-index: 20;
    top: 0;
    min-height: 56px;
    margin: 0 -12px 10px;
    padding: 8px 12px;
    border-bottom: 1px solid #edf0f4;
    background: rgba(255, 255, 255, .96);
    backdrop-filter: blur(10px);
  }
  .oi-shop-filter-open {
    height: 40px;
    padding: 0 14px;
    border-color: #dce3ec;
    border-radius: 9px;
    box-shadow: none;
  }
  .oi-shop-filter-drawer {
    display: grid;
    align-items: end;
  }
  .oi-shop-filter-backdrop {
    background: rgba(15, 23, 42, .48);
    backdrop-filter: blur(2px);
  }
  .oi-shop-filter-panel {
    position: relative;
    inset: auto;
    width: 100%;
    height: 100dvh;
    max-height: 100dvh;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    overflow: hidden;
  }
  .oi-shop-filter-grabber {
    display: none;
  }
  .oi-shop-filter-head {
    align-items: center;
    padding: calc(12px + env(safe-area-inset-top, 0px)) 18px 14px;
    border-bottom: 1px solid #edf0f4;
  }
  .oi-shop-filter-head h2 {
    font-size: 17px;
    letter-spacing: -.01em;
  }
  .oi-shop-filter-hint {
    display: none;
  }
  .oi-shop-filter-x {
    width: 38px;
    height: 38px;
    border-color: #e6eaf0;
    border-radius: 50%;
    background: #f8fafc;
  }
  .oi-shop-filter-body {
    display: flex;
    padding: 0;
    background: #fff;
    overflow: hidden;
    overscroll-behavior: contain;
  }
  .oi-mobile-filter-nav {
    display: flex;
    flex: 0 0 112px;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    overflow-y: auto;
    padding: 8px 0 18px;
    border-right: 1px solid #edf0f4;
    background: #f6f8fb;
    -webkit-overflow-scrolling: touch;
  }
  .oi-mobile-filter-tab {
    min-height: 48px;
    padding: 8px 10px 8px 14px;
    border: 0;
    border-left: 3px solid transparent;
    background: transparent;
    color: #647084;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    text-align: left;
  }
  .oi-mobile-filter-tab.is-active {
    border-left-color: var(--oi-primary, #0d6efd);
    background: #fff;
    color: #1f56d2;
    font-weight: 700;
  }
  .oi-mobile-filter-sections {
    flex: 1 1 auto;
    min-width: 0;
    overflow-y: auto;
    padding: 0 16px 16px;
    -webkit-overflow-scrolling: touch;
  }
  .oi-mobile-active-filters {
    margin: 14px 0 2px;
    padding: 0 0 13px;
    border-bottom: 1px solid #edf0f4;
  }
  .oi-mobile-active-filters-title {
    display: block;
    margin-bottom: 8px;
    color: #647084;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
  }
  .oi-mobile-active-filter-list {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }
  .oi-mobile-active-filter-list::-webkit-scrollbar {
    display: none;
  }
  .oi-mobile-active-filter {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 7px;
    min-height: 30px;
    padding: 0 9px;
    border: 1px solid #c9d9fc;
    border-radius: 99px;
    background: #f3f7ff;
    color: #285fdc;
    font-family: inherit;
    font-size: 12px;
    font-weight: 700;
  }
  .oi-mobile-active-filter i {
    font-size: 11px;
  }
  .oi-shop-filter-block {
    margin: 0;
    padding: 17px 0;
    border: 0;
    border-bottom: 1px solid #edf0f4;
    border-radius: 0;
  }
  .oi-shop-filter-block h3 {
    margin-bottom: 9px;
    font-size: 15px;
  }
  .oi-shop-filter-choices {
    gap: 0;
  }
  .oi-shop-filter-choice {
    min-height: 48px;
    padding: 11px 0;
    border: 0;
    border-bottom: 1px solid #f0f2f5;
    border-radius: 0;
    background: transparent;
    font-size: 14px;
  }
  .oi-shop-filter-choice:last-child {
    border-bottom: 0;
  }
  .oi-shop-filter-choice.is-active {
    border-color: #f0f2f5;
    background: transparent;
    box-shadow: none;
    color: var(--oi-primary, #0d6efd);
  }
  .oi-shop-filter-choice input {
    width: 20px;
    height: 20px;
  }
  .oi-shop-filter-price {
    margin-top: 10px;
  }
  .oi-shop-filter-foot {
    grid-template-columns: 1fr 1.55fr;
    gap: 10px;
    padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
    border-top: 0;
    box-shadow: 0 -5px 16px rgba(15, 23, 42, .08);
  }
  .oi-shop-filter-foot-clear,
  .oi-shop-filter-foot-done {
    height: 50px;
    border-radius: 10px;
  }
}

/* Sol filtreli kategori listelerinde ana sayfadaki kart dili korunur. */
#oi-shop-products .oi-product-card.has-hover-box-shadow {
  border-color: #e5eaf2;
  border-radius: 14px;
  box-shadow: 0 2px 7px rgba(19, 49, 89, .06);
}
#oi-shop-products .oi-product-card.has-hover-box-shadow:hover {
  border-color: #9ec0ee;
  box-shadow: 0 10px 24px rgba(21, 73, 139, .13);
  transform: translateY(-3px);
}
#oi-shop-products .prd-btn-grp {
  margin-top: 4px;
  padding-top: 4px;
}
#oi-shop-products .pricing-part {
  width: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  text-align: left;
}
#oi-shop-products .pricing-part .price-text {
  margin-right: auto;
  text-align: left;
}

/* Hesabım / Siparişlerim: Özgür İletişim sipariş vitrini */
[data-oi-panel="orders"] .oi-account-panel-head {
  margin-bottom: 18px;
}
[data-oi-panel="orders"] .oi-account-panel-head h2 {
  color: #13233a;
  font-size: clamp(1.6rem, 2vw, 2rem);
}
[data-oi-panel="orders"] .oi-account-panel-head p {
  color: #6b7789;
}
[data-oi-panel="orders"] .oi-account-toolbar {
  gap: 14px;
  margin-bottom: 20px;
}
[data-oi-panel="orders"] .oi-account-search {
  min-height: 50px;
  border-color: #dce5f2;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(20, 61, 112, .04);
}
[data-oi-panel="orders"] .oi-account-search:focus-within {
  border-color: #72a4ea;
  box-shadow: 0 0 0 3px rgba(33, 90, 218, .09);
}
[data-oi-panel="orders"] .oi-account-filters {
  padding: 4px;
  border-radius: 12px;
  background: #f3f6fa;
  width: fit-content;
}
[data-oi-panel="orders"] .oi-account-filter {
  min-height: 36px;
  border-color: transparent;
  padding: 7px 16px;
  background: transparent;
}
[data-oi-panel="orders"] .oi-account-filter.is-active {
  border-color: #d7e4f8;
  background: #fff;
  color: #215ada;
  box-shadow: 0 3px 10px rgba(24, 68, 126, .08);
}
.oi-account-orders {
  gap: 18px;
}
.oi-account-order {
  border-color: #dfe6ef;
  border-radius: 16px;
  box-shadow: 0 6px 22px rgba(17, 49, 91, .055);
}
.oi-account-order:hover,
.oi-account-order.is-open {
  border-color: #b9cee9;
  box-shadow: 0 12px 34px rgba(17, 57, 108, .09);
}
.oi-account-order-row {
  grid-template-columns: 76px minmax(180px, 1.3fr) minmax(170px, .82fr) minmax(126px, auto) 92px;
  gap: 18px;
  padding: 18px 20px;
  background: linear-gradient(110deg, #fff 0%, #fff 66%, #f8fbff 100%);
}
.oi-account-order-thumb {
  width: 76px;
  height: 76px;
  border-color: #e2e9f2;
  border-radius: 12px;
  background: linear-gradient(145deg, #f8fbff, #eef4fb);
  padding: 5px;
}
.oi-account-order-info {
  display: grid;
  align-content: center;
  gap: 5px;
}
.oi-account-order-no {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 5px;
  margin: 0;
}
.oi-account-order-no small,
.oi-account-order-status small,
.oi-account-order-date small,
.oi-account-order-total small {
  display: block;
  color: #8793a4;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.oi-account-order-no b {
  color: #42617f;
  font-size: 12px;
  font-weight: 700;
}
.oi-account-order-title {
  color: #13233a;
  font-size: 15px;
  line-height: 1.35;
}
.oi-account-order-count {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #778497;
  font-size: 12px;
}
.oi-account-order-count i {
  color: #4777bc;
}
.oi-account-order-status {
  gap: 10px;
  width: fit-content;
  min-width: 160px;
  padding: 10px 12px;
  border: 1px solid #dce8f7;
  border-radius: 12px;
  background: #f6f9fd;
}
.oi-account-order-status-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 3px 10px rgba(22, 66, 119, .1);
}
.oi-account-order-status b {
  display: block;
  margin-top: 2px;
  color: currentColor;
  font-size: 13px;
  line-height: 1.25;
}
.oi-account-order-status.is-ok { border-color: #ccebd8; background: #f1fbf5; }
.oi-account-order-status.is-warn { border-color: #f1dfc1; background: #fff9ef; }
.oi-account-order-status.is-info { border-color: #d5e4fa; background: #f2f7ff; }
.oi-account-order-status.is-bad { border-color: #f1ccd1; background: #fff5f6; }
.oi-account-order-meta {
  gap: 8px;
}
.oi-account-order-date,
.oi-account-order-total {
  display: block;
}
.oi-account-order-date b,
.oi-account-order-total b {
  display: block;
  margin-top: 2px;
  color: #26384f;
  font-size: 13px;
  font-weight: 700;
}
.oi-account-order-total b {
  color: #215ada;
  font-size: 16px;
}
.oi-account-order-chevron {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 36px;
  padding: 0 11px;
  border: 1px solid #d9e4f3;
  border-radius: 10px;
  background: #fff;
  color: #315c91;
  font-size: 12px;
  font-weight: 700;
}
.oi-account-order.is-open .oi-account-order-chevron {
  transform: none;
}
.oi-account-order.is-open .oi-account-order-chevron i {
  transform: rotate(180deg);
}
.oi-account-order-chevron i {
  transition: transform .2s ease;
}
.oi-account-order-detail {
  padding: 22px;
  border-top-color: #dfe7f1;
  background: #f6f9fd;
}
.oi-od {
  color: #26384f;
}
.oi-od-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 16px;
  padding: 18px 20px;
  border: 1px solid #d9e7f8;
  border-radius: 14px;
  background: linear-gradient(120deg, #eef6ff 0%, #f8fbff 58%, #fff7ef 100%);
}
.oi-od-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px;
  color: #215ada;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.oi-od-head h3 {
  margin: 0;
  color: #13233a;
  font-size: 19px;
  font-weight: 800;
}
.oi-od-head p {
  margin: 4px 0 0;
  color: #6b7789;
  font-size: 13px;
}
.oi-od-head-total {
  flex: 0 0 auto;
  min-width: 160px;
  text-align: right;
}
.oi-od-head-total span {
  display: block;
  color: #778497;
  font-size: 11px;
}
.oi-od-head-total strong {
  display: block;
  margin-top: 3px;
  color: #215ada;
  font-size: 21px;
}
.oi-od-products {
  grid-template-columns: minmax(0, 1.4fr) minmax(240px, .7fr);
  gap: 16px;
}
.oi-od-items-wrap,
.oi-od-state {
  border: 1px solid #dfe7f1;
  border-radius: 14px;
  background: #fff;
}
.oi-od-items-wrap {
  overflow: hidden;
}
.oi-od-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  padding: 0 16px;
  border-bottom: 1px solid #e8eef5;
  background: #fbfcfe;
}
.oi-od-section-head span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #26384f;
  font-size: 14px;
  font-weight: 800;
}
.oi-od-section-head i { color: #215ada; }
.oi-od-section-head b {
  color: #7a8798;
  font-size: 11px;
  font-weight: 700;
}
.oi-od-items {
  gap: 0;
}
.oi-od-item {
  grid-template-columns: 82px minmax(0, 1fr) auto;
  min-height: 108px;
  padding: 14px 16px;
  border: 0;
  border-radius: 0;
}
.oi-od-item + .oi-od-item {
  border-top: 1px solid #edf1f6;
}
.oi-od-item img {
  width: 82px;
  height: 82px;
  padding: 5px;
  border: 1px solid #e4ebf3;
  background: #f7f9fc;
}
.oi-od-item-copy strong {
  color: #17283f;
  font-size: 14px;
}
.oi-od-item > b {
  color: #215ada;
  font-size: 16px;
}
.oi-od-review-btn,.oi-od-reviewed{width:max-content;margin-top:7px;border-radius:8px;font-size:12px;font-weight:700}.oi-od-review-btn{padding:7px 10px;border:1px solid #b9cdfd;background:#f5f8ff;color:#215ada}.oi-od-review-btn:hover{background:#eaf0ff}.oi-od-reviewed{display:inline-flex;align-items:center;gap:6px;color:#25834b}.oi-review-modal[hidden]{display:none}.oi-review-modal{position:fixed;inset:0;z-index:10050;display:grid;place-items:center;padding:20px}.oi-review-backdrop{position:absolute;inset:0;border:0;background:rgba(15,23,42,.56);backdrop-filter:blur(3px)}body.oi-review-open{overflow:hidden}.oi-review-dialog{position:relative;width:min(560px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:18px;background:#fff;box-shadow:0 24px 70px rgba(15,23,42,.24)}.oi-review-dialog>header{display:flex;justify-content:space-between;gap:20px;padding:22px 24px;border-bottom:1px solid #e5ebf3}.oi-review-dialog>header small{color:#215ada;font-size:11px;font-weight:800;letter-spacing:.08em}.oi-review-dialog>header h3{margin:4px 0 2px;color:#142033;font-size:22px}.oi-review-dialog>header p{margin:0;color:#68778b;font-size:13px}.oi-review-dialog>header>button{width:36px;height:36px;border:1px solid #dfe6ef;border-radius:10px;background:#fff;color:#627086}.oi-review-dialog form{display:grid;gap:17px;padding:22px 24px}.oi-review-dialog label{display:grid;gap:7px;color:#29384d;font-size:13px;font-weight:700}.oi-review-dialog label small{font-weight:500;color:#8591a2}.oi-review-dialog input[type=text],.oi-review-dialog textarea{width:100%;border:1px solid #d8e1ec;border-radius:10px;padding:11px 12px;background:#fff;color:#172033;outline:0}.oi-review-dialog textarea{resize:vertical}.oi-review-dialog input:focus,.oi-review-dialog textarea:focus{border-color:#3772f6;box-shadow:0 0 0 3px rgba(55,114,246,.1)}.oi-review-stars{margin:0;padding:14px 16px;border:1px solid #e1e8f1;border-radius:12px;background:#fafcff}.oi-review-stars legend{float:none;width:auto;margin:0 0 8px;padding:0;color:#29384d;font-size:13px;font-weight:800}.oi-review-stars div{display:inline-flex;gap:5px}.oi-review-stars button{padding:0;border:0;background:none;color:#c9d2df;font-size:26px}.oi-review-stars button.is-on{color:#f4b629}.oi-review-stars>span{margin-left:10px;color:#69778a;font-size:12px;font-weight:700}.oi-review-dialog footer{display:flex;justify-content:flex-end;gap:10px}.oi-review-cancel,.oi-review-submit{min-height:42px;padding:0 16px;border-radius:9px;font-weight:750}.oi-review-cancel{border:1px solid #d9e1eb;background:#fff;color:#536174}.oi-review-submit{border:1px solid #2863e8;background:#2863e8;color:#fff}.oi-review-list{display:grid;gap:12px}.oi-review-card{display:grid;grid-template-columns:84px minmax(0,1fr);gap:16px;padding:17px;border:1px solid #e0e7f0;border-radius:14px;background:#fff}.oi-review-card>img{width:84px;height:84px;padding:5px;object-fit:contain;border:1px solid #e7edf4;border-radius:10px;background:#f8fafc}.oi-review-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.oi-review-card-top>strong{color:#17283f}.oi-review-card-top>span{white-space:nowrap;color:#f4b629}.oi-review-card-top b{margin-left:6px;color:#475569;font-size:12px}.oi-review-card small,.oi-review-card time{display:block;color:#7a8798;font-size:12px}.oi-review-card h4{margin:8px 0 3px;font-size:14px}.oi-review-card p{margin:3px 0 7px;color:#44536a;font-size:13px;line-height:1.55}
@media(max-width:575px){.oi-review-modal{padding:0;place-items:end center}.oi-review-dialog{width:100%;max-height:92vh;border-radius:18px 18px 0 0}.oi-review-dialog>header,.oi-review-dialog form{padding:18px}.oi-review-card{grid-template-columns:64px minmax(0,1fr);padding:13px}.oi-review-card>img{width:64px;height:64px}.oi-review-card-top{display:block}.oi-review-card-top>span{display:block;margin-top:4px}}
.oi-product-reviews-section{padding-top:28px}.oi-product-reviews-head{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:24px;border:1px solid #e0e7f0;border-radius:16px;background:#f8faff}.oi-product-reviews-head>div>span{color:#2863e8;font-size:11px;font-weight:800;letter-spacing:.08em}.oi-product-reviews-head h2{margin:4px 0;color:#172033;font-size:25px}.oi-product-reviews-head p{margin:0;color:#68778b}.oi-product-review-score{display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 10px;min-width:170px}.oi-product-review-score strong{grid-row:1/3;color:#172033;font-size:38px}.oi-product-review-score span{color:#f4b629}.oi-product-review-score small{color:#778497}.oi-product-review-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:16px}.oi-product-review{padding:20px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.oi-product-review>header{display:flex;justify-content:space-between}.oi-product-review-stars{color:#f4b629}.oi-product-review time{color:#8995a5;font-size:12px}.oi-product-review h3{margin:13px 0 5px;font-size:16px}.oi-product-review>p{margin:6px 0 18px;color:#46566c;line-height:1.65}.oi-product-review>footer{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;padding-top:13px;border-top:1px solid #edf1f5}.oi-product-review>footer span{color:#25834b;font-size:12px;font-weight:700}.oi-product-review>footer small{color:#7c899a}.oi-product-review-empty{display:flex;align-items:center;gap:14px;margin-top:16px;padding:22px;border:1px dashed #ccd7e5;border-radius:14px;color:#65758b}.oi-product-review-empty>i{font-size:28px}.oi-product-review-empty p{margin:3px 0 0}.oi-product-review-empty strong{color:#25364d}@media(max-width:767px){.oi-product-reviews-head{align-items:flex-start;flex-direction:column}.oi-product-review-grid{grid-template-columns:1fr}.oi-product-review-score{min-width:0}}
.oi-product-review.is-extra{display:none}
.oi-product-reviews-more{display:flex;align-items:center;justify-content:center;width:100%;min-height:46px;margin-top:14px;border:1px solid #d5deea;border-radius:12px;background:#fff;color:#215ada;font-weight:700;cursor:pointer}
.oi-product-reviews-more:hover{border-color:#b9cdfd;background:#f5f8ff}

/* Hesabım — İade ve diğer satış sonrası talepler */
.oi-account-nav-count{display:grid;min-width:22px;height:22px;margin-left:auto;place-items:center;padding:0 6px;border-radius:999px;background:#2863e8;color:#fff;font-size:10px;font-style:normal;font-weight:800}.oi-requests-list{display:grid;gap:11px}.oi-request-card{overflow:hidden;border:1px solid #dfe6ef;border-radius:14px;background:#fff;box-shadow:0 3px 12px rgba(23,48,84,.035);transition:border-color .18s,box-shadow .18s}.oi-request-card:hover,.oi-request-card.is-open{border-color:#b9caf0;box-shadow:0 8px 24px rgba(31,72,151,.08)}.oi-request-summary{display:grid;grid-template-columns:72px minmax(0,1fr) auto 20px;align-items:center;gap:15px;width:100%;padding:15px;border:0;background:#fff;color:#172033;text-align:left;cursor:pointer}.oi-request-summary>img{width:72px;height:72px;padding:5px;object-fit:contain;border:1px solid #e5ebf2;border-radius:11px;background:#f8fafc}.oi-request-copy{display:grid;gap:3px;min-width:0}.oi-request-copy small{color:#758297;font-size:11px;font-weight:700}.oi-request-copy strong{font-size:15px}.oi-request-copy em{overflow:hidden;color:#526176;font-size:12px;font-style:normal;text-overflow:ellipsis;white-space:nowrap}.oi-request-state{display:inline-flex;align-items:center;gap:6px;padding:7px 9px;border-radius:999px;background:#eef4ff;color:#2863e8;font-size:11px;font-weight:800;white-space:nowrap}.oi-request-state>i{font-size:7px}.oi-request-state.is-success{background:#e9f8ef;color:#197044}.oi-request-state.is-warning{background:#fff5db;color:#946200}.oi-request-state.is-danger{background:#fff0f0;color:#b42318}.oi-request-chevron{color:#8490a2;font-size:12px;transition:transform .18s}.oi-request-card.is-open .oi-request-chevron{transform:rotate(180deg)}.oi-request-detail{border-top:1px solid #e8edf3;background:#fbfcfe}.oi-request-detail-inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:16px}.oi-request-detail-block{padding:14px;border:1px solid #e1e7ef;border-radius:11px;background:#fff}.oi-request-detail-block h4{display:flex;align-items:center;gap:7px;margin:0 0 9px;color:#27384f;font-size:13px}.oi-request-detail-block h4 i{color:#2863e8}.oi-request-detail-block>p{margin:0;color:#4b5c72;font-size:13px;line-height:1.6;white-space:pre-line}.oi-request-detail-facts{display:flex;flex-wrap:wrap;gap:18px;margin-top:12px;padding-top:11px;border-top:1px dashed #e2e8f0}.oi-request-detail-facts span{display:grid;gap:2px}.oi-request-detail-facts small,.oi-request-service-grid small{color:#8793a5;font-size:10px}.oi-request-detail-facts strong,.oi-request-service-grid strong{color:#2b3c52;font-size:12px}.oi-request-admin-note{grid-column:1/-1;display:flex;gap:11px;padding:13px 14px;border:1px solid #cfe0ff;border-radius:11px;background:#f1f6ff;color:#2863e8}.oi-request-admin-note>i{margin-top:2px}.oi-request-admin-note small{font-size:10px;font-weight:800;letter-spacing:.04em}.oi-request-admin-note p{margin:3px 0 0;color:#354a67;font-size:13px;line-height:1.5;white-space:pre-line}.oi-request-service-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.oi-request-service-grid>div{display:grid;gap:2px}.oi-request-files{display:grid;gap:7px}.oi-request-files a{display:flex;align-items:center;gap:8px;min-width:0;padding:9px;border-radius:8px;background:#f4f7fb;color:#2863e8;text-decoration:none}.oi-request-files a span{overflow:hidden;min-width:0;font-size:12px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.oi-request-files a small{margin-left:auto;color:#8995a6;font-size:9px;text-transform:uppercase}.oi-request-files a>i:last-child{font-size:10px}.oi-request-timeline{display:grid;gap:10px;margin:0;padding:0;list-style:none}.oi-request-timeline li{display:grid;grid-template-columns:12px minmax(0,1fr);gap:8px}.oi-request-timeline li>span{width:8px;height:8px;margin-top:4px;border:2px solid #aac0f4;border-radius:50%;background:#fff}.oi-request-timeline li:first-child>span{border-color:#2863e8;background:#2863e8}.oi-request-timeline li>div{display:grid;gap:2px}.oi-request-timeline strong{color:#42536a;font-size:11px;font-weight:650;line-height:1.4}.oi-request-timeline time{color:#929dad;font-size:9px}.oi-request-detail-error{padding:24px;color:#b42318;text-align:center}.oi-request-detail-error i{margin-right:6px}
.oi-od-item-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px;margin-top:8px}.oi-od-after-sales-btn,.oi-od-after-sales-state{display:inline-flex;align-items:center;gap:6px;width:max-content;border-radius:8px;font-size:12px;font-weight:700}.oi-od-after-sales-btn{padding:7px 10px;border:1px solid #d3dce8;background:#fff;color:#3d4b5f}.oi-od-after-sales-btn:hover{border-color:#8daaf0;background:#f6f8ff;color:#215ada}.oi-od-after-sales-state{padding:7px 10px;background:#eef4ff;color:#215ada}.oi-as-modal[hidden]{display:none}.oi-as-modal{position:fixed;inset:0;z-index:10060;display:grid;place-items:center;padding:20px}.oi-as-backdrop{position:absolute;inset:0;border:0;background:rgba(15,23,42,.6);backdrop-filter:blur(3px)}body.oi-as-open{overflow:hidden}.oi-as-dialog{position:relative;width:min(680px,100%);max-height:calc(100vh - 40px);overflow:hidden;border-radius:20px;background:#fff;box-shadow:0 30px 90px rgba(15,23,42,.28)}.oi-as-head{display:flex;align-items:center;justify-content:space-between;padding:22px 26px;border-bottom:1px solid #e8edf4}.oi-as-head small,.oi-as-form-title small{color:#2863e8;font-size:10px;font-weight:800;letter-spacing:.1em}.oi-as-head h3{margin:3px 0 0;color:#172033;font-size:25px}.oi-as-head>button{display:grid;width:40px;height:40px;place-items:center;border:1px solid #e1e7ef;border-radius:50%;background:#f7f9fc;color:#536176}.oi-as-body{max-height:calc(100vh - 126px);overflow:auto;padding:22px 26px 26px}.oi-as-product{display:flex;align-items:center;gap:15px;min-height:94px;padding:13px 16px;border-radius:14px;background:#f5f7fa}.oi-as-product img{width:68px;height:68px;flex:0 0 auto;padding:4px;object-fit:contain;border:1px solid #e5eaf0;border-radius:50%;background:#fff}.oi-as-product>span{display:grid;gap:2px}.oi-as-product strong{color:#172033;font-size:15px}.oi-as-product small{color:#536176}.oi-as-product em{color:#8792a3;font-size:11px;font-style:normal}.oi-as-loading{padding:42px;text-align:center;color:#718096}.oi-as-eligibility{margin:19px 0;padding:13px 15px;border-left:3px solid #2863e8;border-radius:0 9px 9px 0;background:#f4f7ff;color:#536176;font-size:13px;line-height:1.45}.oi-as-eligibility strong{color:#22334e}.oi-as-choices{display:grid;gap:10px}.oi-as-choices>button{display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:12px;width:100%;min-height:72px;padding:13px 16px;text-align:left;border:1px solid #e0e6ee;border-radius:12px;background:#fff;color:#1f2d42;box-shadow:0 2px 7px rgba(15,23,42,.035);transition:border-color .18s,box-shadow .18s,transform .18s}.oi-as-choices>button:hover:not(:disabled){transform:translateY(-1px);border-color:#9bb5f4;box-shadow:0 7px 18px rgba(35,78,164,.1)}.oi-as-choices>button>i:first-child{display:grid;width:38px;height:38px;place-items:center;border-radius:10px;background:#f1f5fd;color:#2863e8;font-size:16px}.oi-as-choices>button>span{display:grid;gap:3px}.oi-as-choices strong{font-size:14px}.oi-as-choices small{color:#7c889a;font-size:12px}.oi-as-choices>button>i:last-child{color:#9aa6b6;font-size:12px}.oi-as-choices>button.is-disabled{cursor:not-allowed;background:#fafafa;color:#a5abb4;box-shadow:none}.oi-as-choices>button.is-disabled>i:first-child{background:#f1f1f1;color:#b6bbc2}.oi-as-back{margin:5px 0 17px;padding:0;border:0;background:transparent;color:#536176;font-size:12px;font-weight:700}.oi-as-back i{margin-right:6px}.oi-as-form-title{display:flex;align-items:center;gap:12px;margin-bottom:18px;padding-bottom:16px;border-bottom:1px solid #edf1f5}.oi-as-form-title>span{display:grid;width:44px;height:44px;place-items:center;border-radius:12px;background:#eaf1ff;color:#2863e8;font-size:18px}.oi-as-form-title h4{margin:2px 0 0;color:#172033;font-size:19px}.oi-as-form{display:grid;gap:15px}.oi-as-field{display:grid;gap:7px;margin:0;color:#29384d;font-size:13px;font-weight:700}.oi-as-field input,.oi-as-field select,.oi-as-field textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid #d9e1eb;border-radius:10px;background:#fff;color:#172033;outline:0}.oi-as-field textarea{resize:vertical;line-height:1.5}.oi-as-field input:focus,.oi-as-field select:focus,.oi-as-field textarea:focus{border-color:#3772f6;box-shadow:0 0 0 3px rgba(55,114,246,.1)}.oi-as-field>small{color:#8995a5;font-size:11px;font-weight:500}.oi-as-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.oi-as-service{padding:15px;border:1px solid #dfe7f1;border-radius:12px;background:#fafcff}.oi-as-check{display:flex;align-items:flex-start;gap:10px;margin:0;cursor:pointer}.oi-as-check input{margin-top:4px}.oi-as-check>span{display:grid}.oi-as-check strong{color:#26364c;font-size:13px}.oi-as-check small{color:#7d899a;font-size:11px}.oi-as-service-fields{display:grid;gap:12px;margin-top:15px;padding-top:15px;border-top:1px solid #e5ebf2}.oi-as-upload{display:flex;align-items:center;gap:13px;min-height:78px;padding:14px 16px;border:1px dashed #b9c9df;border-radius:12px;background:#f9fbff;color:#2863e8;cursor:pointer}.oi-as-upload input{position:absolute;width:1px;height:1px;opacity:0}.oi-as-upload>i{font-size:23px}.oi-as-upload>span{display:grid}.oi-as-upload strong{font-size:13px}.oi-as-upload small{color:#77869a;font-size:11px}.oi-as-files{display:flex;flex-wrap:wrap;gap:7px}.oi-as-files span{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:6px 9px;border-radius:7px;background:#f0f4f9;color:#526176;font-size:11px}.oi-as-files span i{color:#2863e8}.oi-as-form>footer{display:flex;justify-content:flex-end;gap:9px;padding-top:5px}.oi-as-cancel,.oi-as-submit{min-height:43px;padding:0 17px;border-radius:9px;font-weight:750}.oi-as-cancel{border:1px solid #d9e1eb;background:#fff;color:#536174}.oi-as-submit{border:1px solid #2863e8;background:#2863e8;color:#fff}.oi-as-submit:disabled{opacity:.65}
@media(max-width:575px){.oi-as-modal{padding:0;place-items:stretch}.oi-as-dialog{width:100%;max-height:100vh;border-radius:0}.oi-as-head{padding:17px 18px}.oi-as-head h3{font-size:21px}.oi-as-body{max-height:calc(100vh - 76px);padding:16px 16px 24px}.oi-as-product{min-height:82px}.oi-as-product img{width:58px;height:58px}.oi-as-choices>button{min-height:70px;padding:12px}.oi-as-two{grid-template-columns:1fr}.oi-as-form>footer{position:sticky;bottom:-24px;margin:0 -16px -24px;padding:13px 16px;background:#fff;border-top:1px solid #e6ebf2}.oi-as-submit{flex:1}}
@media(max-width:700px){.oi-request-summary{grid-template-columns:58px minmax(0,1fr) 16px;gap:11px;padding:12px}.oi-request-summary>img{width:58px;height:58px}.oi-request-state{grid-column:2/3;width:max-content;margin-top:3px;padding:5px 8px}.oi-request-chevron{grid-column:3;grid-row:1/3}.oi-request-detail-inner{grid-template-columns:1fr;padding:12px}.oi-request-admin-note{grid-column:auto}.oi-request-service-grid{grid-template-columns:1fr}.oi-request-files a small{display:none}.oi-account-nav-count{margin-left:auto}.oi-account-nav-btn[data-oi-panel-tab]::after{margin-left:0}}
.oi-od-state {
  align-items: flex-start;
  padding: 20px;
}
.oi-od-state > .oi-od-state-icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  flex: 0 0 48px;
  margin: 0;
  padding: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 5px 15px rgba(30, 70, 118, .1);
  color: #0d6efd;
  font-size: 18px;
  line-height: 1;
}
.oi-od-state > i { display: none; }
.oi-od-state > .oi-od-state-icon i {
  display: block;
  width: auto;
  height: auto;
  margin: 0;
  padding: 0;
  border-radius: 0;
  background: none;
  color: inherit;
  font-size: 18px;
  line-height: 1;
}
.oi-od-state.is-ok > .oi-od-state-icon { color: #157347; }
.oi-od-state.is-warn > .oi-od-state-icon { color: #b76e00; }
.oi-od-state.is-bad > .oi-od-state-icon { color: #b42318; }
.oi-od-state small {
  display: block;
  margin-bottom: 3px;
  color: #7b8797;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.oi-od-state strong {
  color: #17283f;
  font-size: 17px;
}
.oi-od-state.is-ok strong { color: #157347; }
.oi-od-state.is-warn strong { color: #9b6200; }
.oi-od-state.is-info strong { color: #215ada; }
.oi-od-state.is-bad strong { color: #b42318; }
.oi-cargo-track {
  padding: 12px 14px;
  border: 1px solid #dce7f4;
  border-radius: 12px;
  background: #fff;
}
.oi-od-grid {
  gap: 16px;
  margin-top: 16px;
}
.oi-od-grid > section {
  min-width: 0;
}
.oi-od-grid h3 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  color: #17283f;
  font-size: 16px;
}
.oi-od-grid h3 i { color: #215ada; }
.oi-od-card,
.oi-od-pay {
  height: calc(100% - 27px);
  border-color: #dfe7f1;
  border-radius: 14px;
  box-shadow: 0 4px 14px rgba(22, 58, 101, .035);
}
.oi-od-addresses {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.oi-od-addresses .oi-od-card,
.oi-od-addresses .oi-od-card + .oi-od-card {
  height: auto;
  margin-top: 0;
}
.oi-od-card .oi-od-pickup-id-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 11px;
  border: 1px solid #f0ddac;
  border-radius: 9px;
  background: #fff9e9;
  color: #775312;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  white-space: normal;
}
.oi-od-pickup-id-note i { flex: 0 0 auto; margin-top: 2px; font-size: 14px; }
.oi-od-item-copy .oi-od-item-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin-top: 12px;
}
.oi-od-item-copy .oi-od-item-actions > button,
.oi-od-item-copy .oi-od-item-actions > span {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  margin-top: 0;
}
.oi-od-card h4 {
  color: #26384f;
  font-size: 13px;
}
.oi-od-pay {
  align-content: start;
  gap: 12px;
}
.oi-od-pay div {
  padding-bottom: 10px;
  border-bottom: 1px dashed #e6ebf1;
}
.oi-od-pay div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.oi-od-pay .is-total {
  margin-top: 0;
  padding: 12px 0 0;
  border-top: 1px solid #dce4ed;
  border-bottom: 0;
}
.oi-od-pay .is-total b {
  color: #215ada;
  font-size: 18px;
}
.oi-od-note {
  border-color: #d8e6f7;
  background: #eef6ff;
}
.oi-od-refunds {
  display: grid;
  gap: 4px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid #d5ead9;
  border-radius: 10px;
  background: #f2fbf4;
  color: #24553a;
  font-size: 13px;
}
.oi-od-refunds small { color: #5f7f69; }
.oi-od-cancel {
  margin-top: 14px;
  font-size: 13px;
}
.oi-od-cancel > button,
.oi-od-cancel form button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid #f1c4c4;
  border-radius: 8px;
  background: #fff;
  color: #b42318;
  font-weight: 700;
  cursor: pointer;
}
.oi-od-cancel form {
  display: grid;
  gap: 8px;
  padding: 12px 14px;
  border: 1px solid #f1d4d4;
  border-radius: 10px;
  background: #fff8f8;
}
.oi-od-cancel form p { margin: 0; color: #5b3a3a; }
.oi-od-cancel form label { display: grid; gap: 4px; color: #4b5565; font-weight: 600; }
.oi-od-cancel form textarea { width: 100%; padding: 8px 10px; border: 1px solid #e3d2d2; border-radius: 8px; font: inherit; }
.oi-od-cancel form div { display: flex; gap: 8px; flex-wrap: wrap; }
.oi-od-cancel form button[type="submit"] { border-color: #b42318; background: #b42318; color: #fff; }
.oi-od-cancel form button:disabled { opacity: .6; cursor: wait; }
.oi-od-cancel.is-pending {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 12px 14px;
  border: 1px solid #f1dfb8;
  border-radius: 10px;
  background: #fff8eb;
  color: #7a4d12;
}

@media (max-width: 1199px) {
  .oi-account-order-row {
    grid-template-columns: 68px minmax(160px, 1fr) minmax(150px, .8fr) 120px 42px;
    gap: 12px;
    padding: 16px;
  }
  .oi-account-order-thumb { width: 68px; height: 68px; }
  .oi-account-order-chevron {
    width: 38px;
    min-height: 38px;
    padding: 0;
  }
  .oi-account-order-chevron span { display: none; }
}

@media (max-width: 991px) {
  .oi-account-order-row {
    grid-template-columns: 62px minmax(0, 1fr) auto;
    grid-template-areas:
      "thumb info chevron"
      "status status status"
      "meta meta meta";
    gap: 10px 12px;
    padding: 14px;
  }
  .oi-account-order-thumb { width: 62px; height: 62px; }
  .oi-account-order-status {
    width: 100%;
    min-width: 0;
  }
  .oi-account-order-meta {
    grid-template-columns: 1fr 1fr;
    width: 100%;
    padding-top: 10px;
    border-top: 1px solid #edf1f6;
    text-align: left;
    justify-items: start;
  }
  .oi-account-order-total { justify-self: end; text-align: right; }
  .oi-account-order-detail { padding: 14px; }
  .oi-od-head { align-items: flex-start; }
  .oi-od-products,
  .oi-od-grid { grid-template-columns: 1fr; }
  .oi-od-card,
  .oi-od-pay { height: auto; }
}

@media (max-width: 575px) {
  .oi-od-addresses { grid-template-columns: 1fr; }
  [data-oi-panel="orders"] .oi-account-filters {
    width: 100%;
    border-radius: 10px;
  }
  [data-oi-panel="orders"] .oi-account-filter {
    flex: 0 0 auto;
  }
  .oi-account-order-title {
    white-space: normal;
  }
  .oi-account-order-chevron {
    width: 34px;
    min-height: 34px;
  }
  .oi-od-head {
    display: grid;
    gap: 14px;
    padding: 15px;
  }
  .oi-od-head-total {
    min-width: 0;
    padding-top: 12px;
    border-top: 1px solid #dce7f4;
    text-align: left;
  }
  .oi-od-item {
    grid-template-columns: 64px minmax(0, 1fr);
    min-height: 0;
    padding: 12px;
  }
  .oi-od-item img { width: 64px; height: 64px; }
  .oi-od-item > b {
    grid-column: 2;
    justify-self: start;
  }
}

/* Kategori filtresi — site temasıyla aynı kart dili */
.oi-shop-filter-area {
  background: #fff;
}
.oi-hb-layout {
  display: block;
}
.oi-hb-main {
  min-width: 0;
}
@media (min-width: 992px) {
  .oi-hb-layout {
    display: grid;
    grid-template-columns: 248px minmax(0, 1fr);
    gap: 32px;
    align-items: start;
  }
}
@media (max-width: 991.98px) {
  .oi-shop-filter-area .oi-shop-sidebar-col {
    display: none;
  }
}
.oi-hb {
  font-family: "Cabin", sans-serif;
  color: var(--oi-ink, #212529);
  background: #fff;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  padding: 6px 16px 14px;
  box-shadow: 0 2px 7px rgba(19, 49, 89, 0.06);
}
.oi-hb-switch {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 14px 0;
  border-bottom: 1px solid #e9ecef;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: var(--oi-ink, #212529);
}
.oi-hb-switch input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.oi-hb-switch-ui {
  position: relative;
  width: 42px;
  height: 24px;
  border-radius: 999px;
  background: #d7d7d7;
  flex: 0 0 auto;
  transition: background 0.15s ease;
}
.oi-hb-switch-ui::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  transition: transform 0.15s ease;
}
.oi-hb-switch input:checked + .oi-hb-switch-ui {
  background: var(--oi-primary, #0d6efd);
}
.oi-hb-switch input:checked + .oi-hb-switch-ui::after {
  transform: translateX(18px);
}
.oi-hb-switch input:focus-visible + .oi-hb-switch-ui {
  outline: 2px solid var(--oi-primary, #0d6efd);
  outline-offset: 2px;
}
.oi-hb-sec {
  border-bottom: 1px solid #e9ecef;
}
.oi-hb-sec-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin: 0;
  padding: 16px 0 12px;
  border: 0;
  background: transparent;
  color: var(--oi-ink, #212529);
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  text-align: left;
}
.oi-hb-sec-btn i {
  color: var(--oi-primary, #0d6efd);
  font-size: 12px;
  transition: transform 0.15s ease;
}
.oi-hb-sec.is-open .oi-hb-sec-btn i {
  transform: rotate(180deg);
}
.oi-hb-sec-body {
  padding-bottom: 12px;
}
.oi-hb-sec-body[hidden] {
  display: none !important;
}
.oi-hb-find {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  margin: 0 0 8px;
  padding: 0 12px;
  border: 1px solid #e5eaf2;
  border-radius: 10px;
  background: #f8f9fa;
}
.oi-hb-find i {
  color: #9a9a9a;
  font-size: 13px;
}
.oi-hb-find input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  font-family: inherit;
  font-size: 14px;
  color: #212121;
}
.oi-hb-sub {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 10px 0 4px;
  font-size: 13px;
  font-weight: 700;
  color: #3a3a3a;
}
.oi-hb-sub i {
  color: #8a8a8a;
  font-size: 12px;
}
.oi-hb-list {
  display: flex;
  flex-direction: column;
}
.oi-hb-check {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 7px 2px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #3d3d3d;
}
.oi-hb .oi-hb-check input[type="checkbox"] {
  appearance: none;
  position: static;
  opacity: 1;
  pointer-events: auto;
  width: 18px;
  height: 18px;
  margin: 0;
  border: 1.5px solid #c8c8c8;
  border-radius: 4px;
  background: #fff;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  clip: auto;
}
.oi-hb .oi-hb-check input[type="checkbox"]:checked {
  background: var(--oi-primary, #0d6efd);
  border-color: var(--oi-primary, #0d6efd);
}
.oi-hb .oi-hb-check input[type="checkbox"]:checked::after {
  content: "";
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) translate(-1px, -1px);
}
.oi-hb-check:hover span {
  color: #111;
}
.oi-hb-price {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 8px;
  margin-top: 10px;
}
.oi-hb-price input {
  height: 38px;
  border: 1px solid #e5eaf2;
  border-radius: 10px;
  padding: 0 10px;
  font-family: inherit;
  font-size: 13px;
  background: #fff;
  min-width: 0;
}
.oi-hb-price button {
  height: 38px;
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  background: var(--oi-primary, #0d6efd);
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
}
.oi-hb-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  margin: 0 0 10px;
  color: #8d8d8d;
  font-size: 13px;
}
.oi-hb-crumb a {
  color: #8d8d8d;
  text-decoration: none;
}
.oi-hb-crumb a:hover {
  color: #212121;
}
.oi-hb-crumb i {
  font-size: 9px;
}
.oi-hb-crumb span {
  color: #4a4a4a;
}
.oi-hb-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.oi-hb-head h1 {
  margin: 0;
  font-size: 22px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--oi-ink, #212529);
}
.oi-hb-head h1 span {
  font-weight: 500;
  color: #6f6f6f;
  font-size: 16px;
}
.oi-hb-head-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
}
.oi-hb-head-tools .oi-shop-view-menu {
  display: none !important;
}
.oi-hb-head .oi-sort-btn,
.oi-hb-chip,
.oi-hb-chips-nav {
  border-color: #e5eaf2;
}
.oi-hb-head .oi-sort-btn {
  min-width: 180px;
  height: 40px;
  border-radius: 10px;
  background: #fff;
}
.oi-hb-chips {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}
.oi-hb-chips-track {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  flex: 1 1 auto;
  min-width: 0;
  padding: 2px 0;
}
.oi-hb-chips-track::-webkit-scrollbar {
  display: none;
}
.oi-hb-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 14px;
  border: 1px solid #e5e5e5;
  border-radius: 10px;
  background: #fff;
  color: #222;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
}
.oi-hb-chip i {
  font-size: 11px;
  color: #8a8a8a;
}
.oi-hb-chip.is-active {
  border-color: var(--oi-primary, #0d6efd);
  color: var(--oi-primary, #0d6efd);
  background: rgba(13, 110, 253, 0.06);
  font-weight: 700;
}
.oi-hb-chip:hover {
  border-color: #9ec0ee;
  color: var(--oi-primary, #0d6efd);
}
.oi-hb-chips-nav {
  width: 32px;
  height: 32px;
  border: 1px solid #e5e5e5;
  border-radius: 50%;
  background: #fff;
  color: #444;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  cursor: pointer;
}
.oi-hb-chips-nav[hidden] {
  display: none !important;
}
.oi-hb-picks {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
}
.oi-hb-picks a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 10px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e5e5e5;
  color: #333;
  font-size: 13px;
  text-decoration: none;
}
.oi-hb-picks-clear {
  border: 0 !important;
  background: transparent !important;
  text-decoration: underline !important;
  font-weight: 600;
}
.oi-shop-filter-block .oi-hb-switch {
  border-bottom: 0;
  padding: 10px 0;
}
@media (max-width: 991.98px) {
  .oi-hb-head h1 {
    font-size: 18px;
  }
  .oi-hb-head h1 span {
    font-size: 14px;
  }
}

/* Sipariş takibi */
.oi-track {
  background: #fff;
  padding: 36px 0 64px;
  font-family: "Cabin", sans-serif;
  color: #212529;
}
.oi-track-card,
.oi-track-result {
  max-width: 760px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  box-shadow: 0 2px 7px rgba(19, 49, 89, 0.06);
}
.oi-track-card {
  padding: 28px 24px 24px;
}
.oi-track-card h1 {
  margin: 0 0 8px;
  font-size: 28px;
  font-weight: 700;
}
.oi-track-lead {
  margin: 0 0 20px;
  color: #6c757d;
}
.oi-track-form {
  display: grid;
  gap: 14px;
}
@media (min-width: 720px) {
  .oi-track-form {
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
  }
}
.oi-track-form label {
  display: grid;
  gap: 6px;
  margin: 0;
  font-size: 13px;
  font-weight: 600;
}
.oi-track-form input {
  height: 46px;
  border: 1px solid #e5eaf2;
  border-radius: 10px;
  padding: 0 12px;
  font-family: inherit;
  font-size: 15px;
  background: #f8f9fa;
}
.oi-track-form input:focus {
  outline: 0;
  border-color: #0d6efd;
  background: #fff;
  box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.12);
}
.oi-track-form button {
  height: 46px;
  padding: 0 22px;
  border: 0;
  border-radius: 10px;
  background: #0d6efd;
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}
.oi-track-form button:disabled {
  opacity: 0.7;
  cursor: wait;
}
.oi-track-error {
  margin: 14px 0 0;
  color: #dc3545;
  font-weight: 600;
}
.oi-track-result {
  margin-top: 18px;
  padding: 22px 22px 8px;
}
.oi-track-result[hidden] {
  display: none !important;
}
.oi-track-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 18px;
}
.oi-track-head h2 {
  margin: 0;
  font-size: 20px;
}
.oi-track-head p {
  margin: 4px 0 0;
  color: #6c757d;
  font-size: 14px;
}
.oi-track-badge {
  flex: 0 0 auto;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(13, 110, 253, 0.1);
  color: #0d6efd;
  font-size: 13px;
  font-weight: 700;
}
.oi-track-badge.is-done { background: #e8f8ee; color: #157347; }
.oi-track-badge.is-failed { background: #fdecec; color: #b42318; }
.oi-track-steps {
  list-style: none;
  margin: 0 0 18px;
  padding: 0;
  display: grid;
  gap: 0;
}
.oi-track-steps li {
  display: grid;
  grid-template-columns: 22px 1fr;
  gap: 12px;
  align-items: start;
  position: relative;
}
.oi-track-steps li span {
  padding: 0 0 16px;
  font-size: 14px;
  font-weight: 600;
  color: #98a2b3;
}
.oi-track-steps li.is-done span,
.oi-track-steps li.is-current span { color: #212529; }
.oi-track-steps li.is-failed span { color: #b42318; }
.oi-track-mark {
  width: 14px;
  height: 14px;
  margin: 3px auto 0;
  border-radius: 50%;
  border: 2px solid #d0d5dd;
  background: #fff;
  position: relative;
  z-index: 1;
}
.oi-track-steps li:not(:last-child)::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 18px;
  bottom: -2px;
  width: 2px;
  background: #e5eaf2;
}
.oi-track-steps li.is-done .oi-track-mark {
  border-color: #0d6efd;
  background: #0d6efd;
}
.oi-track-steps li.is-current .oi-track-mark {
  border-color: #0d6efd;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.16);
}
.oi-track-steps li.is-done:not(:last-child)::before { background: #0d6efd; }
.oi-track-steps li.is-failed .oi-track-mark {
  border-color: #b42318;
  background: #b42318;
}
.oi-track-items {
  border-top: 1px solid #e9ecef;
}
.oi-track-item {
  display: grid;
  grid-template-columns: 64px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid #f1f3f5;
}
.oi-track-item img {
  width: 64px;
  height: 64px;
  object-fit: contain;
  border-radius: 8px;
  background: #f8f9fa;
}
.oi-track-item strong { display: block; font-size: 14px; }
.oi-track-item em {
  display: block;
  margin-top: 2px;
  font-style: normal;
  color: #6c757d;
  font-size: 13px;
}
.oi-track-sums {
  margin: 8px 0 14px;
  display: grid;
  gap: 6px;
  justify-items: end;
  font-size: 14px;
}
.oi-track-sums b { font-size: 18px; }

/* Müşteri hizmetleri */
.oi-support {
  background: #fff;
  font-family: "Cabin", sans-serif;
  color: #212529;
}
.oi-support-hero {
  background: #f8f9fa;
  border-bottom: 1px solid #e9ecef;
  padding: 36px 0 28px;
}
.oi-support-crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
  margin-bottom: 12px;
  font-size: 13px;
  color: #6c757d;
}
.oi-support-crumb a {
  color: #6c757d;
  text-decoration: none;
}
.oi-support-crumb a:hover { color: #212529; }
.oi-support-hero h1 {
  margin: 0;
  font-size: clamp(1.5rem, 2.4vw, 2rem);
  font-weight: 700;
}
.oi-support-hero p {
  margin: 10px 0 0;
  max-width: 640px;
  color: #6c757d;
  font-size: 15px;
  line-height: 1.6;
}
.oi-support-body {
  padding: 36px 0 64px;
}
.oi-support-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.oi-support-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 140px;
  padding: 22px;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 7px rgba(19, 49, 89, 0.06);
  color: inherit;
  text-decoration: none;
}
.oi-support-card:hover {
  border-color: #0d6efd;
  color: inherit;
}
.oi-support-card i {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: #e7f1ff;
  color: #0d6efd;
  font-size: 16px;
}
.oi-support-card span {
  margin-top: 8px;
  font-size: 13px;
  color: #6c757d;
}
.oi-support-card strong {
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  word-break: break-word;
}
.oi-support-card em {
  font-style: normal;
  font-size: 13px;
  font-weight: 600;
  color: #0d6efd;
}
.oi-support-card--wide { grid-column: 1 / -1; }
.oi-support-map {
  margin-top: 28px;
}
.oi-support-map-head h2 {
  margin: 0 0 8px;
  font-size: 1.1rem;
  font-weight: 700;
}
.oi-support-map-head p {
  margin: 0;
  max-width: 720px;
  color: #495057;
  font-size: 15px;
  line-height: 1.7;
}
.oi-support-map-frame {
  margin-top: 14px;
  height: 420px;
  overflow: hidden;
  border: 1px solid #e5eaf2;
  border-radius: 14px;
  background: #f8f9fa;
  box-shadow: 0 2px 7px rgba(19, 49, 89, 0.06);
}
.oi-support-map-frame iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
.oi-support-map-link {
  display: inline-flex;
  align-items: center;
  margin-top: 12px;
  color: #0d6efd;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}
.oi-support-map-link:hover { color: #0a58ca; }
@media (max-width: 767px) {
  .oi-support-cards { grid-template-columns: 1fr; }
  .oi-support-card strong { font-size: 16px; }
  .oi-support-map-frame { height: 320px; }
}

/* Müşteri Hizmetleri — yenilenen sayfa düzeni */
.oi-support { padding:34px 0 72px; background:#f7f9fc; color:#182235; }
.oi-support-shell { max-width:1180px; }
.oi-support-hero { position:relative; overflow:hidden; padding:36px 42px 42px; border:0; border-radius:22px; background:linear-gradient(120deg,#102a63 0%,#215ada 55%,#3a75eb 100%); color:#fff; box-shadow:0 18px 45px rgba(20,60,142,.2); }
.oi-support-hero::before,.oi-support-hero::after { position:absolute; border-radius:50%; content:""; pointer-events:none; }
.oi-support-hero::before { width:290px; height:290px; right:-88px; bottom:-170px; border:48px solid rgba(255,255,255,.1); }
.oi-support-hero::after { width:88px; height:88px; right:29%; top:-42px; background:rgba(255,255,255,.08); }
.oi-support-crumb { position:relative; z-index:1; gap:7px; margin-bottom:26px; color:rgba(255,255,255,.68); }
.oi-support-crumb a { color:rgba(255,255,255,.78); }
.oi-support-crumb a:hover { color:#fff; }
.oi-support-crumb i { font-size:9px; opacity:.6; }
.oi-support-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) minmax(290px,390px); gap:34px; align-items:end; }
.oi-support-kicker { display:inline-flex; align-items:center; gap:7px; margin-bottom:13px; padding:7px 11px; border-radius:999px; background:rgba(255,255,255,.14); color:inherit; font-size:12px; font-weight:700; letter-spacing:.02em; }
.oi-support-hero h1 { max-width:560px; color:#fff; font-size:clamp(2rem,3.5vw,3rem); line-height:1.12; }
.oi-support-hero p { margin-top:14px; max-width:610px; color:rgba(255,255,255,.82); font-size:16px; }
.oi-support-hero-actions { display:grid; gap:11px; }
.oi-support-hero-action { display:flex; align-items:center; gap:13px; min-height:68px; padding:12px 16px; border:1px solid rgba(255,255,255,.25); border-radius:13px; background:rgba(4,22,65,.16); color:#fff; text-decoration:none; transition:transform .2s ease,background .2s ease; }
.oi-support-hero-action:hover { transform:translateY(-2px); background:rgba(4,22,65,.28); color:#fff; }
.oi-support-hero-action > i { display:grid; width:38px; height:38px; place-items:center; border-radius:10px; background:rgba(255,255,255,.16); }
.oi-support-hero-action span { display:grid; gap:2px; font-size:12px; }
.oi-support-hero-action strong { font-size:15px; font-weight:700; overflow-wrap:anywhere; }
.oi-support-hero-action--light { background:#fff; border-color:#fff; color:#173a89; }
.oi-support-hero-action--light:hover { background:#edf3ff; color:#173a89; }
.oi-support-hero-action--light > i { background:#e8f0ff; color:#215ada; }
.oi-support-contact,.oi-support-shortcuts,.oi-support-location { margin-top:32px; }
.oi-support-section-head { display:flex; align-items:end; justify-content:space-between; gap:20px; margin-bottom:16px; }
.oi-support-section-head > div > span { display:block; margin-bottom:4px; color:#215ada; font-size:12px; font-weight:700; letter-spacing:.055em; text-transform:uppercase; }
.oi-support-section-head h2 { margin:0; color:#182235; font-size:23px; font-weight:700; }
.oi-support-section-head p { max-width:390px; margin:0; color:#687386; font-size:14px; line-height:1.55; }
.oi-support-section-head--compact { margin-bottom:14px; }
.oi-support-cards { gap:18px; }
.oi-support-card { position:relative; display:grid; grid-template-columns:50px 1fr; column-gap:15px; min-height:162px; padding:26px; border:1px solid #e1e7f0; border-radius:17px; box-shadow:0 8px 20px rgba(19,49,89,.055); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.oi-support-card:hover { transform:translateY(-3px); border-color:#8eafea; box-shadow:0 14px 28px rgba(19,49,89,.1); }
.oi-support-card-icon { display:grid; width:48px; height:48px; grid-row:1 / span 3; place-items:center; border-radius:13px; background:#e9f1ff; color:#215ada; }
.oi-support-card-icon > i { width:auto; height:auto; margin:0; padding:0; background:transparent; color:inherit; font-size:19px; line-height:1; }
.oi-support-card span { color:#748094; }
.oi-support-card strong { align-self:start; margin-top:2px; color:#182235; }
.oi-support-card em { align-self:end; margin-top:12px; color:#215ada; }
.oi-support-card em i { width:auto; height:auto; margin-left:3px; background:transparent; font-size:11px; }
.oi-support-shortcut-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.oi-support-shortcut { display:flex; align-items:center; gap:12px; min-height:103px; padding:17px; border:1px solid #e1e7f0; border-radius:15px; background:#fff; color:inherit; text-decoration:none; transition:border-color .2s ease,box-shadow .2s ease; }
.oi-support-shortcut:hover { border-color:#98b6eb; box-shadow:0 9px 20px rgba(19,49,89,.07); color:inherit; }
.oi-support-shortcut > i { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; border-radius:11px; background:#f0f5ff; color:#215ada; }
.oi-support-shortcut span { display:grid; gap:4px; min-width:0; }
.oi-support-shortcut strong { color:#182235; font-size:14px; font-weight:700; }
.oi-support-shortcut small { color:#748094; font-size:12px; line-height:1.35; }
.oi-support-shortcut > b { margin-left:auto; color:#215ada; font-size:23px; font-weight:400; }
.oi-support-location { display:grid; grid-template-columns:minmax(280px,.9fr) minmax(0,1.3fr); min-height:380px; overflow:hidden; border:1px solid #dfe6f0; border-radius:20px; background:#fff; box-shadow:0 8px 24px rgba(19,49,89,.06); }
.oi-support-location-info { display:flex; flex-direction:column; align-items:flex-start; padding:38px; background:linear-gradient(145deg,#eff5ff 0%,#f9fbff 100%); }
.oi-support-location-info .oi-support-kicker { background:#dce9ff; color:#215ada; }
.oi-support-location-info h2 { margin:0; color:#182235; font-size:27px; line-height:1.2; }
.oi-support-location-info > p { margin:13px 0 21px; color:#657287; font-size:15px; line-height:1.6; }
.oi-support-address { display:flex; gap:10px; align-items:flex-start; color:#34435a; font-size:14px; font-weight:600; line-height:1.55; }
.oi-support-address > i { margin-top:3px; color:#215ada; }
.oi-support-route { display:inline-flex; align-items:center; gap:8px; margin-top:auto; padding:11px 15px; border-radius:9px; background:#215ada; color:#fff; font-size:14px; font-weight:700; text-decoration:none; }
.oi-support-route:hover { background:#1647b3; color:#fff; }
.oi-support-route i { font-size:12px; }
.oi-support-map-frame { min-height:340px; margin:0; border:0; border-radius:0; box-shadow:none; background:#dbe6f7; }
.oi-support-map-frame iframe[hidden] { display:none; }
.oi-support-map-consent { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; height:100%; padding:28px; text-align:center; color:#34445e; }
.oi-support-map-consent > i { font-size:36px; color:#3863d8; }
.oi-support-map-consent p { margin:0; font-size:17px; font-weight:700; }
.oi-support-map-consent button { min-height:42px; padding:9px 20px; border:0; border-radius:10px; background:#315fd4; color:#fff; font:inherit; font-weight:700; cursor:pointer; }
.oi-support-map-consent button:hover { background:#244dae; }
.oi-support-map-consent button:focus-visible { outline:3px solid #8aa8f7; outline-offset:3px; }
.oi-support-map-consent small { font-size:12px; line-height:1.5; color:#61718b; }
@media (max-width:991px) { .oi-support-hero-grid { grid-template-columns:1fr; } .oi-support-hero-actions { grid-template-columns:repeat(2,minmax(0,1fr)); } .oi-support-location { grid-template-columns:1fr; } .oi-support-map-frame { height:330px; } }
@media (max-width:767px) { .oi-support { padding:20px 0 48px; } .oi-support-hero { padding:25px 21px 27px; border-radius:16px; } .oi-support-crumb { margin-bottom:20px; } .oi-support-hero h1 { font-size:29px; } .oi-support-hero p { font-size:14px; } .oi-support-hero-actions { grid-template-columns:1fr; gap:9px; } .oi-support-hero-action { min-height:60px; } .oi-support-section-head { display:block; } .oi-support-section-head p { margin-top:9px; } .oi-support-card { min-height:145px; padding:21px; } .oi-support-shortcut-grid { grid-template-columns:1fr; } .oi-support-location-info { padding:27px 22px; } .oi-support-location-info h2 { font-size:23px; } .oi-support-map-frame { min-height:285px; height:285px; } }

/* Checkout — sade, güven veren ve sipariş akışını öne çıkaran düzen */
body.oi-checkout-shell { margin:0; background:#f4f6f9; color:#202939; }
.oi-checkout-topbar { background:#fff; border-bottom:1px solid #e4e8ef; }
.oi-checkout-topbar-inner.container { display:flex; align-items:center; justify-content:space-between; min-height:78px; }
.oi-checkout-brand { display:inline-flex; align-items:center; min-width:0; }
.oi-checkout-brand img { display:block; width:184px; max-width:48vw; max-height:56px; object-fit:contain; }
.oi-checkout-topbar-trust { display:flex; align-items:center; gap:10px; color:#25354c; }
.oi-checkout-topbar-icon { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; border-radius:11px; background:#edf4ff; color:#2f64d8; font-size:17px; }
.oi-checkout-topbar-trust > span:last-child { display:grid; gap:2px; }
.oi-checkout-topbar-trust strong { font-size:13px; font-weight:700; }
.oi-checkout-topbar-trust small { color:#788396; font-size:11px; }
.oi-checkout-page { padding:27px 0 52px !important; background:#f4f6f9 !important; }
.oi-checkout-page > .container { max-width:1280px; }
.oi-checkout .row.row--24 { --bs-gutter-x:22px; --bs-gutter-y:18px; }
.oi-co-head { align-items:center; margin-bottom:20px; }
.oi-co-page-title { color:#182235; font-size:28px; letter-spacing:-.025em; }
.oi-co-page-sub { max-width:620px; color:#697588; font-size:14px; }
.oi-co-back { padding:9px 12px; border:1px solid #dfe5ee; border-radius:9px; background:#fff; color:#40516b; font-size:13px; }
.oi-co-back:hover { border-color:#b7c8e6; background:#f9fbff; color:#245edb; text-decoration:none; }
.oi-co-block { margin-bottom:15px; padding:21px; border:1px solid #e2e7ef; border-radius:13px; background:#fff; box-shadow:0 3px 12px rgba(25,42,70,.035); }
.oi-co-block-head { align-items:center; gap:11px; margin-bottom:15px; }
.oi-co-step { flex-basis:30px; width:30px; height:30px; background:#edf3ff; color:#2d63d8; }
.oi-co-step--icon { font-size:13px; }
.oi-co-title { color:#202b3e; font-size:18px; }
.oi-co-sub { margin-top:3px; color:#778296; font-size:12px; }
.oi-co-delivery-types { gap:10px; margin-bottom:13px; }
.oi-co-choice-inner { min-height:68px; padding:11px 13px; border-radius:10px; }
.oi-co-choice input:checked + .oi-co-choice-inner { border-color:#8aacee; background:#f6f9ff; box-shadow:0 0 0 2px rgba(47,109,243,.08); }
.oi-co-card { padding:15px; border-color:#e5e9f0; border-radius:10px; background:#fbfcfe; }
.oi-co-card--soft { background:#fbfcfe; }
.oi-co-card-head { margin-bottom:9px; }
.oi-co-card-label strong { color:#35435a; font-size:13px; }
.oi-co-card-head a { font-size:12px; }
.oi-co-card-text { color:#5e697b; font-size:13px; }
.oi-co-select { height:43px; border-color:#dfe5ee; border-radius:8px; background-color:#fff; }
.oi-co-select:focus { border-color:#7399e7; box-shadow:0 0 0 3px rgba(47,109,243,.1); }
.oi-co-pay-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.oi-co-pay-option { align-items:flex-start; min-height:90px; padding:13px; border-radius:10px; }
.oi-co-pay-option:has(input:checked) { border-color:#8aacee; background:#f6f9ff; box-shadow:0 0 0 2px rgba(47,109,243,.08); }
.oi-co-pay-icon { flex-basis:34px; width:34px; height:34px; border-radius:9px; background:#eef3fb; font-size:14px; }
.oi-co-pay-body strong { color:#28364b; font-size:13px; }
.oi-co-pay-body small { font-size:11px; line-height:1.45; }
.oi-co-ship-items { gap:9px; }
.oi-co-ship-item { grid-template-columns:70px minmax(0,1fr) auto; gap:13px; padding:12px; border-color:#e5e9f0; border-radius:10px; background:#fff; }
.oi-co-ship-item-img { width:70px; height:70px; max-width:70px; max-height:70px; border-radius:8px; border-color:#edf0f4; }
.oi-co-ship-item-img img,.oi-co-ship-item img { max-width:68px; max-height:68px; }
.oi-co-ship-item-body { gap:4px; }
.oi-co-ship-item-body strong { color:#28364b; font-size:14px; }
.oi-co-ship-item-body span { color:#667286; font-size:12px; }
.oi-co-ship-item-body .oi-co-product-meta { color:#8290a2; font-size:11px; }
.oi-co-ship-item-price { color:#263b61; font-size:14px; font-weight:700; white-space:nowrap; }
.oi-co-legal .oi-co-block-head { margin-bottom:8px; }
.oi-co-accordion { border-color:#e7ebf1; }
.oi-co-accordion summary { padding:13px 2px; color:#35435a; font-size:13px; }
.oi-co-accordion-body { color:#596579; font-size:12px; }
.oi-co-summary { position:sticky; top:22px; padding:21px; border:1px solid #e1e6ee; border-radius:13px; background:#fff; box-shadow:0 5px 18px rgba(25,42,70,.05); }
.oi-co-summary .oi-cart-summary-title { margin-bottom:15px; color:#202b3e; font-size:19px; }
.oi-co-summary .oi-cart-summary-rows { display:flex; flex-direction:column; gap:0; }
.oi-co-summary .oi-cart-summary-row { padding:9px 0; border-bottom:1px solid #eef0f4; color:#667286; font-size:13px; }
.oi-co-summary .oi-cart-summary-row strong { color:#35435a; font-size:13px; }
.oi-co-summary .oi-cart-summary-total { margin-top:4px; padding:13px 0 5px; border-top:0; color:#202b3e; font-size:15px; }
.oi-co-summary .oi-cart-summary-total strong { color:#2d63d8; font-size:20px; }
.oi-co-summary .oi-cart-checkout { height:49px; margin-top:16px; border-radius:9px; background:#2f66df; font-size:15px; box-shadow:0 5px 12px rgba(47,102,223,.18); }
.oi-co-summary .oi-cart-checkout:hover:not(:disabled) { background:#2458c8; }
.oi-co-coupon-note { display:flex; align-items:center; gap:8px; margin-top:12px; padding:9px 10px; border:1px solid #dcefe2; border-radius:8px; background:#f4fbf6; color:#3f7251; font-size:12px; }
.oi-co-coupon-note[hidden] { display:none; }
.oi-co-coupon-note > i { color:#398552; }
.oi-co-coupon-note > span { min-width:0; overflow-wrap:anywhere; }
.oi-co-coupon-note > a { margin-left:auto; color:#2e6d42; font-weight:700; text-decoration:underline; white-space:nowrap; }
.oi-co-summary .oi-cart-freeship { margin-top:10px; }
.oi-co-legal-consent { margin-top:12px; padding:11px; border-color:#e5e8ed; background:#fff; }
.oi-co-legal-consent-copy { color:#737987; font-size:12px; line-height:1.5; }
.oi-co-legal-consent-copy a { color:#4d5665; font-weight:700; }
.oi-co-summary-note { justify-content:flex-start; margin-top:12px; color:#7c8797; font-size:11px; line-height:1.45; }
.oi-co-summary-note i { color:#6380b9; }
.oi-co-summary .oi-cart-secondary { height:40px; margin-top:12px; border-color:#e4e8ef; border-radius:8px; color:#506078; font-size:13px; }
.oi-checkout-footer { border-top:1px solid #e5e9ef; background:#fff; }
.oi-checkout-footer-inner.container { display:flex; align-items:center; gap:9px; min-height:58px; color:#7a8493; font-size:12px; }
.oi-checkout-footer-inner > span { color:#4b586d; font-weight:600; }
.oi-checkout-footer-inner > a { color:#2f64d8; font-weight:700; text-decoration:none; }
.oi-checkout-footer-inner > a:hover { text-decoration:underline; }
.oi-checkout-footer-inner > small { margin-left:auto; color:#929baa; font-size:11px; }
@media (max-width:991px) {
  .oi-co-summary { position:static; margin-top:0; }
  .oi-co-pay-list { grid-template-columns:1fr; }
}
@media (max-width:767px) {
  .oi-checkout-topbar-inner.container { min-height:66px; }
  .oi-checkout-brand img { width:150px; max-height:46px; }
  .oi-checkout-topbar-icon { flex-basis:32px; width:32px; height:32px; font-size:14px; }
  .oi-checkout-topbar-trust { gap:7px; }
  .oi-checkout-topbar-trust strong { font-size:11px; }
  .oi-checkout-topbar-trust small { font-size:10px; }
  .oi-checkout-page { padding:19px 0 36px !important; }
  .oi-co-head { align-items:flex-start; margin-bottom:15px; }
  .oi-co-page-title { font-size:23px; }
  .oi-co-page-sub { margin-top:4px; font-size:13px; }
  .oi-co-back { padding:7px 9px; font-size:12px; }
  .oi-co-block { margin-bottom:12px; padding:15px; border-radius:11px; }
  .oi-co-block-head { margin-bottom:12px; }
  .oi-co-delivery-types { grid-template-columns:1fr 1fr; gap:8px; }
  .oi-co-choice-inner { min-height:72px; padding:9px; gap:8px; }
  .oi-co-choice-inner > i { flex-basis:32px; width:32px; height:32px; }
  .oi-co-choice-text strong { font-size:12px; }
  .oi-co-choice-text small { font-size:10px; }
  .oi-co-card { padding:12px; }
  .oi-co-card-head { align-items:flex-start; }
  .oi-co-card-label strong { font-size:12px; }
  .oi-co-card-head a { font-size:11px; }
  .oi-co-ship-item { grid-template-columns:56px minmax(0,1fr); gap:10px; padding:10px; }
  .oi-co-ship-item-img { width:56px; height:56px; max-width:56px; max-height:56px; }
  .oi-co-ship-item-img img,.oi-co-ship-item img { max-width:54px; max-height:54px; }
  .oi-co-ship-item-body strong { font-size:13px; }
  .oi-co-ship-item-price { grid-column:2; justify-self:start; font-size:13px; }
  .oi-co-summary { padding:17px; }
  .oi-co-summary .oi-cart-summary-total strong { font-size:18px; }
  .oi-checkout-footer-inner.container { flex-wrap:wrap; gap:5px 8px; padding-top:12px; padding-bottom:12px; }
  .oi-checkout-footer-inner > small { width:100%; margin-left:0; }
}

/* Checkout address picker and mobile consent layout */
.oi-co-card-head > button[data-oi-checkout-address-open] {
  flex:0 0 auto;
  padding:0;
  border:0;
  background:transparent;
  color:#2f64d8;
  font:inherit;
  font-size:12px;
  font-weight:700;
  white-space:nowrap;
  cursor:pointer;
}
.oi-co-card-head > button[data-oi-checkout-address-open]:hover { color:#1d4fb7; text-decoration:underline; }
.oi-co-address-summary { overflow-wrap:anywhere; white-space:pre-line; line-height:1.55; }
.oi-checkout-shell #oi-addr-modal .oi-addr-modal-dialog { width:min(760px,100%); padding:22px 24px 20px; }
.oi-co-address-modal[hidden] { display:none !important; }
.oi-co-address-modal { position:fixed; inset:0; z-index:10990; display:flex; align-items:center; justify-content:center; padding:20px; }
.oi-co-address-backdrop { position:absolute; inset:0; width:100%; border:0; background:rgba(17,26,43,.48); cursor:default; }
.oi-co-address-dialog { position:relative; z-index:1; display:flex; flex-direction:column; width:min(760px,100%); max-height:min(820px,calc(100vh - 40px)); overflow:hidden; border:1px solid #e1e7f0; border-radius:16px; background:#fff; box-shadow:0 24px 70px rgba(18,35,62,.24); }
.oi-co-address-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:21px 24px 17px; border-bottom:1px solid #e9edf3; }
.oi-co-address-kicker { display:block; margin-bottom:5px; color:#3768d8; font-size:10px; font-weight:800; letter-spacing:.09em; }
.oi-co-address-head h2 { margin:0; color:#202b3e; font-size:21px; font-weight:700; }
.oi-co-address-x { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; border:1px solid #e4e9f1; border-radius:50%; background:#fff; color:#68758a; cursor:pointer; }
.oi-co-address-x:hover { border-color:#cbd8ed; background:#f6f9ff; color:#245edb; }
.oi-co-address-list { display:grid; gap:10px; min-height:90px; overflow:auto; padding:18px 24px; }
.oi-co-address-empty { display:grid; justify-items:center; gap:8px; padding:28px 14px; border:1px dashed #d7dfeb; border-radius:12px; color:#728096; text-align:center; }
.oi-co-address-empty i { color:#6b8ce0; font-size:22px; }
.oi-co-address-empty strong { color:#34445d; font-size:14px; }
.oi-co-address-card { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:14px 15px; border:1px solid #e1e6ee; border-radius:12px; background:#fff; transition:border-color .16s ease,background .16s ease,box-shadow .16s ease; }
.oi-co-address-card.is-selected { border-color:#6f94ed; background:#f5f8ff; box-shadow:0 0 0 2px rgba(47,102,223,.08); }
.oi-co-address-option { display:flex; align-items:flex-start; gap:12px; min-width:0; margin:0; cursor:pointer; }
.oi-co-address-option input { flex:0 0 18px; width:18px; height:18px; margin:3px 0 0; accent-color:#3568dc; }
.oi-co-address-copy { display:grid; gap:4px; min-width:0; }
.oi-co-address-copy strong { color:#26364e; font-size:14px; line-height:1.35; }
.oi-co-address-copy small { color:#66748a; font-size:12px; line-height:1.4; }
.oi-co-address-copy p { margin:0; color:#47566d; font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.oi-co-address-badges { display:flex; flex-wrap:wrap; gap:6px; margin-top:2px; }
.oi-co-address-badge { display:inline-flex; align-items:center; gap:5px; padding:4px 7px; border-radius:6px; background:#edf7f0; color:#327648; font-size:10px; font-weight:700; }
.oi-co-address-edit { display:inline-flex; align-items:center; gap:6px; align-self:start; padding:7px 9px; border:1px solid #dbe4f3; border-radius:8px; background:#fff; color:#3768d8; font-size:12px; font-weight:700; cursor:pointer; }
.oi-co-address-edit:hover { border-color:#9bb5ec; background:#f6f9ff; }
.oi-co-address-add { display:flex; align-items:center; justify-content:center; gap:9px; min-height:48px; margin:0 24px 17px; border:1px dashed #9eb5e6; border-radius:10px; background:#f8faff; color:#315fc6; font-size:13px; font-weight:700; cursor:pointer; }
.oi-co-address-add:hover { border-style:solid; background:#eff4ff; }
.oi-co-address-actions { display:flex; justify-content:flex-end; gap:10px; padding:15px 24px 20px; border-top:1px solid #e9edf3; background:#fff; }
.oi-co-address-actions button { min-width:130px; min-height:43px; padding:9px 15px; border-radius:8px; font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.oi-co-address-cancel { border:1px solid #dfe5ee; background:#fff; color:#526078; }
.oi-co-address-confirm { border:1px solid #2f66df; background:#2f66df; color:#fff; }
.oi-co-address-confirm:disabled { border-color:#c8d0dd; background:#c8d0dd; cursor:not-allowed; }
.oi-co-summary .oi-co-legal-consent { display:flex !important; align-items:flex-start; gap:10px; width:100%; min-width:0; box-sizing:border-box; }
.oi-co-summary .oi-co-legal-consent > input { flex:0 0 20px; width:20px; height:20px; }
.oi-co-summary .oi-co-legal-consent-copy { display:block !important; flex:1 1 auto; width:auto !important; min-width:0 !important; max-width:none !important; margin:0; white-space:normal; overflow-wrap:break-word; word-break:normal; }
.oi-checkout-shell .oi-co-addresses { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:stretch; }
.oi-checkout-shell .oi-co-addresses > div { min-width:0; }
.oi-checkout-shell .oi-co-addresses .oi-co-card { height:100%; padding:13px 15px; background:#fff; }
.oi-checkout-shell .oi-co-addresses .oi-co-card--soft { margin-top:0; }
.oi-checkout-shell .oi-co-addresses .oi-co-card-head { margin-bottom:10px; padding-bottom:9px; border-bottom:1px solid #e9edf4; }
.oi-checkout-shell .oi-co-addresses .oi-co-card-label strong { color:#263c62; font-size:13px; }
.oi-checkout-shell .oi-co-address-name { display:block; margin-bottom:4px; color:#1f2937; font-size:13px; line-height:1.35; overflow-wrap:break-word; }
.oi-checkout-shell .oi-co-addresses .oi-co-card-text { margin:0; color:#617087; font-size:12px; line-height:1.45; white-space:normal; overflow-wrap:break-word; }
.oi-checkout-shell .oi-co-summary #oi-checkout-legal-accept {
  -webkit-appearance:none !important; appearance:none !important; display:grid !important;
  position:relative !important; inset:auto !important; float:none !important;
  flex:0 0 20px !important; width:20px !important; min-width:20px !important;
  height:20px !important; min-height:20px !important; margin:2px 0 0 !important;
  padding:0 !important; border:2px solid #7b8ba4 !important; border-radius:5px !important;
  background:#fff !important; opacity:1 !important; visibility:visible !important;
  transform:none !important; clip:auto !important; clip-path:none !important;
  pointer-events:auto !important; cursor:pointer !important; z-index:1;
}
.oi-checkout-shell .oi-co-summary #oi-checkout-legal-accept:checked { border-color:#3164d8 !important; background:#3164d8 !important; }
.oi-checkout-shell .oi-co-summary #oi-checkout-legal-accept:checked::after { content:""; width:10px; height:6px; margin-top:-2px; border-bottom:2px solid #fff; border-left:2px solid #fff; transform:rotate(-45deg); }
@media (max-width:767px) { .oi-checkout-shell .oi-co-addresses { grid-template-columns:minmax(0,1fr); } }
@media (max-width:767px) {
  .oi-co-address-modal { align-items:flex-end; padding:0; }
  .oi-co-address-dialog { width:100%; max-height:calc(100vh - 12px); border-radius:16px 16px 0 0; }
  .oi-checkout-shell #oi-addr-modal { padding:0; align-items:stretch; }
  .oi-checkout-shell #oi-addr-modal .oi-addr-modal-dialog { width:100%; max-height:100%; min-height:100%; border-radius:0; padding:16px 14px calc(16px + env(safe-area-inset-bottom,0px)); }
  .oi-co-address-head { padding:17px 17px 14px; }
  .oi-co-address-head h2 { font-size:19px; }
  .oi-co-address-list { padding:14px 16px; }
  .oi-co-address-card { grid-template-columns:minmax(0,1fr); gap:9px; padding:12px; }
  .oi-co-address-edit { justify-self:end; }
  .oi-co-address-add { margin:0 16px 13px; }
  .oi-co-address-actions { padding:12px 16px calc(14px + env(safe-area-inset-bottom,0px)); }
  .oi-co-address-actions button { flex:1 1 0; min-width:0; }
}

/* Checkout — güvenli ödeme alanı ve ödeme penceresi */
.oi-co-block-head .oi-co-step:not(.oi-co-step--icon) { background:#2f66df; color:#fff; }

.oi-co-pay-option { position:relative; padding-right:46px; }
.oi-co-pay-option::after { content:""; position:absolute; top:50%; right:16px; width:20px; height:20px; margin-top:-10px; border:2px solid #cfd7e3; border-radius:50%; background:#fff; transition:border-color .15s ease, box-shadow .15s ease; }
.oi-co-pay-option:has(input:checked)::after { border-color:#2f66df; box-shadow:inset 0 0 0 4px #fff, inset 0 0 0 10px #2f66df; }

.oi-co-summary { border-top:3px solid #2f66df; }
.oi-co-summary .oi-cart-summary-total { align-items:baseline; padding:15px 0 4px; }
.oi-co-summary .oi-cart-summary-total strong { font-size:22px; letter-spacing:-.01em; }
.oi-co-summary .oi-co-legal-consent { margin-top:14px; border-radius:10px; }
.oi-co-summary .oi-cart-checkout { display:flex; align-items:center; justify-content:center; gap:9px; height:52px; margin-top:12px; border-radius:10px; font-size:16px; letter-spacing:.01em; transition:background .15s ease, box-shadow .15s ease, transform .15s ease; }
.oi-co-summary .oi-cart-checkout:hover:not(:disabled) { box-shadow:0 8px 20px rgba(47,102,223,.28); transform:translateY(-1px); }
.oi-co-summary .oi-cart-checkout > i { font-size:14px; }
.oi-co-trust { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:12px; padding:10px 12px; border-radius:10px; background:#f5f7fb; }
.oi-co-trust-cards { display:inline-flex; align-items:center; gap:8px; color:#6d7a8f; font-size:24px; line-height:1; }
.oi-co-trust-cards b { padding:3px 6px; border:1.5px solid #6d7a8f; border-radius:4px; font-size:10px; font-weight:800; letter-spacing:.04em; line-height:1; }
.oi-co-trust-ssl { display:inline-flex; align-items:center; gap:6px; color:#3d7a54; font-size:12px; font-weight:700; white-space:nowrap; }

.oi-pay-modal[hidden] { display:none !important; }
.oi-pay-modal { position:fixed; inset:0; z-index:10000; overflow:auto; padding:2vh 16px; background:rgba(15,23,42,.72); }
.oi-pay-modal-dialog { max-width:900px; margin:0 auto; overflow:hidden; border-radius:16px; background:#fff; box-shadow:0 24px 70px rgba(0,0,0,.3); }
.oi-pay-modal-head { display:flex; align-items:center; gap:12px; padding:14px 20px; border-bottom:1px solid #e5e9f0; }
.oi-pay-modal-icon { display:grid; flex:0 0 38px; width:38px; height:38px; place-items:center; border-radius:11px; background:#e9f7ef; color:#2f8a52; }
.oi-pay-modal-head > div { display:grid; gap:2px; min-width:0; }
.oi-pay-modal-head strong { color:#1c2a42; font-size:15px; }
.oi-pay-modal-head small { color:#64748b; font-size:12px; }
.oi-pay-modal-head > a { margin-left:auto; color:#2f64d8; font-size:13px; font-weight:700; white-space:nowrap; }
.oi-pay-modal-dialog iframe { display:block; width:100%; height:min(80vh,850px); border:0; }

@media (max-width:767px) {
  .oi-co-trust { flex-wrap:wrap; }
  .oi-pay-modal { padding:0; }
  .oi-pay-modal-dialog { min-height:100%; border-radius:0; }
  .oi-pay-modal-head { padding:12px 14px; }
  .oi-pay-modal-dialog iframe { height:calc(100vh - 64px); }
}

/* Product review preview and dedicated review feed */
.oi-reviews-overview{display:grid;grid-template-columns:minmax(0,1.3fr) 170px minmax(220px,.9fr);align-items:center;gap:24px;padding:25px 28px;border:1px solid #dbe5f5;border-radius:18px;background:linear-gradient(115deg,#f5f8ff 0%,#fff 76%)}
.oi-reviews-overview-intro{min-width:0}.oi-reviews-eyebrow,.oi-reviews-list-heading>div>span{color:#3264d8;font-size:11px;font-weight:800;letter-spacing:.1em}.oi-reviews-overview-intro h2{margin:5px 0 6px;color:#182945;font-size:24px;line-height:1.25}.oi-reviews-overview-intro p{margin:0;color:#617189;font-size:14px;line-height:1.5}.oi-reviews-verified-note{display:inline-flex;align-items:center;gap:7px;margin-top:15px;color:#48725c;font-size:12px;font-weight:650}.oi-reviews-overview-score{display:flex;align-items:center;gap:12px}.oi-reviews-overview-score>strong{color:#17294b;font-size:48px;font-weight:800;line-height:1}.oi-reviews-overview-score>div{display:grid;gap:5px}.oi-reviews-overview-score>div>span{display:flex;gap:2px;color:#eeab36;font-size:12px}.oi-reviews-overview-score small{color:#65758e;font-size:12px;white-space:nowrap}.oi-reviews-overview-bars{display:grid;gap:7px}.oi-reviews-overview-bar{display:grid;grid-template-columns:30px minmax(0,1fr) 28px;align-items:center;gap:8px;color:#63748b;font-size:12px}.oi-reviews-overview-bar>span{white-space:nowrap}.oi-reviews-overview-bar>span i{color:#e9aa3c;font-size:9px}.oi-reviews-overview-bar>div{height:7px;overflow:hidden;border-radius:99px;background:#e9edf4}.oi-reviews-overview-bar>div>span{display:block;height:100%;border-radius:99px;background:#3d6fe2}.oi-reviews-overview-bar>b{text-align:right;color:#465a76;font-size:11px;font-weight:700}
.oi-reviews-list-heading{display:flex;align-items:end;justify-content:space-between;gap:14px;margin:28px 0 14px}.oi-reviews-list-heading h3{margin:3px 0 0;color:#1c2b44;font-size:20px}.oi-reviews-list-heading>small{color:#718098;font-size:13px;white-space:nowrap}.oi-reviews-list{display:grid;gap:12px}.oi-review-entry{display:grid;grid-template-columns:42px minmax(0,1fr);gap:14px;padding:20px;border:1px solid #e1e8f2;border-radius:15px;background:#fff}.oi-review-entry-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#eaf0ff;color:#2e5dcc;font-size:17px;font-weight:800}.oi-review-entry-content{min-width:0}.oi-review-entry-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.oi-review-entry-person{display:flex;align-items:center;flex-wrap:wrap;gap:4px 12px}.oi-review-entry-person strong{color:#1e2c42;font-size:15px}.oi-review-entry-person span{display:inline-flex;align-items:center;gap:5px;color:#348558;font-size:11px;font-weight:700}.oi-review-entry-head time{color:#8491a3;font-size:12px;white-space:nowrap}.oi-review-entry-rating{display:flex;align-items:center;gap:8px;margin-top:8px}.oi-review-entry-stars{display:inline-flex;gap:2px;color:#eda933;font-size:13px}.oi-review-entry-rating b{color:#5b6980;font-size:12px}.oi-review-entry-content>p{margin:12px 0 0;color:#35455b;font-size:14px;line-height:1.7;overflow-wrap:anywhere}.oi-review-entry-variant{display:inline-flex;align-items:center;gap:7px;margin-top:14px;padding:6px 10px;border-radius:7px;background:#f3f6fa;color:#52647d;font-size:12px}.oi-review-entry-variant>span{color:#8290a1;font-weight:700}
a.oi-product-reviews-more{display:inline-flex;width:auto;min-width:240px;gap:10px;margin:20px auto 0;padding:0 20px;text-decoration:none}a.oi-product-reviews-more:hover{text-decoration:none;color:#174fca}.oi-review-page{padding:32px 0 80px;background:#f8faff}.oi-review-page .container{max-width:1200px}.oi-review-page-back{display:inline-flex;align-items:center;gap:7px;margin-bottom:20px;color:#4b6388;font-size:13px;font-weight:700;text-decoration:none}.oi-review-page-back:hover{color:#215ada;text-decoration:none}.oi-review-page-hero{display:flex;align-items:center;gap:18px;margin-bottom:22px;padding:20px;border:1px solid #e2e8f0;border-radius:16px;background:#fff}.oi-review-page-hero img{width:86px;height:86px;flex:0 0 86px;object-fit:contain;border:1px solid #e7edf5;border-radius:11px;background:#fff}.oi-review-page-hero span{color:#3264d8;font-size:11px;font-weight:800;letter-spacing:.1em}.oi-review-page-hero h1{margin:5px 0;color:#16283f;font-size:25px;line-height:1.3}.oi-review-page-hero p{margin:0;color:#6b7a91;font-size:13px}.oi-review-page-feed{margin-top:28px}.oi-review-page-feed h2{margin:0 0 15px;color:#1c2b44;font-size:21px}.oi-review-page-status{padding:20px;text-align:center;color:#65758b;font-size:13px}.oi-review-page-status[hidden]{display:none}.oi-review-page-retry{display:inline-flex;align-items:center;gap:7px;margin-top:9px;padding:8px 14px;border:1px solid #ccd9f1;border-radius:8px;background:#fff;color:#215ada;font-weight:700;cursor:pointer}.oi-review-page-sentinel{height:2px}
@media(max-width:991px){.oi-reviews-overview{grid-template-columns:minmax(0,1fr) minmax(210px,.8fr)}.oi-reviews-overview-intro{grid-column:1/-1}}
@media(max-width:600px){.oi-reviews-overview{grid-template-columns:1fr;gap:18px;padding:20px}.oi-reviews-overview-intro{grid-column:auto}.oi-reviews-overview-score>strong{font-size:42px}.oi-reviews-list-heading{align-items:flex-start;flex-direction:column;gap:5px}.oi-review-entry{grid-template-columns:34px minmax(0,1fr);gap:10px;padding:15px}.oi-review-entry-avatar{width:34px;height:34px;font-size:14px}.oi-review-entry-head{flex-direction:column;gap:4px}.oi-review-page{padding:22px 0 60px}.oi-review-page-hero{gap:12px;padding:14px}.oi-review-page-hero img{width:68px;height:68px;flex-basis:68px}.oi-review-page-hero h1{font-size:19px}a.oi-product-reviews-more{width:100%}}
.oi-review-entry-content>p{white-space:pre-wrap}

/* Kategori ağacının tek alt seviyesi: markalar. Mevcut menünün sade çizgisi. */
.oi-mega-layout{grid-template-columns:210px minmax(0,1fr);min-height:170px}
.oi-mega-layout.has-banner{grid-template-columns:210px minmax(0,1fr) 280px}
.oi-mega-rail{padding:25px 20px;background:#f8f9fa}
.oi-mega-rail>strong{display:block;color:#222c3e;font-size:17px;line-height:1.3}
.oi-mega-rail-top{display:inline-flex;align-items:center;gap:9px;margin:14px 0 0;padding:0;border:0;font-size:12px;font-weight:650}
.oi-mega-rail-top i{font-size:10px}
.oi-mega-main{min-width:0;padding:23px 29px}
.oi-mega-section-label{display:block;margin-bottom:10px;color:#66758b;font-size:12px;font-weight:700}
.oi-mega-cols{grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 18px}
.oi-mega-leaf{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:5px;font-size:14px;font-weight:600}
.oi-mega-leaf i{color:#a1adbd;font-size:10px}
.oi-mega-leaf:hover,.oi-mega-leaf:focus-visible{padding-left:11px;background:#f3f6fc;color:#315fc6;text-decoration:none}
.oi-mega-promo{padding:12px}.oi-mega-banner{min-height:170px}
@media(max-width:1199px){.oi-mega-layout.has-banner{grid-template-columns:180px minmax(0,1fr) 230px}.oi-mega-cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:991px){.oi-mega-layout,.oi-mega-layout.has-banner{grid-template-columns:minmax(0,1fr)}.oi-mega-promo{display:none}}

/* Mağaza: model filtresi */
.oi-hb-model-list .oi-hb-model-brand{display:block;margin:10px 0 4px;color:#7a8698;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.oi-hb-model-list .oi-hb-model-brand:first-child{margin-top:0}
.oi-hb-model-list .oi-hb-check small{color:#97a1b0;font-size:11px;font-weight:600}

.oi-shop-search-note{margin:-4px 0 14px;padding:9px 12px;border-radius:9px;background:#f3f7ff;color:#40506a;font-size:13px}.oi-shop-search-note strong{color:#2350b8}

/* Katalog kartı görseli: büyütme yok, kart içinde boşluklu ve tamamen görünür. */
.oi-product-card.has-hover-box-shadow .oi-card-img,
#oi-shop-products .oi-card-img {
  padding: 10px 14px;
}
.oi-product-card.has-hover-box-shadow .oi-prd-img,
.oi-product-card.has-hover-box-shadow .oi-hover-img,
#oi-shop-products .oi-prd-img,
#oi-shop-products .oi-hover-img {
  max-width: 100%;
  max-height: 100%;
  transform: none;
}
@media (max-width: 767px) {
  .oi-product-card.has-hover-box-shadow .oi-card-img,
  #oi-shop-products .oi-card-img {
    padding: 6px 8px;
  }
}