/*!
 * Galata Timeline — DVR zaman cizelgesi gorunumu
 */

.gt {
    --gt-rec: #f5334f;
    --gt-bg: #12161c;
    --gt-line: #232b35;

    background: var(--gt-bg);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    user-select: none;
}

/* --------------------------------------------------------------- saat cubugu */

.gt__bar {
    display: flex; align-items: center; gap: 6px;
    padding: 0 0 2px;
}

/*  Saatler, serit ve baloncugun ORTAK kapsayicisi. Butun yuzde hesaplari
    buna gore yapiliyor; yakinlastirma dugmeleri kenarda kalip olcuyu
    bozmuyor.  */
.gt__view { position: relative; flex: 1 1 auto; min-width: 0; }

/*  Yakinlastirma dugmeleri. Olcu DOKUNMA icin secildi: 40px, telefonda
    parmakla isabet ettirilebilen en kucuk makul hedef. Bu ozellik zaten en
    cok orada gerekiyor -- 24 saat bir telefon ekranina sigdiginda bir piksel
    dakikalar ediyor ve istenen ana tiklamak mumkun olmuyor. 32px hala rahat
    basilabilir bir hedef ve seritle ayni yuksekligi tutturuyor.  */
.gt__zoom {
    flex: 0 0 auto;
    /*  Serit ile AYNI hizada dursunlar: cubugun ustunde saat etiketleri var,
        dugmeler onlarin degil seridin karsisina geliyor.  */
    align-self: flex-end;
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    background: #1b2129; color: #c8d4de;
    border: 1px solid var(--gt-line); border-radius: 8px;
    font-family: inherit; font-size: 18px; font-weight: 700; line-height: 1;
    cursor: pointer;
    transition: background .15s ease, color .15s ease;
}
.gt__zoom:hover:not(:disabled) { background: #232b35; color: #fff; }
.gt__zoom:active:not(:disabled) { background: var(--gp-accent, #00b1ff); color: #fff; }
.gt__zoom:focus-visible { outline: 2px solid var(--gp-accent, #00b1ff); outline-offset: 1px; }
/*  En uctaki basamakta dugme sonuc vermez; pasif gorunsun ki izleyici
    basip durmasin.  */
.gt__zoom:disabled { opacity: .35; cursor: default; }

.gt__hours { position: relative; height: 18px; }
.gt__hour {
    position: absolute; top: 3px;
    font-size: 10px; color: #6f8091;
    transform: translateX(-50%);
}

.gt__track {
    position: relative;
    height: 30px;
    background: #2b333d;
    cursor: pointer;
    overflow: hidden;
    /*  Yatay hareketi BIZ isliyoruz (pencereyi kaydirmak icin), dikeyi
        tarayiciya birakiyoruz. Yakinlastirilmamisken kaydirilacak bir sey
        olmadigi icin dokunma tamamen tarayicida kalir.  */
    touch-action: pan-y;
}

/*  Yakinlastirilmis gorunumde serit suruklenebilir.  */
.gt--zoomed .gt__track { touch-action: none; cursor: grab; }
.gt--zoomed .gt__track:active { cursor: grabbing; }

/* Kayit olan araliklar */
.gt__seg {
    position: absolute; top: 0; bottom: 0;
    background: var(--gt-rec);
    min-width: 2px;
}

/* Su an oynatilan konum */
.gt__cursor {
    position: absolute; top: -3px; bottom: -3px;
    width: 2px;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .55);
    pointer-events: none;
    z-index: 3;
}

/* Fare ustundeyken saat baloncugu */
.gt__tip {
    position: absolute; top: 0;
    transform: translateX(-50%);
    background: #05070a; color: #fff;
    font-size: 11px; font-weight: 600;
    padding: 2px 7px; border-radius: 4px;
    pointer-events: none;
    opacity: 0; transition: opacity .12s ease;
    z-index: 4;
}
.gt__tip.is-visible { opacity: 1; }

/* ------------------------------------------------------------------ gunler */

.gt__days { display: flex; border-top: 1px solid var(--gt-line); }

.gt__day {
    flex: 1 1 0;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    background: transparent;
    border: 0; border-right: 1px solid var(--gt-line);
    padding: 7px 4px;
    color: #c8d4de;
    cursor: pointer;
    font-family: inherit;
    transition: background .15s ease;
}
.gt__day:last-child { border-right: 0; }
.gt__day:hover:not(:disabled) { background: #1b2129; }
.gt__day.is-active { background: var(--gp-accent, #00b1ff); color: #fff; }
.gt__day.is-empty, .gt__day:disabled { color: #4a5764; cursor: not-allowed; }

.gt__day-num { font-size: 19px; font-weight: 600; line-height: 1; }
.gt__day-meta { display: flex; flex-direction: column; line-height: 1.15; }
.gt__day-week { font-size: 10px; font-weight: 700; text-transform: capitalize; }
.gt__day-month { font-size: 10px; opacity: .7; text-transform: capitalize; }

.gt__day.is-active .gt__day-month { opacity: .85; }

/* ------------------------------------------------------------------ mobil */

@media (max-width: 560px) {
    .gt__day { flex-direction: column; gap: 0; padding: 5px 2px; }
    .gt__day-num { font-size: 15px; }
    .gt__day-month { display: none; }
    .gt__hour { font-size: 9px; }
}

@media (max-width: 380px) {
    .gt__day-meta { display: none; }
}

/* ------------------------------------------------------------ canliya don */
/*  "Canlıya Dön" dugmesi buradan kaldirildi: oynaticinin kontrol cubuguna
    tasindi (galata-player.css -> .gp-golive). "gt--archive" sinifi yerinde
    duruyor; yaklasan zaman cizelgesi yakinlastirmasinda kullanilacak.  */
