﻿/* ============================================================
   TEMSAN Muhendislik — temsan-overrides.css
   Root.Master'da body sonunda yuklenir (App_Themes auto-inject'i ezer)
   Tarih: 2026-08-30
   ============================================================ */

/* --- 0. RESET: nopCommerce 1.90 legacy 1rem=24px fix --- */
html { font-size: 16px !important; }
body {
  font-family: 'Manrope', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  color: #333 !important;
  line-height: 1.6 !important;
  background: #fff !important;
}

/* --- 1. BRAND TOKENS (CSS custom properties) --- */
:root {
  /* --- a5 statik tasariminin token seti ile BIREBIR hizalandi --- */
  --brand: #FF6600;
  --brand-600: #E75C00;
  --brand-700: #C94F00;
  --brand-metin: #BE4A00;
  --brand-soft: #FFF3EA;
  --brand-dark: #E75C00;            /* geriye donuk uyum */
  --btn-birincil-zemin: #FF6600;
  --btn-birincil-metin: #FFFFFF;
  --navy: #104066;
  --navy-800: #0C3151;
  --navy-900: #08243D;
  --navy-600: #1A5885;
  --navy-soft: #EAF1F7;
  --navy-dark: #0C3050;             /* geriye donuk uyum */
  /* Notr */
  --ink: #16202A;
  --ink-2: #3C4854;
  --muted: #64707C;
  --line: #E3E8ED;
  --line-2: #EFF2F5;
  --bg: #FFFFFF;
  --bg-soft: #F5F7FA;
  --bg-soft-2: #EDF1F5;
  --bg-warm: #FFF8F0;
  --white: #FFFFFF;
  /* Durum */
  --ok: #1E874B;
  --warn: #B4690E;
  --err: #C0362C;
  /* Tipografi */
  --fs-xs: .75rem;
  --fs-sm: .8125rem;
  --fs-base: .9375rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;
  /* Aralik olcegi (4px tabanli) */
  --s-1: .25rem;  --s-2: .5rem;   --s-3: .75rem;  --s-4: 1rem;
  --s-5: 1.25rem; --s-6: 1.5rem;  --s-8: 2rem;    --s-10: 2.5rem;
  --s-12: 3rem;   --s-16: 4rem;   --s-20: 5rem;   --s-24: 6rem;
  /* Bicim */
  --radius: 4px;
  --radius-lg: 8px;
  --shadow-sm: 0 1px 2px rgba(16,32,42,.06), 0 1px 3px rgba(16,32,42,.05);
  --shadow: 0 4px 12px rgba(16,32,42,.07), 0 2px 4px rgba(16,32,42,.04);
  --shadow-md: 0 4px 12px rgba(16,32,42,.07), 0 2px 4px rgba(16,32,42,.04);
  --shadow-lg: 0 18px 40px rgba(16,32,42,.12), 0 4px 12px rgba(16,32,42,.06);
  /* Hareket */
  --ease: cubic-bezier(.16,.68,.43,.99);
  --dur: .24s;
  /* Yerlesim */
  --container: 1400px;
  --container-pad: clamp(1rem, 4vw, 2.5rem);
  --header-h: 76px;
}

/* --- 2. LAYOUT --- */
.master-wrapper-content {
  max-width: var(--container) !important;
  margin-inline: auto !important;
  padding-inline: var(--container-pad) !important;
}

/* --- 3. TYPOGRAPHY --- */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Manrope', system-ui, sans-serif !important;
  color: var(--navy) !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
}

a { color: var(--brand) !important; text-decoration: none !important; }
a:hover { color: var(--brand-dark) !important; }

/* --- 4. PAGES TITLE BANNER --- */
.sections,
#ctl00_ctl00_cph1_divSection,
[id*="cph1_divSection"] {
  display: block !important;
  background: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}
#ctl00_ctl00_cph1_divSection::before,
.sections::before {
  display: none !important;
}
body.home-page .sections,
body.home-page #ctl00_ctl00_cph1_divSection { display: none !important; }
.pages-title {
  background: var(--bg-soft) !important;
  /* a5'te bant tam genislik; metin icerik kapsayicisiyla ayni hizada durur.
     Kutu genisligindeyken baslik bandin sol kenarina yapisik goruluyordu. */
  /* Iki yana simetrik tasma: hem LTR hem RTL'de dogru calisir
     (tek tarafli margin RTL'de bandi ekran disina kaydiriyordu). */
  width: auto !important;
  max-width: none !important;
  margin-left: calc(-50vw + 50%) !important;
  margin-right: calc(-50vw + 50%) !important;
  padding-block: 40px 36px !important;
  /* Ic bosluk Bootstrap'in .container genisligini izler; boylece baslik her
     ekran genisliginde icerikle ayni hizada baslar (kirilma noktalari altta). */
  padding-inline: max(15px, calc((100vw - 1140px) / 2 + 15px)) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
  overflow: hidden !important;
}
.pages-title::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(620px 220px at 92% -20%, rgba(255,102,0,.12), transparent 70%) !important;
  pointer-events: none !important;
}
.pages-title .container { position: relative !important; z-index: 1 !important; }
.pages-title h1,
.pages-title h2 {
  font-size: 0 !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 !important;
  line-height: 1.2 !important;
}
.pages-title h1 span {
  font-size: 28px !important;
  color: var(--navy) !important;
}
.pages-title h1 br { display: none !important; }
.breadcrumb-nav {
  list-style: none !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  font-size: 13px !important;
}
.breadcrumb-nav a {
  color: var(--muted) !important;
  text-decoration: none !important;
}
.breadcrumb-nav a:hover { color: var(--brand) !important; }
.breadcrumb-nav a + a::before {
  content: "/" !important;
  color: var(--line) !important;
  margin-right: 8px !important;
}

/* --- 5. CATEGORY / PRODUCT GRIDS --- */
.sub-category-grid,
.product-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
}
.sub-category-grid > table,
.product-grid > table,
.sub-category-grid > table > tbody,
.product-grid > table > tbody,
.sub-category-grid > table > tbody > tr,
.product-grid > table > tbody > tr {
  display: contents !important;
}
@media (max-width: 1023px) {
  .sub-category-grid,
  .product-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
  .sub-category-grid,
  .product-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 479px) {
  .sub-category-grid,
  .product-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 12px !important; }
}

.item-box {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  background: var(--white) !important;
  transition: box-shadow .3s, transform .3s !important;
  position: relative !important;
}
.item-box::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.item-box:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.item-box:hover::before { transform: scaleX(1) !important; }
.item-box .picture {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.item-box .picture img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
  display: block !important;
  transition: transform .5s !important;
}
.item-box:hover .picture img { transform: scale(1.05) !important; }
.item-box .details {
  padding: 16px 20px 20px !important;
}
.item-box .product-title a,
.item-box .title a {
  color: var(--navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
}
.item-box .product-title a:hover,
.item-box .title a:hover {
  color: var(--brand) !important;
}
.item-box .prices,
.item-box .add-info,
.item-box .buttons { display: none !important; }

/* Subcategory card body */
.sub-category-body {
  padding: 16px 20px 20px !important;
}
.sub-category-body .category-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  margin: 0 0 6px !important;
  line-height: 1.35 !important;
}
.sub-category-body .category-title a {
  color: var(--navy) !important;
  text-decoration: none !important;
}
.item-box:hover .category-title a { color: var(--brand) !important; }
.sub-category-desc {
  font-size: 13px !important;
  color: var(--muted) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.sub-category-arrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--brand) !important;
  transition: gap .2s !important;
}
.item-box:hover .sub-category-arrow { gap: 8px !important; }

/* --- 5B. SIDEBAR CATEGORY NAVIGATION --- */
aside.departments {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: #fff !important;
  position: sticky !important;
  top: 100px !important;
  overflow: hidden !important;
}
aside.departments aside.departments {
  border: none !important;
  border-radius: 0 !important;
  position: static !important;
}
aside.departments .list-group {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
aside.departments .list-group li {
  margin: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
aside.departments .list-group li:last-child { border-bottom: none !important; }
html body aside.departments .list-group li a {
  display: block !important;
  padding: 10px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #3C4854 !important;
  background: #fff !important;
  text-decoration: none !important;
  transition: background .15s, color .15s !important;
}
html body aside.departments .list-group li a:hover {
  background: #F5F7FA !important;
  color: var(--brand) !important;
}
html body aside.departments .list-group li.active a {
  background: var(--navy) !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
  font-size: 13px !important;
}
html body aside.departments .list-group li.inactive a {
  padding-left: 24px !important;
  margin-left: 0 !important;
}
html body aside.departments .list-group li.inactive {
  margin-left: 0 !important;
}

/* --- 6. CATEGORY DESCRIPTION (ic sayfa icerigi) --- */
.category-description {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: var(--ink-2) !important;
}
.category-description h2 { font-size: 24px !important; margin-top: 32px !important; }
.category-description h3 { font-size: 20px !important; margin-top: 24px !important; }
.category-description img { max-width: 100% !important; height: auto !important; border-radius: var(--radius) !important; }

/* --- 7. CONTACT PAGE --- */
.contact-page input[type="text"],
.contact-page input[type="email"],
.contact-page textarea,
.contact-page select {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  padding: 10px 14px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  transition: border-color .2s !important;
}
.contact-page input:focus,
.contact-page textarea:focus {
  border-color: var(--brand) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255, 102, 0, .12) !important;
}

/* --- 8. BUTTONS --- */
.btn-primary,
.btn-soft-success,
input[type="submit"],
.product-page .add-to-cart-button,
button.btn {
  background: var(--brand) !important;
  border-color: var(--brand) !important;
  color: #fff !important;
  border-radius: var(--radius) !important;
  font-family: 'Manrope', sans-serif !important;
  font-weight: 600 !important;
  transition: background .2s !important;
}
.btn-primary:hover,
.btn-soft-success:hover,
input[type="submit"]:hover {
  background: var(--brand-dark) !important;
  border-color: var(--brand-dark) !important;
}

/* --- 9. WHATSAPP FLOATING BUTTON --- */
.pulse-button-w {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  z-index: 9999 !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  background: #25D366 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 4px 12px rgba(37, 211, 102, .35) !important;
  transition: transform .2s !important;
}
.pulse-button-w::before {
  content: '\f232' !important;
  font-family: 'Font Awesome 5 Brands', 'Font Awesome 6 Brands', FontAwesome !important;
  font-size: 28px !important;
  color: #fff !important;
  font-weight: 400 !important;
}
.pulse-button-w:hover {
  transform: scale(1.1) !important;
}

/* --- 10. DESKTOP SIDEBAR (Teklif Iste) --- */
.m-go-to {
  position: fixed !important;
  right: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 999 !important;
}
.m-go-to .btn {
  background: var(--brand) !important;
  color: #fff !important;
  border-radius: var(--radius) 0 0 var(--radius) !important;
  padding: 8px 14px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}
.m-go-to .btn:hover {
  background: var(--brand-dark) !important;
}

/* --- 11. MOBILE ACTION BAR --- */
.m-action-bar {
  display: none !important;
}
@media (max-width: 768px) {
  .m-action-bar {
    display: flex !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 10000 !important;
    background: var(--navy) !important;
    justify-content: stretch !important;
    box-shadow: 0 -2px 12px rgba(0,0,0,.15) !important;
  }
  .m-action-bar__btn {
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 4px !important;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    gap: 2px !important;
    transition: background .2s !important;
  }
  .m-action-bar__btn:hover,
  .m-action-bar__btn:active {
    background: rgba(255,255,255,.1) !important;
    color: #fff !important;
  }
  .m-action-bar__btn--primary {
    background: var(--brand) !important;
  }
  .m-action-bar__btn--primary:hover {
    background: var(--brand-dark) !important;
  }
  .m-action-bar__icon {
    font-size: 20px !important;
    line-height: 1 !important;
  }
  .m-action-bar__label {
    font-size: 10px !important;
    letter-spacing: .02em !important;
  }
  /* WA floating gizle (mobilde bar var) */
  .pulse-button-w {
    bottom: 72px !important;
  }
  /* Body alt padding (bar arkasinda kalmasin) */
  body { padding-bottom: 60px !important; }
}

/* --- 12. FOOTER OVERRIDES --- */
footer,
.footer-wrapper {
  font-family: 'Manrope', sans-serif !important;
}
footer a { color: rgba(255,255,255,.8) !important; }
footer a:hover { color: #fff !important; }

/* --- 13. HEADER OVERRIDES --- */
.top-header {
  background: var(--navy) !important;
  color: #fff !important;
  font-size: 13px !important;
}
.top-header a { color: rgba(255,255,255,.9) !important; }
.top-header a:hover { color: #fff !important; }

/* --- 14. BREADCRUMB --- */
.breadcrumb {
  background: transparent !important;
  padding: 12px 0 !important;
  font-size: 13px !important;
}
.breadcrumb a { color: var(--muted) !important; }
.breadcrumb a:hover { color: var(--brand) !important; }

/* --- 15. MISC --- */
.blog-posts .post { border-bottom: 1px solid var(--line) !important; padding-bottom: 24px !important; margin-bottom: 24px !important; }
.pager { text-align: center !important; margin: 32px 0 !important; }
.pager a, .pager span {
  display: inline-block !important;
  padding: 6px 14px !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  margin: 0 2px !important;
  font-size: 14px !important;
}
.pager .current-page {
  background: var(--brand) !important;
  color: #fff !important;
  border-color: var(--brand) !important;
}

/* --- 16. KVKK COOKIE CONSENT brand uyumu --- */
#fbcc-banner { border-top-color: var(--brand) !important; }
.fbcc-btn:hover { border-color: var(--brand) !important; }
#fbcc-modal .fbcc-head h3 { color: var(--navy) !important; }
.fbcc-sw input:checked + .fbcc-sl { background: var(--brand) !important; }
.fbcc-sw input:disabled + .fbcc-sl { background: #F0C8A8 !important; }
.fbcc-always { color: var(--navy) !important; }
.fbcc-reopen-fab { background: var(--navy) !important; }

/* =============================================================
   17. TEMSAN HEADER (th-*)
   ============================================================= */

/* --- Topbar --- */
.th-topbar {
  background: var(--navy) !important;
  color: #fff !important;
  font-size: 13px !important;
  padding: 6px 0 !important;
  border: none !important;
}
.th-container {
  max-width: var(--container) !important;
  margin: 0 auto !important;
  padding: 0 var(--container-pad) !important;
}
.th-topbar .th-container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
}
.th-topbar__left {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
}
.th-topbar__left a,
.th-topbar__left span {
  color: rgba(255,255,255,.9) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  font-size: 13px !important;
}
.th-topbar__left a:hover { color: #fff !important; }
.th-topbar__left i { font-size: 13px !important; color: var(--brand) !important; }
.th-topbar__hours i { color: var(--brand) !important; }
.th-topbar__right {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}
.th-topbar__right a {
  color: rgba(255,255,255,.8) !important;
  text-decoration: none !important;
  font-size: 15px !important;
  transition: color .2s !important;
}
.th-topbar__right a:hover { color: #fff !important; }

/* --- Main Navbar --- */
.th-navbar {
  background: #fff !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
  position: relative !important;
  z-index: 1000 !important;
}
.th-navbar .th-container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 80px !important;
}
.th-navbar.th-sticky {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 9990 !important;
  animation: thSlideDown .3s ease !important;
}
@keyframes thSlideDown { from { transform: translateY(-100%); } to { transform: translateY(0); } }
.th-logo { flex-shrink: 0 !important; }
.th-logo img {
  height: 56px !important;
  width: auto !important;
  display: block !important;
}

/* --- Desktop Menu --- */
.th-nav { flex: 1 !important; display: flex !important; justify-content: center !important; }
.th-menu {
  display: flex !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}
.th-menu > li { position: relative !important; }
.th-menu > li > a {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 8px 16px !important;
  color: var(--ink) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  transition: color .2s !important;
  white-space: nowrap !important;
}
.th-menu > li > a:hover,
.th-menu > li:hover > a { color: var(--brand) !important; }
.th-dd-icon { font-size: 10px !important; margin-left: 2px !important; transition: transform .2s !important; }
.th-dd:hover .th-dd-icon { transform: rotate(180deg) !important; }

/* --- Dropdown --- */
.th-dd__list {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  background: #fff !important;
  min-width: 220px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  border-radius: 0 0 var(--radius) var(--radius) !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 8px 0 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(8px) !important;
  transition: all .2s !important;
  z-index: 100 !important;
}
.th-dd:hover > .th-dd__list {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}
.th-dd__list li a {
  display: block !important;
  padding: 8px 20px !important;
  color: var(--ink) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background .15s, color .15s !important;
}
.th-dd__list li a:hover {
  background: var(--bg-soft) !important;
  color: var(--brand) !important;
}

/* --- Mega Menu --- */
.th-mega {
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(8px) !important;
  background: #fff !important;
  width: 820px !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.12) !important;
  border-radius: 0 0 var(--radius-lg) var(--radius-lg) !important;
  padding: 28px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: all .25s !important;
  z-index: 100 !important;
}
.th-mega-parent:hover > .th-mega {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateX(-50%) translateY(0) !important;
}
.th-mega__grid {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr 200px !important;
  gap: 24px !important;
}
.th-mega__col h4 {
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  color: var(--navy) !important;
  margin: 0 0 10px !important;
  padding-bottom: 8px !important;
  border-bottom: 2px solid var(--brand) !important;
}
.th-mega__col ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.th-mega__col ul li a {
  display: block !important;
  padding: 5px 0 !important;
  color: var(--ink-2) !important;
  font-size: 13.5px !important;
  text-decoration: none !important;
  transition: color .15s !important;
}
.th-mega__col ul li a:hover { color: var(--brand) !important; }
.th-mega__cta {
  background: var(--bg-soft) !important;
  border-radius: var(--radius) !important;
  padding: 20px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}
.th-mega__cta strong {
  font-size: 16px !important;
  color: var(--navy) !important;
}
.th-mega__cta p {
  font-size: 13px !important;
  color: var(--ink-2) !important;
  margin: 6px 0 12px !important;
}

/* --- Actions --- */
.th-actions {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-shrink: 0 !important;
}
.th-icon-btn {
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  font-size: 18px !important;
  color: var(--ink) !important;
  padding: 8px !important;
  transition: color .2s !important;
}
.th-icon-btn:hover { color: var(--brand) !important; }
.th-hamburger { display: none !important; }

/* --- Buttons --- */
.th-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 10px 22px !important;
  border-radius: var(--radius) !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  border: 2px solid transparent !important;
  transition: all .2s !important;
  white-space: nowrap !important;
}
.th-btn--primary {
  background: var(--brand) !important;
  color: #fff !important;
  border-color: var(--brand) !important;
}
.th-btn--primary:hover {
  background: var(--brand-dark) !important;
  border-color: var(--brand-dark) !important;
  color: #fff !important;
}
.th-btn--outline {
  background: transparent !important;
  color: var(--navy) !important;
  border-color: var(--navy) !important;
}
.th-btn--outline:hover {
  background: var(--navy) !important;
  color: #fff !important;
}
.th-btn--outline-w {
  background: transparent !important;
  color: #fff !important;
  border-color: rgba(255,255,255,.5) !important;
}
.th-btn--outline-w:hover {
  background: rgba(255,255,255,.1) !important;
  border-color: #fff !important;
  color: #fff !important;
}
.th-btn--lg { padding: 14px 28px !important; font-size: 15px !important; }
.th-btn--full { width: 100% !important; }
.th-cta-btn { padding: 8px 20px !important; font-size: 13px !important; }

/* --- Search Overlay --- */
.th-search-overlay {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  background: rgba(0,0,0,.6) !important;
  z-index: 99999 !important;
  display: none !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding-top: 120px !important;
}
.th-search-overlay--open {
  display: flex !important;
}
.th-search-overlay__inner {
  background: #fff !important;
  border-radius: var(--radius-lg) !important;
  padding: 24px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: 90% !important;
  max-width: 600px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,.2) !important;
}
.th-search-overlay__inner .srch { display: block !important; flex: 1 !important; }
.th-search-overlay__inner input[type="text"] {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 2px solid var(--line) !important;
  border-radius: var(--radius) !important;
  font-size: 16px !important;
  font-family: 'Manrope', sans-serif !important;
}
.th-search-overlay__inner input[type="text"]:focus {
  border-color: var(--brand) !important;
  outline: none !important;
}

/* --- Mobile Menu --- */
.th-overlay {
  position: fixed !important;
  inset: 0 !important;
  background: rgba(0,0,0,.5) !important;
  z-index: 99990 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transition: all .3s !important;
}
.th-overlay--open { opacity: 1 !important; visibility: visible !important; }
.th-mmenu {
  position: fixed !important;
  top: 0 !important; right: -320px !important; bottom: 0 !important;
  width: 320px !important;
  background: #fff !important;
  z-index: 99995 !important;
  display: flex !important;
  flex-direction: column !important;
  transition: right .3s ease !important;
  overflow-y: auto !important;
}
.th-mmenu--open { right: 0 !important; }
.th-mmenu__top {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid var(--line) !important;
}
.th-mmenu__top button {
  background: none !important;
  border: none !important;
  font-size: 22px !important;
  cursor: pointer !important;
  color: var(--ink) !important;
}
.th-mmenu__body {
  flex: 1 !important;
  padding: 8px 0 !important;
  overflow-y: auto !important;
}
.th-mmenu__body > ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.th-mmenu__body > ul > li > a,
.th-mmenu__body > ul > li > button {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 12px 20px !important;
  color: var(--ink) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  background: none !important;
  border: none !important;
  cursor: pointer !important;
  text-align: left !important;
}
.th-mmenu__body > ul > li > a:hover,
.th-mmenu__body > ul > li > button:hover { background: var(--bg-soft) !important; }
.th-macc > button i { font-size: 10px !important; transition: transform .2s !important; }
.th-macc--open > button i { transform: rotate(180deg) !important; }
.th-macc > ul {
  display: none !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: var(--bg-soft) !important;
}
.th-macc--open > ul { display: block !important; }
.th-macc > ul li a {
  display: block !important;
  padding: 8px 20px 8px 36px !important;
  color: var(--ink-2) !important;
  font-size: 14px !important;
  text-decoration: none !important;
}
.th-macc > ul li a:hover { color: var(--brand) !important; }
.th-mmenu__bottom {
  padding: 16px 20px !important;
  border-top: 1px solid var(--line) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

/* --- Responsive Header --- */
@media (max-width: 992px) {
  .th-nav { display: none !important; }
  .th-hamburger { display: block !important; }
  .th-hide-m { display: none !important; }
  .th-topbar__left { gap: 12px !important; }
}

/* =============================================================
   18. TEMSAN FOOTER (tf-*)
   ============================================================= */

.tf {
  font-family: 'Manrope', sans-serif !important;
}
.tf-container {
  max-width: var(--container) !important;
  margin: 0 auto !important;
  padding: 0 var(--container-pad) !important;
}

/* --- CTA &#351;eridi --- */
.tf-cta {
  background: var(--navy) !important;
  padding: 56px 0 !important;
}
.tf-cta .tf-container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 32px !important;
  flex-wrap: wrap !important;
}
.tf-cta__text h2 {
  color: #fff !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  margin: 0 0 8px !important;
}
.tf-cta__text p {
  color: rgba(255,255,255,.75) !important;
  font-size: 15px !important;
  margin: 0 !important;
}
.tf-cta__buttons {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

/* --- Main area --- */
.tf-main {
  background: var(--navy-dark) !important;
  padding: 56px 0 !important;
  color: rgba(255,255,255,.85) !important;
}
.tf-grid {
  display: grid !important;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr !important;
  gap: 40px !important;
}
.tf-col h3 {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  margin: 0 0 16px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--brand) !important;
}
.tf-col ul {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tf-col ul li { margin-bottom: 6px !important; }
.tf-col ul li a {
  color: rgba(255,255,255,.75) !important;
  text-decoration: none !important;
  font-size: 14px !important;
  transition: color .2s !important;
}
.tf-col ul li a:hover { color: #fff !important; }
.tf-col--brand p {
  color: rgba(255,255,255,.7) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 12px 0 16px !important;
}
.tf-logo img {
  height: 48px !important;
  width: auto !important;
  filter: brightness(0) invert(1) !important;
}
.tf-social {
  display: flex !important;
  gap: 10px !important;
}
.tf-social a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.1) !important;
  color: #fff !important;
  font-size: 16px !important;
  text-decoration: none !important;
  transition: background .2s !important;
}
.tf-social a:hover { background: var(--brand) !important; color: #fff !important; }

/* --- Contact list --- */
.tf-contact li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-bottom: 12px !important;
  font-size: 14px !important;
}
.tf-contact li i {
  color: var(--brand) !important;
  font-size: 14px !important;
  margin-top: 3px !important;
  flex-shrink: 0 !important;
}
.tf-contact li a {
  color: rgba(255,255,255,.8) !important;
  text-decoration: none !important;
}
.tf-contact li a:hover { color: #fff !important; }

/* --- Bottom bar --- */
.tf-bottom {
  background: #071E30 !important;
  padding: 16px 0 !important;
}
.tf-bottom .tf-container {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}
.tf-copyright {
  color: rgba(255,255,255,.6) !important;
  font-size: 13px !important;
  margin: 0 !important;
}
.tf-legal {
  display: flex !important;
  gap: 16px !important;
}
.tf-legal a {
  color: rgba(255,255,255,.6) !important;
  font-size: 13px !important;
  text-decoration: none !important;
}
.tf-legal a:hover { color: #fff !important; }

/* --- Scroll top --- */
.cd-top {
  position: fixed !important;
  bottom: 24px !important;
  left: 24px !important;
  z-index: 9998 !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: var(--navy) !important;
  color: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 18px !important;
  text-decoration: none !important;
  box-shadow: var(--shadow-md) !important;
  transition: background .2s !important;
}
.cd-top:hover { background: var(--brand) !important; color: #fff !important; }

/* --- Responsive Footer --- */
@media (max-width: 992px) {
  .tf-grid { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
  .tf-cta .tf-container { flex-direction: column !important; text-align: center !important; }
  .tf-cta__buttons { justify-content: center !important; }
}
@media (max-width: 600px) {
  .tf-grid { grid-template-columns: 1fr !important; gap: 28px !important; }
  .tf-bottom .tf-container { flex-direction: column !important; text-align: center !important; }
  .tf-cta__text h2 { font-size: 22px !important; }
}

/* --- Eski tema class'larini gizle --- */
.top-header:not(.th-topbar),
.main-nav:not(.th-navbar),
.navigation:not(.th-nav) { /* eski tema header override */ }
header:not(.th) > .top-header { display: none !important; }
header:not(.th) > .main-nav { display: none !important; }

/* =============================================================
   19. TEMSAN HOMEPAGE (tm-*)
   ============================================================= */

/* --- Hero --- */
.tm-hero {
  position: relative !important;
  background: #fff !important;
  overflow: hidden !important;
  height: clamp(420px, 56vh, 580px) !important;
  display: flex !important;
  align-items: center !important;
}
.tm-hero__bg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
}
.tm-hero__bg img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: right center !important;
}
.tm-hero__overlay {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: linear-gradient(88deg,
    rgba(255,255,255,.72) 0%,
    rgba(255,255,255,.45) 30%,
    rgba(255,255,255,.12) 55%,
    rgba(255,255,255,0) 100%) !important;
}
.tm-hero .th-container {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
}
.tm-hero__ic {
  max-width: 660px !important;
}
.tm-hero__etiket {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 12px !important;
}
.tm-hero__etiket::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}
.tm-hero__baslik {
  color: var(--ink) !important;
  font-size: clamp(2rem, 1.2rem + 3.4vw, 3.5rem) !important;
  margin-bottom: 8px !important;
  letter-spacing: -.025em !important;
  line-height: 1.1 !important;
}
.tm-hero__alt {
  color: var(--ink-2) !important;
  font-size: 18px !important;
  max-width: 52ch !important;
  margin-bottom: 28px !important;
  font-weight: 500 !important;
}
.tm-hero__btn {
  display: flex !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
}
@media (max-width: 767px) {
  .tm-hero { height: clamp(340px, 50vh, 440px) !important; }
  .tm-hero__overlay {
    background: linear-gradient(180deg,
      rgba(255,255,255,.85) 0%,
      rgba(255,255,255,.6) 60%,
      rgba(255,255,255,.3) 100%) !important;
  }
  .tm-hero__baslik { font-size: 2rem !important; }
  .tm-hero__alt { font-size: 16px !important; margin-bottom: 20px !important; }
}

/* --- Hero-alti serit --- */
.tm-serit {
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
}
.tm-serit__izgara {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
}
.tm-serit__oge {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 24px 20px !important;
  color: var(--muted) !important;
  border-right: 1px solid var(--line) !important;
}
.tm-serit__oge:last-child { border-right: 0 !important; }
.tm-serit__ikon {
  font-size: 26px !important;
  color: var(--brand) !important;
  flex: none !important;
  width: 26px !important;
  text-align: center !important;
}
.tm-serit__oge strong {
  display: block !important;
  color: var(--ink) !important;
  font-size: 15px !important;
  line-height: 1.3 !important;
}
.tm-serit__oge span {
  font-size: 13px !important;
  color: var(--muted) !important;
}
@media (max-width: 1023px) {
  .tm-serit__izgara { grid-template-columns: 1fr 1fr !important; }
  .tm-serit__oge:nth-child(2n) { border-right: 0 !important; }
  .tm-serit__oge:nth-child(-n+2) { border-bottom: 1px solid var(--line) !important; }
}
@media (max-width: 479px) {
  .tm-serit__izgara { grid-template-columns: 1fr !important; }
  .tm-serit__oge { border-right: 0 !important; border-bottom: 1px solid var(--line) !important; }
  .tm-serit__oge:last-child { border-bottom: 0 !important; }
}

/* --- Secilmis Urunler --- */
.tm-urunler {
  padding: clamp(3rem, 1.5rem + 5vw, 5rem) 0 !important;
  background: #fff !important;
}
.tm-etiket {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 10px !important;
}
.tm-etiket::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}
.tm-urunler__baslik {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  flex-wrap: wrap !important;
  margin-bottom: 40px !important;
}
.tm-urunler__baslik h2 {
  font-size: clamp(1.5rem, 1rem + 1.7vw, 2.25rem) !important;
  margin: 0 !important;
  color: var(--navy) !important;
}
.tm-urunler__grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 1023px) {
  .tm-urunler__grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
  .tm-urunler__grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 479px) {
  .tm-urunler__grid { grid-template-columns: 1fr !important; }
}

