/* =====================================================================
   İris Otomasyon — tasarım temeli (renk/yazı/bileşen belirteçleri)
   Mevcut irisotomasyon.com dilinden: koyu turkuaz, açık camgöbeği paneller,
   açık limon zeminli bölümler, Bricolage Grotesque, yuvarlak kartlar, kemer biçimli görseller.
   Bütün ön yüz CSS'leri bu belirteçleri kullanır (iris-*.css). Sınıf öneki: .ir-
   ===================================================================== */
:root{
  --ir-primary: #006267;        /* ana turkuaz (buton, vurgu) */
  --ir-primary-2: #004D51;      /* koyu turkuaz (başlık metni) */
  --ir-ink: #0C2F25;            /* en koyu (gövde metni) */
  --ir-text: #2E4A4C;           /* gövde metni */
  --ir-muted: #52706F;          /* ikincil metin — #E8FBFD/#D2F5F8 üzerinde ≥4.5:1 (WCAG AA) */
  --ir-line: #D6ECEE;           /* çizgi */
  --ir-cyan: #E8FBFD;           /* açık camgöbeği panel */
  --ir-cyan-2: #D2F5F8;         /* biraz koyu camgöbeği */
  --ir-lime: #F7FDD6;           /* açık limon bölüm zemini */
  --ir-teal-bright: #19B6B3;    /* parlak turkuaz (ikon, logo tonu) */
  --ir-bg: #FFFFFF;
  --ir-soft: #F4FAFA;           /* sayfa açık zemin */
  --ir-danger: #C0392B;
  --ir-success: #2E8B57;
  --ir-warn: #D98E04;

  --ir-radius-sm: 6px;          /* buton */
  --ir-radius: 14px;            /* kart */
  --ir-radius-lg: 24px;         /* büyük blok (hero, footer, bölüm kutusu) */
  --ir-radius-arch: 120px 120px 18px 18px;   /* kemer biçimli üst köşe */

  --ir-shadow-sm: 0 1px 2px rgba(12,47,37,.06);
  --ir-shadow: 0 10px 30px -12px rgba(0,77,81,.22);
  --ir-shadow-lg: 0 24px 60px -24px rgba(0,77,81,.35);

  --ir-font: "Bricolage Grotesque", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ir-container: 1240px;
  --ir-gutter: clamp(16px, 3vw, 28px);
  --ir-section: clamp(56px, 8vw, 104px);
}

