/*
  Kokpit teması. Cam kokpit: grafit gövde, macenta etkin rota, camgöbeği seçim, kehribar dikkat.
  Telsiz gövdesinin ve frekans bandının köşelerinde çerçeve vidaları, macenta ibre, telsiz kartı
  düğmeleri çok işlevli ekranın (MFD) yumuşak tuşları gibi. Her seçici :root[data-skin="kokpit"] ile başlar.
*/

/* Gönder simgesi: yukarı ok (işaretlemede Gece'nin simgesi) */
:root[data-skin="kokpit"] .skin-gece {
  display: inline-block;
}

/* Çerçeve vidaları: telsiz gövdesi ve frekans bandının dört köşesi */
:root[data-skin="kokpit"] .radio,
:root[data-skin="kokpit"] .band {
  background-image:
    radial-gradient(circle, var(--edge) 0, var(--edge) 2px, rgba(0, 0, 0, 0) 3px),
    radial-gradient(circle, var(--edge) 0, var(--edge) 2px, rgba(0, 0, 0, 0) 3px),
    radial-gradient(circle, var(--edge) 0, var(--edge) 2px, rgba(0, 0, 0, 0) 3px),
    radial-gradient(circle, var(--edge) 0, var(--edge) 2px, rgba(0, 0, 0, 0) 3px);
  background-repeat: no-repeat;
  background-size: 14px 14px;
  background-position: 0 0, 100% 0, 0 100%, 100% 100%;
}

:root[data-skin="kokpit"] .radio {
  border-width: 2px;
  border-radius: var(--radius-card);
}

/* Macenta ibre: rota çizgisi gibi hafif parlar */
:root[data-skin="kokpit"] .needle::after {
  box-shadow: 0 0 6px var(--focus-halo);
}

/* Camgöbeği seçim: ayarlı istasyon ve açık özel konuşma */
:root[data-skin="kokpit"] .station.is-tuned,
:root[data-skin="kokpit"] .dm-item[aria-current],
:root[data-skin="kokpit"] .dm-item.is-active {
  border-color: var(--accent-2-text);
}

/* MFD yumuşak tuşları: köşeli, üstte ton şeridi, içe gömülü kenar */
:root[data-skin="kokpit"] .radio .radio-button {
  border-top-width: 3px;
  border-radius: 2px;
  box-shadow: inset 0 1px 0 var(--top-light), inset 0 -2px 0 var(--key-lip);
}

:root[data-skin="kokpit"] .radio .radio-ptt {
  border-radius: var(--radius-card);
  background-image: none;
}

:root[data-skin="kokpit"] .radio-ptt-dome {
  border-radius: var(--radius-control);
}

/* Telsiz ekranı: çok işlevli ekran çerçevesi */
:root[data-skin="kokpit"] .radio .radio-screen {
  border: 2px solid var(--line-strong);
  border-radius: var(--radius-control);
}

/* Bölüm etiketleri: gösterge yazısı ve camgöbeği kısa çizgi */
:root[data-skin="kokpit"] .section-title::before {
  content: "";
  flex: none;
  width: 0.6rem;
  height: 2px;
  margin-right: 0.45rem;
  background-color: var(--accent-2-text);
}

/* Saatler ve gösterge yazıları tek aralıklı */
:root[data-skin="kokpit"] .msg-time,
:root[data-skin="kokpit"] .msg-hover-time,
:root[data-skin="kokpit"] .kbd,
:root[data-skin="kokpit"] .secret,
:root[data-skin="kokpit"] .kid,
:root[data-skin="kokpit"] .members-count {
  font-family: var(--font-mono);
  font-weight: 500;
}

/* Okunmamış noktası kehribar dikkat */
:root[data-skin="kokpit"] .unread-badge {
  border-radius: 1px;
  background-color: var(--warn);
}

/* Anahtarsız şifreli mesaj: uyarı kutusu */
:root[data-skin="kokpit"] .msg-notice {
  display: inline-flex;
  padding: 0.45rem 0.75rem;
  border: 1px dashed var(--warn-line);
  border-radius: var(--radius-control);
  background-color: var(--surface-sunken);
  font-style: normal;
}

/* Profil kartı bandı: ufuk çizgisi */
:root[data-skin="kokpit"] .profile-card-band {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.16) 0, rgba(255, 255, 255, 0.16) 50%, rgba(0, 0, 0, 0.16) 50%, rgba(0, 0, 0, 0.16) 100%);
}

/* Seviye ölçer: bölütlü gösterge */
:root[data-skin="kokpit"] .meter-bar {
  background-image: repeating-linear-gradient(90deg, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 7px, var(--surface-sunken) 7px, var(--surface-sunken) 9px);
}

/* Ayarlar: seçili kategoride camgöbeği çizgi */
:root[data-skin="kokpit"] .settings-cat[aria-current="page"] {
  border-color: transparent;
  box-shadow: inset 3px 0 0 var(--accent-2-text);
}