/* ea-cat-card styling (DB kategori kartlari) */
.ea-cat-card {
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  text-decoration: none !important;
  color: inherit !important;
  position: relative !important;
  transition: box-shadow .3s, transform .3s !important;
}
.ea-cat-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
  color: inherit !important;
}
.ea-cat-card::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.ea-cat-card:hover::before { transform: scaleX(1) !important; }
.ea-cat-card__media {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.ea-cat-card__media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
  transition: transform .5s !important;
}
.ea-cat-card:hover .ea-cat-card__media img { transform: scale(1.05) !important; }
.ea-cat-card__body {
  padding: 16px 20px 20px !important;
}
.ea-cat-card__body .ea-label {
  display: none !important;
}
.ea-cat-card__body h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 6px !important;
  line-height: 1.35 !important;
}
.ea-cat-card:hover h3 { color: var(--brand) !important; }
.ea-cat-card__body p {
  font-size: 13px !important;
  color: var(--muted) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}
.ea-cat-card__arrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-top: 10px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--brand) !important;
}
.ea-cat-card:hover .ea-cat-card__arrow { gap: 8px !important; }

/* Product card styling */
.tm-urunler .item-box {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  overflow: hidden !important;
  background: #fff !important;
  transition: box-shadow .3s, transform .3s !important;
  position: relative !important;
}
.tm-urunler .item-box:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.tm-urunler .item-box::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transition: transform .3s !important;
}
.tm-urunler .item-box:hover::before { transform: scaleX(1) !important; }
.tm-urunler .item-box .picture {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
}
.tm-urunler .item-box .picture img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
  transition: transform .5s !important;
}
.tm-urunler .item-box:hover .picture img { transform: scale(1.05) !important; }
.tm-urunler .item-box .product-title a {
  color: var(--navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
}
.tm-urunler .item-box .product-title a:hover { color: var(--brand) !important; }
.tm-urunler .item-box .prices,
.tm-urunler .item-box .add-info,
.tm-urunler .item-box .buttons { display: none !important; }

/* --- Eski anasayfa bloklarini gizle --- */
.ea-hero,
.ea-pillars,
.ea-products,
.ea-carousel,
.ea-news { /* eski tema blok class'lari override edildi */ }
.ea-partners { display: none !important; }

/* Eski blok basliklarini resetle */
.section-title { display: none !important; }
.tm-urunler .section-title { display: none !important; }

/* --- Secilmis Urunler (hardcoded kartlar) --- */
.tm-secilmis {
  padding: clamp(3rem, 1.5rem + 5vw, 5rem) 0 !important;
  background: var(--bg-soft) !important;
}
.tm-secilmis__grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 1023px) {
  .tm-secilmis__grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
  .tm-secilmis__grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 479px) {
  .tm-secilmis__grid { grid-template-columns: 1fr !important; }
}

/* Product cards */
.tm-kart {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: box-shadow .3s, transform .3s !important;
}
.tm-kart::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.tm-kart:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.tm-kart:hover::before { transform: scaleX(1) !important; }
.tm-kart__link {
  display: block !important;
  text-decoration: none !important;
  color: inherit !important;
}
.tm-kart__link:hover { color: inherit !important; }
.tm-kart__gorsel {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.tm-kart__gorsel img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
  transition: transform .5s !important;
}
.tm-kart:hover .tm-kart__gorsel img { transform: scale(1.05) !important; }
.tm-kart__govde {
  padding: 16px 20px 20px !important;
}
.tm-kart__grup {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 6px !important;
}
.tm-kart__govde h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 6px !important;
  line-height: 1.35 !important;
}
.tm-kart:hover .tm-kart__govde h3 { color: var(--brand) !important; }
.tm-kart__govde p {
  font-size: 13px !important;
  color: var(--muted) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

/* --- Urun Gruplari (DB kategoriler) --- */
.tm-urunler .sub-category-grid,
.tm-urunler .cat-grid,
.tm-urunler .ea-cat-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 1023px) {
  .tm-urunler .sub-category-grid,
  .tm-urunler .cat-grid,
  .tm-urunler .ea-cat-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 767px) {
  .tm-urunler .sub-category-grid,
  .tm-urunler .cat-grid,
  .tm-urunler .ea-cat-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 479px) {
  .tm-urunler .sub-category-grid,
  .tm-urunler .cat-grid,
  .tm-urunler .ea-cat-grid { grid-template-columns: 1fr !important; }
}
.tm-urunler .item-box .product-title a,
.tm-urunler .item-box .title a {
  color: var(--navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
.tm-urunler .item-box .product-title a:hover,
.tm-urunler .item-box .title a:hover { color: var(--brand) !important; }
.tm-urunler .item-box .description,
.tm-urunler .item-box .prices,
.tm-urunler .item-box .add-info,
.tm-urunler .item-box .buttons,
.tm-urunler .item-box .add-to-cart-button { display: none !important; }

/* =============================================================
   20. CONTACT PAGE (ea-contact-*)
   ============================================================= */

/* --- Contact Hero --- */
.ea-contact-hero {
  background: var(--bg-soft) !important;
  padding: 48px 0 !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
  overflow: hidden !important;
}
.ea-contact-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(620px 220px at 92% -20%, rgba(255,102,0,.12), transparent 70%) !important;
  pointer-events: none !important;
}
.ea-contact-hero .container {
  position: relative !important;
  z-index: 1 !important;
  max-width: var(--container) !important;
  margin: 0 auto !important;
  padding: 0 var(--container-pad) !important;
}
.ea-contact-hero .ea-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 10px !important;
}
.ea-contact-hero .ea-label::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}
.ea-contact-hero h1 {
  font-size: 28px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 12px !important;
  line-height: 1.2 !important;
}
.ea-contact-hero .ea-breadcrumb {
  font-size: 13px !important;
  color: var(--muted) !important;
  margin: 0 !important;
}
.ea-contact-hero .ea-breadcrumb a {
  color: var(--muted) !important;
  text-decoration: none !important;
}
.ea-contact-hero .ea-breadcrumb a:hover { color: var(--brand) !important; }
.ea-contact-hero .ea-breadcrumb .sep {
  margin: 0 6px !important;
  color: var(--line) !important;
}

/* --- Contact Body --- */
.ea-contact-body {
  padding: 56px 0 !important;
}
.ea-contact-body .container {
  max-width: var(--container) !important;
  margin: 0 auto !important;
  padding: 0 var(--container-pad) !important;
}
.ea-contact-grid {
  display: grid !important;
  grid-template-columns: 1fr 1.15fr !important;
  gap: clamp(2rem, 4vw, 4rem) !important;
  align-items: start !important;
}
@media (max-width: 899px) {
  .ea-contact-grid { grid-template-columns: 1fr !important; }
}

/* --- Contact Info Card --- */
.ea-contact-info {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 28px !important;
}
.ea-contact-info .ea-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 10px !important;
}
.ea-contact-info .ea-label::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}
.ea-contact-info h2 {
  font-size: 22px !important;
  margin: 0 0 20px !important;
}
.ea-contact-list {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.ea-contact-list li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--line) !important;
  margin: 0 !important;
}
.ea-contact-list li:last-child { border-bottom: none !important; }
.ea-contact-list li .ico {
  width: 40px !important;
  height: 40px !important;
  flex: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius) !important;
  background: var(--bg-warm) !important;
  color: var(--brand) !important;
  font-size: 16px !important;
}
html body .ea-contact-list li .ico i,
html body .ea-contact-list li .ico .fa,
html body .ea-contact-list li .ico .fas,
html body .ea-contact-list li .ico .far,
html body .ea-contact-list li .ico .fab {
  color: var(--brand) !important;
}
.ea-contact-list li p {
  margin: 0 !important;
  font-size: 15px !important;
  color: var(--ink-2) !important;
  line-height: 1.6 !important;
}
.ea-contact-list li p a {
  color: var(--ink-2) !important;
  text-decoration: none !important;
}
.ea-contact-list li p a:hover { color: var(--brand) !important; }
.ea-contact-list .ea-branch-header {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  padding-top: 20px !important;
}
.ea-contact-list .ea-branch-header span {
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--navy) !important;
}
.ea-contact-list .ea-branch-header:first-child { padding-top: 0 !important; }

/* --- Contact Form --- */
.ea-contact-form-wrap {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: 28px !important;
}
.ea-contact-form-wrap .ea-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 10px !important;
}
.ea-contact-form-wrap .ea-label::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}
.ea-contact-form-wrap h2 {
  font-size: 22px !important;
  margin: 0 0 8px !important;
}
.ea-form-intro {
  font-size: 15px !important;
  color: var(--muted) !important;
  margin: 0 0 24px !important;
  line-height: 1.6 !important;
}
.ea-form-result {
  background: #E8F5E9 !important;
  border: 1px solid #A5D6A7 !important;
  border-radius: var(--radius) !important;
  padding: 16px 20px !important;
  color: #2E7D32 !important;
  margin-bottom: 20px !important;
}
.ea-contact-form .ea-form-row {
  margin-bottom: 16px !important;
}
.ea-contact-form .ea-form-field {
  width: 100% !important;
}
.ea-contact-form input[type="text"],
.ea-contact-form input[type="email"],
.ea-contact-form textarea,
.ea-contact-form select,
.ea-contact-form .form-control {
  width: 100% !important;
  padding: 12px 16px !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  transition: border-color .2s !important;
  box-sizing: border-box !important;
  background: #fff !important;
  color: var(--ink) !important;
}
.ea-contact-form input:focus,
.ea-contact-form textarea:focus {
  border-color: var(--brand) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255, 102, 0, .12) !important;
}
.ea-contact-form .ea-textarea {
  min-height: 140px !important;
  resize: vertical !important;
}
.ea-form-submit {
  margin-top: 20px !important;
}
.ea-btn-submit {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: 100% !important;
  padding: 14px 28px !important;
  background: var(--brand) !important;
  color: #fff !important;
  border: none !important;
  border-radius: var(--radius) !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .2s !important;
}
.ea-btn-submit:hover {
  background: var(--brand-dark) !important;
}

/* --- Contact Map --- */
.ea-contact-map {
  padding: 0 0 56px !important;
}
.ea-contact-map .container {
  max-width: var(--container) !important;
  margin: 0 auto !important;
  padding: 0 var(--container-pad) !important;
}
.ea-map-wrap {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  aspect-ratio: 16 / 7 !important;
  background: var(--bg-soft) !important;
  margin-bottom: 20px !important;
}
.ea-map-wrap:last-child { margin-bottom: 0 !important; }
.ea-map-frame {
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  display: block !important;
}

/* =============================================================
   21. BLOG PAGE
   ============================================================= */

/* Blog list post cards */
.blog-posts {
  max-width: 860px !important;
  margin: 0 auto !important;
}
.blog-posts .post {
  display: grid !important;
  grid-template-columns: 260px 1fr !important;
  gap: 24px !important;
  align-items: center !important;
  padding: 24px 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
.blog-posts .post:last-child { border-bottom: none !important; }
@media (max-width: 699px) {
  .blog-posts .post { grid-template-columns: 1fr !important; gap: 16px !important; }
}
.blog-posts .post-image {
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  border: 1px solid var(--line) !important;
  aspect-ratio: 16 / 10 !important;
  background: var(--bg-soft) !important;
}
.blog-posts .post-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
.blog-posts .post-date {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-bottom: 6px !important;
}
.blog-posts .post-title {
  font-size: 18px !important;
  font-weight: 700 !important;
  margin: 0 0 8px !important;
  line-height: 1.4 !important;
}
.blog-posts .post-title a {
  color: var(--navy) !important;
  text-decoration: none !important;
}
.blog-posts .post-title a:hover { color: var(--brand) !important; }
.blog-posts .post-body {
  font-size: 15px !important;
  color: var(--muted) !important;
  line-height: 1.6 !important;
  margin-bottom: 8px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.blog-posts .read-more a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--brand) !important;
}
.blog-posts .read-more a:hover { gap: 8px !important; }

/* Blog detail page */
.blog-post {
  max-width: 860px !important;
  margin: 0 auto !important;
}
.blog-post .post-date {
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  color: var(--muted) !important;
  margin-bottom: 16px !important;
}
.blog-post .post-body {
  font-size: 16px !important;
  line-height: 1.8 !important;
  color: var(--ink-2) !important;
}
.blog-post .post-body img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: var(--radius-lg) !important;
  margin: 24px 0 !important;
}

/* =============================================================
   22. TOPIC PAGES (kurumsal icerik sayfalari)
   ============================================================= */

/* Better content area for topic/kurumsal pages */
.category-description p {
  margin-bottom: 16px !important;
}
.category-description ul,
.category-description ol {
  margin-bottom: 20px !important;
  padding-left: 1.5rem !important;
}
.category-description li {
  margin-bottom: 8px !important;
  color: var(--ink-2) !important;
  list-style: disc !important;
}
html body .category-description ul li::before,
html body .category-description ol li::before {
  content: none !important;
  display: none !important;
}
html body .category-description ul li::first-letter {
  color: inherit !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  margin-right: 0 !important;
}
.category-description li::marker {
  color: var(--brand) !important;
}
.category-description blockquote {
  margin: 24px 0 !important;
  padding: 20px 24px !important;
  background: var(--bg-soft) !important;
  border-left: 3px solid var(--brand) !important;
  border-radius: 0 var(--radius) var(--radius) 0 !important;
  font-style: italic !important;
  color: var(--ink) !important;
}
.category-description table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 15px !important;
  margin: 24px 0 !important;
}
.category-description th,
.category-description td {
  padding: 10px 16px !important;
  text-align: left !important;
  border-bottom: 1px solid var(--line) !important;
}
.category-description thead th {
  background: var(--bg-soft) !important;
  color: var(--ink) !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
}
.category-description tbody tr:hover {
  background: var(--bg-soft) !important;
}
.category-description a {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
.category-description a:hover {
  color: var(--brand-dark) !important;
}

/* Eski tema .sections gizlemelerini iletisim sayfasinda da gizle */
body:not(.home-page) .ea-contact-hero + .sections,
body:not(.home-page) .ea-contact-hero ~ #ctl00_ctl00_cph1_divSection { display: none !important; }

/* =============================================================
   23. EA-LABEL (shared label component)
   ============================================================= */
.ea-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
}
.ea-label::before {
  content: "" !important;
  width: 24px !important;
  height: 3px !important;
  background: var(--brand) !important;
  flex: none !important;
}

/* =============================================================
   24. HEADER STICKY FIX — CSS sticky replaces JS position:fixed
   ============================================================= */
header.th {
  position: sticky !important;
  top: -36px !important;
  z-index: 9990 !important;
}
.th-navbar.th-sticky {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  z-index: auto !important;
  animation: none !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.1) !important;
}
@media (max-width: 992px) {
  header.th { top: 0 !important; }
}

/* =============================================================
   25. HOMEPAGE — hide categories section, keep for future
   ============================================================= */
body.home-page .tm-urunler--kategoriler,
body.home-page .ea-carousel,
body.home-page .ea-partners {
  display: none !important;
}

/* =============================================================
   26. HOMEPAGE DYNAMIC PRODUCT CARDS (ProductBox2 in .tm-secilmis)
   ============================================================= */
