/* GÖREN Hesaplayıcı v4.0 – SKS Kalite
   Easy Accordion Pro tasarım diliyle uyumlu · Açık & Koyu mod tam destek
   Mobil öncelikli, dokunmatik dostu, iOS Safari zoom önlemli */

/* ══════════════════════════════════════════
   RENK SİSTEMİ (Açık Mod – varsayılan)
═══════════════════════════════════════════ */
#goren-wrap {
  /* Ana vurgu rengi – Easy Accordion Pro'nun mavisi */
  --ea-primary:    #1176dd;
  --ea-primary-hv: #0d5fb5;
  --ea-primary-lt: #e8f2fd;
  --ea-primary-tx: #0d4a8f;

  /* Yüzeyler */
  --ea-bg:         #ffffff;       /* ana arkaplan */
  --ea-surface:    #f6f8fb;       /* kart/header arkaplanı */
  --ea-surface-2:  #eef2f7;       /* iç gri */
  --ea-border:     #e1e5eb;       /* kart sınırı */
  --ea-border-2:   #c8d0db;       /* input sınırı */

  /* Metin */
  --ea-text:       #1a2332;       /* ana metin */
  --ea-text-2:     #4a5668;       /* ikincil metin */
  --ea-text-3:     #7a8699;       /* placeholder / mini etiket */

  /* Durum renkleri */
  --ea-green-bg:   #e8f5e9; --ea-green-tx: #1b5e20;
  --ea-amber-bg:   #fff8e1; --ea-amber-tx: #c75a00;
  --ea-red-bg:     #ffebee; --ea-red-tx:   #b71c1c;
  --ea-info-bg:    #e8f2fd; --ea-info-tx:  #0d4a8f;

  /* Kart kırmızı çerçeve rengi (her iki modda görünür) */
  --ea-card-border:    #e53935;
  --ea-card-border-hv: #c62828;

  /* Köşe, gölge, geçiş */
  --ea-r:    4px;
  --ea-r-lg: 6px;
  --ea-shadow:    0 1px 3px rgba(0,0,0,.06);
  --ea-shadow-lg: 0 2px 8px rgba(0,0,0,.08), 0 1px 3px rgba(0,0,0,.04);
  --ea-trans: .18s ease;
}

/* ══════════════════════════════════════════
   KOYU MOD – iki yöntem destekleniyor
   1) Sistem tercihinde dark
   2) Tema gövdesinde .dark, [data-theme="dark"], vb.
═══════════════════════════════════════════ */
@media (prefers-color-scheme: dark) {
  #goren-wrap:not([data-theme="light"]) {
    --ea-primary:    #4a9eff;
    --ea-primary-hv: #6db1ff;
    --ea-primary-lt: #0d2942;
    --ea-primary-tx: #8ec0ff;

    --ea-bg:         #0f1419;
    --ea-surface:    #1a212b;
    --ea-surface-2:  #232c38;
    --ea-border:     #2d3744;
    --ea-border-2:   #3d4956;

    --ea-text:       #e8eef5;
    --ea-text-2:     #b0bcc9;
    --ea-text-3:     #7a8699;

    --ea-green-bg:#1a3320; --ea-green-tx:#7fc787;
    --ea-amber-bg:#3a2a05; --ea-amber-tx:#ffb74d;
    --ea-red-bg:  #391214; --ea-red-tx:  #ef5350;
    --ea-info-bg: #0d2942; --ea-info-tx: #8ec0ff;

    --ea-card-border:    #ef5350;
    --ea-card-border-hv: #ff7373;

    --ea-shadow:    0 1px 3px rgba(0,0,0,.4);
    --ea-shadow-lg: 0 2px 10px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.3);
  }
}

/* Manuel koyu mod sınıfları – tema veya body üzerinde */
body.dark-mode #goren-wrap,
body.is-dark-theme #goren-wrap,
body[data-theme="dark"] #goren-wrap,
body.dark #goren-wrap,
html[data-theme="dark"] #goren-wrap,
html.dark #goren-wrap,
#goren-wrap[data-theme="dark"] {
  --ea-primary:    #4a9eff;
  --ea-primary-hv: #6db1ff;
  --ea-primary-lt: #0d2942;
  --ea-primary-tx: #8ec0ff;

  --ea-bg:         #0f1419;
  --ea-surface:    #1a212b;
  --ea-surface-2:  #232c38;
  --ea-border:     #2d3744;
  --ea-border-2:   #3d4956;

  --ea-text:       #e8eef5;
  --ea-text-2:     #b0bcc9;
  --ea-text-3:     #7a8699;

  --ea-green-bg:#1a3320; --ea-green-tx:#7fc787;
  --ea-amber-bg:#3a2a05; --ea-amber-tx:#ffb74d;
  --ea-red-bg:  #391214; --ea-red-tx:  #ef5350;
  --ea-info-bg: #0d2942; --ea-info-tx: #8ec0ff;

  --ea-card-border:    #ef5350;
  --ea-card-border-hv: #ff7373;

  --ea-shadow:    0 1px 3px rgba(0,0,0,.4);
  --ea-shadow-lg: 0 2px 10px rgba(0,0,0,.5), 0 1px 3px rgba(0,0,0,.3);
}

