/* ═══════════════════════════════════════════════════════
   04-FILEMANAGER — Yandex Disk Klonu
   Sol ağaç + Sağ dosya listesi
   ═══════════════════════════════════════════════════════ */

/* app-body 2 kolonlu Yandex layout */
/* app-body grid SADECE Bulut Disk (yx-app) gorunurken */
.app-body:has(.yx-app:not([style*="display: none"])):has(.shell[style*="display: none"]) {
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr;
  height: 100%;
  max-height: none;
  overflow: hidden !important;
}
/* Diger sayfalar: normal block layout */
.app-body {
  padding: 0;
  overflow-y: auto;
  overflow-x: hidden;
}

/* .shell artık navTo ile kontrol ediliyor (dashboard/projeler routing) */
/* .shell { display: none !important; } -- Aşama 8'de kaldırıldı */
.notif-wrap { z-index: 9999; }

/* Yandex layout konteyner */
.yx-app {
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  overflow: hidden;
}

/* Üst toolbar (Yandex Disk'in üst toolbar'ı) */
.yx-toolbar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  background: #f7f7f5;
  border-bottom: 1px solid var(--c-border);
  flex-shrink: 0;
  min-height: 44px;
}
.yx-tbtn {
  width: 32px;
  height: 32px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  color: var(--c-text-2);
  transition: all .12s;
  flex-shrink: 0;
}
.yx-tbtn:hover:not(:disabled) {
  background: #fff;
  border-color: var(--c-border);
  color: var(--c-accent);
}
.yx-tbtn:disabled { opacity: 0.3; cursor: not-allowed; }
.yx-tbtn.primary {
  background: var(--c-primary);
  color: #fff;
  border-color: var(--c-primary);
  width: auto;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 600;
  gap: 6px;
}
.yx-tbtn.primary:hover { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }

.yx-path {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 2px;
  font-size: 12px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 0 12px;
  height: 32px;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: thin;
}
.yx-path::-webkit-scrollbar { height: 4px; }
.yx-path::-webkit-scrollbar-thumb { background: #d1d1ce; border-radius: 2px; }
.yx-path .pcrumb {
  cursor: pointer;
  padding: 4px 8px;
  border-radius: 4px;
  color: var(--c-text-2);
  white-space: nowrap;
  font-weight: 500;
  transition: all .1s;
}
.yx-path .pcrumb:hover { background: var(--c-bg-2); color: var(--c-accent); }
.yx-path .pcrumb.last { color: var(--c-text); font-weight: 700; }
.yx-path .psep { color: var(--c-text-3); font-size: 11px; padding: 0 2px; }

/* Ana içerik — sol ağaç + orta dosya listesi + sağ detay paneli */
.yx-main {
  flex: 1;
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr) 300px;
  overflow: hidden;
  min-height: 0;
  min-width: 0;
}

/* Sol klasör ağacı */
.yx-tree {
  border-right: 1px solid var(--c-border);
  background: #fafaf8;
  overflow-y: auto;
  padding: 10px 0;
  scrollbar-width: thin;
}
.yx-tree::-webkit-scrollbar { width: 8px; }
.yx-tree::-webkit-scrollbar-thumb { background: #d4d4d1; border-radius: 4px; }
.yx-tree::-webkit-scrollbar-track { background: transparent; }

.yt-section {
  font-size: 9px;
  font-weight: 700;
  color: var(--c-text-3);
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 12px 16px 6px;
}
.yt-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px 6px 8px;
  cursor: pointer;
  font-size: 12px;
  color: var(--c-text);
  user-select: none;
  border-left: 3px solid transparent;
  transition: background .08s;
}
.yt-row:hover { background: rgba(0,0,0,0.04); }
.yt-row.on {
  background: rgba(194,65,12,0.08);
  border-left-color: var(--c-accent);
  color: var(--c-text);
  font-weight: 600;
}
.yt-row.bound { color: var(--c-accent); }
.yt-row .twist {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
  color: var(--c-text-3);
  transition: transform .12s;
}
.yt-row .twist.open { transform: rotate(90deg); color: var(--c-text-2); }
.yt-row .twist.empty { visibility: hidden; }
.yt-row .twist.loading { color: var(--c-accent); animation: spin 0.8s linear infinite; }
@keyframes spin { from{transform:rotate(0)} to{transform:rotate(360deg)} }
.yt-row .ico { font-size: 13px; flex-shrink: 0; }
.yt-row .label {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.yt-row .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--c-accent);
  flex-shrink: 0;
}
.yt-children {
  padding-left: 14px;
}

