/* v50.17 — Uygulamalar, Tasarım Editörü ve Video Editör için sakin, tonal yüzeyler.
   Çizgi/kenarlık kullanılmaz (tonal-no-stroke sözleşmesi); hiyerarşi dolgu tonlarıyla kurulur.
   İkonlar 24px viewBox, 1.8 çizgi kalınlığında tek aile. */
:root{
 --apps-ico-video:#7B61FF;
 --apps-ico-design:#E0567A;
 --apps-ico-auto:#1FA67A;
 --apps-ico-brain:#E8893C;
}

/* ---- Ortak ikon ailesi ---- */
.de-ico,.app-symbol svg,.de-drop-ico svg,.de-dropzone svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
.de-ico{width:15px;height:15px}
.app-symbol svg{width:20px;height:20px}
.app-symbol.small svg{width:18px;height:18px}
.ve-back .de-ico{width:14px;height:14px;margin:0 3px 0 -3px}
.de-btn{display:inline-flex;align-items:center;gap:7px;text-decoration:none;white-space:nowrap}

/* ---- Uygulama başlatıcı ---- */
.apps-sub,.de-sub{margin:4px 0 0;color:var(--metadata,var(--muted));font-size:12px;font-weight:520;line-height:1.35}
.de-sub b{color:var(--text);font-weight:680}
.route-applications .app-card{background:var(--tonal-surface,var(--surface-main))!important;border-radius:14px!important}
.route-applications .app-card:hover{background:var(--tonal-hover,var(--surface-hover))!important}
.app-card .app-symbol{background:color-mix(in srgb,var(--app-tint,var(--accent)) 15%,transparent)!important;color:var(--app-tint,var(--accent))!important;border-radius:11px}
.app-card-video{--app-tint:var(--apps-ico-video)}
.app-card-design{--app-tint:var(--apps-ico-design)}
.app-card-auto{--app-tint:var(--apps-ico-auto)}
.app-card-brain{--app-tint:var(--apps-ico-brain)}
.app-card .app-meta{display:flex;justify-content:space-between;gap:10px;background:transparent}
.app-card .app-meta span:first-child{color:var(--text);font-weight:640}

/* ---- Uygulama sayfası başlığı ---- */
.ve-title{display:flex;align-items:center;gap:11px;min-width:0}
.ve-title h1{margin:0!important}
.ve-symbol,.de-symbol{flex:0 0 auto;width:38px!important;height:38px!important;border-radius:10px!important;box-shadow:none!important}
.ve-symbol{background:color-mix(in srgb,var(--apps-ico-video) 16%,transparent)!important;color:var(--apps-ico-video)!important}
.de-symbol{background:color-mix(in srgb,var(--apps-ico-design) 16%,transparent)!important;color:var(--apps-ico-design)!important}
.ve-head-actions .de-btn{height:34px;min-height:34px;padding:0 12px;border-radius:9px}