/* ══════════════════════════════════════════
   RESET & TABAN
═══════════════════════════════════════════ */
[id="goren-wrap"] *,
[id="goren-wrap"] *::before,
[id="goren-wrap"] *::after,
#goren-toast {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

#goren-wrap {
  font-family: inherit;       /* sayfa/tema fontunu kullan – Easy Accordion ile uyumlu */
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--ea-text);
  background: var(--ea-bg);
  padding: 1.25rem 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#goren-wrap button,
#goren-wrap input,
#goren-wrap select,
#goren-wrap textarea { font-family: inherit; }

/* ══════════════════════════════════════════
   BAŞLIK BÖLÜMÜ
   Tema (BoomBox) h1 stillerini ezmek için !important kullanılıyor.
   Hem header'a hem title'a hem de altındaki kurum türü kutusuna boşluk verilir
   ki en az biri çalışsın.
═══════════════════════════════════════════ */
.g-header {
  margin-bottom: 2.25rem !important;
  padding-bottom: 0 !important;
}

.g-title {
  font-size: 1.75rem !important;     /* 28px */
  font-weight: 600;
  color: var(--ea-text);
  letter-spacing: -.015em;
  line-height: 1.2;
  margin: 0 0 1.5rem 0 !important;   /* alt boşluk garantili */
  padding: 0 !important;
  display: block;
}