.tm-secilmis .product-grid {
  display: contents !important;
}
.tm-secilmis .product-grid > [class*="col-"],
.tm-secilmis .product-grid > table,
.tm-secilmis .product-grid > table > tbody,
.tm-secilmis .product-grid > table > tbody > tr {
  display: contents !important;
}
.tm-secilmis .team-portrait {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: box-shadow .3s, transform .3s !important;
}
.tm-secilmis .team-portrait::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.tm-secilmis .team-portrait:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.tm-secilmis .team-portrait:hover::before { transform: scaleX(1) !important; }
.tm-secilmis .tp-avatar {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tm-secilmis .tp-avatar a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
.tm-secilmis .tp-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
  transition: transform .5s !important;
}
.tm-secilmis .team-portrait:hover .tp-avatar img { transform: scale(1.05) !important; }
.tm-secilmis .tp-caption {
  padding: 16px 20px 20px !important;
}
.tm-secilmis .tp-caption h4 {
  display: block !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin: 0 0 6px !important;
  line-height: 1.4 !important;
}
.tm-secilmis .tp-caption h3 {
  font-size: 15px !important;
  font-weight: 700 !important;
  margin: 0 0 6px !important;
  line-height: 1.35 !important;
}
.tm-secilmis .tp-caption h3 a {
  color: var(--navy) !important;
  text-decoration: none !important;
}
.tm-secilmis .team-portrait:hover .tp-caption h3 a { color: var(--brand) !important; }
.tm-secilmis .tp-caption .description {
  font-size: 13px !important;
  color: var(--muted) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.tm-secilmis .span-social,
.tm-secilmis .buttons,
.tm-secilmis .add-info {
  display: none !important;
}

/* =============================================================
   27. PRODUCT DETAIL PAGE (OneVariant2.ascx)
   ============================================================= */

/* --- 27a. Page title / hero banner --- */
section.page-title {
  background: var(--bg-soft) !important;
  padding: 40px 0 32px !important;
  margin-bottom: 0 !important;
}
section.page-title h1 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 28px !important;
  font-weight: 800 !important;
  color: var(--navy) !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

/* --- 27b. Main section spacing --- */
section.shop-single-section {
  padding: 48px 0 64px !important;
  background: #fff !important;
}
.shop-single-section .main-container,
.shop-single-section .main {
  padding: 0 !important;
  margin: 0 !important;
}

/* --- 27c. Two-column grid layout --- */
.product-view .master-wrapper-main > .row {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: clamp(2rem, 4vw, 4rem) !important;
  align-items: start !important;
}
@media (max-width: 899px) {
  .product-view .master-wrapper-main > .row {
    grid-template-columns: 1fr !important;
  }
}
.product-view .master-wrapper-main > .row > .col-md-6 {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  padding: 0 !important;
  float: none !important;
}
.product-view .master-wrapper-main > .row > .col-md-12 {
  width: 100% !important;
  max-width: 100% !important;
  grid-column: 1 / -1 !important;
  padding: 0 !important;
  float: none !important;
}

/* --- 27d. Image gallery (left column) --- */
.shop-single-slider {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: #fff !important;
  padding: 24px !important;
  overflow: hidden !important;
}
.shop-single-slider .slider-for {
  aspect-ratio: 1 !important;
  position: relative !important;
  overflow: hidden !important;
  margin-bottom: 12px !important;
}
.shop-single-slider .slider-for .slick-list.draggable,
.shop-single-slider .slider-for .slick-list {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.shop-single-slider .slider-for .slick-track {
  /* GENISLIK VERME: slick serit genisligini satir ici stille kendi hesaplar
     (4 resim = 1960px). Burada 100%% dayatilirsa serit tek slayt kadar kalir
     ve 2. resimden itibaren kadraj disinda gorunmez olur. */
  height: 100% !important;
}
.shop-single-slider .slider-for .slick-slide {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.shop-single-slider .slider-for .slick-slide > * {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.shop-single-slider .slider-for .slick-slide a,
.shop-single-slider .slider-for .slick-slide > * > * {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}
.shop-single-slider .slider-for img {
  max-width: 90% !important;
  max-height: 90% !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}
.shop-single-slider .slider-nav {
  display: flex !important;
  gap: 8px !important;
}
.shop-single-slider .slider-nav .slick-slide {
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  transition: border-color .2s !important;
  padding: 6px !important;
  background: #fff !important;
}
.shop-single-slider .slider-nav .slick-slide:hover {
  border-color: var(--muted) !important;
}
.shop-single-slider .slider-nav .slick-current {
  border-color: var(--brand) !important;
  border-width: 2px !important;
}
.shop-single-slider .slider-nav img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}
.shop-single-slider .nav-btn {
  display: none !important;
}
.product-view .product-img-box {
  display: none !important;
}

/* --- 27e. Product info (right column) --- */
.product-shop {
  padding-top: 0 !important;
}
.product-shop .product-details {
  padding: 0 !important;
}
.product-shop .product-details > h2 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 24px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 20px !important;
  line-height: 1.35 !important;
  border-bottom: 1px solid var(--line) !important;
  padding-bottom: 16px !important;
}

/* --- 27f. Accordion panels --- */
.product-details .faq-accordion {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  margin-bottom: 24px !important;
}
.product-details .faq-accordion .panel {
  border: none !important;
  border-bottom: 1px solid var(--line) !important;
  margin: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.product-details .faq-accordion .panel:last-child {
  border-bottom: none !important;
}
.product-details .faq-accordion .panel-heading {
  padding: 0 !important;
  background: none !important;
  border: none !important;
}
.product-details .faq-accordion .panel-heading a {
  display: block !important;
  padding: 14px 20px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  text-decoration: none !important;
  transition: background .2s, color .2s !important;
  position: relative !important;
}
.product-details .faq-accordion .panel-heading a::before {
  display: none !important;
}
.product-details .faq-accordion .panel-heading a::after {
  content: "+" !important;
  position: absolute !important;
  right: 20px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  color: var(--muted) !important;
  transition: transform .2s !important;
}
.product-details .faq-accordion .panel-heading a:not(.collapsed)::after {
  content: "\2212" !important;
  color: var(--brand) !important;
}
.product-details .faq-accordion .panel-heading a:hover {
  background: var(--bg-soft) !important;
  color: var(--brand) !important;
}
.product-details .faq-accordion .panel-body {
  padding: 16px 20px 20px !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  color: var(--ink-2) !important;
}

/* --- 27g. Demo request form --- */
.product-details .contact-validation-active .form-group {
  margin-bottom: 12px !important;
}
.product-details .contact-validation-active .form-control {
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-size: 14px !important;
  font-family: 'Manrope', sans-serif !important;
  transition: border-color .2s !important;
  background: #fff !important;
  width: 100% !important;
}
.product-details .contact-validation-active .form-control:focus {
  border-color: var(--brand) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(255,102,0,.12) !important;
}
.product-details .contact-validation-active textarea.form-control {
  min-height: 80px !important;
  resize: vertical !important;
}
.product-details .submit-area .btn-custom,
.product-details .contact-validation-active .btn-custom {
  background: var(--brand) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 24px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  font-family: 'Manrope', sans-serif !important;
  cursor: pointer !important;
  transition: background .2s !important;
}
.product-details .submit-area .btn-custom:hover,
.product-details .contact-validation-active .btn-custom:hover {
  background: #E75C00 !important;
}
.product-details .result {
  padding: 16px 20px !important;
  background: #E8F5E9 !important;
  border-radius: 8px !important;
  color: #2E7D32 !important;
  font-size: 14px !important;
}

/* --- 27h. Documents table --- */
.product-details table.documentDownload {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
}
.product-details table.documentDownload thead {
  background: var(--bg-soft) !important;
}
.product-details table.documentDownload th {
  padding: 10px 16px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  text-align: left !important;
  border-bottom: 2px solid var(--line) !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
}
.product-details table.documentDownload td {
  padding: 10px 16px !important;
  border-bottom: 1px solid var(--line) !important;
  color: var(--ink-2) !important;
}
.product-details table.documentDownload a {
  color: var(--brand) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}
.product-details table.documentDownload a:hover {
  text-decoration: underline !important;
}

/* --- 27i. Video block --- */
.videoBlock h3 {
  font-size: 18px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin-bottom: 12px !important;
}

/* --- 27j. Description / collateral area --- */
.product-collateral.mt-5 {
  margin-top: 48px !important;
  padding-top: 40px !important;
  border-top: 1px solid var(--line) !important;
}
.product-collateral .product-variant-line > h3 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 20px !important;
}
.product-collateral .fulldescription {
  font-size: 15px !important;
  line-height: 1.75 !important;
  color: var(--ink-2) !important;
}
.product-collateral .fulldescription h2,
.product-collateral .fulldescription h3,
.product-collateral .fulldescription h4 {
  color: var(--navy) !important;
  font-family: 'Manrope', sans-serif !important;
  margin: 24px 0 12px !important;
}
.product-collateral .fulldescription h2 { font-size: 20px !important; font-weight: 700 !important; }
.product-collateral .fulldescription h3 { font-size: 17px !important; font-weight: 700 !important; }
.product-collateral .fulldescription h4 { font-size: 15px !important; font-weight: 700 !important; }
.product-collateral .fulldescription p {
  margin: 0 0 16px !important;
}
.product-collateral .fulldescription ul,
.product-collateral .fulldescription ol {
  padding-left: 20px !important;
  margin: 0 0 16px !important;
}
.product-collateral .fulldescription li {
  margin-bottom: 6px !important;
}
.product-collateral .fulldescription table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: 16px 0 !important;
  font-size: 14px !important;
}
.product-collateral .fulldescription th,
.product-collateral .fulldescription td {
  padding: 10px 16px !important;
  border: 1px solid var(--line) !important;
  text-align: left !important;
}
.product-collateral .fulldescription th {
  background: var(--bg-soft) !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
}
.product-collateral .fulldescription tr:nth-child(even) td {
  background: var(--bg-soft) !important;
}
.product-collateral .fulldescription img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 8px !important;
}

/* --- 27k. Hide e-commerce elements --- */
.product-view .price-info,
.product-view .add-to-box,
.product-view .add-to-box-actions,
.product-view .product-sku,
.product-view .product-name,
.product-view .arw_breadcrumbs,
.product-view .social-buttons,
.product-view .more-views,
.product-view .creditCard,
.product-view .manufacturerpartnumber,
.product-view .manufacturers,
.product-view .stock,
.product-view .backButton {
  display: none !important;
}

/* --- 27l. Hide empty product-details children --- */
.product-details > .buttons:empty,
.product-details > .attributes:empty,
.product-details > #divProductSize:empty,
.product-details > .add-to-cart {
  display: none !important;
}

/* --- 27m. Breadcrumb in page-title --- */
.tm-breadcrumb {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  font-size: 13px !important;
  font-family: 'Manrope', sans-serif !important;
}
.tm-breadcrumb li { display: inline-flex !important; align-items: center !important; }
.tm-breadcrumb li + li::before {
  content: "/" !important;
  margin-right: 6px !important;
  color: var(--muted) !important;
}
.tm-breadcrumb a {
  color: var(--muted) !important;
  text-decoration: none !important;
  transition: color .2s !important;
}
.tm-breadcrumb a:hover { color: var(--brand) !important; }
.tm-breadcrumb span[aria-current] {
  color: var(--navy) !important;
  font-weight: 600 !important;
}

/* --- 27n. CTA buttons below accordion --- */
html body .product-details .tm-product-cta {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  margin-bottom: 24px !important;
}
html body .product-details .tm-product-cta a.tm-btn-primary {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 14px 28px !important;
  background: var(--brand) !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background .2s, transform .2s !important;
}
html body .product-details .tm-product-cta a.tm-btn-primary:hover {
  background: #E75C00 !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}
html body .product-details .tm-product-cta a.tm-btn-primary svg {
  width: 18px !important; height: 18px !important; fill: none !important;
  stroke: currentColor !important; stroke-width: 2 !important;
}
html body .product-details .tm-product-cta a.tm-btn-outline {
  display: inline-flex !important;
  align-items: center !important;
  padding: 14px 28px !important;
  background: transparent !important;
  color: var(--navy) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
  font-family: 'Manrope', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: border-color .2s, color .2s !important;
}
html body .product-details .tm-product-cta a.tm-btn-outline:hover {
  border-color: var(--brand) !important;
  color: var(--brand) !important;
}

/* --- 27o. Help/support box --- */
html body .product-details .tm-product-help {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  padding: 20px !important;
  background: var(--bg-soft) !important;
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--line) !important;
  margin-bottom: 24px !important;
}
html body .product-details .tm-product-help svg {
  width: 24px !important; height: 24px !important;
  color: var(--brand) !important; flex: none !important; margin-top: 2px !important;
  fill: none !important; stroke: currentColor !important; stroke-width: 2 !important;
  stroke-linecap: round !important; stroke-linejoin: round !important;
}
html body .product-details .tm-product-help p { margin: 0 !important; font-size: 14px !important; color: var(--ink-2) !important; line-height: 1.6 !important; }
html body .product-details .tm-product-help strong { display: block !important; color: var(--navy) !important; margin-bottom: 4px !important; font-size: 15px !important; }
html body .product-details .tm-product-help a { color: var(--brand) !important; font-weight: 700 !important; text-decoration: none !important; }
html body .product-details .tm-product-help a:hover { text-decoration: underline !important; }

/* --- 27p. Description section (#desc) --- */
#desc.product-collateral {
  border-top: 1px solid var(--line) !important;
  padding-top: 32px !important;
}
#desc .product-variant-line > h3 {
  font-family: 'Manrope', sans-serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  color: var(--navy) !important;
  margin: 0 0 16px !important;
}

/* --- 27q. Responsive tweaks --- */
@media (max-width: 767px) {
  section.page-title h1 {
    font-size: 22px !important;
  }
  .product-shop .product-details > h2 {
    font-size: 20px !important;
  }
  .product-collateral.mt-5 {
    margin-top: 32px !important;
    padding-top: 24px !important;
  }
  .product-collateral .product-variant-line > h3 {
    font-size: 18px !important;
  }
  .tm-product-cta {
    flex-direction: column !important;
  }
  .tm-product-cta .tm-btn-primary,
  .tm-product-cta .tm-btn-outline {
    width: 100% !important;
    justify-content: center !important;
  }
  .tm-breadcrumb {
    font-size: 12px !important;
  }
}

/* =============================================================
   28. CATEGORY PAGE — product grid in content area
   ============================================================= */
.category-page .product-grid > [class*="col-"] {
  padding: 0 !important;
}
.category-page .product-grid .team-portrait {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: box-shadow .3s, transform .3s !important;
  height: 100% !important;
}
.category-page .product-grid .team-portrait::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.category-page .product-grid .team-portrait:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.category-page .product-grid .team-portrait:hover::before { transform: scaleX(1) !important; }
.category-page .product-grid .tp-avatar {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}
.category-page .product-grid .tp-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
}
.category-page .product-grid .tp-caption {
  padding: 16px 20px 20px !important;
}
.category-page .product-grid .tp-caption h3 a {
  color: var(--navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}
.category-page .product-grid .team-portrait:hover .tp-caption h3 a { color: var(--brand) !important; }
.category-page .product-grid .tp-caption h4 {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin: 0 0 4px !important;
}
.category-page .product-grid .tp-caption .description {
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
}
.category-page .product-grid .span-social,
.category-page .product-grid .buttons,
.category-page .product-grid .add-info {
  display: none !important;
}

/* =============================================================
   29. FEATURED PRODUCTS on category pages
   ============================================================= */
.featured-product-grid > .title {
  font-family: 'Manrope', sans-serif !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin-bottom: 24px !important;
}
.featured-product-grid > div:not(.title) {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
}
@media (max-width: 767px) {
  .featured-product-grid > div:not(.title) {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 479px) {
  .featured-product-grid > div:not(.title) {
    grid-template-columns: 1fr !important;
  }
}
.featured-product-grid > div:not(.title) > table,
.featured-product-grid > div:not(.title) > table > tbody,
.featured-product-grid > div:not(.title) > table > tbody > tr,
.featured-product-grid > div:not(.title) > table > tbody > tr > td {
  display: contents !important;
}
.featured-product-grid > div:not(.title) > [class*="col-"],
.featured-product-grid > div:not(.title) td.item-box > [class*="col-"] {
  width: auto !important;
  max-width: none !important;
  flex: none !important;
  padding: 0 !important;
}
.featured-product-grid .team-portrait {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  position: relative !important;
  transition: box-shadow .3s, transform .3s !important;
  height: 100% !important;
}
.featured-product-grid .team-portrait::before {
  content: "" !important;
  position: absolute !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform .3s !important;
  z-index: 2 !important;
}
.featured-product-grid .team-portrait:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1) !important;
  transform: translateY(-4px) !important;
}
.featured-product-grid .team-portrait:hover::before { transform: scaleX(1) !important; }
.featured-product-grid .tp-avatar {
  aspect-ratio: 1 !important;
  background: #fff !important;
  border-bottom: 1px solid var(--line) !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}
.featured-product-grid .tp-avatar img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  padding: 20px !important;
}
.featured-product-grid .tp-caption {
  padding: 16px 20px 20px !important;
}
.featured-product-grid .tp-caption h3 a {
  color: var(--navy) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  text-decoration: none !important;
}
.featured-product-grid .team-portrait:hover .tp-caption h3 a { color: var(--brand) !important; }
.featured-product-grid .tp-caption h4 {
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: var(--brand) !important;
  margin: 0 0 4px !important;
}
.featured-product-grid .tp-caption .description {
  font-size: 13px !important;
  color: var(--muted) !important;
  line-height: 1.5 !important;
}
.featured-product-grid .span-social,
.featured-product-grid .buttons,
.featured-product-grid .add-info {
  display: none !important;
}

/* =============================================================
   30. URUN DETAY - a5 statik tasarimi ile birebir
   Icerik panelden yonetilir (Urun Sekmeleri / Nop_ProductTabs).
   ============================================================= */

.product-view .faq-accordion,
.product-view .product-collateral > .product-variant-line > h3,
.product-view .product-collateral .fulldescription { display: none !important; }

.product-view .master-wrapper-main > .row {
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: clamp(2rem, 4vw, 4rem) !important;
  align-items: start !important;
}

.product-view .urun-galeri__ana {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: #fff !important;
  aspect-ratio: 1 !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(1.5rem, 4vw, 3rem) !important;
  overflow: hidden !important;
}
.product-view .urun-galeri__ana img { width: 100% !important; height: 100% !important; object-fit: contain !important; }
.product-view .urun-galeri__kucuk { display: grid !important; grid-template-columns: repeat(4,1fr) !important; gap: var(--s-3) !important; margin-top: var(--s-3) !important; }
.product-view .urun-galeri__kucuk button {
  border: 1px solid var(--line) !important; border-radius: var(--radius) !important; background: #fff !important;
  aspect-ratio: 1 !important; padding: var(--s-2) !important; overflow: hidden !important; cursor: pointer !important;
  transition: border-color var(--dur) var(--ease) !important;
}
.product-view .urun-galeri__kucuk button:hover { border-color: var(--muted) !important; }
.product-view .urun-galeri__kucuk button[aria-current="true"] { border-color: var(--brand) !important; border-width: 2px !important; }
.product-view .urun-galeri__kucuk img { width: 100% !important; height: 100% !important; object-fit: contain !important; }

.product-view .urun-bilgi__grup {
  display: inline-block !important; font-size: var(--fs-xs) !important; font-weight: 800 !important;
  letter-spacing: .1em !important; text-transform: uppercase !important;
  color: var(--brand-metin) !important; margin-bottom: var(--s-3) !important;
}
.product-view .urun-bilgi h2 { font-size: var(--fs-2xl) !important; margin: 0 0 var(--s-4) !important; color: var(--ink) !important; font-weight: 800 !important; }
.product-view .urun-bilgi__ozet { font-size: var(--fs-md) !important; color: var(--ink-2) !important; margin-bottom: var(--s-6) !important; }

.product-view .urun-ozet-tablo { border: 1px solid var(--line) !important; border-radius: var(--radius-lg) !important; overflow: hidden !important; margin-bottom: var(--s-6) !important; }
.product-view .urun-ozet-tablo dl { margin: 0 !important; display: grid !important; grid-template-columns: auto 1fr !important; }
.product-view .urun-ozet-tablo dt,
.product-view .urun-ozet-tablo dd { margin: 0 !important; padding: var(--s-3) var(--s-5) !important; border-bottom: 1px solid var(--line-2) !important; font-size: var(--fs-base) !important; }
.product-view .urun-ozet-tablo dt { font-weight: 700 !important; color: var(--ink) !important; background: var(--bg-soft) !important; white-space: nowrap !important; }
.product-view .urun-ozet-tablo dd { color: var(--ink-2) !important; }
.product-view .urun-ozet-tablo dl > :nth-last-child(-n+2) { border-bottom: 0 !important; }

.product-view .urun-aksiyon { display: flex !important; gap: var(--s-3) !important; flex-wrap: wrap !important; margin-bottom: var(--s-6) !important; }

.product-view .urun-yardim {
  display: flex !important; align-items: flex-start !important; gap: var(--s-4) !important; padding: var(--s-5) !important;
  background: var(--bg-soft) !important; border-radius: var(--radius-lg) !important; border: 1px solid var(--line) !important;
}
.product-view .urun-yardim svg { width: 24px !important; height: 24px !important; color: var(--brand) !important; flex: none !important; margin-top: 2px !important; }
.product-view .urun-yardim p { margin: 0 !important; font-size: var(--fs-base) !important; color: var(--ink-2) !important; }
.product-view .urun-yardim strong { display: block !important; color: var(--ink) !important; margin-bottom: var(--s-1) !important; }

.tm-sekme { margin-top: var(--s-12); }
.tm-sekme .sekme__basliklar {
  display: flex !important; gap: var(--s-1) !important; border-bottom: 1px solid var(--line) !important;
  margin-bottom: var(--s-8) !important; overflow-x: auto !important; scrollbar-width: none !important;
}
.tm-sekme .sekme__basliklar::-webkit-scrollbar { display: none !important; }
.tm-sekme .sekme__basliklar button {
  padding: var(--s-4) var(--s-5) !important; white-space: nowrap !important; position: relative !important;
  font-size: var(--fs-base) !important; font-weight: 700 !important; color: var(--muted) !important;
  background: none !important; border: 0 !important; cursor: pointer !important;
  transition: color var(--dur) var(--ease) !important;
}
.tm-sekme .sekme__basliklar button::after {
  content: "" !important; position: absolute !important; left: var(--s-4) !important; right: var(--s-4) !important;
  bottom: -1px !important; height: 3px !important; background: var(--brand) !important;
  transform: scaleX(0) !important; transition: transform var(--dur) var(--ease) !important;
}
.tm-sekme .sekme__basliklar button:hover { color: var(--ink) !important; }
.tm-sekme .sekme__basliklar button[aria-selected="true"] { color: var(--brand-metin) !important; }
.tm-sekme .sekme__basliklar button[aria-selected="true"]::after { transform: scaleX(1) !important; }
.tm-sekme .sekme__panel[hidden] { display: none !important; }
.tm-sekme .sekme__panel > .icerik,
.tm-sekme .sekme__panel > .tablo-sarmal { max-width: 760px; }

.tm-sekme .veri-notu {
  display: flex !important; align-items: flex-start !important; gap: var(--s-3) !important;
  padding: var(--s-4) var(--s-5) !important; border-radius: var(--radius) !important;
  background: #FFF8E8 !important; border: 1px solid #F0DFB4 !important; color: #6B5518 !important;
  font-size: var(--fs-sm) !important; margin-bottom: var(--s-6) !important; max-width: 760px;
}
.tm-sekme .veri-notu p { margin: 0 !important; }

.tm-sekme .tablo-sarmal { overflow-x: auto !important; border: 1px solid var(--line) !important; border-radius: var(--radius-lg) !important; }
.tm-sekme .tablo { width: 100% !important; font-size: var(--fs-base) !important; min-width: 520px !important; border-collapse: collapse !important; }
.tm-sekme .tablo th,
.tm-sekme .tablo td { padding: var(--s-3) var(--s-5) !important; text-align: left !important; border-bottom: 1px solid var(--line-2) !important; }
.tm-sekme .tablo tbody tr:last-child td { border-bottom: 0 !important; }
.tm-sekme .tablo tbody tr:hover { background: var(--bg-soft) !important; }
.tm-sekme .tablo th[scope="row"] { font-weight: 700 !important; color: var(--ink) !important; width: 38% !important; }

.tm-sekme .icerik p { margin: 0 0 var(--s-4) !important; color: var(--ink-2) !important; font-size: var(--fs-base) !important; line-height: 1.7 !important; }
.tm-sekme .icerik h3 { font-size: var(--fs-lg) !important; color: var(--ink) !important; font-weight: 800 !important; margin: var(--s-6) 0 var(--s-3) !important; }
.tm-sekme .icerik h3:first-child { margin-top: 0 !important; }
.tm-sekme .icerik ul { margin: 0 0 var(--s-4) !important; padding-left: var(--s-5) !important; }
.tm-sekme .icerik li { margin-bottom: var(--s-2) !important; color: var(--ink-2) !important; font-size: var(--fs-base) !important; line-height: 1.7 !important; }
.tm-sekme .icerik li::first-letter { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; }
.tm-sekme .icerik li::before { content: none !important; }
.tm-sekme .icerik a { color: var(--brand-metin) !important; text-decoration: underline !important; }
.tm-sekme .gorsel-gizli { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; border: 0 !important; }

@media (max-width: 899px) {
  .product-view .master-wrapper-main > .row { grid-template-columns: 1fr !important; }
}

/* =============================================================
   31. KURUMSAL SAYFALAR - a5 statik tasarimi ile birebir
   Icerik panelden yonetilir (Kategori > Aciklama).
   ============================================================= */

html body .category-description .gorsel-gizli { position:absolute!important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0 0 0 0) !important; white-space:nowrap !important; border:0 !important; }
html body .category-description .kapsayici { width:100% !important; max-width:var(--container) !important; margin-inline:auto !important; padding-inline:var(--container-pad) !important; }
html body .category-description .kapsayici--dar { max-width:860px !important; }
html body .category-description .bolum { padding-block:clamp(3rem,1.5rem + 5vw,var(--s-20)) !important; }
html body .category-description .bolum--sikisik { padding-block:clamp(2rem,1rem + 3vw,var(--s-12)) !important; }
html body .category-description .bolum--soft { background:var(--bg-soft) !important; }
html body .category-description .bolum--vurgu { background:var(--brand-soft) !important; }
html body .category-description .izgara { display:grid !important; gap:var(--s-6) !important; }
html body .category-description .izgara--2 { grid-template-columns:repeat(2,1fr) !important; }
html body .category-description .izgara--3 { grid-template-columns:repeat(3,1fr) !important; }
html body .category-description .izgara--4 { grid-template-columns:repeat(4,1fr) !important; }
html body .category-description .etiket { display:inline-flex !important; align-items:center !important; gap:var(--s-2) !important; font-size:var(--fs-xs) !important; font-weight:800 !important; letter-spacing:.14em !important; text-transform:uppercase !important; color:var(--brand-metin) !important; margin-bottom:var(--s-3) !important; }
html body .category-description .etiket::before { content:"" !important; width:24px !important; height:3px !important; background:var(--brand) !important; flex:none !important; }
html body .category-description .bolum-baslik { margin-bottom:var(--s-10) !important; }
html body .category-description .bolum-baslik h2 { margin-bottom:var(--s-3) !important; }
html body .category-description .bolum-baslik p { max-width:62ch !important; color:var(--muted) !important; font-size:var(--fs-md) !important; }
html body .category-description .bolum--vurgu .bolum-baslik p { color:var(--ink-2) !important; }
html body .category-description .bolum-baslik--orta { text-align:center !important; }
html body .category-description .bolum-baslik--orta .etiket { justify-content:center !important; }
html body .category-description .bolum-baslik--orta p { margin-inline:auto !important; }
html body .category-description .bolum-baslik--satir { display:flex !important; align-items:flex-end !important; justify-content:space-between !important; gap:var(--s-6) !important; flex-wrap:wrap !important; }
html body .category-description .btn { display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:var(--s-2) !important; padding:.75rem 1.5rem !important; border-radius:var(--radius) !important; font-size:var(--fs-base) !important; font-weight:700 !important; line-height:1.2 !important; border:2px solid transparent !important; text-align:center !important; transition:background var(--dur) var(--ease),color var(--dur) var(--ease),
             border-color var(--dur) var(--ease),transform var(--dur) var(--ease),
             box-shadow var(--dur) var(--ease) !important; }
