/**
 * Alpine.js x-cloak engelleme
 * Kütüphane yüklenene kadar öğeleri gizli tutar.
 */
[x-cloak] {
    display: none !important;
}

/** * İstersen spinner için küçük bir geçiş yumuşatması da ekleyebilirsin
 */
.bg-opacity-75 {
    backdrop-filter: blur(2px);
}

/* Icon spin utility (Remix Icons ile çalışır; fa-spin'in yerine geçer) */
@keyframes icon-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.icon-spin {
    display: inline-block;
    animation: icon-spin 1s linear infinite;
}

/* ── Sayfa rehberi (Plan 42) ─────────────────────────────────────────── */
.offcanvas.page-help { --vz-offcanvas-width: 420px; }
.page-help-steps li::marker { color: var(--vz-primary); font-weight: 600; }
.page-help-offer {
    position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 1035;
    width: min(380px, calc(100vw - 2rem));
    border: 1px solid var(--vz-border-color);
    animation: page-help-offer-in .25s ease-out;
}
@keyframes page-help-offer-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.shepherd-element.guide-step { max-width: 360px; border-radius: .5rem; box-shadow: 0 10px 40px rgba(0,0,0,.25); }
.guide-step .shepherd-header { padding: .75rem 1rem .25rem; background: transparent !important; }
.guide-step .shepherd-title { font-size: .95rem; font-weight: 600; color: var(--vz-heading-color, inherit); }
.guide-step .shepherd-text { padding: .25rem 1rem .75rem; font-size: .85rem; color: var(--vz-body-color); }
.guide-step .shepherd-footer { padding: 0 1rem .75rem; gap: .35rem; align-items: center; }
.guide-step .shepherd-button { margin: 0; }
.guide-step .guide-step-count { margin-right: auto; font-size: .75rem; color: var(--vz-secondary-color, #878a99); }
[data-bs-theme="dark"] .shepherd-element.guide-step { background: var(--vz-secondary-bg, #212529); }
.guide-step .shepherd-button.btn-light { background: var(--vz-light, #f3f6f9) !important; color: var(--vz-body-color) !important; }
.guide-step .shepherd-button.btn-light:hover { background: var(--vz-border-color, #e9ebec) !important; }
.page-help-player .ratio-16x10 { --vz-aspect-ratio: 62.5%; --bs-aspect-ratio: 62.5%; }
/* Balon–hedef arası ok boşluğu (Shepherd 11'de offset yok; Velzon okunu -18px'e iter) */
.shepherd-element.guide-step[data-popper-placement^=bottom] { margin-top: 14px; }
.shepherd-element.guide-step[data-popper-placement^=top]    { margin-top: -14px; }
.shepherd-element.guide-step[data-popper-placement^=right]  { margin-left: 14px; }
.shepherd-element.guide-step[data-popper-placement^=left]   { margin-left: -14px; }
.shepherd-element.guide-step[data-popper-placement^=bottom] > .shepherd-arrow { top: -8px; }
.shepherd-element.guide-step[data-popper-placement^=top] > .shepherd-arrow    { bottom: -8px; }
/* Velzon oku remixicon "yukarı ok" glifi (yalnız altında yönüne göre çizilmiş) → diğer yönlerde döndür */
.shepherd-element.guide-step[data-popper-placement^=top] > .shepherd-arrow:before   { transform: rotate(180deg); }
.shepherd-element.guide-step[data-popper-placement^=right] > .shepherd-arrow        { left: -20px; }
.shepherd-element.guide-step[data-popper-placement^=right] > .shepherd-arrow:before { transform: rotate(-90deg); }
.shepherd-element.guide-step[data-popper-placement^=left] > .shepherd-arrow         { right: -20px; }
.shepherd-element.guide-step[data-popper-placement^=left] > .shepherd-arrow:before  { transform: rotate(90deg); }

/* ── h-100 kart alt boşluğu ──────────────────────────────────────────────
   Velzon .card'a margin-bottom (grid-gutter) verir; h-100 kart sütunun tam
   boyunu alınca bu boşluk sütunun DIŞINA taşar → son satırdaki kart footer'a
   yapışır. Boşluğu yükseklikten düşüp sütun içinde tut. mb-0'lı kart hariç. */
.row > [class*="col"] > .card.h-100:not(.mb-0) {
    height: calc(100% - var(--vz-grid-gutter-width)) !important;
}

/* ── Yan yana özet kartlarında eşit yükseklik ────────────────────────────
   Satırdaki kartlardan birinde açıklama satırı varsa (ör. "Tahmini · 307 iş
   günü…") yalnız o uzuyor, komşuları kısa kalıp düzensiz görünüyordu. Sütunda
   TEK kart (mb-0) varsa sütunu doldurur → satırdaki kartlar en uzunu kadar olur.
   Üst üste iki kart taşıyan sütun :only-child'a uymaz, dokunulmaz. */
.row > [class*="col"] > .card.mb-0:only-child {
    height: 100%;
}

/* ── Profil alt sekme çubuğu (gruplu sekme) ─────────────────────────────
   Çubuk profilin koyu kapak görselinin (profile-wid-bg) üstüne düşer: koyu
   yazı okunmaz, Velzon .nav-link:hover menü rengini (yeşil) verip yazıyı
   tamamen kaybettirir. Kart zemini + açık renk kuralları → her zeminde okunur. */
.profile-subnav {
    background-color: var(--vz-secondary-bg);
    border: 1px solid var(--vz-border-color);
    border-radius: var(--vz-border-radius);
    padding: 0 .5rem;
}
.profile-subnav .nav-link { color: var(--vz-body-color); }
.profile-subnav .nav-link:hover,
.profile-subnav .nav-link:focus { color: var(--vz-success); }

/* Yardım makalesi görselleri (shot: bağlantısı) — altyazı görselin hemen altında */
.help-article-body img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: .75rem 0 .25rem;
    border: 1px solid var(--vz-border-color);
    border-radius: .375rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, .06);
}
.help-article-body img + em {
    display: block;
    margin-bottom: 1rem;
    color: var(--vz-secondary-color);
    font-size: .8125rem;
}

/* ── Pano gün ızgarası (livewire.partials.dash-grid) ─────────────────────
   Puantaj Föyü ile aynı görünüm (table-bordered/sm, .8rem, harf hücresi); ilk sütun ve başlık kaydırmada sabit. */
.dash-grid-scroll { max-height: 70vh; }
.dash-grid-table { font-size: .8rem; }
.dash-grid-table thead th { position: sticky; top: 0; z-index: 3; min-width: 30px; }
.dash-grid-table .dash-grid-label {
    position: sticky; left: 0; z-index: 2; min-width: 200px; max-width: 16rem; text-align: left;
    background: var(--vz-secondary-bg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.dash-grid-table thead .dash-grid-label { z-index: 4; }
.dash-grid-table .dash-grid-total { min-width: 40px; }
.dash-grid-table .dash-cell { padding: .35rem 0; line-height: 1.2; min-height: 1.6rem; font-weight: 600; }
/* Yıllık puantaj: kısa ay boşluğu, işyeri şeridi + geçiş çizgisi (durum renkleriyle çakışmayan mor), hücre tooltip'i */
.dash-grid-compact .dash-grid-label { min-width: 84px; max-width: 7rem; }
.dash-grid-compact .dash-grid-table thead th { min-width: 26px; }
.dash-grid-table .dash-void { background: repeating-linear-gradient(45deg, var(--vz-light), var(--vz-light) 3px, var(--vz-secondary-bg) 3px, var(--vz-secondary-bg) 6px); }
.dash-grid-table td[data-tip] { position: relative; cursor: default; }
.dash-grid-table .dash-band::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: #6f42c1; pointer-events: none; }
.dash-grid-table .dash-change::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #6f42c1; pointer-events: none; }
.dash-legend-band { box-shadow: inset 0 -3px 0 #6f42c1; }
.dash-tip .tooltip-inner { white-space: pre-line; text-align: left; max-width: 320px; }
.dash-legend {
    display: inline-flex; align-items: center; justify-content: center; width: 1.25rem; height: 1.25rem;
    border-radius: 3px; font-size: .7rem; font-weight: 600;
}

/* Pano gösterge kartı sütunu: içerik (uzun tutar, karşılaştırma yazısı) sütunu genişletip son kartı alta itmesin. */
.dash-kpi-col { min-width: 0; }