/* ══════════════════════════════════════════
   KURUM TÜRÜ DROPDOWN
═══════════════════════════════════════════ */
.g-kt-dropdown {
  position: relative;
  margin: 0 0 12px 0 !important;   /* alttaki Hesaplama akordiyonu ile arasında net boşluk */
  z-index: 10;
}
.g-kt-dropdown:has(.g-kt-trigger.open) { z-index: 9999; }
.g-kt-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;          /* sol/sağ boşluk yazı kenara temas etmesin */
  min-height: 56px;            /* gösterge kartlarıyla aynı yükseklik */
  font-size: 1rem;
  font-family: inherit;
  background: rgba(229, 57, 53, .08);   /* hafif kırmızı dolgu – kurum seçili */
  border: 1px solid var(--ea-card-border);
  border-radius: var(--ea-r-lg);        /* gösterge kartlarıyla aynı yuvarlaklık */
  color: var(--ea-text);
  cursor: pointer;
  text-align: left;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: border-color var(--ea-trans), background var(--ea-trans);
}
.g-kt-trigger:hover,
.g-kt-trigger.open {
  background: rgba(229, 57, 53, .14);
  border-color: var(--ea-card-border);
}
.g-kt-trigger-lbl {
  color: var(--ea-text-3);
  font-size: .9375rem;
  flex-shrink: 0;
}
.g-kt-trigger-val {
  flex: 1;
  font-weight: 600;
  color: var(--ea-card-border);  /* seçili kurum: kırmızı yazı */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.g-kt-trigger-arrow {
  color: var(--ea-text-3);
  font-size: 14px;
  flex-shrink: 0;
  transition: transform var(--ea-trans);
}
.g-kt-trigger.open .g-kt-trigger-arrow { transform: rotate(180deg); }

.g-kt-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  margin: 0;
  padding: 6px;
  list-style: none;
  background: var(--ea-bg, #1a1a1a);
  border: 1px solid var(--ea-border-2);
  border-radius: var(--ea-r);
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  z-index: 9999;          /* tema header / sticky elemanları geçsin */
  max-height: 60vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
@media (prefers-color-scheme: light) {
  .g-kt-menu { background: #fff; }
}
.g-kt-opt {
  padding: 12px 14px;
  font-size: 1rem;
  color: var(--ea-text);
  cursor: pointer;
  border-radius: 8px;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background var(--ea-trans), color var(--ea-trans);
}
.g-kt-opt:hover { background: var(--ea-surface); }
.g-kt-opt.active {
  background: rgba(229, 57, 53, .12);
  color: var(--ea-card-border);
  font-weight: 600;
}

/* ══════════════════════════════════════════
   HESAPLAMA BİLGİLERİ AKORDİYONU
═══════════════════════════════════════════ */
.g-hb {
  border: 1px solid var(--ea-card-border);   /* gösterge kartlarıyla aynı kırmızı çerçeve */
  border-radius: var(--ea-r-lg);
  margin: 0 0 12px 0 !important;             /* arama kutusu ile arasında net boşluk */
  overflow: hidden;
  transition: border-color var(--ea-trans);
}
.g-hb:hover { border-color: var(--ea-card-border-hv); }
.g-hb-head {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 24px;          /* sol/sağ boşluk yazı kenara temas etmesin */
  min-height: 56px;            /* gösterge kartlarıyla aynı yükseklik */
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none;
  font-family: inherit;
  font-size: 1rem;
  color: var(--ea-text);
  cursor: pointer;
  text-align: left;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  -webkit-appearance: none;
  appearance: none;
  outline: none;
  touch-action: manipulation;
  transition: none;        /* arka plan değişimi tetiklemesin */
}
.g-hb-head:hover,
.g-hb-head:focus,
.g-hb-head:focus-visible,
.g-hb-head:active,
.g-hb-head.open {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  outline: none;
  box-shadow: none;
}
.g-hb-title {
  font-weight: 600;
  flex: 1;
}
.g-hb-chev {
  color: var(--ea-text-3);
  font-size: 14px;
  flex-shrink: 0;
  transition: transform var(--ea-trans);
}
.g-hb-head.open .g-hb-chev { transform: rotate(180deg); }

/* Mini özet – başlık satırında doldurulan/GP bilgisi */
.g-hb-mini {
  display: none;            /* JS değer atayınca .show ile görünür olacak */
  font-size: .875rem;       /* 14px */
  font-weight: 600;
  color: var(--ea-card-border);
  padding: 3px 10px;
  background: rgba(229, 57, 53, .10);
  border-radius: 99px;
  white-space: nowrap;
  flex-shrink: 0;
  letter-spacing: .01em;
}
.g-hb-mini.show { display: inline-block; }
.g-hb-body {
  padding: 16px 18px 18px;
  border-top: 1px solid var(--ea-card-border);
}
/* Akordiyon içindeki son eleman boşluk yapmasın */
.g-hb-body > .g-summary { margin-bottom: 1rem !important; }
.g-hb-body > .g-topbar { margin-bottom: 1rem !important; }

/* Bilgi notu */
.g-hb-note {
  font-size: .9375rem;
  color: var(--ea-text-2);
  padding: 12px 14px;
  margin: 0 4px;                   /* sol çizgi akordiyon kenarına bitişmesin */
  background: rgba(122, 134, 153, .08);
  border-left: 3px solid var(--ea-card-border);
  border-radius: 8px;
  line-height: 1.55;
}
.g-hb-note strong { color: var(--ea-card-border); }

/* Eski kurum türü buton şeridi kaldırıldı – sınıflar kalsa da gizle */
.g-kurumturu { display: none !important; }
.g-tabs { display: none !important; }

/* ══════════════════════════════════════════
   ÜST BAR – Kurum / Dönem / Butonlar
═══════════════════════════════════════════ */
.g-topbar {
  display: flex;
  align-items: flex-end;
  gap: 14px;
  margin-bottom: 1.5rem !important;
  flex-wrap: wrap;
  background: transparent;
  border: none;          /* iç kart çerçevesi kaldırıldı – akordiyon gövdesi zaten çerçeveli */
  border-radius: 0;
  padding: 0;
}

.g-topbar-left    { display: flex; gap: 10px; flex: 1; flex-wrap: wrap; min-width: 0; }
.g-topbar-actions { display: flex; gap: 8px; flex-shrink: 0; }

.g-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 150px;
}

.g-field label {
  font-size: .8125rem;    /* 13px */
  font-weight: 600;
  color: var(--ea-text-3);
  text-transform: uppercase;
  letter-spacing: .05em;
}

.g-field input {
  width: 100%;
  padding: 12px 14px;
  font-size: 1rem;        /* 16px – iOS zoom önleme */
  font-family: inherit;
  text-align: left !important;
  direction: ltr !important;
  border: 1px solid var(--ea-border-2);
  border-radius: 10px;
  background: transparent;
  color: var(--ea-text);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color var(--ea-trans), box-shadow var(--ea-trans);
}
.g-field input:focus {
  border-color: var(--ea-text-3);
  box-shadow: 0 0 0 3px rgba(122, 134, 153, .15);
}
.g-field input::placeholder,
.g-field input::-webkit-input-placeholder { color: var(--ea-text-3); text-align: left !important; }

/* Kurum / Dönem input'ları – sola yaslı (tema ezmesin) */
#goren-wrap .g-field input { text-align: left !important; direction: ltr !important; }
#goren-wrap .g-field input::placeholder { text-align: left !important; }

/* ══════════════════════════════════════════
   KURUM TÜRÜ – Segmented control
═══════════════════════════════════════════ */
.g-kurumturu {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 1.25rem;
}
.g-kt-btn {
  flex: 1 0 auto;
  min-width: 130px;
  padding: 11px 14px;
  font-size: .9125rem;
  font-weight: 500;
  font-family: inherit;
  border: 1px solid var(--ea-border-2);
  border-radius: var(--ea-r);
  background: transparent;
  color: var(--ea-text-2);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: color var(--ea-trans), border-color var(--ea-trans);
  line-height: 1.3;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.g-kt-btn:hover:not(:disabled) {
  background: var(--ea-surface);
  color: var(--ea-text);
  border-color: var(--ea-text-3);
}
.g-kt-btn.active {
  background: transparent;
  color: var(--ea-card-border);
  border-color: var(--ea-card-border);
  font-weight: 600;
}
.g-kt-btn:disabled {
  opacity: .45;
  cursor: not-allowed;
}

/* ══════════════════════════════════════════
   EYLEM BUTONLARI – Temizle / Paylaş
═══════════════════════════════════════════ */
.g-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 18px;
  font-size: .9375rem;    /* 15px */
  font-weight: 600;
  font-family: inherit;
  border: 1px solid transparent;
  border-radius: var(--ea-r);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
  transition: background var(--ea-trans), border-color var(--ea-trans), color var(--ea-trans), opacity var(--ea-trans);
  white-space: nowrap;
  min-height: 42px;       /* dokunma hedefi */
}

.g-btn-clear {
  background: transparent;
  color: var(--ea-text-2);
  border-color: var(--ea-border-2);
}
.g-btn-clear:hover,
.g-btn-clear:active {
  background: rgba(229, 57, 53, .12);
  border-color: #e53935;
  color: #e53935;
}

.g-btn-share {
  background: transparent;
  color: var(--ea-text-2);
  border-color: var(--ea-border-2);
}
.g-btn-share:hover,
.g-btn-share:active {
  background: rgba(0, 122, 255, .12);
  border-color: #007AFF;     /* iOS sistem mavisi */
  color: #007AFF;
}

/* ══════════════════════════════════════════
   ÖZET KARTLARI
═══════════════════════════════════════════ */
.g-summary {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 10px;
  margin-bottom: 1.5rem !important;
}

.g-scard {
  background: transparent;
  border-radius: var(--ea-r-lg);
  padding: 14px 16px;
  border: 1px solid var(--ea-border);
}
.g-scard-lbl {
  font-size: .8125rem;    /* 13px */
  color: var(--ea-text-3);
  margin-bottom: 5px;
  font-weight: 500;
}
.g-scard-val {
  font-size: 1.5rem;      /* 24px */
  font-weight: 700;
  color: var(--ea-text);
  line-height: 1.15;
}
.g-scard-val.accent { color: var(--ea-primary); }

/* ══════════════════════════════════════════
   ARAMA
═══════════════════════════════════════════ */
.g-search-row { margin-bottom: 1.5rem !important; }
.g-search { position: relative; }
.g-search-icon {
  position: absolute;
  left: 14px; top: 50%;
  transform: translateY(-50%);
  color: var(--ea-text-3);
  pointer-events: none;
  font-size: 16px;
  line-height: 1;
}
.g-search input {
  width: 100%;
  padding: 12px 14px 12px 46px;
  font-size: 1rem;
  font-family: inherit;
  border: 1px solid var(--ea-border-2);
  border-radius: var(--ea-r);
  background: transparent;
  color: var(--ea-text);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color var(--ea-trans), box-shadow var(--ea-trans);
}
.g-search input:focus {
  border-color: var(--ea-text-3);
  box-shadow: 0 0 0 3px rgba(122, 134, 153, .15);
}
.g-search input::placeholder { color: var(--ea-text-3); }

/* Arama temizle (×) butonu – yazı varken görünür, sağa yaslı */
.g-search-clear {
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  display: none;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  line-height: 1;
  color: var(--ea-text-3);
  background: transparent;
  border: none;
  border-radius: 50%;
  cursor: pointer;
  padding: 0;
  font-family: inherit;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background var(--ea-trans), color var(--ea-trans);
}
.g-search-clear:hover { background: var(--ea-surface); color: var(--ea-text); }
.g-search-clear.show { display: flex; }
.g-search input.has-text { padding-right: 44px !important; }

/* ══════════════════════════════════════════
   SEKMELER (filtreler)
═══════════════════════════════════════════ */
.g-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 1.5rem !important;
}

.g-tab {
  padding: 10px 18px;
  font-size: .9375rem;    /* 15px */
  font-weight: 500;
  font-family: inherit;
  border: 1px solid var(--ea-border-2);
  border-radius: var(--ea-r);
  background: transparent;
  color: var(--ea-text-2);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: all var(--ea-trans);
  line-height: 1.3;
  min-height: 40px;
  white-space: nowrap;
}
.g-tab:hover { background: var(--ea-surface); color: var(--ea-text); }
.g-tab.active {
  background: transparent;
  color: var(--ea-card-border);
  border-color: var(--ea-card-border);
  font-weight: 600;
}

/* ══════════════════════════════════════════
   AKORDİYON KART – kırmızı çerçeve, şeffaf gövde
═══════════════════════════════════════════ */

/* Liste kapsayıcısı – kartlar arası garantili boşluk (gap, margin'den etkilenmez) */
#goren-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  margin-bottom: 1.5rem !important;
}

