/* ==========================================================================
   HIZIRBEY Design System — Generic Studio Header
   Ownership: Public Studio header presentation
========================================================================== */

.hds-studio__header {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1rem;
  /* Kancalar (25.10.2026): --hds-studio-header-padding, -surface, -border, -radius, -shadow. */
  padding: var(--hds-studio-header-padding, 0.95rem 1.05rem);
  background: var(--hds-studio-header-surface, linear-gradient(180deg, #ffffff 0%, #fbfdff 100%));
  border: var(--hds-studio-header-border, 1px solid var(--hds-studio-border));
  border-top: 0;
  border-radius: var(--hds-studio-header-radius, 0 0 var(--hds-studio-radius-md) var(--hds-studio-radius-md));
  box-shadow: var(--hds-studio-header-shadow, 0 7px 20px rgb(15 23 42 / 4%));
}

.hds-studio__header::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgb(47 128 237 / 16%), transparent);
  content: "";
}

.hds-studio__header-icon {
  display: flex;
  justify-content: center;
  align-items: center;
  /* Kancalar (01.11.2026): --hds-studio-header-icon-size (2.6rem), --hds-studio-header-icon-font-size (1.3rem). */
  width: var(--hds-studio-header-icon-size, 2.6rem);
  height: var(--hds-studio-header-icon-size, 2.6rem);
  flex: 0 0 var(--hds-studio-header-icon-size, 3rem);
  border-radius: var(--hds-studio-radius-md);
  /* Kancalar (03.11.2026): --hds-studio-header-icon-bg, -icon-border, -icon-color, -icon-shadow. */
  background: var(--hds-studio-header-icon-bg, linear-gradient(145deg, var(--hds-studio-view-soft), #ffffff));
  border: var(--hds-studio-header-icon-border, 1px solid rgb(47 128 237 / 14%));
  color: var(--hds-studio-header-icon-color, var(--hds-studio-view));
  font-size: var(--hds-studio-header-icon-font-size, 1.3rem);
  box-shadow: var(--hds-studio-header-icon-shadow, inset 0 1px 0 rgb(255 255 255 / 90%), 0 4px 12px rgb(47 128 237 / 8%));
}

.hds-studio__header-copy {
  min-width: 0;
  flex: 1;
}

/* Başlık üstündeki içerik yolu (breadcrumb): küçük yazı, başlıkla arasında boşluk (01.11.2026). */
.hds-studio__header-copy > .hds-navigation.variant-breadcrumb {
  margin-bottom: 0.55rem;
  font-size: 0.72rem;
}

/* Opt-in başlık aksiyonları (Studio::headerActions): sağa yaslı, dikey ortalı;
   dar genişlikte başlık kopyasının altına sarar. */
.hds-studio__header:has(> .hds-studio__header-actions) {
  flex-wrap: wrap;
  align-items: center;
}

.hds-studio__header-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  margin-left: auto;
}

.hds-studio__eyebrow {
  display: block;
  margin-bottom: 0.15rem;
  color: var(--hds-studio-header-eyebrow-color, var(--hds-studio-view));
  font-size: 0.6rem;
  font-weight: 850;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.hds-studio__title {
  margin: 0;
  color: var(--hds-studio-header-title-color, var(--hds-studio-text));
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.hds-studio__description {
  margin: 0.35rem 0 0;
  max-width: 46rem;
  color: var(--hds-studio-header-description-color, var(--hds-studio-text-soft));
  line-height: 1.6;
}

/* Dönüş bağlantısı (Studio::backLink): ikon / hero görseli tıklanır, üzerine gelince vurgu. */
.hds-studio__header-icon--link,
.hds-studio__hero-visual--link {
  text-decoration: none;
  cursor: pointer;
}

.hds-studio__header-icon--link:hover,
.hds-studio__header-icon--link:focus-visible,
.hds-studio__hero-visual--link:hover,
.hds-studio__hero-visual--link:focus-visible {
  border-color: var(--hds-studio-view);
  box-shadow: 0 0 0 3px rgb(47 128 237 / 18%);
}

/* >>> Başlık satırı + durum rozeti (PageHeader::status() · 31.10.2026) */
.hds-studio__title-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  min-width: 0;
}
/* <<< Başlık satırı + durum rozeti */

/* >>> Koyu yeşil başlık tonu (Definition::headerTone('forest') · 02.11.2026)
   Marka şeridi: yeşil zemin, açık yazı, altın eyebrow; ikinci düğme çerçeveli açık, birincil altın. */
.hds-studio--header-forest {
  --hds-studio-header-surface: #0c4a4d;
  --hds-studio-header-border: 0;
  --hds-studio-header-radius: 0.9rem;
  --hds-studio-header-shadow: none;
  --hds-studio-header-padding: 1rem 1.4rem;
  --hds-studio-header-icon-bg: rgb(255 255 255 / 14%);
  --hds-studio-header-icon-border: 1px solid rgb(255 255 255 / 18%);
  --hds-studio-header-icon-color: #ffffff;
  --hds-studio-header-icon-shadow: none;
  --hds-studio-header-eyebrow-color: #e2c277;
  --hds-studio-header-title-color: #ffffff;
  --hds-studio-header-description-color: rgb(255 255 255 / 88%);
}

.hds-studio--header-forest .hds-studio__header::before { display: none; }

.hds-studio--header-forest .hds-studio__header { border-top: 0; align-items: center; }

.hds-studio--header-forest .hds-studio__header-actions .hds-button.secondary {
  border-color: rgb(255 255 255 / 70%);
  background: transparent;
  color: #ffffff !important;
}

.hds-studio--header-forest .hds-studio__header-actions .hds-button.secondary:hover {
  background: rgb(255 255 255 / 12%);
}

/* <<< Koyu yeşil başlık tonu */