/* Sağ dosya listesi */
.yx-files {
  overflow-y: auto;
  background: #fff;
  position: relative;
  scrollbar-width: thin;
}
.yx-files::-webkit-scrollbar { width: 10px; }
.yx-files::-webkit-scrollbar-thumb { background: #d4d4d1; border-radius: 5px; }
.yx-files.drag-over::after {
  content: '⬇️ Buraya bırak — yüklenecek';
  position: absolute;
  inset: 12px;
  border: 3px dashed var(--c-accent);
  border-radius: 12px;
  background: rgba(194,65,12,0.06);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 700;
  color: var(--c-accent);
  z-index: 10;
  pointer-events: none;
}

.yx-files-empty {
  padding: 80px 20px;
  text-align: center;
  color: var(--c-text-3);
  font-size: 13px;
}
.yx-files-empty .icon {
  font-size: 56px;
  display: block;
  margin-bottom: 14px;
  opacity: 0.3;
}
.yx-files-empty .hint {
  font-size: 11px;
  margin-top: 8px;
  color: var(--c-text-3);
}

/* Dosya tablosu — Yandex tarzı */
.yx-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.yx-table thead th {
  position: sticky;
  top: 0;
  background: #fafaf8;
  border-bottom: 1px solid var(--c-border);
  padding: 9px 14px;
  text-align: left;
  font-size: 10px;
  font-weight: 700;
  color: var(--c-text-2);
  text-transform: uppercase;
  letter-spacing: 0.6px;
  z-index: 5;
  cursor: pointer;
  user-select: none;
}
.yx-table thead th:hover { color: var(--c-accent); }
.yx-table thead th.num { text-align: right; }
.yx-table thead th .sort { font-size: 8px; margin-left: 4px; opacity: 0.5; }
.yx-table thead th.active .sort { opacity: 1; color: var(--c-accent); }

.yx-row {
  cursor: default;
  transition: background .06s;
}
.yx-row:hover { background: #fafaf6; }
.yx-row.sel { background: rgba(194,65,12,0.10); }
.yx-row.sel:hover { background: rgba(194,65,12,0.14); }
.yx-row td {
  padding: 7px 14px;
  border-bottom: 1px solid #f3f3ef;
  vertical-align: middle;
  color: var(--c-text);
}
.yx-row td.col-name {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.yx-row .chk {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: var(--c-accent);
}
.yx-row .icon {
  font-size: 18px;
  flex-shrink: 0;
  width: 22px;
  text-align: center;
}
.yx-row .name {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.yx-row.folder .name { font-weight: 600; }
.yx-row.folder .name { cursor: pointer; }
.yx-row.folder .name:hover { color: var(--c-accent); }
.yx-row td.col-size { text-align: right; color: var(--c-text-2); font-size: 11px; white-space: nowrap; width: 100px; }
.yx-row td.col-type { color: var(--c-text-3); font-size: 11px; white-space: nowrap; width: 130px; }
.yx-row td.col-date { color: var(--c-text-3); font-size: 11px; white-space: nowrap; width: 140px; }

/* Hover butonları (satır üstüne gelince çıkar) */
.yx-row .row-actions {
  display: none;
  gap: 4px;
  margin-left: auto;
}
.yx-row:hover .row-actions { display: flex; }
.yx-row .row-actions button {
  width: 24px;
  height: 24px;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  color: var(--c-text-2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.yx-row .row-actions button:hover {
  background: #fff;
  border-color: var(--c-border);
  color: var(--c-accent);
}

/* Sağ tık menü */
.yx-ctx {
  position: fixed;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  box-shadow: var(--shadow-lg);
  padding: 6px;
  min-width: 200px;
  z-index: 9999;
  font-size: 12px;
}
.yx-ctx .ci {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  cursor: pointer;
  border-radius: 4px;
  color: var(--c-text);
  user-select: none;
}
.yx-ctx .ci:hover { background: var(--c-bg-2); }
.yx-ctx .ci.danger { color: var(--c-danger); }
.yx-ctx .ci.danger:hover { background: #fef2f2; }
.yx-ctx .sep { height: 1px; background: var(--c-border); margin: 4px 0; }
.yx-ctx .ci .ico { width: 18px; text-align: center; font-size: 13px; }
.yx-ctx .ci .key { margin-left: auto; color: var(--c-text-3); font-size: 10px; }

/* Alt status bar (Yandex tarzı) */
.yx-status {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 6px 14px;
  background: #fafaf8;
  border-top: 1px solid var(--c-border);
  font-size: 11px;
  color: var(--c-text-2);
  flex-shrink: 0;
  min-height: 30px;
}
.yx-status .ss-spacer { flex: 1; }
.yx-status .ss-tag {
  background: #fff;
  border: 1px solid var(--c-border);
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 600;
}

/* Loading overlay */
.yx-loading {
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  font-size: 12px;
  color: var(--c-text-2);
}
.yx-loading .spinner {
  width: 24px;
  height: 24px;
  border: 3px solid var(--c-border);
  border-top-color: var(--c-accent);
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
  margin-right: 10px;
}

/* Yan proje paneli (overlay, klasör projeye bağlıysa) */
.yx-side-proj {
  position: fixed;
  right: 0;
  top: var(--top-h);
  bottom: var(--foot-h);
  width: 380px;
  background: #fff;
  border-left: 1px solid var(--c-border);
  box-shadow: -4px 0 16px rgba(0,0,0,0.06);
  z-index: 50;
  transform: translateX(100%);
  transition: transform .25s;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.yx-side-proj.open { transform: translateX(0); }
.yx-side-proj .sp-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
  background: var(--c-bg-2);
}
.yx-side-proj .sp-head h3 { font-size: 13px; font-weight: 700; color: var(--c-text); margin: 0; }
.yx-side-proj .sp-head .close {
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  cursor: pointer;
  font-size: 18px;
  color: var(--c-text-2);
  border-radius: 4px;
}
.yx-side-proj .sp-head .close:hover { background: rgba(0,0,0,0.05); }
.yx-side-proj .sp-body { flex: 1; padding: 14px 16px; overflow-y: auto; }
.yx-side-proj .sp-empty {
  padding: 40px 20px;
  text-align: center;
  color: var(--c-text-3);
  font-size: 12px;
}
.yx-side-proj .btn-bind {
  width: 100%;
  padding: 12px;
  background: var(--c-primary);
  color: #fff;
  border: none;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  margin-top: 14px;
  font-family: var(--font);
}
.yx-side-proj .btn-bind:hover { background: var(--c-accent); }

/* Mobil */
@media (max-width: 800px) {
  .yx-main { grid-template-columns: 1fr; }
  .yx-tree { display: none; }
  .yx-tree.show-mobile { display: block; position: absolute; left: 0; top: 0; bottom: 0; width: 80%; z-index: 100; box-shadow: var(--shadow-lg); }
  .yx-row td.col-type, .yx-row td.col-date { display: none; }
  .yx-side-proj { width: 100%; }
}

/* Sol kabuk menüsündeki eski "Yandex Klasörleri" bölümünü gizle (artık ana ekran) */
/* Sol siyah menü içindeki Yandex ağacı görünür kalsın */
/* Sol siyah menüdeki disk göstergesi görünür olsun */
.side-foot { display: flex !important; }

/* Tek kolon dosya listesi (ağaç sol siyah menüde) */
.yx-main.yx-single {
  grid-template-columns: 1fr !important;
}
/* Detay paneli açıkken: orta + sağ */
.yx-main.yx-single.with-detail {
  grid-template-columns: minmax(0, 1fr) 320px !important;
}
@media (max-width: 900px) {
  .yx-main.yx-single.with-detail { grid-template-columns: 1fr !important; }
  .yx-main.yx-single.with-detail .yx-files { display: none; }
}

/* Breadcrumb'i de güncelle */
.app-crumb { padding: 8px 16px; font-size: 11px; }

/* ═══ SAĞ DETAY PANELİ (Yandex tarzı) ═══ */
.yx-detail {
  border-left: 1px solid var(--c-border);
  background: #fafaf8;
  overflow-y: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.yx-detail .yd-empty {
  padding: 50px 20px;
  text-align: center;
  color: var(--c-text-3);
  font-size: 12px;
}
.yx-detail .yd-empty .ico {
  font-size: 42px;
  display: block;
  margin-bottom: 12px;
  opacity: 0.3;
}

.yx-detail .yd-preview {
  padding: 20px 16px;
  text-align: center;
  border-bottom: 1px solid var(--c-border);
  background: #fff;
}
.yx-detail .yd-preview .yd-icon {
  font-size: 72px;
  line-height: 1;
  margin-bottom: 10px;
}
.yx-detail .yd-preview img {
  max-width: 100%;
  max-height: 240px;
  object-fit: contain;
  border-radius: 6px;
  border: 1px solid var(--c-border);
}
.yx-detail .yd-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--c-text);
  word-break: break-all;
  margin-top: 8px;
}

.yx-detail .yd-info {
  padding: 14px 16px;
}
.yx-detail .yd-row {
  display: flex;
  justify-content: space-between;
  padding: 7px 0;
  font-size: 11px;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.yx-detail .yd-row:last-child { border-bottom: none; }
.yx-detail .yd-row .l { color: var(--c-text-3); }
.yx-detail .yd-row .v { color: var(--c-text); font-weight: 600; text-align: right; max-width: 170px; overflow: hidden; text-overflow: ellipsis; }

.yx-detail .yd-actions {
  padding: 12px 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  border-top: 1px solid var(--c-border);
}
.yx-detail .yd-btn {
  padding: 10px 14px;
  border: 1px solid var(--c-border);
  background: #fff;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--c-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font);
  transition: all .12s;
}
.yx-detail .yd-btn:hover { border-color: var(--c-accent); color: var(--c-accent); }
.yx-detail .yd-btn.primary {
  background: var(--c-primary);
  color: #fff;
  border-color: var(--c-primary);
}
.yx-detail .yd-btn.primary:hover { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.yx-detail .yd-btn.danger { color: var(--c-danger); }
.yx-detail .yd-btn.danger:hover { background: #fef2f2; border-color: var(--c-danger); }

.yx-detail .yd-section {
  padding: 14px 16px;
  border-top: 1px solid var(--c-border);
}
.yx-detail .yd-section-h {
  font-size: 10px;
  font-weight: 700;
  color: var(--c-text-3);
  letter-spacing: 0.8px;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.yx-detail .yd-bind-empty {
  font-size: 11px;
  color: var(--c-text-3);
  padding: 10px 0;
  text-align: center;
}

/* Mobil: sağ panel gizle */
@media (max-width: 1100px) {
  .yx-main { grid-template-columns: 240px minmax(0, 1fr); }
  .yx-detail { display: none; }
}
@media (max-width: 800px) {
  .yx-main { grid-template-columns: 1fr; }
  .yx-tree { display: none; }
}

/* ═══════════════════════════════════════════════════════
   YÜKLEYİCİ MODAL
   ═══════════════════════════════════════════════════════ */

.up-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.55);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  font-family: var(--font);
}
.up-box {
  background: #fff;
  border-radius: 12px;
  width: 100%;
  max-width: 720px;
  max-height: 88vh;
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.up-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--c-border);
  background: var(--c-bg-2);
  flex-shrink: 0;
}
.up-title {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-text);
}
.up-target {
  font-size: 11px;
  color: var(--c-text-2);
  margin-top: 3px;
  font-family: monospace;
}
.up-close {
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  font-size: 22px;
  cursor: pointer;
  border-radius: 6px;
  color: var(--c-text-2);
}
.up-close:hover { background: rgba(0,0,0,0.06); }

.up-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px 20px;
}

.up-merge-box {
  padding: 12px 14px;
  background: rgba(194,65,12,0.06);
  border: 1px solid rgba(194,65,12,0.25);
  border-radius: 8px;
  margin-bottom: 14px;
}
.up-merge-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  cursor: pointer;
  color: var(--c-text);
}
.up-merge-toggle input {
  width: auto;
  accent-color: var(--c-accent);
}
.up-merge-name {
  width: 100%;
  margin-top: 10px;
  padding: 9px 12px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  font-size: 13px;
  font-family: var(--font);
  background: #fff;
}
.up-hint {
  margin-top: 6px;
  font-size: 10px;
  color: var(--c-text-3);
}

.up-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.up-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid var(--c-border);
  border-radius: 8px;
  background: #fff;
  transition: border-color .1s;
}
.up-item:hover { border-color: var(--c-border-2); }
.up-item[draggable="true"] { cursor: grab; }
.up-item[draggable="true"]:active { cursor: grabbing; }
.up-drag {
  color: var(--c-text-3);
  font-size: 14px;
  padding: 4px 2px;
  user-select: none;
  cursor: grab;
}
.up-thumb {
  width: 60px;
  height: 60px;
  border-radius: 6px;
  object-fit: cover;
  flex-shrink: 0;
  background: var(--c-bg-2);
  border: 1px solid var(--c-border);
}
.up-thumb-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: var(--c-text-3);
}
.up-item-body {
  flex: 1;
  min-width: 0;
}
.up-item-name {
  font-weight: 600;
  font-size: 12px;
  color: var(--c-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.up-item-meta {
  font-size: 10px;
  color: var(--c-text-3);
  margin: 2px 0 6px;
}
.up-chk {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--c-text-2);
  cursor: pointer;
  margin-bottom: 6px;
}
.up-chk input { width: auto; accent-color: var(--c-accent); }
.up-type-row {
  display: flex;
  gap: 6px;
  margin-top: 4px;
}
.up-type-sel {
  padding: 6px 8px;
  border: 1px solid var(--c-border);
  border-radius: 5px;
  font-size: 11px;
  background: #fff;
  flex: 0 0 130px;
  font-family: var(--font);
  color: var(--c-text);
}
.up-name-input {
  flex: 1;
  min-width: 0;
  padding: 6px 10px;
  border: 1px solid var(--c-border);
  border-radius: 5px;
  font-size: 11px;
  background: #fff;
  font-family: var(--font);
  color: var(--c-text);
}
.up-del {
  width: 28px;
  height: 28px;
  border: 1px solid var(--c-border);
  background: #fff;
  border-radius: 5px;
  cursor: pointer;
  font-size: 13px;
  color: var(--c-danger);
  flex-shrink: 0;
}
.up-del:hover { background: #fef2f2; border-color: var(--c-danger); }

.up-add-more {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--c-border);
}
.up-add-btn {
  padding: 8px 14px;
  border: 1px dashed var(--c-border-2);
  background: transparent;
  color: var(--c-text-2);
  border-radius: 6px;
  cursor: pointer;
  font-size: 11px;
  font-weight: 600;
  font-family: var(--font);
}
.up-add-btn:hover { border-color: var(--c-accent); color: var(--c-accent); }

.up-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 20px;
  border-top: 1px solid var(--c-border);
  background: var(--c-bg-2);
  gap: 12px;
  flex-shrink: 0;
}
.up-count {
  font-size: 11px;
  color: var(--c-text-2);
}
.up-actions {
  display: flex;
  gap: 8px;
}
.up-btn {
  padding: 9px 18px;
  border: 1px solid var(--c-border);
  background: #fff;
  color: var(--c-text);
  border-radius: 6px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
  font-family: var(--font);
}
.up-btn:hover { border-color: var(--c-accent); color: var(--c-accent); }
.up-btn.primary {
  background: var(--c-primary);
  color: #fff;
  border-color: var(--c-primary);
}
.up-btn.primary:hover:not(:disabled) { background: var(--c-accent); border-color: var(--c-accent); color: #fff; }
.up-btn:disabled { opacity: 0.5; cursor: not-allowed; }

/* ═══════════════════════════════════════════════════════
   BELGE TARAYICI MODAL
   ═══════════════════════════════════════════════════════ */

.sc-modal {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.85);
  z-index: 10001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  font-family: var(--font);
}
.sc-box {
  background: #1a1a1a;
  border-radius: 12px;
  width: 100%;
  max-width: 720px;
  max-height: 92vh;
  box-shadow: 0 30px 80px rgba(0,0,0,0.5);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  color: #fff;
}
.sc-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 16px;
  background: #242424;
  border-bottom: 1px solid #000;
}
.sc-title { font-size: 14px; font-weight: 700; }
.sc-sub { font-size: 11px; color: #999; margin-top: 2px; }
.sc-close {
  width: 32px;
  height: 32px;
  border: none;
  background: transparent;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  border-radius: 6px;
}
.sc-close:hover { background: rgba(255,255,255,0.1); }

.sc-stage {
  position: relative;
  background: #000;
  flex-shrink: 0;
  aspect-ratio: 16/12;
  max-height: 60vh;
  overflow: hidden;
  transition: background .1s;
}
.sc-stage video,
.sc-stage canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.sc-stage canvas { pointer-events: none; }
.sc-detect-hint {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.7);
  color: #fff;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 12px;
  pointer-events: none;
}

.sc-pages {
  display: flex;
  gap: 6px;
  padding: 10px 16px;
  background: #0d0d0d;
  border-top: 1px solid #000;
  overflow-x: auto;
  min-height: 70px;
  max-height: 90px;
}
.sc-page {
  position: relative;
  flex-shrink: 0;
  width: 60px;
  height: 70px;
  border: 2px solid #444;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
}
.sc-page img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sc-page-num {
  position: absolute;
  bottom: 2px;
  left: 2px;
  background: rgba(0,0,0,0.7);
  color: #fff;
  font-size: 9px;
  padding: 1px 4px;
  border-radius: 2px;
}
.sc-page-del {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 16px;
  height: 16px;
  border: none;
  background: rgba(220,38,38,0.9);
  color: #fff;
  border-radius: 50%;
  font-size: 11px;
  cursor: pointer;
  padding: 0;
  line-height: 1;
}

.sc-foot {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 16px 14px;
  background: #1a1a1a;
}
.sc-filters {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.sc-fbtn {
  flex: 1;
  min-width: 0;
  padding: 8px 6px;
  border: 1px solid #333;
  background: #242424;
  color: #ccc;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font);
  white-space: nowrap;
}
.sc-fbtn:hover { background: #2a2a2a; color: #fff; }
.sc-fbtn.on {
  background: var(--c-accent);
  color: #fff;
  border-color: var(--c-accent);
}

.sc-actions {
  display: flex;
  gap: 8px;
  align-items: center;
}
.sc-shoot {
  flex: 1;
  padding: 14px;
  background: #fff;
  color: #1a1a1a;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  font-family: var(--font);
}
.sc-shoot:hover:not(:disabled) { background: #f0f0f0; }
.sc-shoot:disabled { opacity: 0.4; cursor: not-allowed; }
.sc-btn {
  padding: 14px 20px;
  border: 1px solid #444;
  background: transparent;
  color: #fff;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  font-family: var(--font);
}
.sc-btn:hover:not(:disabled) { border-color: var(--c-accent); color: var(--c-accent); }
.sc-btn.primary {
  background: var(--c-accent);
  color: #fff;
  border-color: var(--c-accent);
}
.sc-btn.primary:hover:not(:disabled) {
  background: #d44a0e;
  border-color: #d44a0e;
}
.sc-btn:disabled { opacity: 0.4; cursor: not-allowed; }

@media (max-width: 600px){
  .sc-stage { max-height: 50vh; }
  .sc-fbtn { font-size: 9px; padding: 6px 4px; }
}

/* CAD dosya satırları belirgin olsun */
.yx-row.is-cad td.col-name .icon { color: #f0ad4e; }
.yx-row.is-cad td.col-type { color: #f0ad4e; font-weight: 600; }
.yx-row.is-cad:hover { background: rgba(240, 173, 78, 0.06); }

/* Mobil iyileştirme — telefonda layout düzgün olsun */
@media (max-width: 800px) {
  body { overflow: auto; }
  .app-shell { height: auto; min-height: 100vh; overflow: visible; }
  .app-side {
    position: fixed;
    z-index: 100;
  }
  .app-main { width: 100vw; }
  .app-body {
    display: block !important;
    overflow: visible !important;
    height: auto !important;
  }
  .yx-app { height: auto; min-height: calc(100vh - var(--top-h) - var(--foot-h)); }
  .yx-main {
    grid-template-columns: 1fr !important;
    height: auto;
    overflow: visible;
  }
  .yx-tree { display: none; }
  .yx-tree.show-mobile {
    display: block;
    position: fixed;
    left: 0;
    top: var(--top-h);
    bottom: var(--foot-h);
    width: 80%;
    z-index: 99;
    box-shadow: var(--shadow-lg);
    background: #fafaf8;
  }
  .yx-files { overflow-y: visible; }
  .yx-row td.col-type, .yx-row td.col-date, .yx-row td.col-size { display: none; }
  .yx-row td.col-name { padding: 12px; }
  .yx-row .row-actions { display: flex !important; }
  .yx-toolbar { flex-wrap: wrap; }
  .yx-path { min-width: 100%; order: 99; }
  .at-search { display: none; }
  .at-spacer { flex: 1; }
  .at-actions .at-btn span { display: none; }
}

/* ═══════════════════════════════════════════════════════
   YANDEX AĞACI — Sol siyah menü içinde
   ═══════════════════════════════════════════════════════ */

#yxTree {
  background: var(--side-bg);
  color: var(--side-text);
  flex: 1;
  overflow-y: auto;
  padding: 4px 0 12px;
}
#yxTree .yt-section {
  font-size: 9px;
  font-weight: 700;
  color: var(--side-text-2);
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 12px 16px 6px;
}
#yxTree .yt-row {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px 7px 8px;
  cursor: pointer;
  font-size: 12px;
  color: var(--side-text);
  user-select: none;
  border-left: 3px solid transparent;
  transition: background .08s;
}
#yxTree .yt-row:hover { background: var(--side-hover); color: #fff; }
#yxTree .yt-row.on {
  background: rgba(194,65,12,0.18);
  border-left-color: var(--side-active);
  color: #fff;
  font-weight: 600;
}
#yxTree .yt-row.bound { color: #fbbf24; }
#yxTree .yt-row.bound:hover { color: #fcd34d; }
#yxTree .yt-row .twist {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 8px;
  color: var(--side-text-2);
  transition: transform .12s;
}
#yxTree .yt-row .twist.open { transform: rotate(90deg); color: var(--side-text); }
#yxTree .yt-row .twist.empty { visibility: hidden; }
#yxTree .yt-row .twist.loading {
  color: var(--side-active);
  animation: spin 0.8s linear infinite;
}
#yxTree .yt-row .ico { font-size: 13px; flex-shrink: 0; opacity: 0.85; }
#yxTree .yt-row .label {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#yxTree .yt-row .dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--side-active);
  flex-shrink: 0;
}
#yxTree .yt-children { padding-left: 14px; }