.g-item {
  border: 1px solid var(--ea-card-border);
  border-radius: var(--ea-r-lg);
  margin: 0 !important;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
  transition: border-color var(--ea-trans);
}
.g-item:hover { border-color: var(--ea-card-border-hv); }

/* ── Başlık satırı (header) – şeffaf ── */
.g-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 24px;          /* sol/sağ boşluk yazı kenara temas etmesin */
  background: transparent;
  cursor: pointer;
  user-select: none;
  -webkit-user-select: none;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: background var(--ea-trans);
  min-height: 56px;
}
.g-head:hover { background: rgba(229, 57, 53, .04); }

.g-num {
  font-size: .875rem;     /* 14px */
  color: var(--ea-text-3);
  font-weight: 700;
  flex-shrink: 0;
  min-width: 42px;
}

.g-head-title {
  font-size: 1.125rem;    /* 18px */
  font-weight: 400;       /* Easy Accordion Pro ile aynı – kalın değil */
  color: var(--ea-text);
  flex: 1;
  line-height: 1.4;
  min-width: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
}

.g-gp-chip {
  font-size: .8125rem;    /* 13px */
  font-weight: 700;
  flex-shrink: 0;
  padding: 4px 10px;
  border-radius: 99px;
  white-space: nowrap;
}