/* ---------- Taban ---------- */
html{ -webkit-text-size-adjust: 100%; }
body.ir{
  margin: 0; background: var(--ir-bg); color: var(--ir-text);
  font-family: var(--ir-font); font-size: 16px; line-height: 1.6;
  -webkit-font-smoothing: antialiased; font-optical-sizing: auto;
}
body.ir h1, body.ir h2, body.ir h3, body.ir h4, body.ir h5, body.ir h6{
  font-family: var(--ir-font); color: var(--ir-primary-2); font-weight: 500; letter-spacing: -.01em; line-height: 1.15; margin: 0 0 .5em;
}
body.ir a{ color: var(--ir-primary); text-decoration: none; }
body.ir a:hover{ color: var(--ir-primary-2); }
body.ir img{ max-width: 100%; height: auto; }
body.ir .ir-num, body.ir .ir-price{ font-variant-numeric: tabular-nums; }
body.ir :focus-visible{ outline: 2px solid var(--ir-primary); outline-offset: 2px; }
/* Koyu zeminlerde (footer, turkuaz paneller) açık turkuaz odak halkası */
body.ir .irf :focus-visible{ outline-color: #9FE6E4; }
/* Ekran okuyucuya özel metin */
.ir-sr-only{ position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* Hareket azaltma tercihi: tüm sayfa genelinde animasyon/geçiş/kaydırma */
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto !important; }
  body.ir *, body.ir *::before, body.ir *::after{ transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

.ir-container{ width: 100%; max-width: var(--ir-container); margin: 0 auto; padding: 0 var(--ir-gutter); box-sizing: border-box; }
.ir-section{ padding: var(--ir-section) 0; }
.ir-box{ margin: 0 var(--ir-gutter); border-radius: var(--ir-radius-lg); }   /* kenarlardan içe alınmış renkli blok */
.ir-box--lime{ background: var(--ir-lime); }
.ir-box--cyan{ background: var(--ir-cyan); }
.ir-box--teal{ background: var(--ir-primary); color: #fff; }

/* Bölüm başlığı: küçük üst etiket + büyük başlık */
.ir-eyebrow{ display: inline-block; font-size: .72rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ir-primary); margin-bottom: .6rem; }
.ir-title{ font-size: clamp(1.8rem, 3.6vw, 2.6rem); }
.ir-head{ text-align: center; max-width: 720px; margin: 0 auto clamp(28px, 4vw, 48px); }
.ir-head p{ color: var(--ir-muted); margin: 0; }
.ir-lead{ font-size: 1.06rem; color: var(--ir-text); }

/* ---------- Butonlar ---------- */
.ir-btn{
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 44px; padding: .6rem 1.25rem; border-radius: var(--ir-radius-sm); border: 1px solid transparent;
  font: 600 .92rem/1.2 var(--ir-font); cursor: pointer; text-decoration: none !important;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.ir-btn--primary{ background: var(--ir-primary); color: #fff !important; }
.ir-btn--primary:hover{ background: var(--ir-primary-2); }
.ir-btn--soft{ background: var(--ir-cyan); color: var(--ir-primary-2) !important; }
.ir-btn--soft:hover{ background: var(--ir-cyan-2); }
.ir-btn--ghost{ background: transparent; border-color: var(--ir-line); color: var(--ir-primary-2) !important; }
.ir-btn--ghost:hover{ border-color: var(--ir-primary); }
.ir-btn--light{ background: #fff; color: var(--ir-primary-2) !important; }
.ir-btn--block{ width: 100%; }
.ir-btn--sm{ min-height: 36px; padding: .4rem .85rem; font-size: .84rem; }
.ir-btn:disabled{ opacity: .55; cursor: not-allowed; }

/* Yuvarlak ok butonu (kart üzerinde) */
.ir-arrow{ width: 52px; height: 52px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--ir-primary); color: #fff; box-shadow: var(--ir-shadow); }

/* ---------- Kartlar ---------- */
.ir-card{ background: #fff; border: 1px solid var(--ir-line); border-radius: var(--ir-radius); box-shadow: var(--ir-shadow-sm); }
.ir-card--cyan{ background: var(--ir-cyan); border-color: transparent; }
.ir-arch{ border-radius: var(--ir-radius-arch); overflow: hidden; }   /* kemer biçimli görsel / kart */

/* Onay maddeleri (✓ daire) */
.ir-checks{ list-style: none; padding: 0; margin: 0; display: grid; gap: .7rem; }
.ir-checks li{ display: flex; gap: .65rem; align-items: flex-start; }
.ir-checks li::before{ content: ""; flex: 0 0 22px; height: 22px; border-radius: 50%; margin-top: 1px;
  background: var(--ir-primary) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E") center/12px no-repeat; }

/* Rozet / etiket */
.ir-badge{ display: inline-flex; align-items: center; gap: .3rem; padding: .18rem .55rem; border-radius: 999px; font-size: .74rem; font-weight: 600; background: var(--ir-cyan); color: var(--ir-primary-2); }
.ir-badge--ok{ background: #E5F4EC; color: var(--ir-success); }
.ir-badge--warn{ background: #FDF2DD; color: #9A6500; }
.ir-badge--no{ background: #FBE9E7; color: var(--ir-danger); }

/* ---------- Form ---------- */
.ir-field{ display: flex; flex-direction: column; gap: .35rem; margin: 0 0 .9rem; }
.ir-field > span, .ir-label{ font-size: .8rem; font-weight: 600; color: var(--ir-primary-2); }
.ir-input, .ir-select, .ir-textarea{
  width: 100%; box-sizing: border-box; min-height: 46px; padding: .6rem .85rem;
  border: 1px solid var(--ir-line); border-radius: 8px; background: #fff; color: var(--ir-ink);
  font: 400 16px/1.4 var(--ir-font); transition: border-color .15s, box-shadow .15s;
}
.ir-textarea{ min-height: 120px; resize: vertical; }
.ir-input:focus, .ir-select:focus, .ir-textarea:focus{ outline: 0; border-color: var(--ir-primary); box-shadow: 0 0 0 3px rgba(0,98,103,.15); }
.ir-select{ appearance: none; -webkit-appearance: none; padding-right: 2.2rem;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23004D51' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right .8rem center; }

/* ---------- Izgara yardımcıları ---------- */
.ir-grid{ display: grid; gap: clamp(14px, 2vw, 24px); }
.ir-grid--2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ir-grid--3{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ir-grid--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 991.98px){ .ir-grid--3, .ir-grid--4{ grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px){ .ir-grid--2, .ir-grid--3{ grid-template-columns: 1fr; } }

/* Ekran okuyucu için gizli */
.ir-sr{ position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* =====================================================================
   İç sayfa ortak bileşenleri (iç sayfa ajanı ekledi — includes/iris-page.php ile kullanılır)
   ===================================================================== */
.ir-ico{ flex: none; vertical-align: middle; }

/* Sayfa başlığı: yol + etiket + başlık + açıklama */
.ir-pagehead{ padding: clamp(22px, 3.5vw, 40px) 0 clamp(26px, 4vw, 48px); background: var(--ir-cyan); margin: 0 var(--ir-gutter); border-radius: 0 0 var(--ir-radius-lg) var(--ir-radius-lg); }
.ir-pagehead--lime{ background: var(--ir-lime); }
.ir-pagehead--plain{ background: transparent; }
.ir-pagehead-row{ display: flex; align-items: flex-end; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap; }
.ir-pagehead-copy{ max-width: 760px; min-width: 0; }
body.ir .ir-pagehead-title, .ir-pagehead-title{ font-size: clamp(1.75rem, 4vw, 2.75rem); margin: 0; color: var(--ir-primary-2); overflow-wrap: anywhere; }
.ir-pagehead-lead{ margin: .7rem 0 0; color: var(--ir-text); font-size: 1.04rem; max-width: 640px; }
.ir-pagehead-aside{ display: flex; gap: 10px; flex-wrap: wrap; }

.ir-crumb{ margin-bottom: clamp(14px, 2vw, 22px); font-size: .82rem; }
.ir-crumb ol{ list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.ir-crumb li{ display: inline-flex; align-items: center; gap: 4px; color: var(--ir-muted); min-width: 0; }
.ir-crumb li + li::before{ content: "/"; color: #9DB9BB; margin-right: 2px; }
.ir-crumb a{ color: var(--ir-primary) !important; }
.ir-crumb [aria-current]{ color: var(--ir-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 60vw; }

/* Uyarı kutuları */
.ir-alert{ display: flex; gap: .65rem; align-items: flex-start; padding: .85rem 1rem; border-radius: 10px; font-size: .93rem; margin: 0 0 1rem; border: 1px solid transparent; }
.ir-alert--ok{ background: #E9F6EF; border-color: #CDEBD9; color: #1F6B43; }
.ir-alert--err{ background: #FCECEA; border-color: #F5D3CE; color: #9B2C20; }
.ir-alert--info{ background: var(--ir-cyan); border-color: var(--ir-cyan-2); color: var(--ir-primary-2); }
.ir-alert--warn{ background: #FDF4E1; border-color: #F6E2B6; color: #7A5300; }
.ir-alert ul{ margin: 0; padding-left: 1.1rem; }

/* Boş durum */
.ir-empty{ text-align: center; padding: clamp(36px, 6vw, 72px) 20px; border: 1px dashed var(--ir-line); border-radius: var(--ir-radius-lg); background: var(--ir-soft); }
.ir-empty-ico{ width: 72px; height: 72px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--ir-cyan); color: var(--ir-primary); margin-bottom: 14px; }
.ir-empty h2, .ir-empty h3{ font-size: 1.35rem; margin-bottom: .4rem; }
.ir-empty p{ color: var(--ir-muted); max-width: 440px; margin: 0 auto 1.2rem; }

/* Sayfalama */
.ir-pager{ display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 32px; }
.ir-pager a, .ir-pager span{ min-width: 42px; height: 42px; padding: 0 10px; display: inline-grid; place-items: center; border-radius: 10px; border: 1px solid var(--ir-line); color: var(--ir-primary-2) !important; font-weight: 600; font-variant-numeric: tabular-nums; background: #fff; }
.ir-pager a:hover{ border-color: var(--ir-primary); }
.ir-pager .is-active{ background: var(--ir-primary); border-color: var(--ir-primary); color: #fff !important; }
.ir-pager .is-gap{ border: 0; background: transparent; min-width: 20px; }

/* Adet seçici */
.ir-qty{ display: inline-flex; align-items: stretch; border: 1px solid var(--ir-line); border-radius: 8px; background: #fff; overflow: hidden; height: 46px; }
.ir-qty button{ width: 40px; border: 0; background: transparent; color: var(--ir-primary-2); font-size: 1.15rem; cursor: pointer; display: grid; place-items: center; }
.ir-qty button:hover{ background: var(--ir-cyan); }
.ir-qty input{ width: 64px; border: 0; text-align: center; font: 600 16px/1 var(--ir-font); color: var(--ir-ink); font-variant-numeric: tabular-nums; -moz-appearance: textfield; background: transparent; }
.ir-qty input::-webkit-outer-spin-button, .ir-qty input::-webkit-inner-spin-button{ -webkit-appearance: none; margin: 0; }
.ir-qty--sm{ height: 38px; }
.ir-qty--sm button{ width: 32px; }
.ir-qty--sm input{ width: 48px; font-size: 15px; }

/* Tablo */
.ir-table{ width: 100%; border-collapse: collapse; font-size: .94rem; }
.ir-table th, .ir-table td{ text-align: left; padding: .7rem .9rem; border-bottom: 1px solid var(--ir-line); vertical-align: top; }
.ir-table th{ color: var(--ir-primary-2); font-weight: 600; }
.ir-table--zebra tr:nth-child(odd) th, .ir-table--zebra tr:nth-child(odd) td{ background: var(--ir-soft); }
.ir-table-wrap{ overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* Bilgi/ikonlu kutucuk (kart içinde ikon + metin) */
.ir-ibox{ display: flex; gap: 14px; align-items: flex-start; padding: 18px; border-radius: var(--ir-radius); background: var(--ir-cyan); }
.ir-ibox-ico{ width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; background: #fff; color: var(--ir-primary); flex: none; }
.ir-ibox b{ display: block; color: var(--ir-primary-2); font-weight: 600; }
.ir-ibox span, .ir-ibox p{ color: var(--ir-text); font-size: .9rem; margin: 0; }

/* Çip / hap bağlantı */
.ir-chip{ display: inline-flex; align-items: center; gap: .4rem; padding: .45rem .9rem; border-radius: 999px; border: 1px solid var(--ir-line); background: #fff; color: var(--ir-primary-2) !important; font-size: .86rem; font-weight: 500; white-space: nowrap; }
.ir-chip:hover{ border-color: var(--ir-primary); }
.ir-chip.is-active{ background: var(--ir-primary); border-color: var(--ir-primary); color: #fff !important; }
.ir-chip small{ opacity: .7; font-variant-numeric: tabular-nums; }

/* Basit metin bloğu (sözleşme, açıklama) */
.ir-prose{ color: var(--ir-text); line-height: 1.75; }
.ir-prose h2{ font-size: 1.4rem; margin: 1.8em 0 .6em; }
.ir-prose h3{ font-size: 1.15rem; margin: 1.5em 0 .5em; }
.ir-prose p, .ir-prose ul, .ir-prose ol{ margin: 0 0 1em; }
.ir-prose ul, .ir-prose ol{ padding-left: 1.25rem; }
.ir-prose li{ margin-bottom: .35em; }
.ir-prose a{ text-decoration: underline !important; text-underline-offset: 2px; }
.ir-prose table{ width: 100%; border-collapse: collapse; margin: 0 0 1em; }
.ir-prose th, .ir-prose td{ border: 1px solid var(--ir-line); padding: .5rem .7rem; text-align: left; }

/* Teklif sepeti bildirimi (iris-quote.js) */
.ir-qtoast{ position: fixed; z-index: 2000; left: 50%; bottom: calc(20px + var(--irbn-h, 0px)); transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 32px); width: max-content; padding: 12px 14px 12px 16px;
  background: var(--ir-primary-2); color: #fff; border-radius: 14px; box-shadow: var(--ir-shadow-lg); font: 500 .92rem/1.35 var(--ir-font); transition: opacity .2s, transform .2s; }
.ir-qtoast.is-on{ opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.ir-qtoast a{ color: #fff !important; background: rgba(255,255,255,.14); padding: .4rem .75rem; border-radius: 8px; font-weight: 600; white-space: nowrap; }
.ir-qtoast a:hover{ background: rgba(255,255,255,.24); }
.ir-qtoast--err{ background: var(--ir-danger); }
@media (max-width: 575.98px){ .ir-qtoast{ flex-wrap: wrap; } }