/* ---- Çalışma alanı (iframe) ---- */
.de-runtime-wrap{overflow:hidden;border-radius:12px!important;background:var(--tonal-surface,var(--surface-main))!important}
.de-runtime{height:calc(100dvh - 186px)!important;min-height:520px!important;background:#0C0D11!important}
.de-bar-state{margin-left:auto;font-size:11px;color:var(--metadata)}
.de-bar-state:empty{display:none}
.ve-runtime-bar .de-bar-state+button{margin-left:0}

/* ---- Sürümler ---- */
.de-drop{width:100%;display:flex!important;align-items:center;justify-content:flex-start!important;gap:14px;height:auto!important;min-height:84px!important;padding:16px 18px!important;margin:0 0 10px;border-radius:12px!important;background:var(--tonal-surface,var(--surface-sunken))!important;color:var(--text);text-align:left;cursor:pointer;transition:background-color .12s ease}
.de-drop:hover{background:var(--tonal-hover,var(--surface-hover))!important}
.de-drop b{display:block;font-size:13.5px;font-weight:700}
.de-drop small{display:block;margin-top:3px;color:var(--metadata);font-size:11.5px;font-weight:500}
.de-drop-ico{flex:0 0 auto;width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:color-mix(in srgb,var(--apps-ico-design) 15%,transparent);color:var(--apps-ico-design)}
.de-drop-ico svg{width:22px;height:22px}
.de-policy{display:flex;align-items:center;gap:7px;margin:0 2px 12px;color:var(--metadata);font-size:11.5px}
.de-policy b{color:var(--text)}
.de-current{margin-bottom:8px;background:color-mix(in srgb,var(--apps-ico-design) 7%,var(--tonal-surface,var(--surface-main)))!important}
.version-row{background:var(--tonal-surface,var(--surface-main))!important}
.version-row h3,.de-current h3{font-size:13.5px}
.version-row p,.de-current p{margin:0;color:var(--metadata);font-size:11.5px}
.version-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.version-actions a,.version-actions button{display:inline-flex;align-items:center;height:30px;min-height:30px;padding:0 11px;border-radius:8px;background:var(--tonal-card,var(--surface-raised));color:var(--text);font-size:11.5px;font-weight:620;text-decoration:none;cursor:pointer}
.version-actions a:hover,.version-actions button:hover{background:var(--tonal-hover,var(--surface-hover))}
.version-actions .de-danger{color:var(--danger,#e5484d)}
.versions-empty{background:var(--tonal-surface,transparent)}

/* ---- Yükleme / onay penceresi ---- */
.de-dialog{width:min(94vw,500px)}
.de-dialog form{display:grid;gap:12px;padding:16px}
.de-dialog p{margin:0;color:var(--muted);font-size:12.5px;line-height:1.55}
.de-file{display:flex;align-items:center;gap:10px;padding:8px 8px 8px 12px;border-radius:10px;background:var(--tonal-input,var(--input));cursor:pointer}
.de-file[hidden]{display:none}
.de-file input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.de-file-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12.5px;color:var(--text)}
.de-file .ghost-btn{pointer-events:none;height:30px;min-height:30px}
.de-pass{display:grid;gap:6px;font-size:11.5px;font-weight:650;color:var(--metadata)}
.de-pass input{width:100%;min-height:38px;padding:0 12px;border-radius:9px;font-size:13px}
.de-progress{height:6px;border-radius:6px;background:var(--tonal-card,var(--surface-sunken));overflow:hidden}
.de-progress i{display:block;height:100%;width:0;background:var(--accent);transition:width .15s ease}
.de-error{color:var(--danger,#e5484d)!important;font-weight:600}
.de-danger-btn{background:var(--danger,#e5484d)!important;color:#fff!important}

/* ---- Sayfaya dosya bırakma katmanı ---- */
.de-dropzone{position:fixed;inset:0;z-index:90;display:grid;place-items:center;background:color-mix(in srgb,var(--bg,#000) 72%,transparent);backdrop-filter:blur(3px);pointer-events:none}
.de-dropzone[hidden]{display:none}
.de-dropzone>div{display:grid;justify-items:center;gap:8px;padding:28px 34px;border-radius:16px;background:var(--tonal-menu,var(--dialog));color:var(--text);text-align:center}
.de-dropzone svg{width:30px;height:30px;color:var(--apps-ico-design)}
.de-dropzone b{font-size:14px}
.de-dropzone small{color:var(--metadata)}

@media(max-width:800px){
 .de-runtime{height:calc(100dvh - 210px)!important;min-height:440px!important}
 .ve-title{gap:9px}
 .de-drop{min-height:72px!important;padding:12px!important}
 .version-row,.de-current{flex-wrap:wrap}
}

/* ---- Video Editör: profil kartları ve çalışma çubuğu ---- */
.route-video-editor-page .tour-card{background:var(--tonal-surface,var(--surface-main))!important;border-radius:14px!important}
.route-video-editor-page .tour-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.route-video-editor-page .profile-live{flex:0 0 auto;padding:4px 9px;border-radius:999px;font-size:10px;font-weight:800;letter-spacing:.06em;background:color-mix(in srgb,var(--green,#2fbf71) 14%,transparent)!important;color:var(--green,#2fbf71)!important}
.route-video-editor-page .profile-live.muted{background:var(--tonal-card,var(--surface-sunken))!important;color:var(--metadata)!important}
.ve-runtime-bar a,.ve-runtime-bar button{display:inline-flex;align-items:center;justify-content:center}