.g-chev {
  font-size: 14px;
  color: var(--ea-text-3);
  flex-shrink: 0;
  transition: transform var(--ea-trans);
  line-height: 1;
}
.g-chev.open { transform: rotate(180deg); }

/* ── Gövde – tamamen şeffaf, hiçbir alt-renk yok ── */
.g-body {
  display: none;
  padding: 18px 24px;          /* yan boşluk: iç öğeler kart kenarına dayanmasın */
  background: transparent;
  border-top: 1px solid var(--ea-card-border);
}
.g-body.open { display: block; }

/* Amaç kutusu – şeffaf, sadece sol vurgu çizgisi */
.g-amac {
  font-size: 1rem;        /* 16px */
  color: var(--ea-text-2);
  line-height: 1.625;
  padding: 4px 14px;
  background: transparent;
  margin: 0 4px 14px 4px;     /* sol vurgu çizgisi kart kenarına yaklaşmasın */
  border-left: 2px solid var(--ea-card-border);
}

/* Meta chip'ler – şeffaf, ince kırmızı çerçeveli */
.g-meta {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.g-meta-chip {
  font-size: .875rem;     /* 14px */
  padding: 5px 12px;
  border-radius: 99px;
  background: transparent;
  color: var(--ea-text-2);
  border: 1px solid var(--ea-card-border);
  white-space: nowrap;
}

/* Formül – şeffaf, sol kırmızı vurgu */
.g-formula {
  background: transparent;
  padding: 4px 14px;
  margin: 0 4px 14px 4px;     /* sol vurgu çizgisi kart kenarına yaklaşmasın */
  font-family: "SF Mono", "Fira Code", "Courier New", monospace;
  font-size: .9375rem;    /* 15px */
  color: var(--ea-text-2);
  line-height: 1.7;
  border-left: 2px solid var(--ea-card-border);
  overflow-x: auto;
}

/* ── Alan grid ── */
.g-fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
@media (max-width: 500px) {
  .g-fields { grid-template-columns: 1fr; }
}

.g-fw label {
  font-size: .875rem;     /* 14px */
  color: var(--ea-text-2);
  display: block;
  margin-bottom: 6px;
  line-height: 1.35;
  font-weight: 500;
}
.g-fw input {
  width: 100%;
  padding: 10px 12px;
  font-size: 1rem;        /* 16px – iOS zoom önleme */
  font-family: inherit;
  border: 1px solid var(--ea-card-border);
  border-radius: var(--ea-r);
  background: transparent;
  color: var(--ea-text);
  outline: none;
  -webkit-appearance: none;
  appearance: none;
  transition: border-color var(--ea-trans), box-shadow var(--ea-trans);
}
.g-fw input:focus {
  border-color: var(--ea-card-border-hv);
  box-shadow: 0 0 0 3px rgba(229, 57, 53, .15);
}

/* ══════════════════════════════════════════
   SONUÇ ALANI
═══════════════════════════════════════════ */
.g-result-area {
  display: flex;
  align-items: stretch;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.g-res-box,
.g-gp-box {
  background: transparent;
  border: 1px solid var(--ea-card-border);
  border-radius: var(--ea-r);
  padding: 10px 16px;
  min-width: 0;
}
.g-res-lbl {
  font-size: .75rem;      /* 12px */
  color: var(--ea-text-3);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: 4px;
  font-weight: 600;
}
.g-res-val {
  font-size: 1.625rem;    /* 26px */
  font-weight: 700;
  color: var(--ea-text);
  line-height: 1.2;
  word-break: break-word;
}
.g-res-unit {
  font-size: .8125rem;
  font-weight: 400;
  color: var(--ea-text-3);
}

.g-yorum {
  font-size: 1rem;        /* 16px */
  padding: 10px 14px;
  border-radius: var(--ea-r);
  flex: 1 1 180px;
  line-height: 1.55;
  font-weight: 500;
  min-width: 0;
}
.y-iyi   { background: var(--ea-green-bg); color: var(--ea-green-tx); }
.y-orta  { background: var(--ea-amber-bg); color: var(--ea-amber-tx); }
.y-kotu  { background: var(--ea-red-bg);   color: var(--ea-red-tx);   }
.y-bilgi { background: var(--ea-info-bg);  color: var(--ea-info-tx);  }

/* GP adımları */
.g-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}
.g-step {
  font-size: .8125rem;    /* 13px */
  padding: 5px 11px;
  border-radius: 99px;
  border: 1px solid var(--ea-card-border);
  color: var(--ea-text-2);
  background: transparent;
  transition: all var(--ea-trans);
}
.g-step.active {
  background: var(--ea-green-bg);
  color: var(--ea-green-tx);
  border-color: var(--ea-green-tx);
  font-weight: 700;
}

/* İpucu – şeffaf, sol kırmızı vurgu */
.g-tip {
  border-left: 2px solid var(--ea-card-border);
  padding: 4px 14px;
  margin: 14px 4px 0 4px;     /* sol vurgu çizgisi kart kenarına yaklaşmasın */
  background: transparent;
}
.g-tip p {
  font-size: 1rem;        /* 16px */
  color: var(--ea-text-2);
  line-height: 1.625;
}
.g-tip strong { color: var(--ea-card-border); }

/* ══════════════════════════════════════════
   BOŞ / SONUÇSUZ
═══════════════════════════════════════════ */
.g-empty {
  text-align: center;
  padding: 2.5rem;
  color: var(--ea-text-3);
  font-size: 1rem;
}
.g-nores {
  font-size: .9375rem;
  color: var(--ea-text-3);
  font-style: italic;
}

/* ══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
/* Footer – istek üzerine gizlendi */
.g-footer { display: none !important; }

/* ══════════════════════════════════════════
   TOAST
═══════════════════════════════════════════ */
#goren-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(16px);
  background: var(--ea-text);
  color: var(--ea-bg);
  padding: 12px 24px;
  border-radius: 99px;
  font-size: .9375rem;
  font-weight: 500;
  opacity: 0;
  pointer-events: none;
  z-index: 100000;
  transition: opacity var(--ea-trans), transform var(--ea-trans);
  white-space: nowrap;
  box-shadow: 0 4px 20px rgba(0,0,0,.25);
  max-width: calc(100vw - 32px);
}
#goren-toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ══════════════════════════════════════════
   RESPONSIVE – TABLET (≤768px)
