/* ==========================================================================
   KALMUK SITE · Yapı taşlarının temel görünümü (form, çerez bildirimi, menü, sayfalama)
   Temalar renkleri bu değişkenlerle değiştirir; gerekirse sınıfları kendi CSS'inde ezer.
   ========================================================================== */
:root {
  --kalmuk-accent: #3b82f6;
  --kalmuk-accent-text: #fff;
  --kalmuk-text: inherit;
  --kalmuk-muted: rgba(127, 127, 127, 0.9);
  --kalmuk-border: rgba(127, 127, 127, 0.35);
  --kalmuk-field-bg: rgba(127, 127, 127, 0.08);
  --kalmuk-radius: 12px;
  --kalmuk-ok: #16a34a;
  --kalmuk-error: #dc2626;
  --kalmuk-banner-bg: #0b0d12;
  --kalmuk-banner-text: #f5f7fb;
}

.kalmuk-sr, .kalmuk-hp { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Formlar */
.kalmuk-form { display: grid; gap: 14px; }
.kalmuk-form__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.kalmuk-form__field { display: grid; gap: 6px; font-size: 0.9rem; }
.kalmuk-form__field > span { color: var(--kalmuk-muted); font-weight: 500; }
.kalmuk-form input:not([type=checkbox]), .kalmuk-form textarea {
  width: 100%; box-sizing: border-box; font: inherit; color: var(--kalmuk-text); background: var(--kalmuk-field-bg);
  border: 1px solid var(--kalmuk-border); border-radius: var(--kalmuk-radius); padding: 12px 14px; transition: border-color .2s, box-shadow .2s;
}
.kalmuk-form input:focus, .kalmuk-form textarea:focus { outline: none; border-color: var(--kalmuk-accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--kalmuk-accent) 20%, transparent); }
.kalmuk-form textarea { resize: vertical; min-height: 140px; }
.kalmuk-form__consent { display: flex; gap: 10px; align-items: flex-start; font-size: 0.85rem; color: var(--kalmuk-muted); }
.kalmuk-form__consent a { color: inherit; text-decoration: underline; }
.kalmuk-form__submit {
  justify-self: start; font: inherit; font-weight: 600; cursor: pointer; border: 0; border-radius: var(--kalmuk-radius);
  padding: 12px 24px; background: var(--kalmuk-accent); color: var(--kalmuk-accent-text); transition: transform .2s, opacity .2s;
}
.kalmuk-form__submit:hover { transform: translateY(-1px); }
.kalmuk-form__submit[disabled] { opacity: .6; cursor: progress; }
.kalmuk-form__result:empty { display: none; }
.kalmuk-form__result { padding: 12px 14px; border-radius: var(--kalmuk-radius); font-size: 0.9rem; border: 1px solid var(--kalmuk-border); }
.kalmuk-form__result.is-ok { border-color: var(--kalmuk-ok); color: var(--kalmuk-ok); }
.kalmuk-form__result.is-error { border-color: var(--kalmuk-error); color: var(--kalmuk-error); }
.kalmuk-form--inline { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.kalmuk-form--inline .kalmuk-form__result { grid-column: 1 / -1; }
@media (max-width: 640px) { .kalmuk-form__row, .kalmuk-form--inline { grid-template-columns: 1fr; } }

/* Çerez bildirimi */
.kalmuk-cookie {
  position: fixed; z-index: 9999; left: 16px; right: 16px; bottom: 16px; max-width: min(560px, calc(100vw - 32px)); margin-inline: auto;
  box-sizing: border-box;
  display: flex; gap: 16px; align-items: center; flex-wrap: wrap; padding: 16px 18px; border-radius: 16px;
  background: var(--kalmuk-banner-bg); color: var(--kalmuk-banner-text); box-shadow: 0 20px 60px -20px rgba(0,0,0,.6);
  font-size: 0.9rem; animation: kalmuk-up .5s cubic-bezier(.16,1,.3,1) both;
}
.kalmuk-cookie p { margin: 0; flex: 1 1 220px; min-width: 0; line-height: 1.5; }
.kalmuk-cookie a { color: inherit; text-decoration: underline; }
.kalmuk-cookie__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.kalmuk-cookie *, .kalmuk-form * { box-sizing: border-box; }
.kalmuk-cookie button { font: inherit; font-weight: 600; cursor: pointer; border-radius: 10px; padding: 9px 14px; border: 1px solid rgba(255,255,255,.25); background: transparent; color: inherit; }
.kalmuk-cookie button.is-primary { background: var(--kalmuk-accent); border-color: transparent; color: var(--kalmuk-accent-text); }
.kalmuk-cookie.is-hiding { opacity: 0; transform: translateY(12px); transition: all .3s; }
@keyframes kalmuk-up { from { opacity: 0; transform: translateY(20px); } }

/* Gezinti izi ve sayfalama */
.kalmuk-breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; font-size: 0.85rem; color: var(--kalmuk-muted); }
.kalmuk-breadcrumbs li + li::before { content: "›"; margin-right: 6px; opacity: .6; }
.kalmuk-breadcrumbs a { color: inherit; text-decoration: none; }
.kalmuk-pagination { display: flex; gap: 12px; align-items: center; justify-content: center; flex-wrap: wrap; margin-top: 32px; }
.kalmuk-pagination ol { list-style: none; display: flex; gap: 6px; margin: 0; padding: 0; }
.kalmuk-pagination a, .kalmuk-pagination span { display: grid; place-items: center; min-width: 38px; height: 38px; padding: 0 10px; border-radius: 10px; border: 1px solid var(--kalmuk-border); color: inherit; text-decoration: none; }
.kalmuk-pagination [aria-current] { background: var(--kalmuk-accent); color: var(--kalmuk-accent-text); border-color: transparent; }

/* Menü (varsayılan, temalar genelde kendi stilini verir) */
.kalmuk-menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; flex-wrap: wrap; }
.kalmuk-menu a { display: inline-flex; gap: 6px; align-items: center; padding: 8px 12px; border-radius: 10px; color: inherit; text-decoration: none; }
.kalmuk-menu .is-active > a { color: var(--kalmuk-accent); }
.kalmuk-menu .has-children { position: relative; }
.kalmuk-menu__sub { list-style: none; margin: 0; padding: 6px; position: absolute; top: 100%; left: 0; min-width: 200px; display: none; background: var(--kalmuk-banner-bg); color: var(--kalmuk-banner-text); border-radius: 12px; z-index: 50; }
.kalmuk-menu .has-children:hover > .kalmuk-menu__sub, .kalmuk-menu .has-children:focus-within > .kalmuk-menu__sub { display: block; }

/* Önizleme şeridi (yönetici taslağı görürken) */
.kalmuk-preview-bar { position: fixed; top: 0; left: 0; right: 0; z-index: 10000; background: #f59e0b; color: #111; text-align: center; font: 600 13px/1 system-ui, sans-serif; padding: 9px; }