html body .category-description .btn:active { transform:translateY(1px) !important; }
html body .category-description .btn svg { width:18px !important; height:18px !important; flex:none !important; }
html body .category-description .btn--birincil { background:var(--btn-birincil-zemin) !important; border-color:var(--btn-birincil-zemin) !important; color:var(--btn-birincil-metin) !important; }
html body .category-description .btn--birincil:hover { background:var(--brand-600) !important; border-color:var(--brand-600) !important; color:var(--btn-birincil-metin) !important; box-shadow:0 6px 18px rgba(255,102,0,.28) !important; }
html body .category-description .btn--ikincil { background:var(--navy) !important; border-color:var(--navy) !important; color:#fff !important; }
html body .category-description .btn--ikincil:hover { background:var(--navy-800) !important; border-color:var(--navy-800) !important; color:#fff !important; }
html body .category-description .btn--anahat { background:transparent !important; border-color:var(--line) !important; color:var(--ink) !important; }
html body .category-description .btn--anahat:hover { border-color:var(--brand) !important; color:var(--brand-metin) !important; background:var(--brand-soft) !important; }
html body .category-description .btn--beyaz { background:#fff !important; border-color:#fff !important; color:var(--navy-900) !important; }
html body .category-description .btn--beyaz:hover { background:var(--brand) !important; border-color:var(--brand) !important; color:#fff !important; }
html body .category-description .btn--hayalet { background:transparent !important; border-color:rgba(255,255,255,.4) !important; color:#fff !important; }
html body .category-description .btn--hayalet:hover { background:#fff !important; border-color:#fff !important; color:var(--navy-900) !important; }
html body .category-description .btn--kucuk { padding:.5rem 1rem !important; font-size:var(--fs-sm) !important; }
html body .category-description .btn--buyuk { padding:.9375rem 2rem !important; font-size:var(--fs-md) !important; }
html body .category-description .btn--tam { width:100% !important; }
html body .category-description .ok-link { display:inline-flex !important; align-items:center !important; gap:var(--s-2) !important; font-weight:700 !important; color:var(--navy) !important; font-size:var(--fs-base) !important; }
html body .category-description .ok-link svg { width:16px !important; height:16px !important; transition:transform var(--dur) var(--ease) !important; }
html body .category-description .ok-link:hover { color:var(--brand-metin) !important; }
html body .category-description .ok-link:hover svg { transform:translateX(4px) !important; }
html body .category-description .ust-serit .kapsayici { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:var(--s-4) !important; min-height:40px !important; }
html body .category-description .dil__btn { display:inline-flex !important; align-items:center !important; gap:var(--s-2) !important; color:var(--ink-2) !important; font-size:var(--fs-sm) !important; font-weight:700 !important; padding:var(--s-1) var(--s-2) !important; border-radius:var(--radius) !important; }
html body .category-description .dil__btn:hover,
html body .category-description .dil__btn[aria-expanded="true"] { color:var(--brand-metin) !important; background:#fff !important; }
html body .category-description .dil__btn .ok { width:12px !important; height:12px !important; transition:transform var(--dur) var(--ease) !important; }
html body .category-description .dil__btn[aria-expanded="true"] .ok { transform:rotate(180deg) !important; }
html body .category-description .dil__btn[aria-expanded="true"] + .dil__liste { opacity:1 !important; visibility:visible !important; transform:translateY(0) !important; }
html body .category-description .ust-bilgi__ana .kapsayici { display:flex !important; align-items:center !important; gap:var(--s-6) !important; min-height:var(--header-h) !important; position:relative !important; }
html body .category-description .ikon-btn { display:grid !important; place-items:center !important; width:42px !important; height:42px !important; border-radius:var(--radius) !important; color:var(--ink) !important; transition:background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
html body .category-description .ikon-btn:hover { background:var(--bg-soft) !important; color:var(--brand-metin) !important; }
html body .category-description .ikon-btn svg { width:20px !important; height:20px !important; }
html body .category-description .mega__izgara { display:grid !important; grid-template-columns:1fr 1fr 1fr 280px !important; gap:var(--s-8) !important; }
html body .category-description .mega__kart { background:var(--brand-soft) !important; border:1px solid #F7DCC8 !important; border-radius:var(--radius-lg) !important; padding:var(--s-6) !important; display:flex !important; flex-direction:column !important; justify-content:space-between !important; gap:var(--s-5) !important; }
html body .category-description .mega__kart h4 { color:var(--ink) !important; font-size:var(--fs-lg) !important; margin-bottom:var(--s-2) !important; }
html body .category-description .mega__kart p { color:var(--ink-2) !important; font-size:var(--fs-sm) !important; margin-bottom:0 !important; }
html body .category-description .menu-btn { display:none !important; }
html body .category-description .kart { background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; overflow:hidden !important; display:flex !important; flex-direction:column !important; position:relative !important; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease) !important; }
html body .category-description .kart::before { content:"" !important; position:absolute !important; top:0 !important; left:0 !important; right:0 !important; height:3px !important; background:var(--brand) !important; transform:scaleX(0) !important; transform-origin:left !important; transition:transform .3s var(--ease) !important; z-index:1 !important; }
html body .category-description .kart:hover { box-shadow:var(--shadow-lg) !important; transform:translateY(-4px) !important; }
html body .category-description .kart:hover::before { transform:scaleX(1) !important; }
html body .category-description .kart__gorsel { position:relative !important; aspect-ratio:4/3 !important; background:var(--bg-soft) !important; overflow:hidden !important; }
html body .category-description .kart__gorsel img { width:100% !important; height:100% !important; object-fit:cover !important; transition:transform .5s var(--ease) !important; }
html body .category-description .kart:hover .kart__gorsel img { transform:scale(1.05) !important; }
html body .category-description .kart__govde { padding:var(--s-5) !important; display:flex !important; flex-direction:column !important; gap:var(--s-2) !important; flex:1 !important; }
html body .category-description .kart__govde h3 { margin:0 !important; font-size:var(--fs-lg) !important; }
html body .category-description .kart__govde p { color:var(--muted) !important; font-size:var(--fs-base) !important; margin:0 !important; }
html body .category-description .kart__alt { margin-top:auto !important; padding-top:var(--s-4) !important; }
html body .category-description .kart__ustu-kapla::after { content:"" !important; position:absolute !important; inset:0 !important; z-index:2 !important; }
html body .category-description .kategori-kart { display:flex !important; flex-direction:column !important; gap:var(--s-4) !important; padding:var(--s-6) !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; position:relative !important; overflow:hidden !important; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease) !important; }
html body .category-description .kategori-kart::before { content:"" !important; position:absolute !important; top:0 !important; left:0 !important; width:3px !important; height:100% !important; background:var(--brand) !important; transform:scaleY(0) !important; transform-origin:top !important; transition:transform .3s var(--ease) !important; }
html body .category-description .kategori-kart:hover { box-shadow:var(--shadow-lg) !important; transform:translateY(-4px) !important; }
html body .category-description .kategori-kart:hover::before { transform:scaleY(1) !important; }
html body .category-description .kategori-kart__ikon { width:52px !important; height:52px !important; display:grid !important; place-items:center !important; flex:none !important; background:var(--brand-soft) !important; color:var(--brand) !important; border-radius:var(--radius) !important; transition:background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
html body .category-description .kategori-kart:hover .kategori-kart__ikon { background:var(--brand) !important; color:#fff !important; }
html body .category-description .kategori-kart__ikon svg { width:26px !important; height:26px !important; }
html body .category-description .kategori-kart h3 { margin:0 !important; font-size:var(--fs-md) !important; }
html body .category-description .kategori-kart p { margin:0 !important; color:var(--muted) !important; font-size:var(--fs-sm) !important; }
html body .category-description .kategori-kart__sayi { margin-top:auto !important; font-size:var(--fs-xs) !important; font-weight:700 !important; color:var(--muted) !important; letter-spacing:.04em !important; }
html body .category-description .cerez__btn { display:flex !important; gap:var(--s-3) !important; flex-wrap:wrap !important; }
html body .category-description .rakamlar .kapsayici { position:relative !important; z-index:1 !important; }
html body .category-description .rakamlar__izgara { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:var(--s-8) !important; }
html body .category-description .ikili { display:grid !important; grid-template-columns:1fr 1fr !important; gap:clamp(2rem,4vw,4rem) !important; align-items:center !important; }
html body .category-description .ikili--gorsel-sag { direction:ltr !important; }
html body .category-description .ikili__gorsel { position:relative !important; }
html body .category-description .ikili__gorsel img { width:100% !important; border-radius:var(--radius-lg) !important; aspect-ratio:4/3 !important; object-fit:cover !important; }
html body .category-description .ikili__gorsel::before { content:"" !important; position:absolute !important; left:-14px !important; top:-14px !important; width:120px !important; height:120px !important; border-left:3px solid var(--brand) !important; border-top:3px solid var(--brand) !important; border-radius:var(--radius-lg) 0 0 0 !important; }
html body .category-description .ikili__rozet { position:absolute !important; right:-10px !important; bottom:-18px !important; background:var(--brand-700) !important; color:#fff !important; padding:var(--s-5) var(--s-6) !important; border-radius:var(--radius-lg) !important; box-shadow:var(--shadow-lg) !important; max-width:220px !important; }
html body .category-description .ikili__rozet strong { display:block !important; color:#fff !important; font-size:var(--fs-2xl) !important; line-height:1 !important; font-weight:800 !important; }
html body .category-description .ikili__rozet span { font-size:var(--fs-sm) !important; font-weight:600 !important; opacity:.92 !important; }
html body .category-description .liste-tik { list-style:none !important; padding:0 !important; margin:0 0 var(--s-8) !important; display:grid !important; gap:var(--s-3) !important; }
html body .category-description .liste-tik li { display:flex !important; gap:var(--s-3) !important; align-items:flex-start !important; margin:0 !important; font-size:var(--fs-md) !important; }
html body .category-description .liste-tik svg { width:20px !important; height:20px !important; color:var(--brand) !important; flex:none !important; margin-top:3px !important; }
html body .category-description .sektor-izgara { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:var(--s-4) !important; }
html body .category-description .sektor { display:flex !important; flex-direction:column !important; align-items:center !important; gap:var(--s-3) !important; padding:var(--s-6) var(--s-4) !important; text-align:center !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease) !important; }
html body .category-description .sektor:hover { border-color:var(--brand) !important; transform:translateY(-3px) !important; box-shadow:var(--shadow) !important; }
html body .category-description .sektor svg { width:32px !important; height:32px !important; color:var(--navy) !important; transition:color var(--dur) var(--ease) !important; }
html body .category-description .sektor:hover svg { color:var(--brand-metin) !important; }
html body .category-description .sektor span { font-size:var(--fs-base) !important; font-weight:700 !important; color:var(--ink) !important; }
html body .category-description .karusel__btn { display:flex !important; gap:var(--s-2) !important; }
html body .category-description .karusel__btn button { width:44px !important; height:44px !important; display:grid !important; place-items:center !important; border-radius:var(--radius) !important; border:1px solid var(--line) !important; background:#fff !important; color:var(--ink) !important; transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
html body .category-description .karusel__btn button:hover:not(:disabled) { background:var(--brand) !important; border-color:var(--brand) !important; color:#fff !important; }
html body .category-description .karusel__btn button:disabled { opacity:.4 !important; cursor:default !important; }
html body .category-description .karusel__btn svg { width:18px !important; height:18px !important; }
html body .category-description .neden { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:var(--s-8) !important; }
html body .category-description .neden__oge { position:relative !important; padding-top:var(--s-6) !important; border-top:2px solid var(--line) !important; }
html body .category-description .neden__oge::before { content:"" !important; position:absolute !important; top:-2px !important; left:0 !important; width:44px !important; height:2px !important; background:var(--brand) !important; }
html body .category-description .neden__oge svg { width:30px !important; height:30px !important; color:var(--brand) !important; margin-bottom:var(--s-4) !important; }
html body .category-description .neden__oge h3 { color:var(--ink) !important; font-size:var(--fs-md) !important; margin-bottom:var(--s-2) !important; }
html body .category-description .neden__oge p { color:var(--muted) !important; font-size:var(--fs-base) !important; margin:0 !important; }
html body .category-description .belge-serit { display:flex !important; align-items:center !important; gap:var(--s-8) !important; flex-wrap:wrap !important; justify-content:center !important; }
html body .category-description .belge { display:flex !important; align-items:center !important; gap:var(--s-4) !important; padding:var(--s-5) var(--s-6) !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; min-width:250px !important; }
html body .category-description .belge svg { width:34px !important; height:34px !important; color:var(--brand) !important; flex:none !important; }
html body .category-description .belge strong { display:block !important; color:var(--ink) !important; font-size:var(--fs-md) !important; line-height:1.3 !important; }
html body .category-description .belge span { font-size:var(--fs-sm) !important; color:var(--muted) !important; }
html body .category-description .icerik { font-size:var(--fs-md) !important; line-height:1.8 !important; color:var(--ink-2) !important; }
html body .category-description .icerik h2 { font-size:var(--fs-2xl) !important; margin-top:var(--s-10) !important; }
html body .category-description .icerik h3 { font-size:var(--fs-xl) !important; margin-top:var(--s-8) !important; }
html body .category-description .icerik h2:first-child,
html body .category-description .icerik h3:first-child { margin-top:0 !important; }
html body .category-description .icerik ul,
html body .category-description .icerik ol { margin-bottom:var(--s-5) !important; padding-left:1.5rem !important; }
html body .category-description .icerik li { margin-bottom:var(--s-3) !important; }
html body .category-description .icerik li::marker { color:var(--brand) !important; }
html body .category-description .icerik img { border-radius:var(--radius-lg) !important; margin-block:var(--s-6) !important; }
html body .category-description .icerik blockquote { margin:var(--s-8) 0 !important; padding:var(--s-6) var(--s-8) !important; background:var(--bg-soft) !important; border-left:3px solid var(--brand) !important; border-radius:0 var(--radius) var(--radius) 0 !important; font-size:var(--fs-lg) !important; font-style:italic !important; color:var(--ink) !important; }
html body .category-description .icerik a { text-decoration:underline !important; text-underline-offset:3px !important; }
html body .category-description .veri-notu { display:flex !important; align-items:flex-start !important; gap:var(--s-3) !important; padding:var(--s-4) var(--s-5) !important; border-radius:var(--radius) !important; background:#FFF8E8 !important; border:1px solid #F0DFB4 !important; color:#6B5518 !important; font-size:var(--fs-sm) !important; margin-bottom:var(--s-6) !important; }
html body .category-description .veri-notu svg { width:18px !important; height:18px !important; flex:none !important; margin-top:2px !important; }
html body .category-description .veri-notu p { margin:0 !important; }
html body .category-description .iletisim-izgara { display:grid !important; grid-template-columns:1fr 1.15fr !important; gap:clamp(2rem,4vw,4rem) !important; align-items:start !important; }
html body .category-description .iletisim-kart { border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; padding:var(--s-6) !important; display:flex !important; gap:var(--s-4) !important; align-items:flex-start !important; background:#fff !important; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease) !important; }
html body .category-description .iletisim-kart:hover { border-color:var(--brand) !important; box-shadow:var(--shadow) !important; }
html body .category-description .iletisim-kart__ikon { width:46px !important; height:46px !important; flex:none !important; display:grid !important; place-items:center !important; border-radius:var(--radius) !important; background:var(--brand-soft) !important; color:var(--brand-metin) !important; }
html body .category-description .iletisim-kart__ikon svg { width:22px !important; height:22px !important; }
html body .category-description .iletisim-kart h3 { font-size:var(--fs-md) !important; margin-bottom:var(--s-1) !important; }
html body .category-description .iletisim-kart p,
html body .category-description .iletisim-kart a { margin:0 !important; font-size:var(--fs-base) !important; color:var(--ink-2) !important; display:block !important; }
html body .category-description .iletisim-kart a:hover { color:var(--brand-metin) !important; }
html body .category-description .belge-kart { display:flex !important; flex-direction:column !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; overflow:hidden !important; background:#fff !important; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease) !important; }
html body .category-description .belge-kart:hover { border-color:var(--brand) !important; box-shadow:var(--shadow-lg) !important; transform:translateY(-4px) !important; }
html body .category-description .belge-kart__kapak { aspect-ratio:3/4 !important; background:var(--bg-soft) !important; overflow:hidden !important; border-bottom:1px solid var(--line) !important; }
html body .category-description .belge-kart__kapak img { width:100% !important; height:100% !important; object-fit:cover !important; }
html body .category-description .belge-kart__govde { padding:var(--s-5) !important; display:flex !important; flex-direction:column !important; gap:var(--s-2) !important; flex:1 !important; }
html body .category-description .belge-kart h3 { font-size:var(--fs-md) !important; margin:0 !important; }
html body .category-description .belge-kart__meta { font-size:var(--fs-xs) !important; color:var(--muted) !important; font-weight:700 !important; letter-spacing:.06em !important; text-transform:uppercase !important; }
html body .category-description .belge-kart__alt { margin-top:auto !important; padding-top:var(--s-4) !important; }
html body .category-description .galeri-izgara { display:grid !important; grid-template-columns:repeat(3,1fr) !important; gap:var(--s-4) !important; }
html body .category-description .lightbox__btn { display:flex !important; gap:var(--s-2) !important; }
html body .category-description .lightbox__btn button { width:44px !important; height:44px !important; display:grid !important; place-items:center !important; border-radius:var(--radius) !important; border:1px solid rgba(255,255,255,.28) !important; color:#fff !important; transition:background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
html body .category-description .lightbox__btn button:hover { background:#fff !important; color:var(--navy-900) !important; }
html body .category-description .lightbox__btn svg { width:20px !important; height:20px !important; }
@media (max-width:1023px) {
  html body .category-description .izgara--3,
html body .category-description .izgara--4 { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:599px) {
  html body .category-description .izgara--2,
html body .category-description .izgara--3,
html body .category-description .izgara--4 { grid-template-columns:1fr !important; }
}
@media (max-width:599px) {
  html body .category-description .ikon-btn { display:grid !important; place-items:center !important; width:42px !important; height:42px !important; border-radius:var(--radius) !important; color:var(--ink) !important; transition:background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
}
@media (max-width:1199px) {
  html body .category-description .mega__izgara { grid-template-columns:1fr 1fr 1fr !important; }
  html body .category-description .mega__kart { grid-column:1/-1 !important; flex-direction:row !important; align-items:center !important; }
}
@media (max-width:1099px) {
  html body .category-description .menu-btn { display:grid !important; }
}
@media (max-width:599px) {
  html body .category-description .izgara--kategori { grid-template-columns:1fr 1fr !important; gap:var(--s-4) !important; }
  html body .category-description .kategori-kart { padding:var(--s-5) var(--s-4) !important; gap:var(--s-3) !important; }
  html body .category-description .kategori-kart__ikon { width:44px !important; height:44px !important; }
  html body .category-description .kategori-kart__ikon svg { width:22px !important; height:22px !important; }
  html body .category-description .kategori-kart h3 { font-size:var(--fs-base) !important; }
}
@media (max-width:479px) {
  html body .category-description .kategori-kart p { display:none !important; }
}
@media (max-width:767px) {
  html body .category-description .rakamlar__izgara { grid-template-columns:1fr 1fr !important; gap:var(--s-6) !important; }
  html body .category-description }


.ikili { display:grid !important; grid-template-columns:1fr 1fr !important; gap:clamp(2rem,4vw,4rem) !important; align-items:center !important; }
  html body .category-description .ikili--gorsel-sag { direction:ltr !important; }
  html body .category-description .ikili__gorsel { position:relative !important; }
  html body .category-description .ikili__gorsel img { width:100% !important; border-radius:var(--radius-lg) !important; aspect-ratio:4/3 !important; object-fit:cover !important; }
  html body .category-description .ikili__gorsel::before { content:"" !important; position:absolute !important; left:-14px !important; top:-14px !important; width:120px !important; height:120px !important; border-left:3px solid var(--brand) !important; border-top:3px solid var(--brand) !important; border-radius:var(--radius-lg) 0 0 0 !important; }
}
@media (max-width:899px) {
  html body .category-description .ikili__rozet { right:var(--s-5) !important; }
  html body .category-description }

.liste-tik { list-style:none !important; padding:0 !important; margin:0 0 var(--s-8) !important; display:grid !important; gap:var(--s-3) !important; }
  html body .category-description .liste-tik li { display:flex !important; gap:var(--s-3) !important; align-items:flex-start !important; margin:0 !important; font-size:var(--fs-md) !important; }
  html body .category-description .liste-tik svg { width:20px !important; height:20px !important; color:var(--brand) !important; flex:none !important; margin-top:3px !important; }
  html body .category-description .sektor-izgara { display:grid !important; grid-template-columns:repeat(4,1fr) !important; gap:var(--s-4) !important; }
  html body .category-description .sektor { display:flex !important; flex-direction:column !important; align-items:center !important; gap:var(--s-3) !important; padding:var(--s-6) var(--s-4) !important; text-align:center !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; transition:border-color var(--dur) var(--ease),transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease) !important; }
}
@media (max-width:1099px) {
  html body .category-description .karusel__btn { display:flex !important; gap:var(--s-2) !important; }
  html body .category-description .karusel__btn button { width:44px !important; height:44px !important; display:grid !important; place-items:center !important; border-radius:var(--radius) !important; border:1px solid var(--line) !important; background:#fff !important; color:var(--ink) !important; transition:border-color var(--dur) var(--ease),background var(--dur) var(--ease),color var(--dur) var(--ease) !important; }
}
@media (max-width:1023px) {
  html body .category-description .neden { grid-template-columns:1fr 1fr !important; }
  html body .category-description .neden__oge { position:relative !important; padding-top:var(--s-6) !important; border-top:2px solid var(--line) !important; }
  html body .category-description .neden__oge::before { content:"" !important; position:absolute !important; top:-2px !important; left:0 !important; width:44px !important; height:2px !important; background:var(--brand) !important; }
  html body .category-description .neden__oge svg { width:30px !important; height:30px !important; color:var(--brand) !important; margin-bottom:var(--s-4) !important; }
  html body .category-description .neden__oge h3 { color:var(--ink) !important; font-size:var(--fs-md) !important; margin-bottom:var(--s-2) !important; }
  html body .category-description .neden__oge p { color:var(--muted) !important; font-size:var(--fs-base) !important; margin:0 !important; }
  html body .category-description .belge-serit { display:flex !important; align-items:center !important; gap:var(--s-8) !important; flex-wrap:wrap !important; justify-content:center !important; }
  html body .category-description .belge { display:flex !important; align-items:center !important; gap:var(--s-4) !important; padding:var(--s-5) var(--s-6) !important; background:#fff !important; border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; min-width:250px !important; }
}
@media (max-width:899px) {
  html body .category-description .iletisim-izgara { grid-template-columns:1fr !important; }
  html body .category-description }

.iletisim-kart { border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; padding:var(--s-6) !important; display:flex !important; gap:var(--s-4) !important; align-items:flex-start !important; background:#fff !important; transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease) !important; }
}
@media (max-width:899px) {
  html body .category-description .galeri-izgara { grid-template-columns:repeat(2,1fr) !important; }
}
/* =============================================================
   32. SAYFA BASLIGI (.pages-title) - a5 .sayfa-basi ile birebir
   ============================================================= */
.pages-title {
  background: var(--bg-soft) !important;
  padding-block: var(--s-12) !important;
  border-bottom: 1px solid var(--line) !important;
  position: relative !important;
  overflow: hidden !important;
}
.pages-title::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(620px 220px at 92% -20%, rgba(255,102,0,.12), transparent 70%) !important;
  pointer-events: none !important;
}
.pages-title > * { position: relative !important; z-index: 1 !important; }

/* h1 magaza adi + <br> + <span>sayfa adi</span> seklinde geliyor.
   Magaza adini gizle, yalniz sayfa adini goster. */
.pages-title h1 { font-size: 0 !important; line-height: 1 !important; margin: 0 !important; }
.pages-title h1 br { display: none !important; }
.pages-title h1 span {
  display: block !important;
  font-size: var(--fs-3xl) !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
  color: var(--ink) !important;
  margin-top: var(--s-4) !important;
}

/* Kirinti (breadcrumb) - a5 .kirinti gorunumu */
.pages-title .breadcrumb-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: var(--s-2) !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: var(--fs-sm) !important;
  color: var(--muted) !important;
}
.pages-title .breadcrumb-nav a { color: var(--muted) !important; text-decoration: none !important; }
.pages-title .breadcrumb-nav a:hover { color: var(--brand-metin) !important; }
.pages-title .breadcrumb-nav a + a::before,
.pages-title .breadcrumb-nav a + span::before { content: "/" !important; color: var(--line) !important; margin-right: var(--s-2) !important; }

/* =============================================================
   33. KURUMSAL SAYFA YERLESIMI - sol menu yok, tam genislik
   ============================================================= */
body.tm-kurumsal .col-lg-3.space-break { display: none !important; }
body.tm-kurumsal .col-lg-9.pl-lg-4 {
  flex: 0 0 100% !important;
  max-width: 100% !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.tm-kurumsal section > .container { max-width: none !important; padding: 0 !important; width: 100% !important; }
body.tm-kurumsal .category-page,
body.tm-kurumsal .category-description { width: 100% !important; }

/* a5'te bolumler tam genislik bant, icerik .kapsayici ile ortalanir */
body.tm-kurumsal .category-description > .bolum { width: 100% !important; }


/* --- 32b. .pages-title siralama duzeltmesi: once kirinti, sonra baslik --- */
.pages-title .container {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: var(--s-4) !important;
}
.pages-title .breadcrumb-nav { order: 1 !important; }
.pages-title h1 { order: 2 !important; margin-top: 0 !important; }
.pages-title h1 span { margin-top: 0 !important; }


/* --- 32c. Global gorsel-gizli (SVG sprite'i gizler) + .pages-title flex duzeni --- */
.gorsel-gizli {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
.pages-title {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: var(--s-4) !important;
}

/* =============================================================
   34. UST YAPI (topbar + header) - a5 statik tasarimi ile birebir
   ============================================================= */

/* --- 34.0 KRITIK: eski tema 2-navigation.css'te #navbar{top:50px}
       navbar'i 50px asagi kaydirip icerigin uzerine bindiriyordu. --- */
#navbar,
.th-navbar { top: 0 !important; }
.th-navbar.th-sticky { top: 0 !important; }

/* --- 34.1 Ust serit: koyu lacivert -> acik gri (a5 --bg-soft) --- */
.th-topbar {
  background: var(--bg-soft) !important;
  color: var(--muted) !important;
  border-bottom: 1px solid var(--line) !important;
}
.th-topbar__left a,
.th-topbar__left span { color: var(--ink-2) !important; }
.th-topbar__left a:hover { color: var(--brand-metin) !important; }
.th-topbar__left i,
.th-topbar__hours i { color: var(--brand) !important; }
.th-topbar__right a { color: var(--muted) !important; }
.th-topbar__right a:hover { color: var(--brand-metin) !important; }

/* --- 34.2 Menu hizasi: ortadan -> logonun yaninda sola --- */
.th-nav {
  flex: 0 1 auto !important;
  justify-content: flex-start !important;
  margin-left: var(--s-8) !important;
}
.th-navbar .th-container { justify-content: flex-start !important; }
.th-actions { margin-left: auto !important; }

/* --- 34.3 Logo ve header yuksekligi (a5: 52px / 76px) --- */
.th-logo img { height: 52px !important; }
.th-navbar .th-container { height: var(--header-h) !important; }

/* --- 34.4 Aktif menu gostergesi: turuncu + 3px alt cizgi --- */
.th-menu > li > a { position: relative !important; }
.th-menu > li > a::after {
  content: "" !important;
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 0 !important;
  height: 3px !important;
  background: var(--brand) !important;
  transform: scaleX(0) !important;
  transition: transform var(--dur) var(--ease) !important;
}
.th-menu > li > a[aria-current="page"] { color: var(--brand-metin) !important; }
.th-menu > li > a[aria-current="page"]::after { transform: scaleX(1) !important; }

/* --- 34.5 Mega menu kolon genisligi (a5: son kolon 280px) --- */
.th-mega__grid { grid-template-columns: 1fr 1fr 1fr 280px !important; }

/* --- 34.6 Mobilde logo (a5: 38px) --- */
@media (max-width: 992px) {
  .th-logo img { height: 38px !important; }
}

/* =============================================================
   35. BLOG - a5 statik tasarimi ile birebir
   Icerik panelden yonetilir (Blog menusu).
   ============================================================= */

html body .tm-blog .ok-link { display:inline-flex !important; align-items:center !important; gap:var(--s-2) !important; font-weight:700 !important; color:var(--navy) !important; font-size:var(--fs-base) !important; }
html body .tm-blog .ok-link svg { width:16px !important; height:16px !important; transition:transform var(--dur) var(--ease) !important; }
html body .tm-blog .ok-link:hover { color:var(--brand-metin) !important; }
html body .tm-blog .ok-link:hover svg { transform:translateX(4px) !important; }
html body .tm-blog .yazi-kart .kart__gorsel { aspect-ratio:16/10 !important; }
html body .tm-blog .yazi-kart__meta { display:flex !important; align-items:center !important; gap:var(--s-3) !important; flex-wrap:wrap !important; font-size:var(--fs-xs) !important; font-weight:700 !important; letter-spacing:.06em !important; text-transform:uppercase !important; color:var(--muted) !important; }
html body .tm-blog .yazi-kart__meta .tur { color:var(--brand-metin) !important; }
html body .tm-blog .yazi-kart__meta time { color:var(--muted) !important; }
html body .tm-blog .yazi-kart h3 { font-size:var(--fs-md) !important; line-height:1.4 !important; }
html body .tm-blog .yazi-kart p { font-size:var(--fs-base) !important; color:var(--muted) !important; display:-webkit-box !important; -webkit-line-clamp:3 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; }
html body .tm-blog .yazi-duzen { display:grid !important; grid-template-columns:minmax(0,1fr) 300px !important; gap:clamp(2rem,4vw,4rem) !important; align-items:start !important; }
html body .tm-blog .yazi-kapak { border-radius:var(--radius-lg) !important; overflow:hidden !important; border:1px solid var(--line) !important; aspect-ratio:16/9 !important; background:var(--bg-soft) !important; margin-bottom:var(--s-8) !important; }
html body .tm-blog .yazi-kapak img { width:100% !important; height:100% !important; object-fit:cover !important; }
html body .tm-blog .yazi-meta { display:flex !important; align-items:center !important; gap:var(--s-4) !important; flex-wrap:wrap !important; font-size:var(--fs-sm) !important; color:var(--muted) !important; margin-bottom:var(--s-6) !important; }
html body .tm-blog .yazi-meta .tur { font-weight:800 !important; letter-spacing:.08em !important; text-transform:uppercase !important; color:var(--brand-metin) !important; font-size:var(--fs-xs) !important; }
html body .tm-blog .yazi-meta span { display:inline-flex !important; align-items:center !important; gap:var(--s-2) !important; }
html body .tm-blog .yazi-meta svg { width:15px !important; height:15px !important; color:var(--muted) !important; }
html body .tm-blog .yan-kutu { border:1px solid var(--line) !important; border-radius:var(--radius-lg) !important; padding:var(--s-5) !important; background:#fff !important; margin-bottom:var(--s-5) !important; }
html body .tm-blog .yan-kutu h3 { font-size:var(--fs-xs) !important; font-weight:800 !important; letter-spacing:.12em !important; text-transform:uppercase !important; color:var(--muted) !important; padding-bottom:var(--s-3) !important; margin-bottom:var(--s-4) !important; border-bottom:1px solid var(--line) !important; }
html body .tm-blog .yan-kutu ul { list-style:none !important; margin:0 !important; padding:0 !important; display:grid !important; gap:var(--s-3) !important; }
html body .tm-blog .yan-kutu li { margin:0 !important; }
html body .tm-blog .yan-kutu a { font-size:var(--fs-base) !important; font-weight:600 !important; color:var(--ink-2) !important; line-height:1.45 !important; }
html body .tm-blog .yan-kutu a:hover { color:var(--brand-metin) !important; }
html body .tm-blog .yan-kutu--cta { background:var(--brand-soft) !important; border-color:#F7DCC8 !important; text-align:center !important; }
html body .tm-blog .yan-kutu--cta h3 { border:0 !important; color:var(--ink) !important; font-size:var(--fs-md) !important; letter-spacing:0 !important; text-transform:none !important; padding:0 !important; margin-bottom:var(--s-2) !important; }
html body .tm-blog .yan-kutu--cta p { font-size:var(--fs-base) !important; color:var(--ink-2) !important; margin-bottom:var(--s-5) !important; }
html body .tm-blog .yazi-gezinme { display:flex !important; justify-content:space-between !important; gap:var(--s-4) !important; flex-wrap:wrap !important; margin-top:var(--s-12) !important; padding-top:var(--s-8) !important; border-top:1px solid var(--line) !important; }
html body .tm-blog .liste-yazi { display:grid !important; grid-template-columns:260px 1fr !important; gap:var(--s-6) !important; align-items:center !important; padding:var(--s-6) 0 !important; border-bottom:1px solid var(--line) !important; }
html body .tm-blog .liste-yazi:last-child { border-bottom:0 !important; }
html body .tm-blog .liste-yazi__gorsel { border-radius:var(--radius-lg) !important; overflow:hidden !important; border:1px solid var(--line) !important; aspect-ratio:16/10 !important; background:var(--bg-soft) !important; }
html body .tm-blog .liste-yazi__gorsel img { width:100% !important; height:100% !important; object-fit:cover !important; transition:transform .5s var(--ease) !important; }
html body .tm-blog .liste-yazi:hover .liste-yazi__gorsel img { transform:scale(1.04) !important; }
html body .tm-blog .liste-yazi h3 { font-size:var(--fs-lg) !important; margin-bottom:var(--s-2) !important; }
html body .tm-blog .liste-yazi p { color:var(--muted) !important; margin-bottom:var(--s-3) !important; }
@media (max-width:1023px) {
  html body .tm-blog .yazi-duzen { grid-template-columns:1fr !important; }
  html body .tm-blog .yazi-kapak { border-radius:var(--radius-lg) !important; overflow:hidden !important; border:1px solid var(--line) !important; aspect-ratio:16/9 !important; background:var(--bg-soft) !important; margin-bottom:var(--s-8) !important; }
}
@media (max-width:699px) {
  html body .tm-blog .liste-yazi { grid-template-columns:1fr !important; gap:var(--s-4) !important; }
  html body .tm-blog .liste-yazi__gorsel { border-radius:var(--radius-lg) !important; overflow:hidden !important; border:1px solid var(--line) !important; aspect-ratio:16/10 !important; background:var(--bg-soft) !important; }
}
/* --- 35b. Blog listesi kapsayici + eski tema kalintilari --- */
html body .tm-blog .blogposts {
  display: flex !important;
  flex-direction: column !important;
}
html body .tm-blog .post-divider,
html body .tm-blog .read-more,
html body .tm-blog .post-details { display: none !important; }
html body .tm-blog .pd-comments { display: none !important; }
html body .tm-blog .liste-yazi img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
html body .tm-blog .liste-yazi h3 { margin: 0 0 var(--s-2) !important; font-size: var(--fs-xl) !important; font-weight: 800 !important; line-height: 1.3 !important; }
html body .tm-blog .liste-yazi h3 a { color: var(--ink) !important; text-decoration: none !important; }
html body .tm-blog .liste-yazi h3 a:hover { color: var(--brand-metin) !important; }
html body .tm-blog .liste-yazi p { color: var(--ink-2) !important; font-size: var(--fs-base) !important; line-height: 1.7 !important; margin: 0 0 var(--s-4) !important; }
html body .tm-blog .yazi-kart__meta .tur { color: var(--brand-metin) !important; }
html body .tm-blog .pager { margin: var(--s-8) 0 0 !important; }

/* --- 35c. Blog listesi: a5'te kenar cubugu yok --- */
/* Blog'da sol menu (Kategoriler / Blog Arsivi) KORUNUR - kullanici istegi */

/* --- 35d. Blog DETAY - a5 yazi duzeni --- */
html body .tm-yazi { max-width: 760px !important; }
html body .tm-yazi .yazi-meta {
  display: flex !important; align-items: center !important; gap: var(--s-4) !important;
  flex-wrap: wrap !important; font-size: var(--fs-xs) !important; font-weight: 700 !important;
  letter-spacing: .06em !important; text-transform: uppercase !important;
  color: var(--muted) !important; margin-bottom: var(--s-4) !important;
}
html body .tm-yazi .yazi-meta .tur { color: var(--brand-metin) !important; }
html body .tm-yazi .yazi-meta span { display: inline-flex !important; align-items: center !important; gap: var(--s-2) !important; }
html body .tm-yazi .yazi-meta svg { width: 14px !important; height: 14px !important; color: var(--brand) !important; }
html body .tm-yazi .yazi-baslik {
  font-size: var(--fs-3xl) !important; font-weight: 800 !important; line-height: 1.2 !important;
  color: var(--ink) !important; margin: 0 0 var(--s-6) !important;
}
html body .tm-yazi .yazi-kapak {
  border-radius: var(--radius-lg) !important; overflow: hidden !important;
  margin-bottom: var(--s-8) !important; border: 1px solid var(--line) !important;
}
html body .tm-yazi .yazi-kapak img { width: 100% !important; height: auto !important; display: block !important; }
html body .tm-yazi .icerik p { color: var(--ink-2) !important; font-size: var(--fs-md) !important; line-height: 1.8 !important; margin: 0 0 var(--s-5) !important; }
html body .tm-yazi .icerik h2 { font-size: var(--fs-xl) !important; font-weight: 800 !important; color: var(--ink) !important; margin: var(--s-8) 0 var(--s-3) !important; }
html body .tm-yazi .icerik h3 { font-size: var(--fs-lg) !important; font-weight: 800 !important; color: var(--ink) !important; margin: var(--s-6) 0 var(--s-3) !important; }
html body .tm-yazi .icerik ul { margin: 0 0 var(--s-5) !important; padding-left: var(--s-6) !important; }
html body .tm-yazi .icerik li { color: var(--ink-2) !important; font-size: var(--fs-md) !important; line-height: 1.8 !important; margin-bottom: var(--s-2) !important; }
html body .tm-yazi .icerik li::first-letter { color: inherit !important; font-size: inherit !important; font-weight: inherit !important; }
html body .tm-yazi .icerik li::before { content: none !important; }
html body .tm-yazi .icerik a { color: var(--brand-metin) !important; text-decoration: underline !important; }
html body .tm-yazi .icerik strong { color: var(--ink) !important; }
html body .tm-yazi .yazi-gezinme {
  margin-top: var(--s-10) !important; padding-top: var(--s-6) !important;
  border-top: 1px solid var(--line) !important;
}
html body .tm-yazi .ok-link {
  display: inline-flex !important; align-items: center !important; gap: var(--s-2) !important;
  font-weight: 700 !important; color: var(--navy) !important; font-size: var(--fs-base) !important;
  text-decoration: none !important;
}
html body .tm-yazi .ok-link:hover { color: var(--brand-metin) !important; }
html body .tm-yazi .ok-link svg { width: 16px !important; height: 16px !important; }
/* a5'te yazi detayinda yorum bolumu yok */
html body .tm-yazi .tm-yorum { display: none !important; }

/* --- 36. Tema kalintisi: .category-description basliklarindaki
       ortalama + 3px dikey cubuk (::before) a5'te yok --- */
body.tm-kurumsal .category-description h2,
body.tm-kurumsal .category-description h3,
body.tm-kurumsal .category-description h4,
html body .tm-yazi .icerik h2,
html body .tm-yazi .icerik h3 {
  text-align: left !important;
  padding-left: 0 !important;
}
body.tm-kurumsal .category-description h2::before,
body.tm-kurumsal .category-description h3::before,
body.tm-kurumsal .category-description h4::before,
html body .tm-yazi .icerik h2::before,
html body .tm-yazi .icerik h3::before {
  content: none !important;
  display: none !important;
}
/* a5'te bolum basligi ortali olabilir - onu koru */
body.tm-kurumsal .category-description .bolum-baslik h2 { text-align: inherit !important; }

/* --- 37. Blog sol menusu (Kategoriler / Blog Arsivi / Etiketler) --- */
body.tm-blog-sayfa aside.departments { display: block !important; }

/* Yalniz gercek panelleri kutula - .clear ayraclari haric */
body.tm-blog-sayfa aside.departments .aside-list-group,
body.tm-blog-sayfa aside.departments .aside-tags {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  margin: 0 0 var(--s-6) !important;
}
body.tm-blog-sayfa aside.departments .clear {
  display: none !important;
  clear: none !important;
  height: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  background: none !important;
}
/* Bos panel (ornegin hic blog kategorisi yokken) gizlenir - JS isaretler */
body.tm-blog-sayfa aside.departments .tm-bos-panel { display: none !important; }

body.tm-blog-sayfa aside.departments h3,
body.tm-blog-sayfa aside.departments h4 {
  font-size: var(--fs-xs) !important;
  font-weight: 800 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  color: var(--brand-metin) !important;
  margin: 0 !important;
  padding: var(--s-4) var(--s-5) !important;
  background: var(--bg-soft) !important;
  border-bottom: 1px solid var(--line) !important;
  text-align: left !important;
}
body.tm-blog-sayfa aside.departments h3::before,
body.tm-blog-sayfa aside.departments h4::before { content: none !important; display: none !important; }

body.tm-blog-sayfa aside.departments ul,
body.tm-blog-sayfa aside.departments .list-group {
  list-style: none !important; margin: 0 !important; padding: 0 !important;
}
body.tm-blog-sayfa aside.departments li { margin: 0 !important; border-bottom: 1px solid var(--line-2) !important; }
body.tm-blog-sayfa aside.departments li:last-child { border-bottom: 0 !important; }
body.tm-blog-sayfa aside.departments li::before,
body.tm-blog-sayfa aside.departments li::marker { content: none !important; }

/* Arsiv: yil basligi + ay linkleri */
body.tm-blog-sayfa aside.departments .list-group > a,
body.tm-blog-sayfa aside.departments li > a {
  display: block !important;
  padding: var(--s-3) var(--s-5) !important;
  color: var(--ink-2) !important;
  font-size: var(--fs-base) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--line-2) !important;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease) !important;
}
body.tm-blog-sayfa aside.departments .list-group > a:hover,
body.tm-blog-sayfa aside.departments li > a:hover {
  background: var(--bg-soft) !important; color: var(--brand-metin) !important;
}
body.tm-blog-sayfa aside.departments .list-group > a:last-child { border-bottom: 0 !important; }
/* Yil basligi (link olmayan metin) */
body.tm-blog-sayfa aside.departments .list-group > span,
body.tm-blog-sayfa aside.departments .list-group > strong,
body.tm-blog-sayfa aside.departments .year {
  display: block !important;
  padding: var(--s-3) var(--s-5) var(--s-1) !important;
  font-weight: 800 !important;
  color: var(--brand-metin) !important;
  font-size: var(--fs-md) !important;
}

/* Etiket bulutu */
body.tm-blog-sayfa aside.departments .aside-tags .tags,
body.tm-blog-sayfa aside.departments .aside-tags > div:not(.form-title) {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: var(--s-2) !important;
  padding: var(--s-4) var(--s-5) !important;
}
body.tm-blog-sayfa aside.departments .aside-tags a {
  display: inline-block !important;
  padding: 4px 10px !important;
  border: 1px solid var(--line) !important;
  border-radius: 999px !important;
  background: var(--bg-soft) !important;
  color: var(--ink-2) !important;
  font-size: var(--fs-sm) !important;
  text-decoration: none !important;
  border-bottom: 1px solid var(--line) !important;
}
body.tm-blog-sayfa aside.departments .aside-tags a:hover {
  background: var(--brand-soft) !important; color: var(--brand-metin) !important; border-color: var(--brand) !important;
}

/* =============================================================
   38. URUN GALERISI - a5 duzeni (ana gorsel + kucuk resimler)
   ============================================================= */
.product-view .shop-single-slider { max-width: 100% !important; }

/* Ana gorsel cercevesi */
.product-view .slider-for.urun-galeri__ana {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: #fff !important;
  aspect-ratio: 1 !important;
  overflow: hidden !important;
  display: block !important;
  padding: clamp(1rem, 3vw, 2rem) !important;
}
.product-view .slider-for.urun-galeri__ana .slick-list,
.product-view .slider-for.urun-galeri__ana .slick-track { height: 100% !important; }
.product-view .slider-for.urun-galeri__ana .slick-slide > div,
.product-view .slider-for.urun-galeri__ana .slick-slide a { display: block !important; height: 100% !important; }
.product-view .slider-for.urun-galeri__ana img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Gorseli olmayan urun: no-image gorseli ortada, soluk */
.product-view .urun-galeri__ana--bos {
  display: grid !important;
  place-items: center !important;
  background: var(--bg-soft) !important;
}
.product-view img.tm-gorsel-yok {
  max-width: 60% !important;
  width: auto !important;
  height: auto !important;
  opacity: .55 !important;
  object-fit: contain !important;
}

/* Kucuk resimler: a5'te 4 sutunlu kare izgara */
.product-view .slider-nav.urun-galeri__kucuk { margin-top: var(--s-3) !important; }
.product-view .slider-nav.urun-galeri__kucuk .slick-slide {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important;
  background: #fff !important;
  overflow: hidden !important;
  aspect-ratio: 1 !important;
  padding: var(--s-2) !important;
  margin-right: var(--s-3) !important;
  cursor: pointer !important;
  transition: border-color var(--dur) var(--ease) !important;
}
.product-view .slider-nav.urun-galeri__kucuk .slick-slide:hover { border-color: var(--muted) !important; }
.product-view .slider-nav.urun-galeri__kucuk .slick-current,
.product-view .slider-nav.urun-galeri__kucuk .slick-slide[aria-current="true"] {
  border-color: var(--brand) !important;
  border-width: 2px !important;
}
.product-view .slider-nav.urun-galeri__kucuk img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* Tek gorsel varken kucuk resim seridi gosterilmez (bos kutu gorunuyordu) */
.product-view .slider-nav.tm-gizle { display: none !important; }

/* --- 38b. No-image duzeltmesi: ozgulluk + en-boy orani --- */
.product-view .slider-for.urun-galeri__ana.urun-galeri__ana--bos {
  display: grid !important;
  place-items: center !important;
  background: var(--bg-soft) !important;
}
.product-view .slider-for.urun-galeri__ana.urun-galeri__ana--bos .slick-list,
.product-view .slider-for.urun-galeri__ana.urun-galeri__ana--bos .slick-track {
  display: none !important;
}
.product-view .slider-for.urun-galeri__ana img.tm-gorsel-yok {
  width: 58% !important;
  height: auto !important;
  max-width: 58% !important;
  max-height: none !important;
  object-fit: contain !important;
  opacity: .5 !important;
  display: block !important;
}

/* --- 38c. Gorseli olmayan urun: slick disinda bagimsiz cerceve --- */
.product-view .shop-single-slider .tm-gizle { display: none !important; }
.product-view .urun-galeri__bos {
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  background: var(--bg-soft) !important;
  aspect-ratio: 1 !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}
.product-view .urun-galeri__bos img.tm-gorsel-yok {
  width: 58% !important;
  height: auto !important;
  max-width: 58% !important;
  max-height: none !important;
  object-fit: contain !important;
  opacity: .5 !important;
  display: block !important;
}

/* =============================================================
   39. DIL SECICI (ust serit) + temel RTL katmani
   ============================================================= */
.th-topbar .th-lang {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-left: var(--s-3) !important;
  color: var(--muted) !important;
}
.th-topbar .th-lang__ikon { width: 15px !important; height: 15px !important; flex: none !important; }
.th-topbar .th-lang select,
.th-topbar .th-lang .languagelist {
  appearance: auto !important;
  background: transparent !important;
  border: 0 !important;
  color: var(--ink-2) !important;
  font-size: 13px !important;
  font-family: inherit !important;
  padding: 2px 4px !important;
  cursor: pointer !important;
  max-width: 140px !important;
}
.th-topbar .th-lang select:focus { outline: 2px solid var(--brand) !important; outline-offset: 2px !important; }
/* Bayrak dugmeleri: dogal boyutlari farkli (tr/us 32x32, sa 16x11) -> esitle */
.th-topbar .th-lang input[type="image"],
.th-topbar .th-lang img {
  width: 22px !important;
  height: 15px !important;
  object-fit: cover !important;
  display: inline-block !important;
  vertical-align: middle !important;
  border: 1px solid rgba(0,0,0,.12) !important;
  border-radius: 2px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: .75 !important;
  transition: opacity var(--dur) var(--ease), border-color var(--dur) var(--ease) !important;
  cursor: pointer !important;
  flex: none !important;
}
.th-topbar .th-lang input[type="image"]:hover,
.th-topbar .th-lang img:hover { opacity: 1 !important; border-color: var(--brand) !important; }
.th-topbar .th-lang .languagelist,
.th-topbar .th-lang select { display: none !important; }

/* --- Temel RTL (Arapca ar-SA, Farsca fa-IR) --- */
[dir="rtl"] body { text-align: right !important; }
[dir="rtl"] .th-topbar .th-container,
[dir="rtl"] .th-navbar .th-container { flex-direction: row-reverse !important; }
[dir="rtl"] .th-nav { margin-left: 0 !important; margin-right: var(--s-8) !important; }
[dir="rtl"] .th-actions { margin-left: 0 !important; margin-right: auto !important; }
[dir="rtl"] .pages-title,
[dir="rtl"] .pages-title .breadcrumb-nav { align-items: flex-end !important; }
[dir="rtl"] .pages-title h1 span { text-align: right !important; }
[dir="rtl"] .kirinti,
[dir="rtl"] .tm-breadcrumb { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] .tm-sekme .tablo th,
[dir="rtl"] .tm-sekme .tablo td { text-align: right !important; }
[dir="rtl"] .tm-sekme .icerik ul,
[dir="rtl"] .tm-yazi .icerik ul { padding-left: 0 !important; padding-right: var(--s-6) !important; }
[dir="rtl"] .urun-ozet-tablo dl { direction: rtl !important; }
[dir="rtl"] .tm-blog .liste-yazi { direction: rtl !important; }
[dir="rtl"] .tf-grid,
[dir="rtl"] .alt-bilgi__izgara { direction: rtl !important; }
[dir="rtl"] .ok-link svg { transform: scaleX(-1) !important; }

/* --- 39b. Dil secici hizalama --- */
.th-topbar .th-lang { line-height: 1 !important; gap: 5px !important; }
.th-topbar .th-lang .th-lang__ikon { opacity: .6 !important; }
[dir="rtl"] .th-topbar .th-lang { flex-direction: row-reverse !important; }

/* --- 40. Yazi/haber detayinda baslik tekrarini kaldir
       (a5'te baslik yalnizca sayfa basligi bandinda yer alir) --- */
html body .tm-yazi .yazi-baslik { display: none !important; }
html body .tm-yazi .yazi-meta { margin-bottom: var(--s-6) !important; }

/* =============================================================
   41. COK DILLI URUN SEKMELERI
   Nop_ProductTabs'ta LanguageID yok; onun yerine slot'lar dile ayrildi:
   1-3 Turkce, 4-6 Ingilizce, 7-9 Arapca (bkz. Modules/ProductTabs.ascx).
   ============================================================= */
/* GUNCEL: sekmeler artik her dilde panelden geliyor (slot 1-3 TR, 4-6 EN, 7-9 AR).
   Bu yuzden FullDescription her dilde gizli; yalniz JS ozet tablosunu ondan okur. */
html body .product-view .fulldescription { display: none !important; }
html body .product-view .tm-sekme--panel { display: block !important; }

/* =============================================================
   42. RTL DUZELTMELERI (Arapca / Farsca)
   ============================================================= */

/* --- Telefon/numara: RTL'de rakam sirasi bozuluyordu --- */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] .th-topbar__left a[href^="tel:"] span,
[dir="rtl"] .tf-contact a[href^="tel:"],
[dir="rtl"] .urun-yardim a[href^="tel:"] {
  direction: ltr !important;
  unicode-bidi: embed !important;
  display: inline-block !important;
}
/* E-posta ve saat araligi da LTR kalmali */
[dir="rtl"] a[href^="mailto:"],
[dir="rtl"] .th-topbar__hours {
  direction: ltr !important;
  unicode-bidi: embed !important;
}
[dir="rtl"] .th-topbar__hours { display: inline-flex !important; }

/* --- Hero: RTL'de metin sagda; okunurluk icin sag taraftan perde --- */
[dir="rtl"] .tm-hero__ic { margin-left: auto !important; margin-right: 0 !important; text-align: right !important; }
[dir="rtl"] .tm-hero__overlay {
  background: linear-gradient(to left, rgba(255,255,255,.92) 0%, rgba(255,255,255,.75) 38%, rgba(255,255,255,0) 68%) !important;
}
[dir="rtl"] .tm-hero__btn { justify-content: flex-end !important; }
[dir="rtl"] .tm-hero__etiket { flex-direction: row-reverse !important; }

/* --- Bolum basliklari ve kartlar --- */
[dir="rtl"] .tm-serit__oge,
[dir="rtl"] .tm-urunler__grid,
[dir="rtl"] .tm-secilmis__grid { direction: rtl !important; }
[dir="rtl"] .bolum-baslik,
[dir="rtl"] .etiket { text-align: right !important; }
[dir="rtl"] .etiket { flex-direction: row-reverse !important; }

/* --- Urun karti ve liste --- */
[dir="rtl"] .team-portrait,
[dir="rtl"] .item-box { direction: rtl !important; text-align: right !important; }

/* --- Yardim kutusu ve aksiyon --- */
[dir="rtl"] .urun-yardim { flex-direction: row-reverse !important; text-align: right !important; }
[dir="rtl"] .urun-aksiyon { justify-content: flex-end !important; }
[dir="rtl"] .tm-btn-primary svg,
[dir="rtl"] .urun-aksiyon svg { transform: scaleX(-1) !important; }

/* --- Sekme basliklari --- */
[dir="rtl"] .tm-sekme .sekme__basliklar { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] .tm-sekme .icerik,
[dir="rtl"] .tm-sekme .veri-notu { text-align: right !important; }
[dir="rtl"] .tm-sekme .veri-notu { flex-direction: row-reverse !important; }

/* --- 42b. Sayfa basligi bandi ve kirinti RTL --- */
[dir="rtl"] .pages-title { align-items: flex-end !important; text-align: right !important; }
[dir="rtl"] .pages-title h1,
[dir="rtl"] .pages-title h1 span { text-align: right !important; }
[dir="rtl"] .pages-title .breadcrumb-nav { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] .pages-title .breadcrumb-nav a + a::before,
[dir="rtl"] .pages-title .breadcrumb-nav a + span::before { margin-right: 0 !important; margin-left: var(--s-2) !important; }
[dir="rtl"] section.page-title .tm-breadcrumb { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] section.page-title h1 { text-align: right !important; }

/* --- 42c. Blog / haber listesi RTL --- */
/* TEMSAN: RTL'de izgara zaten aynalanir; 260px kolon saga, gorsel de oraya duser.
   Onceki "1fr 260px" + order:2 ikilisi gorseli sola aliyordu (aynalama bozuluyordu). */
[dir="rtl"] .tm-blog .liste-yazi { direction: rtl !important; }
/* TEMSAN: RTL'de izgara zaten aynalaniyor; order kurali aynalamayi bozuyordu - kaldirildi
   [dir="rtl"] .tm-blog .liste-yazi__gorsel { order: 2 !important; } */
[dir="rtl"] .tm-blog .yazi-kart__meta { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] .tm-blog .ok-link,
[dir="rtl"] .tm-yazi .ok-link { flex-direction: row-reverse !important; }
[dir="rtl"] .tm-blog .ok-link svg,
[dir="rtl"] .tm-yazi .ok-link svg { transform: scaleX(-1) !important; }
[dir="rtl"] .tm-yazi .yazi-meta { flex-direction: row-reverse !important; justify-content: flex-end !important; }
[dir="rtl"] .tm-yazi .icerik { text-align: right !important; }
[dir="rtl"] aside.departments { direction: rtl !important; text-align: right !important; }

/* ============================================================
   43) TEMSAN - Blog / Haber temsili kapak gorseli (App_Code/TemsanKapak.cs)
   Gercek gorsel yuklenmemis yazilarda, basligi uzerinde yazan ve
   yaziya gore rengi degisen inline SVG kapak uretilir.
   ============================================================ */
html body svg.tm-kapak {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: inherit !important;
}
html body .tm-blog .liste-yazi__gorsel svg.tm-kapak,
html body .liste-yazi__gorsel svg.tm-kapak {
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .5s var(--ease) !important;
}
html body .tm-blog .liste-yazi:hover .liste-yazi__gorsel svg.tm-kapak { transform: scale(1.04) !important; }

/* Detay sayfasindaki kapak: 16/9 cerceve, tasma yok */
html body .tm-yazi .yazi-kapak svg.tm-kapak {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
}

/* ============================================================
   44) TEMSAN - Urun grubu kartlari (a5 .kategori-kart birebir)
   ProductsInGrid.ascx: alt kategoriler duzlestirilerek 19 grup listelenir.
   a5'te kartta gorsel YOK; ikon + baslik + aciklama + urun sayisi var.
   ============================================================ */
html body .sub-category-grid { display: block !important; margin: 0 0 var(--s-10) !important;
  grid-template-columns: none !important; gap: 0 !important; }
html body .sub-category-grid table,
html body .sub-category-grid tbody,
html body .sub-category-grid tr { display: contents !important; }
html body .sub-category-grid > table { display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: var(--s-5) !important; width: 100% !important; }
html body .sub-category-grid td.item-box { display: block !important; padding: 0 !important; vertical-align: stretch !important; }

html body .tm-kat-kart {
  display: flex !important; flex-direction: column !important; gap: var(--s-4) !important;
  padding: var(--s-6) !important; height: 100% !important;
  background: #fff !important; border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important; position: relative !important; overflow: hidden !important;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease) !important;
}
html body .tm-kat-kart::before {
  content: "" !important; position: absolute !important; inset: 0 auto 0 0 !important;
  width: 3px !important; background: var(--brand) !important;
  transform: scaleY(0) !important; transform-origin: top !important; transition: transform .3s var(--ease) !important;
}
html body .tm-kat-kart:hover { box-shadow: var(--shadow-lg) !important; transform: translateY(-4px) !important; }
html body .tm-kat-kart:hover::before { transform: scaleY(1) !important; }

/* a5'te kartta gorsel yok -- yer tutucu "no image" gizlenir */
html body .tm-kat-kart .picture { display: none !important; }

html body .tm-kat-kart__ikon {
  width: 52px !important; height: 52px !important; display: grid !important; place-items: center !important;
  flex: none !important; background: var(--brand-soft) !important; color: var(--brand) !important;
  border-radius: var(--radius) !important; position: static !important;
  transition: background .3s var(--ease), color .3s var(--ease) !important;
}
html body .tm-kat-kart:hover .tm-kat-kart__ikon { background: var(--brand) !important; color: #fff !important; }
html body .tm-kat-kart__ikon svg { width: 26px !important; height: 26px !important; }

html body .tm-kat-kart .sub-category-body { display: flex !important; flex-direction: column !important;
  gap: var(--s-2) !important; flex: 1 1 auto !important; }
html body .tm-kat-kart .category-title { margin: 0 !important; font-size: var(--fs-md) !important;
  font-weight: 800 !important; line-height: 1.3 !important; }
html body .tm-kat-kart .category-title a { color: var(--ink) !important; text-decoration: none !important; }
html body .tm-kat-kart:hover .category-title a { color: var(--brand-metin) !important; }
html body .tm-kat-kart .sub-category-desc { margin: 0 !important; color: var(--muted) !important;
  font-size: var(--fs-sm) !important; line-height: 1.6 !important; }
html body .tm-kat-kart .sub-category-arrow { margin-top: auto !important; padding-top: var(--s-3) !important;
  font-size: var(--fs-xs) !important; font-weight: 700 !important; color: var(--muted) !important;
  letter-spacing: .04em !important; }
html body .tm-kat-kart .sub-category-arrow em { font-style: normal !important; color: var(--brand) !important; }

[dir="rtl"] .tm-kat-kart::before { inset: 0 0 0 auto !important; }
[dir="rtl"] .tm-kat-kart .sub-category-arrow em { display: inline-block !important; transform: scaleX(-1) !important; }

@media (max-width: 1199px) { html body .sub-category-grid > table { grid-template-columns: repeat(3, minmax(0,1fr)) !important; } }
@media (max-width: 899px)  { html body .sub-category-grid > table { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 599px)  {
  html body .tm-kat-kart { padding: var(--s-5) var(--s-4) !important; gap: var(--s-3) !important; }
  html body .tm-kat-kart__ikon { width: 44px !important; height: 44px !important; }
  html body .tm-kat-kart__ikon svg { width: 22px !important; height: 22px !important; }
  html body .tm-kat-kart .category-title { font-size: var(--fs-base) !important; }
}

/* ============================================================
   45) TEMSAN - Arama sonuclari sayfasi (a5 arama.html bandi)
   ============================================================ */
html body .search-panel .tm-arama-baslik {
  padding: var(--s-10) 0 var(--s-6) !important;
  border-bottom: 1px solid var(--line) !important;
  margin-bottom: var(--s-8) !important;
}
html body .search-panel .tm-arama-baslik h1 {
  font-size: clamp(28px, 3.2vw, 40px) !important;
  font-weight: 800 !important;
  letter-spacing: -.02em !important;
  color: var(--ink) !important;
  margin: 0 !important;
}
html body .search-panel .search-input { margin-bottom: var(--s-8) !important; }

/* ============================================================
   46) TEMSAN - 404 sayfasi (a5 404.html)
   ============================================================ */
html body .tm-404 { padding: var(--s-16) 0 var(--s-20) !important; text-align: center !important; }
html body .tm-404 .kapsayici--dar { max-width: 900px !important; margin: 0 auto !important; padding: 0 24px !important; }
html body .tm-404__kod {
  font-size: clamp(64px, 9vw, 112px) !important; font-weight: 800 !important; line-height: 1 !important;
  color: var(--brand) !important; letter-spacing: -.04em !important; margin: 0 0 var(--s-4) !important;
}
html body .tm-404 h1 { font-size: clamp(24px, 3vw, 36px) !important; font-weight: 800 !important; margin: 0 0 var(--s-4) !important; }
html body .tm-404__metin { color: var(--muted) !important; max-width: 56ch !important; margin: 0 auto var(--s-8) !important; }
html body .tm-404__butonlar { display: flex !important; gap: var(--s-4) !important; flex-wrap: wrap !important;
  justify-content: center !important; margin-bottom: var(--s-12) !important; }
html body .tm-404__kartlar { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: var(--s-5) !important; text-align: start !important; }
html body .tm-404__kartlar .tm-kat-kart { text-decoration: none !important; }
@media (max-width: 899px) { html body .tm-404__kartlar { grid-template-columns: 1fr !important; } }

/* --- 45b. Arama sonuc kartlari --- */
html body .search-results .product-list1 { display: flex !important; flex-direction: column !important; }
html body .tm-arama-kart {
  padding: var(--s-6) 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
html body .tm-arama-kart:last-child { border-bottom: 0 !important; }
html body .tm-arama-kart h2 { margin: 0 0 var(--s-2) !important; font-size: var(--fs-lg) !important; font-weight: 800 !important; }
html body .tm-arama-kart h2 a { color: var(--ink) !important; text-decoration: none !important; }
html body .tm-arama-kart h2 a:hover { color: var(--brand-metin) !important; }
html body .tm-arama-kart p { color: var(--muted) !important; margin: 0 0 var(--s-3) !important; line-height: 1.7 !important; }

/* ============================================================
   47) TEMSAN - E-Katalog ve Galeri (a5 e-katalog.html / galeri.html)
   ============================================================ */
html body .tm-medya .kapsayici { max-width: 1240px !important; margin: 0 auto !important; padding: 0 !important; }

/* Veri notu seridi */
html body .veri-notu {
  display: flex !important; align-items: flex-start !important; gap: var(--s-3) !important;
  padding: var(--s-4) var(--s-5) !important; border-radius: var(--radius) !important;
  background: #FFF8E8 !important; border: 1px solid #F0DFB4 !important; color: #6B5518 !important;
  font-size: var(--fs-sm) !important; margin: 0 0 var(--s-8) !important; max-width: 760px !important;
}
html body .veri-notu svg { width: 18px !important; height: 18px !important; flex: none !important; margin-top: 2px !important; }
html body .veri-notu p { margin: 0 !important; }

/* --- E-Katalog kartlari --- */
html body .belge-izgara {
  display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: var(--s-5) !important;
}
@media (max-width: 899px) { html body .belge-izgara { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 559px) { html body .belge-izgara { grid-template-columns: 1fr !important; } }
html body .belge-kart {
  display: flex !important; flex-direction: column !important; background: #fff !important;
  border: 1px solid var(--line) !important; border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease) !important;
}
html body .belge-kart:hover { border-color: var(--brand) !important; box-shadow: var(--shadow-lg) !important; transform: translateY(-4px) !important; }
html body .belge-kart__kapak { aspect-ratio: 3/4 !important; background: var(--bg-soft) !important;
  overflow: hidden !important; border-bottom: 1px solid var(--line) !important; }
html body .belge-kart__kapak img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
html body .belge-kart__govde { padding: var(--s-5) !important; display: flex !important; flex-direction: column !important;
  gap: var(--s-2) !important; flex: 1 1 auto !important; }
html body .belge-kart__meta { font-size: var(--fs-xs) !important; color: var(--muted) !important;
  font-weight: 700 !important; letter-spacing: .06em !important; text-transform: uppercase !important; }
html body .belge-kart h3 { font-size: var(--fs-md) !important; font-weight: 800 !important; margin: 0 !important; }
html body .belge-kart p { color: var(--muted) !important; font-size: var(--fs-base) !important; margin: 0 !important; }
html body .belge-kart__alt { margin-top: auto !important; padding-top: var(--s-4) !important; }
html body .belge-kart__alt .th-btn { width: 100% !important; justify-content: center !important; }

/* --- Galeri --- */
html body .medya-filtre {
  display: flex !important; gap: var(--s-2) !important; flex-wrap: wrap !important;
  margin: 0 0 var(--s-8) !important; padding-bottom: var(--s-5) !important;
  border-bottom: 1px solid var(--line) !important;
}
html body .medya-filtre button {
  padding: .5rem 1.125rem !important; border: 1px solid var(--line) !important; border-radius: 100px !important;
  font-size: var(--fs-base) !important; font-weight: 700 !important; color: var(--ink-2) !important;
  background: #fff !important; cursor: pointer !important;
  transition: border-color .2s var(--ease), background .2s var(--ease), color .2s var(--ease) !important;
}
html body .medya-filtre button:hover { border-color: var(--brand) !important; color: var(--brand-metin) !important; }
html body .medya-filtre button[aria-pressed="true"] { background: var(--brand) !important;
  border-color: var(--brand) !important; color: #fff !important; }

html body .galeri-izgara { display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: var(--s-4) !important; }
@media (max-width: 899px) { html body .galeri-izgara { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 559px) { html body .galeri-izgara { grid-template-columns: 1fr !important; } }
html body .galeri-oge {
  position: relative !important; display: block !important; border-radius: var(--radius-lg) !important;
  overflow: hidden !important; border: 1px solid var(--line) !important;
  aspect-ratio: 4/3 !important; background: var(--bg-soft) !important;
}
html body .galeri-oge img { width: 100% !important; height: 100% !important; object-fit: cover !important;
  display: block !important; transition: transform .5s var(--ease) !important; }
html body .galeri-oge:hover img { transform: scale(1.05) !important; }
html body .galeri-oge__ust {
  position: absolute !important; inset: auto 0 0 0 !important; padding: var(--s-5) !important;
  background: linear-gradient(transparent, rgba(8,36,61,.78)) !important; color: #fff !important;
  font-weight: 700 !important; font-size: var(--fs-base) !important;
}
html body .galeri-oge[hidden] { display: none !important; }

/* --- Lightbox --- */
html body .tm-lightbox {
  position: fixed !important; inset: 0 !important; z-index: 9999 !important;
  background: rgba(8,36,61,.88) !important; display: grid !important; place-items: center !important;
  padding: clamp(1rem,4vw,3rem) !important; opacity: 0 !important; visibility: hidden !important;
  transition: opacity .25s ease, visibility .25s !important;
}
html body .tm-lightbox.acik { opacity: 1 !important; visibility: visible !important; }
html body .tm-lightbox__ic { max-width: min(1100px, 92vw) !important; width: 100% !important; }
html body .tm-lightbox__gorsel { background: #fff !important; border-radius: var(--radius-lg) !important;
  overflow: hidden !important; max-height: 76vh !important; display: grid !important; place-items: center !important; }
html body .tm-lightbox__gorsel img { width: 100% !important; max-height: 76vh !important; object-fit: contain !important; }
html body .tm-lightbox__alt { display: flex !important; align-items: center !important;
  justify-content: space-between !important; gap: var(--s-4) !important; margin-top: var(--s-4) !important;
  color: #fff !important; flex-wrap: wrap !important; }
html body .tm-lightbox__baslik { font-weight: 700 !important; font-size: var(--fs-md) !important; }
html body .tm-lightbox__sayac { color: rgba(255,255,255,.7) !important; font-size: var(--fs-sm) !important;
  font-variant-numeric: tabular-nums !important; }
html body .tm-lightbox__btn { display: flex !important; gap: var(--s-2) !important; }
html body .tm-lightbox__btn button {
  width: 44px !important; height: 44px !important; display: grid !important; place-items: center !important;
  border-radius: var(--radius) !important; border: 1px solid rgba(255,255,255,.28) !important;
  background: transparent !important; color: #fff !important; font-size: 20px !important; cursor: pointer !important;
  transition: background .2s ease, color .2s ease !important;
}
html body .tm-lightbox__btn button:hover { background: #fff !important; color: var(--navy-900) !important; }
[dir="rtl"] .tm-lightbox__btn { flex-direction: row-reverse !important; }

/* ============================================================
   48) TEMSAN - Mobil duzeltmeler (375 / 768 px)
   ============================================================ */
/* Ust serit: telefon disindaki her sey mobilde gizli (a5 .gizle-mobil davranisi).
   Onceden e-posta ve calisma saati sarmalanip serit 117px yuksekliye cikiyordu. */
@media (max-width: 767px) {
  html body .th-topbar .th-hide-m { display: none !important; }
  html body .th-topbar,
  html body .th-topbar .th-container,
  html body .th-topbar__left,
  html body .th-topbar__right {
    min-height: 0 !important;
    flex-wrap: nowrap !important;
  }
  html body .th-topbar a,
  html body .th-topbar span { white-space: nowrap !important; }
  html body .th-topbar { padding: 6px 0 !important; font-size: 13px !important; }
  /* dil secici mobilde de gorunsun */
  html body .th-topbar .th-lang { display: inline-flex !important; }
  html body .th-topbar .th-lang__ikon { display: none !important; }
}

/* ============================================================
   49) TEMSAN - Kenar cubugu olmayan sayfalarda hizalama ve bosluk
   Sayfa basligi bandi (158px) ile icerik (167px) hizasizdi ve
   .bolum'un 80px ust dolgusu basligin altinda buyuk bir bosluk birakiyordu.
   ============================================================ */
/* Icerik sutunu, sayfa basligi bandindaki kapsayiciyla ayni hizaya getirilir.
   Band ic kapsayicisi 15px dolgu kullaniyor; sutunun 24px'lik dolgusu 15px'e cekilir. */
html body.tm-tek-sutun .col-lg-9 { padding-left: 15px !important; padding-right: 15px !important; }
html body.tm-tek-sutun .tm-medya,
html body.tm-tek-sutun .tm-yasal,
html body.tm-tek-sutun .tm-teklif,
html body.tm-tek-sutun .tm-404 { padding-top: var(--s-10) !important; }
html body .tm-medya > .kapsayici,
html body .tm-yasal > .kapsayici,
html body .tm-teklif > .kapsayici { padding-left: 0 !important; padding-right: 0 !important; max-width: none !important; }

/* ============================================================
   50) TEMSAN - Panel galeri modulu (Nop_Gallery) a5 gorunumu
   Galeri sayfasinin icerigi artik panelden yonetiliyor:
   Panel > Galeri > "Galeri" albumu. Fotograf ekle/sil/sirala yeterli.
   ============================================================ */
/* Galeri/katalog izgarasini saran .item-box kutusunun cercevesi ve beyaz zemini
   kartlarin arkasinda ince bir cizgi olarak goruluyordu; notrlestirilir. */
html body .category-description > span > .item-box,
html body .item-box:has(> .fotogaleri) {
  border: 0 !important; background: transparent !important;
  padding: 0 !important; margin: 0 !important; box-shadow: none !important;
  display: block !important;
}
html body .fotogaleri { margin: 0 !important; }
html body .fotogaleri .boxtitle:empty { display: none !important; }
html body .fotogaleri .boxtitle {
  font-size: var(--fs-lg) !important; font-weight: 800 !important;
  margin: 0 0 var(--s-5) !important; color: var(--ink) !important;
}
html body .fotogaleri .gallery {
  display: grid !important; grid-template-columns: repeat(3, minmax(0,1fr)) !important;
  gap: var(--s-4) !important; float: none !important;
}
@media (max-width: 899px) { html body .fotogaleri .gallery { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 559px) { html body .fotogaleri .gallery { grid-template-columns: 1fr !important; } }
html body .fotogaleri .gallery .item {
  position: relative !important; margin: 0 !important; width: auto !important; float: none !important;
  border-radius: var(--radius-lg) !important; overflow: hidden !important;
  border: 1px solid var(--line) !important; aspect-ratio: 4/3 !important; background: var(--bg-soft) !important;
}
html body .fotogaleri .gallery .item > a { display: block !important; width: 100% !important; height: 100% !important; }
html body .fotogaleri .gallery .item img {
  width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important;
  transition: transform .5s var(--ease) !important;
}
html body .fotogaleri .gallery .item:hover img { transform: scale(1.05) !important; }
html body .fotogaleri .gallery .item span {
  position: absolute !important; inset: auto 0 0 0 !important; padding: var(--s-5) !important;
  background: linear-gradient(transparent, rgba(8,36,61,.78)) !important; color: #fff !important;
  font-weight: 700 !important; font-size: var(--fs-base) !important;
}
html body .fotogaleri .gallery .item span:empty { display: none !important; }

/* Tema masonry JS'i .mansory kabindaki ogeleri mutlak konumluyor ve
   izgarayi bozuyordu; satir ici stilleri etkisizlestir. */
html body .fotogaleri .gallery.mansory,
html body .fotogaleri #container { height: auto !important; position: static !important; }
html body .fotogaleri .gallery .item {
  position: relative !important; left: auto !important; top: auto !important;
  right: auto !important; bottom: auto !important; transform: none !important;
}

/* Panel galerisinin ust boslugu (sayfa basligi bandi ile arasindaki bosluk) */
html body.tm-tek-sutun .category-description > .fotogaleri:first-child,
html body.tm-tek-sutun .fotogaleri { padding-top: var(--s-8) !important; }

/* ============================================================
   51) TEMSAN - E-Katalog kartlari (panel foto galerisi uzerinden)
   Icerik: Panel > Foto Galeriler > "E-Katalog" albumu.
   Galeri sayfasindan farkli olarak dikey kapak + baslik + "Talep Edin".
   ============================================================ */
html body.tm-ekatalog .fotogaleri .gallery { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: var(--s-5) !important; }
@media (max-width: 899px) { html body.tm-ekatalog .fotogaleri .gallery { grid-template-columns: repeat(2, minmax(0,1fr)) !important; } }
@media (max-width: 559px) { html body.tm-ekatalog .fotogaleri .gallery { grid-template-columns: 1fr !important; } }

html body.tm-ekatalog .fotogaleri .item {
  aspect-ratio: auto !important; display: flex !important; flex-direction: column !important;
  background: #fff !important; overflow: hidden !important;
  transition: border-color .3s var(--ease), box-shadow .3s var(--ease), transform .3s var(--ease) !important;
}
html body.tm-ekatalog .fotogaleri .item:hover { border-color: var(--brand) !important; box-shadow: var(--shadow-lg) !important; transform: translateY(-4px) !important; }
html body.tm-ekatalog .fotogaleri .item > a {
  display: flex !important; flex-direction: column !important; height: auto !important;
  text-decoration: none !important;
}
html body.tm-ekatalog .fotogaleri .item img {
  aspect-ratio: 3/4 !important; height: auto !important;
  border-bottom: 1px solid var(--line) !important;
}
html body.tm-ekatalog .fotogaleri .item:hover img { transform: none !important; }
html body.tm-ekatalog .fotogaleri .item span {
  position: static !important; background: none !important; color: var(--ink) !important;
  padding: var(--s-5) var(--s-5) var(--s-2) !important;
  font-size: var(--fs-md) !important; font-weight: 800 !important; line-height: 1.3 !important;
}
html body.tm-ekatalog .tm-katalog-btn {
  margin: 0 var(--s-5) var(--s-5) !important; justify-content: center !important;
  display: inline-flex !important; align-items: center !important;
}

/* ============================================================
   52) TEMSAN - Medya sayfalarinda bosluk ve kart yuksekligi
   Sayfa basligi bandi ile icerik arasinda 148px olu bosluk vardi;
   e-katalog kartlari 610px yuksekligindeydi ve sayfa gereksiz uzuyordu.
   ============================================================ */
html body.tm-tek-sutun .sections { margin-bottom: 0 !important; }
html body.tm-tek-sutun .sections + section { padding-top: 0 !important; margin-top: -76px !important; }
html body.tm-tek-sutun .col-lg-9 > .category-description { padding-top: 0 !important; }
html body.tm-tek-sutun .fotogaleri { padding-top: var(--s-4) !important; }
html body.tm-tek-sutun .tm-medya,
html body.tm-tek-sutun .tm-yasal,
html body.tm-tek-sutun .tm-teklif { padding-top: var(--s-6) !important; }

/* E-Katalog kartlari: daha derli toplu */
html body.tm-ekatalog .fotogaleri .gallery { gap: var(--s-4) !important; }
html body.tm-ekatalog .fotogaleri .item img {
  aspect-ratio: auto !important; height: 300px !important; object-fit: cover !important;
}
html body.tm-ekatalog .fotogaleri .item span {
  padding: var(--s-4) var(--s-4) var(--s-2) !important;
  font-size: var(--fs-base) !important;
}
html body.tm-ekatalog .tm-katalog-btn {
  margin: 0 var(--s-4) var(--s-4) !important;
  padding: .5rem 1rem !important; font-size: var(--fs-sm) !important;
}
@media (min-width: 1200px) {
  html body.tm-ekatalog .fotogaleri .gallery { grid-template-columns: repeat(3, minmax(0,1fr)) !important; max-width: 1000px !important; }
}

/* Bos alt-kategori izgarasi sayfada 40px olu alan birakiyordu */
html body .sub-category-grid.tm-bos-izgara { display: none !important; margin: 0 !important; }

/* Sayfa basligi bandi ile icerik arasindaki olu bosluk (tek sutunlu sayfalar) */


/* --- E-Katalog butonu kart disina tasiyordu ---
   Buton esnek kutuda gerilirken marjlari hesaba katmiyor, 100% genislik
   aliyordu; kart 323px iken buton 321+32=353px yer kapliyordu. */
html body.tm-ekatalog .tm-katalog-btn {
  width: calc(100% - 32px) !important;
  max-width: calc(100% - 32px) !important;
  margin: 0 16px 16px !important;
  box-sizing: border-box !important;
  align-self: center !important;
}

/* Tam genislik bant 100vw kullandigi icin kaydirma cubugu genisligi kadar
   yatay tasma olusabilir; govde seviyesinde engellenir. */
/* overflow-x:hidden bir kaydirma kapsayicisi olusturup icerideki
   position:sticky kurallarini bozuyor. "clip" ayni tasmayi keser ama
   kaydirma kapsayicisi yaratmaz; eski tarayicilar ilk satiri kullanir. */
html, body { overflow-x: hidden !important; overflow-x: clip !important; }

/* Bant esnek kutuydu; baslik ve kirinti daralip yanyana diziliyor, RTL'de
   yanlis kenara yapisiyordu. Blok yapinca metin yonu kendiliginden dogru olur. */
/* Dikey akis: kirinti ustte, baslik altta (a5 sirasi). Satir icinde esnek
   kutuyken ikisi daralip yanyana diziliyor, RTL'de yanlis kenara yapisiyordu. */
html body .pages-title { display: flex !important; flex-direction: column !important;
  align-items: flex-start !important; }
html body .pages-title h1,
html body .pages-title .breadcrumb-nav { width: 100% !important; }
html body .pages-title .breadcrumb-nav { order: -1 !important; justify-content: flex-start !important; }

/* ============================================================
   53) TEMSAN - Merkez sayfalarda (urunler, kurumsal) kart izgarasi
   Kenar cubugu JS ile kaldirildigi icin izgara tam genisligi kullanir.
   Uzun tek kelimeler dar kartta tasmasin diye kelime kirilmasi acilir.
   ============================================================ */
/* Sutun sayisi 44. bolumdeki temel kuraldan ve onun medya sorgularindan gelir;
   burada yalnizca uzun kelimelerin dar kartta tasmasi engellenir. Arapcada
   harf harf bolunmemesi icin word-break KULLANILMAZ. */
html body .tm-kat-kart .category-title,
html body .tm-kat-kart .category-title a,
html body .tm-kat-kart .sub-category-desc {
  overflow-wrap: break-word !important;
  hyphens: auto !important;
}

/* Aciklama karttan karta esit yer kaplasin: 3 satirda kesilir. Dar ekranda
   19 kartin tamami okunabilir bir sayfa uzunlugunda kalir. */
html body .tm-kat-kart .sub-category-desc {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
@media (max-width: 599px) {
  html body .tm-kat-kart .sub-category-desc { -webkit-line-clamp: 2 !important; }
}

/* Baslik bandi ic boslugu: .container kirilma noktalari (Bootstrap) ile birebir */
@media (max-width: 1199.98px) {
  html body .pages-title { padding-inline: max(15px, calc((100vw - 960px) / 2 + 15px)) !important; }
}
@media (max-width: 991.98px) {
  html body .pages-title { padding-inline: max(15px, calc((100vw - 720px) / 2 + 15px)) !important; }
}
@media (max-width: 767.98px) {
  html body .pages-title { padding-inline: max(15px, calc((100vw - 540px) / 2 + 15px)) !important; }
}
@media (max-width: 575.98px) {
  /* Dar ekranda kapsayici akiskan; olculen ic kenar 24px (9px row + 15px pad). */
  html body .pages-title { padding-inline: 24px !important; }
}

/* Blog/haber listesinde ilk kartin ust boslugu, bolum boslugunun uzerine
   ekleniyordu (48 + 30 = 78px). Ilk kartta kaldirilir. */
html body .tm-blog .blogposts > .liste-yazi:first-child,
html body .tm-blog .liste-yazi:first-child { padding-top: 0 !important; }

/* Kenar cubugu kaldirilan liste sayfalarinda (haber arsivi) bolum ustu negatif
   margin ile geri cekildigi icin ilk kart baslik bandina yapisiyordu. */
html body.tm-tek-sutun .tm-blog { padding-top: var(--s-10) !important; }
/* Blog listesinde ise bolum boslugu iki kez ekleniyordu; bir miktar kisilir. */
html body:not(.tm-tek-sutun) .tm-blog { margin-top: calc(-1 * var(--s-6)) !important; }

/* ============================================================
   54) TEMSAN - Teklif Alin sayfasi
   Sayfa a5'in bilesen siniflariyla (.ozellik, .urun-yardim, .etiket)
   yazilmisti ama bu siniflarin CSS'i siteye tasinmamisti; adimlar alt alta
   bicimsiz duruyor, ikonlar bosluga dusuyordu. Formu panel uretiyor
   (.formcontrol > table.row/.item-name/.item-value) ve tablo dar bir kolona
   sikisiyordu. Ikisi de burada a5 gorunumune getirilir.
   ============================================================ */

/* --- Tema kalintilari: h2'yi ortalayan ve onune mor cubuk koyan kural --- */
html body .tm-teklif h2,
html body .tm-teklif__formbaslik {
  text-align: left !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
}
html body .tm-teklif h2::before,
html body .tm-teklif__formbaslik::before { content: none !important; display: none !important; }
/* Cubugun biraktigi 18px sol dolgu basligi diger ogelerden iceri kaydiriyordu */
html body .tm-teklif h2,
html body .tm-teklif__formbaslik { padding-left: 0 !important; padding-right: 0 !important; }

/* --- Uc adim: yan yana ucluk dizilim --- */
html body .tm-teklif__adimlar {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: var(--s-6) var(--s-8) !important;
  margin-top: var(--s-8) !important;
}
@media (max-width: 899px) {
  html body .tm-teklif__adimlar { grid-template-columns: 1fr !important; gap: var(--s-5) !important; }
}
html body .tm-teklif .ozellik {
  display: flex !important; gap: var(--s-4) !important; align-items: flex-start !important;
}
html body .tm-teklif .ozellik__ikon {
  width: 46px !important; height: 46px !important; flex: none !important;
  display: grid !important; place-items: center !important;
  border: 1px solid var(--line) !important; border-radius: var(--radius) !important;
  color: var(--brand) !important; background: #fff !important;
}
html body .tm-teklif .ozellik__ikon svg { width: 22px !important; height: 22px !important; }
html body .tm-teklif .ozellik h3 {
  font-size: var(--fs-md) !important; font-weight: 800 !important;
  margin: 0 0 var(--s-1) !important; line-height: 1.3 !important;
}
html body .tm-teklif .ozellik h3::before { content: none !important; }
html body .tm-teklif .ozellik p {
  color: var(--muted) !important; font-size: var(--fs-base) !important;
  line-height: 1.65 !important; margin: 0 !important;
}

/* --- "Acele mi?" kutusu --- */
html body .tm-teklif__acil {
  display: flex !important; align-items: flex-start !important; gap: var(--s-4) !important;
  padding: var(--s-5) !important; margin-top: var(--s-8) !important;
  background: var(--bg-soft) !important; border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
}
html body .tm-teklif__acil svg {
  width: 24px !important; height: 24px !important; flex: none !important;
  color: var(--brand) !important; margin-top: 2px !important;
}
html body .tm-teklif__acil p { margin: 0 !important; font-size: var(--fs-base) !important; color: var(--ink-2) !important; }
html body .tm-teklif__acil strong { display: block !important; color: var(--ink) !important; margin-bottom: var(--s-1) !important; }
html body .tm-teklif__acil a { color: var(--brand-metin) !important; font-weight: 700 !important; }

html body .tm-teklif__formbaslik { margin: var(--s-12) 0 var(--s-5) !important; font-size: var(--fs-2xl) !important; }

/* --- Panel formu: tabloyu duzgun bir form kartina cevirir --- */
html body .formcontrol {
  background: #fff !important; border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  padding: clamp(1.5rem, 3vw, 2.5rem) !important;
  max-width: 820px !important;
}
html body .formcontrol table,
html body .formcontrol tbody { display: block !important; width: 100% !important; border: 0 !important; }
html body .formcontrol tbody {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 var(--s-5) !important;
}
@media (max-width: 699px) {
  html body .formcontrol tbody { grid-template-columns: 1fr !important; }
}
/* Izgara ogeleri varsayilan min-width:auto ile icerigin en dar genisligine
   kilitlenip kolon sinirini asiyordu. */
html body .formcontrol tr.row {
  display: block !important; margin-bottom: var(--s-5) !important;
  min-width: 0 !important; max-width: 100% !important;
}
/* Uzun alan (Talebiniz) tum genisligi kaplar */
html body .formcontrol tr.row:last-child { grid-column: 1 / -1 !important; }
html body .formcontrol td { display: block !important; border: 0 !important; padding: 0 !important; }
html body .formcontrol td.item-name {
  font-size: var(--fs-sm) !important; font-weight: 700 !important;
  color: var(--ink) !important; margin-bottom: var(--s-2) !important;
}
html body .formcontrol td.item-value input[type="text"],
html body .formcontrol td.item-value textarea {
  /* box-sizing olmadan dolgu genisligin uzerine ekleniyor ve alanlar
     kolon sinirlarini asiyordu. */
  box-sizing: border-box !important; max-width: 100% !important;
  width: 100% !important; padding: .75rem var(--s-4) !important;
  border: 1px solid var(--line) !important; border-radius: var(--radius) !important;
  background: #fff !important; color: var(--ink) !important;
  font-family: inherit !important; font-size: var(--fs-base) !important;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease) !important;
}
html body .formcontrol td.item-value textarea { min-height: 150px !important; resize: vertical !important; }
html body .formcontrol td.item-value input[type="text"]:focus,
html body .formcontrol td.item-value textarea:focus {
  outline: none !important; border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px rgba(255, 102, 0, .14) !important;
}
html body .formcontrol .productwritereviewbutton {
  display: inline-flex !important; align-items: center !important; justify-content: center !important;
  min-height: 48px !important; padding: 0 var(--s-8) !important;
  background: var(--brand) !important; color: #fff !important;
  border: 0 !important; border-radius: var(--radius) !important;
  font-family: inherit !important; font-size: var(--fs-base) !important; font-weight: 700 !important;
  cursor: pointer !important; transition: background .2s var(--ease), transform .2s var(--ease) !important;
}
html body .formcontrol .productwritereviewbutton:hover { background: var(--brand-koyu, #E75C00) !important; transform: translateY(-1px) !important; }

[dir="rtl"] html body .tm-teklif h2,
[dir="rtl"] html body .tm-teklif__formbaslik { text-align: right !important; }

/* ============================================================
   55) TEMSAN - Urun teknik dokumani (PDF) dugmesi
   Panelin "Urun PDF leri" sekmesine yuklenen dosyalar site tarafinda hic
   gosterilmiyordu. Sablon artik bu kayitlari basiyor; dugme, aksiyon satirinda
   "Teklif Alin" ve "Tum Urunler" yaninda ucuncu secenek olarak durur.
   ============================================================ */
html body .tm-urun-pdfler { display: contents !important; }

html body .tm-pdf-dugme {
  display: inline-flex !important; align-items: center !important; gap: var(--s-3) !important;
  min-height: 48px !important; padding: 8px var(--s-5) !important;
  background: #fff !important; color: var(--ink) !important;
  border: 1px solid var(--line) !important; border-radius: var(--radius) !important;
  text-decoration: none !important; line-height: 1.25 !important;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), transform .2s var(--ease) !important;
}
html body .tm-pdf-dugme:hover {
  border-color: var(--brand) !important;
  box-shadow: 0 6px 18px rgba(16, 64, 102, .10) !important;
  transform: translateY(-1px) !important;
}
html body .tm-pdf-dugme svg {
  width: 22px !important; height: 22px !important; flex: none !important;
  color: var(--brand) !important;
}
html body .tm-pdf-dugme span {
  display: flex !important; flex-direction: column !important;
  font-size: var(--fs-base) !important; font-weight: 700 !important;
}
html body .tm-pdf-dugme small {
  font-size: var(--fs-xs) !important; font-weight: 600 !important;
  color: var(--muted) !important; letter-spacing: .04em !important;
}
@media (max-width: 599px) {
  html body .tm-pdf-dugme { width: 100% !important; justify-content: center !important; }
}

/* ============================================================
   56) TEMSAN - Urun detay duzeni
   Deneme 1'de sekmeler gorselin altina, sag sutun iki satira yayilmisti.
   Sonuc kotuydu: sekmeler okunurken sag yarida 489px bos alan kaliyordu.
   Sekmeler tam genislikte kaliyor; olu bosluk bunun yerine hero satirinin
   kendisi kisaltilarak ve sekme araligi daraltilarak azaltilir.
   ============================================================ */
@media (min-width: 992px) {
  /* Iki sutun ayni yerde bitsin: gorsel cercevesi bilgi kartinin boyuna uzar,
     fotograf orani korunur (object-fit: contain). Boylece gorselin altinda
     100px'lik bos alan kalmaz. */
  html body.tm-urun-detay .master-wrapper-main > .row { align-items: stretch !important; }
  html body.tm-urun-detay .shop-single-slider {
    height: 100% !important; display: flex !important; flex-direction: column !important;
  }
  html body.tm-urun-detay .shop-single-slider .slider-for { flex: 1 1 auto !important; min-height: 0 !important; }
  /* Yalnizca ANA gorsel; kucuk gorsel seridi (.slider-nav) bu kurallarin
     disinda kalmali, yoksa kucuk resimler eziliyor. */
  html body.tm-urun-detay .shop-single-slider .slider-for .slick-list,
  html body.tm-urun-detay .shop-single-slider .slider-for .slick-track,
  html body.tm-urun-detay .shop-single-slider .slider-for .slick-slide > div,
  html body.tm-urun-detay .shop-single-slider .slider-for .slick-slide a { height: 100% !important; }
  html body.tm-urun-detay .shop-single-slider .slider-for .slick-slide img {
    height: 100% !important; width: 100% !important; object-fit: contain !important;
  }
}

/* Hero ile sekmeler arasi: 106px cok fazlaydi. Satirin kendi bosluğu (57.6px)
   daraltilir, ayirici cizgi ve sekme araligi buna gore ayarlanir. */
html body.tm-urun-detay .master-wrapper-main > .row { row-gap: var(--s-6) !important; }
html body.tm-urun-detay .product-collateral {
  margin-top: 0 !important;
  padding-top: var(--s-8) !important;
  border-top: 1px solid var(--line) !important;
}
html body.tm-urun-detay .product-collateral .tm-sekme { margin-top: 0 !important; }

/* Kucuk gorsel seridi ana gorselle sekmeler arasinda nefes alsin */
html body.tm-urun-detay .urun-galeri__kucuk:not(.tm-gizle) { margin-top: var(--s-4) !important; }

/* --- Aksiyon satiri: uc dugme tek satira sigsin ---------------------------
   Sag sutun 541px; onceki olculerle toplam 607px ediyor ve PDF dugmesi alt
   satira kaciyordu. Ic bosluklar daraltilip uc dugme ayni yukseklige getirildi. */
html body.tm-urun-detay .product-details .urun-aksiyon {
  gap: 12px !important; align-items: stretch !important; flex-wrap: wrap !important;
}
html body.tm-urun-detay .product-details .urun-aksiyon > a {
  min-height: 50px !important; height: auto !important;
  padding: 0 16px !important; font-size: 14px !important;
  white-space: nowrap !important;
}
html body.tm-urun-detay .product-details .urun-aksiyon > a svg { flex: none !important; }
html body.tm-urun-detay .urun-aksiyon .tm-pdf-dugme { gap: var(--s-2) !important; }
html body.tm-urun-detay .urun-aksiyon .tm-pdf-dugme svg { width: 20px !important; height: 20px !important; }
html body.tm-urun-detay .urun-aksiyon .tm-pdf-dugme span { font-size: var(--fs-sm) !important; }
html body.tm-urun-detay .urun-aksiyon .tm-pdf-dugme small { font-size: 11px !important; letter-spacing: .02em !important; }

/* Kucuk gorsel seridi: kare kutucuklar */
html body.tm-urun-detay .urun-galeri__kucuk:not(.tm-gizle) {
  margin-top: var(--s-4) !important; display: block !important;
}
html body.tm-urun-detay .urun-galeri__kucuk .slick-slide { padding: 0 6px !important; }
html body.tm-urun-detay .urun-galeri__kucuk .slick-slide img,
html body.tm-urun-detay .urun-galeri__kucuk .slick-slide > div {
  width: 100% !important; height: auto !important;
}
html body.tm-urun-detay .urun-galeri__kucuk .slick-slide img {
  aspect-ratio: 1 / 1 !important; object-fit: contain !important;
  background: #fff !important; border: 1px solid var(--line) !important;
  border-radius: var(--radius) !important; padding: 6px !important; cursor: pointer !important;
}
html body.tm-urun-detay .urun-galeri__kucuk .slick-current img,
html body.tm-urun-detay .urun-galeri__kucuk .slick-slide img:hover { border-color: var(--brand) !important; }

/* --- Coklu gorselde slider'in sutunu sismesini engelle ---------------------
   Birden fazla fotograf olan urunlerde slick, iz (track) genisligini 7684px
   yapiyor; satir izgara oldugu icin sutun bu genisligi aliyor ve mobilde tum
   bilgi sutunu ekran disina tasiyordu. Izgara ogelerine min-width:0 verilip
   slider kendi kutusuna kilitlenir. */
html body.tm-urun-detay .master-wrapper-main > .row > * { min-width: 0 !important; }
html body.tm-urun-detay .shop-single-slider,
html body.tm-urun-detay .shop-single-slider .slider-for,
html body.tm-urun-detay .shop-single-slider .urun-galeri__kucuk {
  max-width: 100% !important; min-width: 0 !important;
}
html body.tm-urun-detay .shop-single-slider .slick-list { overflow: hidden !important; }

/* ============================================================
   57) TEMSAN - Urun sekmeleri: Dokuman ve Video panelleri
   Sekmeler artik Teknik Bilgi / Urun Detay / Dokuman / Video seklinde ve her
   biri kendi kaynagindan besleniyor. Icerigi olmayan sekme hic basilmaz.
   ============================================================ */
html body .tm-dokuman-liste {
  list-style: none !important; margin: 0 !important; padding: 0 !important;
  display: flex !important; flex-wrap: wrap !important; gap: var(--s-4) !important;
}
html body .tm-dokuman-liste li { margin: 0 !important; }
html body .tm-dokuman-liste li::marker { content: none !important; }

html body .tm-video { margin: 0 0 var(--s-6) !important; }
html body .tm-video:last-child { margin-bottom: 0 !important; }
html body .tm-video__kutu {
  position: relative !important; aspect-ratio: 16 / 9 !important;
  background: #000 !important; border-radius: var(--radius-lg) !important;
  overflow: hidden !important; border: 1px solid var(--line) !important;
}
html body .tm-video__kutu iframe {
  position: absolute !important; inset: 0 !important;
  width: 100% !important; height: 100% !important; border: 0 !important;
}
html body .tm-video figcaption {
  margin-top: var(--s-3) !important; font-size: var(--fs-sm) !important;
  font-weight: 600 !important; color: var(--ink-2) !important;
}

/* ============================================================
   58) TEMSAN - Urun detay: eski video listesi + gorsel cercevesi
   * Temanin "Videolar" tablosu (.videoBlock) artik Video sekmesiyle ayni seyi
     gosteriyordu; gorsel sutununun icinde sekmelerle ic ice giriyordu.
   * Sutunlari esitlemek icin ana gorsel cercevesi uzayabiliyor; kucuk bir
     fotograf (orn. 200x200) cok yuksek ve bos bir kutuda kaliyordu. Ust sinir
     konuldu; artan bosluk sutunun altinda kalir.
   ============================================================ */
html body.tm-urun-detay .videoBlock { display: none !important; }

@media (min-width: 992px) {
  html body.tm-urun-detay .shop-single-slider .slider-for {
    max-height: 560px !important; flex: 0 1 auto !important;
  }
}

/* === 59. Aksiyon satiri: uzun dil etiketlerinde de tek satir (2026-09-22) ===
   Ingilizce "Request a Quote for This Product" Turkce karsiligindan genis;
   white-space:nowrap yuzunden PDF dugmesi alt satira kaciyordu. Etiketin iki
   satira sarmasina izin verildi, dugmeler esit yukseklikte tek sirada kaliyor. */
html body.tm-urun-detay .product-details .urun-aksiyon > a {
  white-space: normal !important;
  text-align: center !important;
  line-height: 1.25 !important;
  flex: 0 1 auto !important;
  min-width: 0 !important;
  padding: 10px 14px !important;
}
html body.tm-urun-detay .product-details .urun-aksiyon > a.tm-pdf-dugme {
  text-align: left !important;
}
/* Genis ekranda sarma yerine daralma: flex-wrap:wrap oldugu surece ogeler
   kuculmez, alt satira kacar. Masaustunde nowrap verilince ucu de sikisip
   ayni sirada kaliyor; mobilde eski sarma davranisi korunuyor. */
@media (min-width: 992px) {
  html body.tm-urun-detay .product-details .urun-aksiyon { flex-wrap: nowrap !important; }
}

/* Mobilde sekme blogu iceri kaciyordu: .product-variant-line'in 25px yan
   dolgusu sekmeleri ozet tablodan 26px daha dar gosteriyordu. Sifirlandi. */
@media (max-width: 991px) {
  html body.tm-urun-detay .product-collateral .product-variant-line {
    padding-left: 0 !important; padding-right: 0 !important;
  }
}

/* === 60. Kategori kartlari, kurumsal sayfa boslugu, belge kartlari (2026-09-23) ===

   1) /urunler'de kartin YALNIZCA baslik yazisi (112x43) baglantiydi; kartin
      geri kalani (261x305) tiklanmiyordu. Baslik baglantisina "yayilan bag"
      katmani eklenerek kartin tamami tiklanabilir yapildi.
   2) Kurumsal sayfalarda (Hakkimizda, Vizyon-Misyon, Kalite, Belgelerimiz)
      baslik bandinin altinda ~130px bos alan kaliyordu: sablonun urettigi bos
      ilk satir + ilk bolumun 80px ust dolgusu. Ikisi de kisildi.
   3) Belge kartlari 600x800 dikey kapakla asiri uzuyordu; kapak 4:3 orana
      kirpilip sertifikanin ust kismi gosteriliyor.                          */

/* --- 1) Kategori karti: tamami tiklanabilir --- */
html body .sub-category-item.tm-kat-kart { position: relative !important; }
html body .sub-category-item.tm-kat-kart .category-title a::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
}
html body .sub-category-item.tm-kat-kart:hover { cursor: pointer !important; }
/* Kart icindeki gercek baglantilar yayilan katmanin ustunde kalsin */
html body .sub-category-item.tm-kat-kart .picture a { position: relative !important; z-index: 3 !important; }

/* --- 2) Kurumsal sayfalarda ust bosluk --- */
/* Sablonun urettigi, icerigi olmayan ilk satir yer kaplamasin */
html body .category-description > .row:first-child:not(:has(img, p, h1, h2, h3, h4, table, section, article, a)) {
  display: none !important;
}
/* Baslik bandi zaten ayrimi sagliyor; ilk bolumun 80px ust dolgusu fazlaydi */
html body .category-description > section.bolum:first-of-type { padding-top: var(--s-8) !important; }

/* --- 3) Belge kartlari --- */
/* Ozgulluk notu: 3249. satirdaki ".category-description .belge-kart__kapak"
   kurali 3/4 orani dayatiyor; ayni ozgullukte yazilmazsa bu kural tutmaz. */
html body .category-description .belge-kart__kapak--oran {
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
  background: var(--yuzey, #f5f8fb) !important;
}
html body .category-description .belge-kart__kapak--oran img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: top center !important;
  display: block !important;
}

/* === 61. Kurumsal sayfalarda bolum araliklari (2026-09-23) ===
   .bolum ust ve alt dolgusu 80'er px idi; iki bolum yan yana gelince aradaki
   bosluk 160px'i buluyordu ve sayfa "dagilmis" gorunuyordu. Kurumsal
   sayfalarda 48px'e indirildi (arada 96px). Ilk bolum baslik bandinin
   hemen altinda oldugu icin daha da kisa. */
body.tm-kurumsal .category-description .bolum {
  padding-block: clamp(2rem, 1rem + 2vw, 3rem) !important;
}
body.tm-kurumsal .category-description > section.bolum:first-of-type {
  padding-top: var(--s-6) !important;
}
body.tm-kurumsal .category-description .bolum--sikisik {
  padding-block: clamp(1.75rem, 1rem + 1.5vw, 2.5rem) !important;
}

/* === 62. Mobil denetim duzeltmeleri (2026-09-23) ==========================

   Denetim: 375px genislikte tum sayfalar tarandi. Bulunanlar:
   1) IKI mobil alt bar ust uste duruyordu. Eski temanin #mobile-contact-bar'i
      (zeytin yesili, z-index 9998) yeni .m-action-bar'in (z 10000) altinda
      kaliyor, ust 21px'i renkli bir serit olarak gorunuyordu.
   2) Yuzen WhatsApp dugmesi mobilde alt bardaki WhatsApp ile ayni isi
      yapiyor ve icerigin uzerine biniyordu.
   3) "Yukari cik" dugmesi tema kalintisi zeytin yesiliydi ve alt barla
      cakisiyordu.
   4) Hakkimizda sektor izgarasi 4 sutunla 375px'e sigmiyor, saga 87px tasiyordu.
   5) Urun teknik tablosu 520px genisligiyle yatay kaydirma gerektiriyordu.
   6) Dokunma hedefleri 36px'in altindaydi (onerilen en az 44px).
   7) Alt bar etiketleri 10px, anasayfa kategori basliklari 11px okunmuyordu.
   ========================================================================= */

/* --- 1) Eski mobil iletisim bari tamamen kaldirilir --- */
html body #mobile-contact-bar,
html body #mobile-contact-bar-outer { display: none !important; }

@media (max-width: 991px) {
  /* --- 2) Yuzen WhatsApp: alt barda zaten var --- */
  html body .pulse-button-w { display: none !important; }

  /* --- 3) Yukari cik dugmesi: marka rengi + alt barin ustunde --- */
  html body .cd-top {
    background-color: var(--brand-ink, #104066) !important;
    bottom: 74px !important;
    right: 14px !important;
    width: 44px !important;
    height: 44px !important;
    z-index: 9991 !important;
  }

  /* --- 4) Sektor izgarasi: 4 sutun sigmiyor, 2 sutun --- */
  html body .category-description .sektor-izgara {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  html body .category-description .sektor-izgara > * { min-width: 0 !important; }

  /* --- 5) Teknik tablo: yatay kaydirma yerine alt alta --- */
  /* 3079-3080. satirlardaki ".tm-sekme .tablo-sarmal{overflow-x:auto}" ve
     ".tm-sekme .tablo{min-width:520px}" kurallari ayni ozgullukte yazilmazsa
     tablo 520px kalir ve yatay kaydirma surer. */
  html body .tm-sekme .tablo-sarmal { overflow-x: visible !important; border: 0 !important; }
  html body .tm-sekme .tablo { min-width: 0 !important; width: 100% !important; }
  html body .sekme__panel table.tablo,
  html body .sekme__panel table.tablo tbody,
  html body .sekme__panel table.tablo tr { display: block !important; width: 100% !important; }
  html body .sekme__panel table.tablo th[scope="row"],
  html body .sekme__panel table.tablo td {
    display: block !important;
    width: auto !important;
    border: 0 !important;
    padding: 2px 0 !important;
    text-align: left !important;
  }
  html body .sekme__panel table.tablo tr {
    padding: 10px 0 !important;
    border-bottom: 1px solid var(--line, #e2e8f0) !important;
  }
  html body .sekme__panel table.tablo th[scope="row"] {
    font-size: 12.5px !important;
    letter-spacing: .02em !important;
    text-transform: uppercase !important;
    color: var(--muted, #6b7a88) !important;
    font-weight: 600 !important;
  }
  html body .sekme__panel table.tablo td { font-size: 15px !important; font-weight: 600 !important; }

  /* --- 6) Dokunma hedefleri en az 44px --- */
  /* DIKKAT: burada "display" DEGISTIRILMEZ. Onceki surumde display:inline-flex
     verilince mobilde gizlenmis olan ustteki "Teklif Alin" dugmesi (.th-btn)
     geri gorunur olup basligi sikistirmisti. Yalnizca yukseklik/dolgu. */
  html body .category-description .btn,
  html body .btn--kucuk,
  html body .tm-pdf-dugme {
    min-height: 44px !important;
    align-items: center !important;
  }
  html body #th-menu-close,
  html body .th-mmenu__kapat {
    width: 44px !important; height: 44px !important;
    align-items: center !important; justify-content: center !important;
  }
  html body .th-topbar__left a { padding-block: 6px !important; display: inline-block !important; }
  /* Kirinti (breadcrumb) baglantilari parmakla secilebilsin */
  html body .breadcrumb a, html body .pages-title a { padding-block: 5px !important; display: inline-block !important; }
  /* Blog kartlarindaki "devaminin oku" baglantisi 24px yuksekligindeydi */
  html body .ok-link { padding-block: 10px !important; display: inline-block !important; }

  /* Dil bayraklari 22x15'ti; parmakla secilemiyordu. Gorsel boyut korunur,
     cevresine dokunma alani eklenir. */
  /* Ozgulluk notu: ".th-topbar .th-lang input[type=image]{padding:0}" kurali
     daha ozgul; ayni yol yazilmazsa dolgu uygulanmaz. */
  html body .th-topbar .th-lang input[type="image"] {
    padding: 12px 8px !important;
    box-sizing: content-box !important;
  }
  html body .th-topbar .th-lang { gap: 0 !important; }
  /* Dolgu eklenince input'un varsayilan cercevesi kutu gibi gorunuyordu */
  html body .th-topbar .th-lang input[type="image"] { border: 0 !important; }

  /* --- 9) Baslik bandinin ustundeki olu alan ---
     Bant 40px ust dolgu + icindeki .container 48px ust bosluk tasiyordu;
     mobilde kirinti satiri ekranin cok asagisinda kaliyordu. */
  html body .page-title, html body .pages-title { padding-top: var(--s-4) !important; }
  html body .page-title > .container,
  html body .pages-title > .container { margin-top: 0 !important; }
  /* Baslik bandi ile ilk icerik arasinda 96px olu alan vardi (.container'in
     48px ust boslugu + bandin alt dolgusu). Mobilde yariya indirildi. */
  html body .master-wrapper-main > .container,
  html body .product-view > .container,
  html body .category-page > .container,
  html body .main-container .container { margin-top: var(--s-5, 20px) !important; }
  /* Urun sayfasi: .shop-single-section 48px + .shop-single-slider 24px ust
     dolgu ile baslik bandi arasinda 96px olu alan biraktiyor. */
  html body .shop-single-section.section-padding { padding-top: var(--s-5, 20px) !important; }

  /* Acilan alt menu ogeleri 38px idi */
  html body .th-mmenu__body ul ul a { min-height: 44px !important; display: flex !important; align-items: center !important; }

  /* --- 8) Form alanlari: iOS otomatik yakinlastirmasini onle ---
     iOS Safari, yazi boyutu 16px'in ALTINDA olan bir alana odaklanildiginda
     sayfayi kendiliginden buyutur ve kullanici elle geri kucultmek zorunda
     kalir. Alanlar 15px idi; 16px'e cikarildi ve dokunma yuksekligi 44px. */
  html body input[type="text"],
  html body input[type="email"],
  html body input[type="tel"],
  html body input[type="password"],
  html body input[type="number"],
  html body input[type="search"],
  html body textarea,
  html body select {
    font-size: 16px !important;
  }
  html body input[type="text"],
  html body input[type="email"],
  html body input[type="tel"],
  html body input[type="password"],
  html body input[type="number"],
  html body input[type="search"],
  html body select {
    min-height: 44px !important;
  }
  /* Ozgulluk notu: 4581. satirdaki ".formcontrol td.item-value input" kurali
     font-size:var(--fs-base) (15px) dayatiyor; ayni yol yazilmazsa 16px tutmaz. */
  html body .formcontrol td.item-value input[type="text"],
  html body .formcontrol td.item-value input[type="email"],
  html body .formcontrol td.item-value input[type="tel"],
  html body .formcontrol td.item-value textarea,
  html body .formcontrol td.item-value select,
  html body .ea-contact-form input[type="text"],
  html body .ea-contact-form input[type="email"],
  html body .ea-contact-form input[type="tel"],
  html body .ea-contact-form textarea,
  html body .ea-contact-form select,
  /* Ozgulluk notu: 1859. satirdaki secici listesinde ".ea-contact-form
     .form-control" (iki sinif) var; textarea onun uzerinden 15px aliyordu. */
  html body .ea-contact-form .form-control {
    font-size: 16px !important;
  }

  /* --- 7) Okunabilir yazi boyutlari --- */
  html body .m-action-bar__label { font-size: 11px !important; letter-spacing: 0 !important; }
  html body h4 { font-size: 13px !important; }
  html body .tm-pdf-dugme small { font-size: 12px !important; }
}

/* === 63. iPhone'da gorulen hatalar (2026-09-23) ==========================

   Gercek cihazda cikip emulatorde cikmayan uc hata:

   1) CEREZ BANDI ile mobil alt bar ayni anda ekranda. Ikisi de
      position:fixed/bottom:0. Bant z-index 2147483600, alt bar 10000;
      cakisiyorlar ve alt bar bandin uzerinde asili kaliyor. Bant acikken
      alt bar gizlenir, onay verilince geri gelir.

   2) CEREZ BANDI YAZILARI OKUNMUYOR. Bant kendi rengini (#fff / #d8cfe6)
      !important'siz veriyor; sitenin baslik/paragraf kurallari !important
      tasidigi icin onu eziyor ve koyu zemine koyu yazi biniyor.

   3) "YUKARI CIK" dugmesi sol altta duruyor ve urun sayfasinda sekme
      seridinin (Teknik Bilgi / Urun Detay / Dokuman) uzerine biniyor.
      Sag kenara alinip alt barin uzerine cikarildi.
   ========================================================================= */

/* --- 2) Cerez bandinin kendi renkleri her zaman gecerli olsun --- */
html body #fbcc-banner,
html body #fbcc-banner .fbcc-wrap,
html body #fbcc-banner .fbcc-text,
html body #fbcc-banner .fbcc-text p,
html body #fbcc-banner .fbcc-text span,
html body #fbcc-banner .fbcc-text li { color: #e7ecf4 !important; }
html body #fbcc-banner .fbcc-text h3,
html body #fbcc-banner h1, html body #fbcc-banner h2,
html body #fbcc-banner h3, html body #fbcc-banner h4 { color: #ffffff !important; }
html body #fbcc-banner .fbcc-text a,
html body #fbcc-banner a { color: #d7c4ff !important; text-decoration: underline !important; }
html body #fbcc-banner .fbcc-btn { color: #ffffff !important; background: transparent !important; }
html body #fbcc-modal .fbcc-card,
html body #fbcc-modal .fbcc-card p,
html body #fbcc-modal .fbcc-card li { color: #2a2a2a !important; }
html body #fbcc-modal .fbcc-head h3 { color: #4c396a !important; }
html body #fbcc-modal .fbcc-foot .fbcc-btn { color: #2a2a2a !important; }

/* --- 3) Yukari cik dugmesi: sag kenar, alt barin ustu --- */
@media (max-width: 991px) {
  html body .cd-top,
  html body .cd-top-btn {
    left: auto !important;
    right: 14px !important;
    bottom: 74px !important;
  }

  /* --- 1) Cerez bandi acikken alt bar gizlenir --- */
  html body.tm-cerez-acik .m-action-bar { display: none !important; }
  html body.tm-cerez-acik .cd-top,
  html body.tm-cerez-acik .cd-top-btn { display: none !important; }
}
/* :has() destekleyen tarayicilarda JS beklemeden de calissin */
@media (max-width: 991px) {
  html body:has(#fbcc-banner) .m-action-bar { display: none !important; }
  html body:has(#fbcc-banner) .cd-top-btn { display: none !important; }
}

/* === 64. Masaustunde baslik bandi yuksekligi (2026-09-23) ===
   Bant 237px idi; icindeki kirinti + baslik toplam 69px, kalan 168px bosluktu
   (bant 40/32 dolgu + .container 48/48 bosluk). Mobil degerler 62-63. bolumde
   ayrica ayarlandigi icin bu kural yalniz genis ekranlar icin yazildi. */
@media (min-width: 992px) {
  /* Bant "top:-30px" ile ustbiligin altina cekiliyor. Dolgu kisilinca bu cekme
     kirintiyi ustbilige yapistirdi; cekme sifirlanip dolgular yeniden dengelendi.
     Sonuc: kirinti ile ustbilik arasi 28px, bant yuksekligi ~155px. */
  html body .page-title,
  html body .pages-title {
    top: 0 !important;
    padding-top: 28px !important;
    padding-bottom: 24px !important;
  }
  html body .page-title > .container,
  html body .pages-title > .container { margin-top: 18px !important; margin-bottom: 18px !important; }
}


/* === 65. Urun grubu kartlarinda ikon yerine kucuk urun gorseli (2026-09-30) ===
   Kategori resmi ya da gruptaki ilk urun fotografi; yoksa eski ikon kalir. */
html body .tm-kat-kart__gorsel {
  width: 72px !important; height: 72px !important; flex: none !important; display: block !important;
  background: #fff !important; border: 1px solid var(--line) !important; border-radius: var(--radius) !important;
  overflow: hidden !important; padding: 4px !important; box-sizing: border-box !important;
  transition: border-color .3s var(--ease) !important;
}
html body .tm-kat-kart:hover .tm-kat-kart__gorsel { border-color: var(--brand) !important; }
html body .tm-kat-kart__gorsel img {
  width: 100% !important; height: 100% !important; max-width: none !important; object-fit: contain !important;
  display: block !important; margin: 0 !important; border: 0 !important;
}
@media (max-width: 767px) {
  html body .tm-kat-kart__gorsel { width: 60px !important; height: 60px !important; }
}


/* === 66. Urun menusu kategori agacindan (2026-10-07) ===
   Mega menu ana gruplari kolon yapar; 8den fazla alt grubu olan kolon genis ve iki sutunlu.
   Menu Urunler basligina degil ust bara gore ortalanir; yoksa genis menu sola tasardi. */
@media (min-width: 993px) {
  html body .th-mega-parent { position: static !important; }
  html body .th-mega.th-mega--agac { width: min(1080px, calc(100vw - 48px)) !important; }
}
html body .th-mega__col h4 a { color: inherit !important; text-decoration: none !important; }
html body .th-mega__col h4 a:hover { color: var(--brand) !important; }
html body .th-mega__col--genis ul { column-count: 2 !important; column-gap: 24px !important; }
html body .th-mega__col--genis ul li { break-inside: avoid !important; }
/* Mobil menu: ana grup kalin, alt gruplar girintili */
html body .th-macc .th-mgrup a strong { color: var(--navy) !important; }
html body .th-macc .th-mgrup { margin-top: 6px !important; }
html body .th-macc .th-malt a { padding-left: 18px !important; font-size: 14px !important; }

/* --- 67. Kategori urun izgarasi: Bootstrap sutunu izgara hucresinde %33'e daraliyordu (2026-10-15) --- */
html body .category-page .product-grid { margin-left: 0 !important; margin-right: 0 !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
html body .product-grid > [class*="col-"] { flex: none !important; max-width: none !important; width: auto !important; min-width: 0 !important; padding: 0 !important; }
@media (max-width: 767px) {
  html body .category-page .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
/* --- 68. Urun tablolari (2026-10-15) ---
   .tm-tablo--veri : panelin "Urun Tablosu" ekranindan gelen tablolar (ProductTabs.ascx uretir;
                     baslik satiri <thead>, vurgulu ilk sutun .tm-tablo--ilk + <th scope=row>).
   .tm-tablo (yalin): urun aciklamasina editorle yapistirilmis eski tablolar; temsan-sayfa.js
                     sabit genislikleri silip kutuya alir, ilk satir/ilk sutun baslik sayilir. */
html body .tm-urun-tablo { margin: 0 0 28px !important; }
html body .tm-urun-tablo:last-child { margin-bottom: 0 !important; }
html body .tm-urun-tablo__baslik { font-size: 17px !important; font-weight: 700 !important; color: var(--navy) !important; margin: 0 0 12px !important; }
html body .tm-urun-tablo__baslik::before, html body .tm-urun-tablo__baslik::after { display: none !important; }
html body .tm-tablo-kutu { overflow: auto !important; max-width: 100% !important; max-height: 70vh !important; margin: 20px 0 28px !important; border: 1px solid var(--line) !important; border-radius: 8px !important; -webkit-overflow-scrolling: touch; background: #fff !important; }
html body .tm-urun-tablo .tm-tablo-kutu { margin: 0 !important; }
html body .tm-tablo-kutu table.tm-tablo { width: auto !important; min-width: 100% !important; max-width: none !important; border-collapse: separate !important; border-spacing: 0 !important; font-size: 13px !important; line-height: 1.4 !important; margin: 0 !important; background: #fff !important; }
html body .tm-tablo-kutu table.tm-tablo td,
html body .tm-tablo-kutu table.tm-tablo th { padding: 8px 12px !important; border: 0 !important; border-bottom: 1px solid var(--line) !important; border-right: 1px solid var(--line) !important; white-space: nowrap !important; text-align: center !important; color: var(--navy) !important; font-weight: 400 !important; background: #fff !important; font-variant-numeric: tabular-nums; }
html body .tm-tablo-kutu table.tm-tablo tbody tr:nth-child(even) > * { background: #f6f8fb !important; }
html body .tm-tablo-kutu table.tm-tablo tbody tr:hover > * { background: #fff4ea !important; }
/* baslik satiri */
html body .tm-tablo-kutu table.tm-tablo thead th,
html body .tm-tablo-kutu table.tm-tablo:not(.tm-tablo--veri) tr:first-child > * { position: sticky !important; top: 0 !important; z-index: 2 !important; background: var(--navy) !important; color: #fff !important; font-weight: 700 !important; }
/* vurgulu ilk sutun */
html body .tm-tablo-kutu table.tm-tablo--ilk tbody th,
html body .tm-tablo-kutu table.tm-tablo--ilk thead th:first-child,
html body .tm-tablo-kutu table.tm-tablo:not(.tm-tablo--veri) td:first-child { position: sticky !important; left: 0 !important; z-index: 1 !important; text-align: left !important; font-weight: 700 !important; }
html body .tm-tablo-kutu table.tm-tablo--ilk tbody th,
html body .tm-tablo-kutu table.tm-tablo:not(.tm-tablo--veri) tr:not(:first-child) td:first-child { background: #eef2f7 !important; }
html body .tm-tablo-kutu table.tm-tablo--ilk tbody tr:hover th,
html body .tm-tablo-kutu table.tm-tablo:not(.tm-tablo--veri) tr:not(:first-child):hover td:first-child { background: #ffe7d3 !important; }
/* kose hucresi */
html body .tm-tablo-kutu table.tm-tablo--ilk thead th:first-child,
html body .tm-tablo-kutu table.tm-tablo:not(.tm-tablo--veri) tr:first-child td:first-child { z-index: 3 !important; background: var(--brand) !important; color: #fff !important; }
@media (max-width: 767px) {
  html body .tm-tablo-kutu table.tm-tablo { font-size: 12px !important; }
  html body .tm-tablo-kutu table.tm-tablo td, html body .tm-tablo-kutu table.tm-tablo th { padding: 7px 9px !important; }
}
[dir="rtl"] .tm-tablo-kutu table.tm-tablo--ilk tbody th,
[dir="rtl"] .tm-tablo-kutu table.tm-tablo--ilk thead th:first-child { left: auto !important; right: 0 !important; text-align: right !important; }