═══════════════════════════════════════════ */
@media (max-width: 768px) {
  .g-summary { grid-template-columns: repeat(2,1fr); }
}

/* ══════════════════════════════════════════
   RESPONSIVE – MOBİL & TABLET YATAY (≤1024px)
   Yazılar webdekinden DAHA BÜYÜK
   (kol mesafesinde okunabilirlik için)
   1024px sınırı: iPhone yatay (≈932px) ve iPad
   portrait (768px) modlarda da mobil davransın diye.
═══════════════════════════════════════════ */
@media (max-width: 1024px) {
  #goren-wrap { padding: 1rem 3px; font-size: 19px; }

  /* Başlık alanı – tema h1 stilini eziyoruz */
  .g-title    { font-size: 1.9375rem !important; letter-spacing: -.02em; margin: 0 0 1.5rem 0 !important; padding: 0 !important; }  /* 31px */
  .g-header   { margin-bottom: 2rem !important; padding: 0 !important; }

  /* Kurum türü dropdown – mobil daha büyük */
  #goren-wrap .g-kt-trigger { padding: 16px 22px; font-size: 1.3125rem; min-height: 58px; border-radius: 10px; }   /* 21px */
  .g-kt-trigger-lbl { font-size: 1.125rem; }                                           /* 18px */
  .g-kt-trigger-val { font-size: 1.3125rem; }                                          /* 21px */
  .g-kt-trigger-arrow { font-size: 16px; }
  .g-kt-menu        { padding: 8px; }
  .g-kt-opt         { padding: 16px 22px; font-size: 1.3125rem; min-height: 54px; }   /* 21px */

  /* Hesaplama Bilgileri akordiyonu – mobil */
  .g-hb             { border-radius: 10px; }
  #goren-wrap .g-hb-head { padding: 18px 22px; font-size: 1.3125rem; min-height: 58px; }   /* 21px */
  .g-hb-title       { font-size: 1.3125rem; }                                         /* 21px */
  .g-hb-chev        { font-size: 16px; }
  .g-hb-mini        { font-size: 1rem; padding: 4px 12px; }                            /* 16px */
  .g-hb-body        { padding: 14px 22px 16px; }   /* başlıkla aynı yan boşluk */

  /* Üst bar – tam genişlik dikey (çerçevesiz; akordiyon gövdesi içinde) */
  .g-topbar {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    gap: 14px;
    border-radius: 0;
    border: none;
  }
  .g-topbar-left    { flex-direction: column; width: 100%; gap: 14px; }
  .g-topbar-actions { width: 100%; gap: 10px; }
  .g-field          { min-width: 0; gap: 8px; }
  .g-field label    { font-size: 1.125rem; }                       /* 18px */
  .g-field input    { padding: 16px 14px; font-size: 1.25rem; min-height: 56px; }  /* 20px */
  .g-btn            { flex: 1; min-height: 56px; font-size: 1.25rem; padding: 14px 18px; }  /* 20px */

  /* Özet kartları – iki sütun, büyük rakamlar */
  .g-summary    { gap: 10px; margin-bottom: 1.5rem !important; }
  .g-scard      { padding: 16px 18px; border-radius: 10px; }
  .g-scard-lbl  { font-size: 1.125rem; margin-bottom: 6px; }       /* 18px */
  .g-scard-val  { font-size: 2rem; }                               /* 32px */

  /* Arama satırı – tüm boşluklar 1.5rem standardı */
  .g-search-row { margin-top: 0 !important; margin-bottom: 1.5rem !important; }

  /* Arama kutusu – yazı ortalı, icon sol başta sabit; ortalanan yazıyla çakışmaz */
  .g-search input {
    padding: 14px 16px !important;
    font-size: 1.25rem;             /* 20px */
    min-height: 54px;
    text-align: center !important;
  }
  .g-search input::placeholder { text-align: center !important; }
  .g-search-icon { font-size: 19px; left: 18px; }
  .g-search-clear { width: 38px; height: 38px; font-size: 26px; right: 10px; }
  .g-search input.has-text { padding-right: 52px !important; }

  /* Sekmeler ve Kurum türü – mobilde yatay scroll, EŞİT BOYUTLU butonlar */
  .g-tabs,
  .g-kurumturu {
    gap: 8px;
    margin-bottom: 1.5rem !important;
    margin-top: 0 !important;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding-bottom: 4px;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .g-tabs::-webkit-scrollbar,
  .g-kurumturu::-webkit-scrollbar { display: none; }

  /* Filtre sekmeleri: hepsi en az 110px, içerik kadar uzayabilir – Tümü artık küçük değil */
  .g-tab {
    flex: 0 0 auto;
    min-width: 110px;
    padding: 14px 18px;
    font-size: 1.1875rem;       /* 19px */
    min-height: 52px;
    text-align: center;
  }

  /* Kurum türü butonları: en az 200px */
  .g-kt-btn {
    flex: 0 0 auto;
    min-width: 200px;
    padding: 15px 22px;
    font-size: 1.1875rem;       /* 19px */
    min-height: 54px;
  }

  /* AKORDİYON KART – kartlar arası bol boşluk (kapsayıcı gap ile) */
  #goren-list   { gap: 8px !important; margin-bottom: 1.5rem !important; }
  .g-item       { border-radius: 10px; }
  #goren-wrap .g-head { padding: 16px 22px; gap: 12px; min-height: 58px; }   /* Kurum Türü/Hesaplama ile aynı yükseklik ve sol/sağ boşluk */
  .g-head-title { font-size: 1.3125rem; line-height: 1.4; font-weight: 400; }  /* 21px – diğer başlıklarla aynı */
  .g-num        { font-size: 1.125rem; min-width: 48px; font-weight: 600; }     /* 18px */
  .g-gp-chip    { font-size: 1.0625rem; padding: 6px 12px; }                    /* 17px */
  .g-chev       { font-size: 16px; }                                            /* diğer chev'lerle aynı */

  /* Kart gövdesi – şeffaf, içerik EA description üzerinde */
  .g-body       { padding: 18px 22px; }   /* yan boşluk: iç öğeler kart kenarına dayanmasın */
  .g-amac       { font-size: 1.3125rem; line-height: 1.7; padding: 4px 14px; }  /* 21px */
  .g-tip        { padding: 4px 14px; }
  .g-tip p      { font-size: 1.3125rem; line-height: 1.65; }                    /* 21px */
  .g-formula    { font-size: 1.25rem; padding: 4px 14px; line-height: 1.75; }   /* 20px */

  /* Meta chip'ler */
  .g-meta       { gap: 8px; margin-bottom: 14px; }
  .g-meta-chip  { font-size: 1.1875rem; padding: 8px 15px; }                    /* 19px */

  /* Form alanları */
  .g-fields     { gap: 12px; margin-bottom: 14px; }
  .g-fw label   { font-size: 1.25rem; margin-bottom: 8px; font-weight: 500; }   /* 20px */
  .g-fw input   { padding: 15px 14px; font-size: 1.25rem; min-height: 54px; border-radius: 8px; }  /* 20px */

  /* Sonuç alanı */
  .g-result-area { gap: 10px; margin-top: 14px; }
  .g-res-box,
  .g-gp-box     { padding: 14px 16px; border-radius: 8px; flex: 1 1 calc(50% - 5px); }
  .g-res-lbl    { font-size: 1.0625rem; margin-bottom: 5px; }                   /* 17px */
  .g-res-val    { font-size: 2.125rem; }                                        /* 34px */
  .g-res-unit   { font-size: 1.125rem; }                                        /* 18px */
  .g-yorum      { font-size: 1.3125rem; padding: 14px 16px; flex-basis: 100%; line-height: 1.55; }  /* 21px */

  /* GP adımları */
  .g-steps      { gap: 8px; margin-top: 14px; }
  .g-step       { font-size: 1.1875rem; padding: 8px 15px; }                    /* 19px */

  /* Boş / sonuçsuz */
  .g-empty      { font-size: 1.3125rem; padding: 2rem 1rem; }                   /* 21px */
  .g-nores      { font-size: 1.25rem; }                                         /* 20px */
}

/* ══════════════════════════════════════════
   RESPONSIVE – KÜÇÜK MOBİL (≤420px)
   Sadece düzen ayarları, yazılar büyük kalsın
═══════════════════════════════════════════ */
@media (max-width: 420px) {
  #goren-wrap   { padding: .9rem 0; }

  .g-title      { font-size: 1.625rem; }                                        /* 26px */

  .g-summary    { grid-template-columns: 1fr 1fr; gap: 8px; }
  .g-scard      { padding: 12px 14px; }
  .g-scard-val  { font-size: 1.5rem; }                                          /* 24px */

  /* Sonuç kutuları dar ekranda alt alta */
  .g-res-box,
  .g-gp-box     { flex-basis: 100%; }
}

/* ══════════════════════════════════════════
   AZALTILMIŞ HAREKET TERCİHİ
═══════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  #goren-wrap *,
  #goren-toast {
    transition: none !important;
    animation: none !important;
  }
}

/* ══════════════════════════════════════════
   YAZDIRMA
═══════════════════════════════════════════ */
@media print {
  .g-topbar-actions,
  .g-search-row,
  .g-tabs,
  .g-chev { display: none !important; }
  .g-body { display: block !important; }
  .g-item { break-inside: avoid; box-shadow: none; }
  #goren-toast { display: none !important; }
}