/* ORTAK DÖNEM SEÇİCİ (#150) — raporların dönem seçimi ve ay/gün seçicileri aynı görünüm ailesinde. */
.okan-period { display: inline-flex; align-items: stretch; flex-wrap: nowrap; max-width: 100%; border: 1px solid var(--ct-border-color, #dee2e6);
    border-radius: 8px; background: var(--ct-secondary-bg, #fff); overflow: hidden; }
.okan-period-ico { display: flex; align-items: center; padding: 0 8px 0 10px; color: var(--ct-secondary-color, #6b7785); font-size: 1rem; }
.okan-period .form-select, .okan-period .form-control { border: 0; border-radius: 0; box-shadow: none; background-color: transparent; font-size: .8rem; }
.okan-period .okan-period-preset { width: auto; min-width: 128px; padding-left: 2px; font-weight: 600; }
.okan-period .okan-period-range { width: 196px; border-left: 1px solid var(--ct-border-color, #dee2e6); cursor: pointer; text-align: center;
    font-variant-numeric: tabular-nums; }
.okan-period .okan-period-range:focus, .okan-period .form-select:focus { background-color: var(--ct-tertiary-bg, #f6f7fb); }
/* Ay ve gün seçicileri (Elektrik · Panolar · GES · Günlük Rapor) aynı çerçevede: okla gezinme + tek kutu. */
.okan-period .btn { border: 0; border-radius: 0; padding: 0 10px; color: var(--ct-secondary-color, #6b7785); }
.okan-period .btn:hover { background: var(--ct-tertiary-bg, #f6f7fb); }
.okan-period .okan-period-single { width: 150px; border-left: 1px solid var(--ct-border-color, #dee2e6);
    border-right: 1px solid var(--ct-border-color, #dee2e6); text-align: center; font-weight: 600; }
/* Seçicinin satırı (Elektrik · Fatura Kontrolü · GES · Panolar · Hat Şeması): seçici ve sayfanın düğmeleri tek satırda. */
.okan-period-bar { display: flex; gap: 6px; align-items: center; margin-bottom: 14px; flex-wrap: wrap; }
/* Telefon (Hayati, 13.10.2026): takvim simgesi kalkar, seçici satırı doldurur, sayfa düğmeleri yalnız simge olup aynı satırda
   kalır (yazısı title'da); aralık kutusu kısaltılmış tarih yazar (okan-period.js). */
@media (max-width: 575.98px) {
    .okan-period-ico { display: none; }
    .okan-period { display: flex; flex: 1 1 auto; min-width: 0; width: auto; }
    .okan-period .okan-period-preset { min-width: 0; flex: 0 1 44%; padding-left: 10px; }
    .okan-period .okan-period-range { width: auto; min-width: 0; flex: 1 1 56%; padding-left: 4px; padding-right: 4px; }
    .okan-period .okan-period-single { width: auto; min-width: 0; flex: 1 1 auto; }
    .okan-period-bar { flex-wrap: nowrap; }
    .okan-period-bar > .btn { flex: 0 0 auto; margin-left: 0 !important; padding: .3rem .6rem; }
    .okan-period-bar > .btn .okan-btn-text { display: none; }
    .okan-period-bar > .btn > i { margin-right: 0 !important; font-size: 1.05rem; }
}