/* Eski .side-tree-h artık ağaç başlığı için */
.side-tree-h {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px 6px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 1.2px;
  color: var(--side-text-2);
  text-transform: uppercase;
  border-top: 1px solid #000;
  margin-top: 8px;
}
.side-tree-h .tcount {
  background: rgba(255,255,255,0.08);
  color: var(--side-text);
  padding: 2px 7px;
  border-radius: 10px;
  font-size: 9px;
}

/* ═══════════════════════════════════════════════════════
   FM MODAL — genel amaçlı (Oturum 7d.2 kurtarma + Oturum 3 hazırlık)
   ═══════════════════════════════════════════════════════ */
.fm-modal-back {
  position: fixed; inset: 0;
  background: rgba(15,18,25,.55);
  display: flex; align-items: center; justify-content: center;
  z-index: 100000;
  animation: fmFade .15s ease;
}
@keyframes fmFade { from{opacity:0} to{opacity:1} }
.fm-modal {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 24px 60px rgba(0,0,0,.35);
  width: min(520px, 92vw);
  max-height: 88vh;
  overflow: hidden;
  display: flex; flex-direction: column;
  animation: fmPop .18s ease;
}
@keyframes fmPop { from{transform:scale(.95);opacity:0} to{transform:scale(1);opacity:1} }
.fm-modal .fm-mh {
  padding: 16px 20px;
  border-bottom: 1px solid #eef0f3;
  display: flex; align-items: center; gap: 10px;
}
.fm-modal .fm-mh .fm-mh-ico { font-size: 22px; }
.fm-modal .fm-mh .fm-mh-tit { font-size: 15px; font-weight: 700; color: #1a1a1a; flex: 1; }
.fm-modal .fm-mh .fm-mh-x {
  width: 28px; height: 28px; border: 0; background: #f3f4f6;
  border-radius: 6px; cursor: pointer; font-size: 16px; color: #555;
}
.fm-modal .fm-mh .fm-mh-x:hover { background: #e5e7eb; }
.fm-modal .fm-mb {
  padding: 18px 20px;
  overflow-y: auto;
  font-size: 13px; color: #374151; line-height: 1.55;
}
.fm-modal .fm-mb .fm-hint { color: #6b7280; font-size: 12px; margin-bottom: 10px; }
.fm-modal .fm-mb input[type=text] {
  width: 100%;
  padding: 10px 12px;
  border: 1.5px solid #d1d5db;
  border-radius: 8px;
  font-size: 13px;
  font-family: inherit;
  outline: none;
  box-sizing: border-box;
}
.fm-modal .fm-mb input[type=text]:focus { border-color: #c2410c; }
.fm-modal .fm-mb .fm-path-box {
  display: flex; gap: 6px; margin-top: 4px;
}
.fm-modal .fm-mb .fm-path-box input {
  flex: 1; font-family: 'Consolas','Courier New',monospace; font-size: 12px;
  background: #f9fafb;
}
.fm-modal .fm-mb .fm-path-box button {
  padding: 0 14px; border: 1.5px solid #c2410c; background: #c2410c; color: #fff;
  border-radius: 8px; cursor: pointer; font-weight: 600; font-size: 12px;
  white-space: nowrap;
}
.fm-modal .fm-mb .fm-path-box button:hover { background: #9a330a; }
.fm-modal .fm-mf {
  padding: 12px 20px 16px;
  border-top: 1px solid #eef0f3;
  display: flex; gap: 8px; justify-content: flex-end;
  background: #fafbfc;
}
.fm-modal .fm-mf button {
  padding: 9px 16px;
  border-radius: 8px;
  font-size: 13px; font-weight: 600;
  cursor: pointer; border: 1.5px solid transparent;
  font-family: inherit;
}
.fm-modal .fm-mf .fm-btn-cancel {
  background: #fff; color: #4b5563; border-color: #d1d5db;
}
.fm-modal .fm-mf .fm-btn-cancel:hover { background: #f3f4f6; }
.fm-modal .fm-mf .fm-btn-ok {
  background: #c2410c; color: #fff; border-color: #c2410c;
}
.fm-modal .fm-mf .fm-btn-ok:hover { background: #9a330a; }
.fm-modal .fm-mf .fm-btn-link {
  background: #fff; color: #1d4ed8; border-color: #bfdbfe;
}
.fm-modal .fm-mf .fm-btn-link:hover { background: #eff6ff; }

/* Cache "anlık göster" durumu için hafif belirti */
.yx-files.fm-stale { opacity: .92; }
.yx-files.fm-stale::after {
  content: '↻ Güncelleniyor...';
  position: absolute; right: 14px; top: 8px;
  font-size: 10px; color: #6b7280;
  background: #fef3c7; padding: 3px 8px; border-radius: 10px;
  pointer-events: none;
}
.yx-files { position: relative; }

/* up-modal animasyon + fm-modal görsel uyumu (override, mevcut kuralları kırmadan) */
.up-modal { animation: fmFade .15s ease; }
.up-modal .up-box { animation: fmPop .18s ease; box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.up-modal .up-head .up-title { letter-spacing: .2px; }
.up-modal .up-foot { background: #fafbfc; }

/* ═══ DETAY PANELİ — Oturum 3 eklemeleri ═══ */
.yx-detail.fm-detail-panel {
  animation: fmDetailIn .2s ease;
}
@keyframes fmDetailIn { from{transform:translateX(20px);opacity:0} to{transform:translateX(0);opacity:1} }
.yx-detail .yd-head {
  display: flex; align-items: center; gap: 8px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--c-border);
  background: #fff;
  position: sticky; top: 0; z-index: 5;
}
.yx-detail .yd-head .yd-h-ico { font-size: 22px; }
.yx-detail .yd-head .yd-h-tit {
  flex: 1; min-width: 0;
  font-size: 13px; font-weight: 700; color: var(--c-text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.yx-detail .yd-head .yd-h-x {
  width: 26px; height: 26px;
  border: 0; background: #f3f4f6;
  border-radius: 5px; cursor: pointer;
  font-size: 15px; color: #555;
  flex-shrink: 0;
}
.yx-detail .yd-head .yd-h-x:hover { background: #e5e7eb; }
.yx-detail .yd-bound-badge {
  display: inline-block;
  padding: 2px 8px;
  background: rgba(194,65,12,.12);
  color: var(--c-accent);
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  margin-left: 6px;
}
.yx-detail .yd-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  padding: 0 16px 14px;
}
.yx-detail .yd-stat {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 10px;
  text-align: center;
}
.yx-detail .yd-stat .v {
  font-size: 18px; font-weight: 700; color: var(--c-text);
  line-height: 1.1;
}
.yx-detail .yd-stat .l {
  font-size: 9px; color: var(--c-text-3);
  text-transform: uppercase; letter-spacing: .5px;
  margin-top: 4px;
}
.yx-detail textarea.yd-notes {
  width: 100%;
  min-height: 80px;
  border: 1px solid var(--c-border);
  border-radius: 6px;
  padding: 8px 10px;
  font-family: inherit;
  font-size: 12px;
  resize: vertical;
  outline: none;
  box-sizing: border-box;
}
.yx-detail textarea.yd-notes:focus { border-color: var(--c-accent); }
.yx-detail .yd-foot {
  padding: 12px 16px;
  border-top: 1px solid var(--c-border);
  background: #fff;
}

/* up-modal güncellenecek/yeni rozetler */
.up-badge-ow {
  display: inline-block;
  padding: 1px 7px;
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .3px;
  margin-left: 4px;
  vertical-align: middle;
}
.up-badge-new {
  display: inline-block;
  padding: 1px 7px;
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .3px;
  margin-left: 4px;
  vertical-align: middle;
}

/* ═══ DOSYA ÖNİZLEME MODAL (PDF/Resim/Video/Ses) ═══ */
.fm-preview-back {
  position: fixed; inset: 0;
  background: rgba(10,12,18,.85);
  z-index: 100001;
  display: flex; align-items: center; justify-content: center;
  padding: 30px 24px;
  animation: fmFade .15s ease;
}
.fm-pv-box {
  background: #1f2228;
  border-radius: 12px;
  width: 100%;
  max-width: 1100px;
  height: 100%;
  max-height: 92vh;
  display: flex; flex-direction: column;
  box-shadow: 0 30px 80px rgba(0,0,0,.6);
  animation: fmPop .2s ease;
  overflow: hidden;
}
.fm-pv-head {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  background: #2a2e36;
  border-bottom: 1px solid #1a1d22;
  flex-shrink: 0;
}
.fm-pv-ico { font-size: 20px; }
.fm-pv-name {
  flex: 1; min-width: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.fm-pv-btn {
  width: 34px; height: 34px;
  border: 0;
  background: rgba(255,255,255,.08);
  color: #fff;
  border-radius: 6px;
  cursor: pointer;
  font-size: 15px;
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none;
  flex-shrink: 0;
  transition: background .12s;
}
.fm-pv-btn:hover { background: rgba(255,255,255,.18); }
.fm-pv-x { font-size: 22px; line-height: 1; }
.fm-pv-x:hover { background: #c2410c; }
.fm-pv-body {
  flex: 1;
  min-height: 0;
  overflow: hidden;
  background: #15171b;
  display: flex;
  align-items: center;
  justify-content: center;
}
.fm-pv-frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: #fff;
}
.fm-pv-imgwrap {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  box-sizing: border-box;
  overflow: auto;
}
.fm-pv-img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0,0,0,.5);
}
.fm-pv-video {
  max-width: 100%;
  max-height: 100%;
  background: #000;
}
.fm-pv-audiowrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding: 40px;
  width: 100%;
}
.fm-pv-audio-ico {
  font-size: 80px;
  opacity: .5;
}

@media (max-width: 700px) {
  .fm-preview-back { padding: 0; }
  .fm-pv-box { max-height: 100vh; max-width: 100vw; border-radius: 0; }
}

/* ═══ "Az önce güncellendi" rozeti (otomatik yenileme) ═══ */
.fm-rec-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .3px;
  text-transform: uppercase;
  margin-left: 6px;
  vertical-align: middle;
  animation: fmRecPulse 1.5s ease-in-out 3;
}
.fm-rec-upd { background: rgba(34,197,94,.15); color: #16a34a; }
.fm-rec-new { background: rgba(59,130,246,.15); color: #2563eb; }
@keyframes fmRecPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.08); }
}
.yx-row.fm-recent { background: rgba(34,197,94,.04); }
.yx-row.fm-recent:hover { background: rgba(34,197,94,.08); }