/* ========================================================
   RedLine Launcher — styles desktop (Electron)
   Gated par .is-electron — aucun impact en navigateur.
   ======================================================== */

/* ----- Title bar ----- */
.titlebar{ display:none }
.is-electron .titlebar{
  display:flex;align-items:center;justify-content:space-between;
  height:36px;flex-shrink:0;
  background:#06080f;
  border-bottom:1px solid var(--border-soft);
  color:var(--text);
  -webkit-app-region:drag;
  user-select:none;position:relative;z-index:100;
}
.is-electron.win-blur .titlebar{ background:#080a13 }
.is-electron .app{ height:calc(100% - 36px) }

.tb-drag{ display:flex;align-items:center;gap:10px;padding:0 14px;flex:1;min-width:0;height:100% }
.tb-actions{ display:flex;align-items:center;height:100%;-webkit-app-region:no-drag }

.tb-logo{
  width:18px;height:18px;flex-shrink:0;opacity:.92;
}
.tb-title{
  font-weight:700;letter-spacing:1.6px;font-size:11.5px;color:var(--text);
  text-transform:uppercase;
}

.tb-ver{ font-size:10.5px;color:var(--muted-2);font-weight:600;padding:0 10px;letter-spacing:.3px }

.tb-btn{
  width:44px;height:36px;display:grid;place-items:center;
  color:var(--muted);background:transparent;border:none;cursor:pointer;
  transition:background .14s var(--ease),color .14s var(--ease);
}
.tb-btn svg{ width:14px;height:14px }
#launcherSettings svg{ width:15px;height:15px }
.tb-btn:hover{ color:var(--text);background:rgba(255,255,255,.06) }
.tb-btn.tb-close:hover{ background:#e8472c;color:#fff }

:root[data-theme="light"] .is-electron .titlebar{ background:var(--bg-soft) }
:root[data-theme="light"] .is-electron.win-blur .titlebar{ background:var(--side-bg) }
:root[data-theme="light"] .tb-logo{ filter:invert(.88);opacity:.85 }
:root[data-theme="light"] .tb-btn:hover{ background:rgba(20,22,40,.06) }

/* ----- Overlay (téléchargement / message) ----- */
.l-overlay{
  position:fixed;inset:36px 0 0 0;z-index:90;
  display:flex;align-items:center;justify-content:center;
  background:rgba(4,6,12,.75);backdrop-filter:blur(5px);
  animation:fade .2s var(--ease);
}
.l-overlay-card{
  width:420px;background:var(--card);border:1px solid var(--border);
  border-radius:14px;padding:26px 28px;text-align:center;
  box-shadow:var(--shadow);animation:pop .26s var(--spring);
}
.l-overlay-card h3{ font-size:16px;font-weight:700;margin-bottom:6px }
.l-overlay-card p{ color:var(--muted);font-size:12.5px;margin-bottom:16px;line-height:1.5 }
.l-bar{
  height:6px;border-radius:99px;background:rgba(255,255,255,.06);
  border:1px solid var(--border-soft);overflow:hidden;
}
.l-bar i{
  display:block;height:100%;width:0%;border-radius:99px;
  background:var(--accent);
  transition:width .35s var(--ease-out);
}
.l-pct{
  font-size:11px;color:var(--muted);font-weight:700;
  font-variant-numeric:tabular-nums;margin-top:8px;letter-spacing:.5px;
}
.l-overlay-btn{
  margin-top:16px;display:inline-flex;align-items:center;gap:7px;
  height:36px;padding:0 18px;border-radius:9px;
  background:var(--accent);color:#fff;font-weight:700;font-size:12.5px;
  cursor:pointer;transition:background .15s var(--ease);
}
.l-overlay-btn:hover{ background:var(--accent-2) }
:root[data-theme="light"] .l-overlay-btn{ background:#16181f }
:root[data-theme="light"] .l-overlay-btn:hover{ background:#2f313d }

/* ----- Modal "Options du launcher" ----- */
.l-modal-wrap{
  position:fixed;inset:36px 0 0 0;z-index:95;
  display:flex;align-items:center;justify-content:center;
  background:rgba(4,6,12,.65);backdrop-filter:blur(5px);
  animation:fade .18s var(--ease);
}
.l-modal{
  width:440px;max-width:92vw;max-height:82vh;overflow:hidden;
  background:var(--card);border:1px solid var(--border);
  border-radius:16px;box-shadow:var(--shadow);
  animation:pop .25s var(--spring);
  display:flex;flex-direction:column;
}
.l-modal-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:15px 20px;border-bottom:1px solid var(--border-soft);
}
.l-modal-head b{ font-size:14px;font-weight:700;display:flex;align-items:center;gap:9px }
.l-modal-head b svg{ width:16px;height:16px;color:var(--accent-2) }
.l-modal-x{
  width:30px;height:30px;border-radius:8px;display:grid;place-items:center;
  color:var(--muted);background:rgba(255,255,255,.04);
  transition:all .14s var(--ease);
}
.l-modal-x:hover{ color:var(--text);background:rgba(255,255,255,.08);transform:rotate(90deg) }
.l-modal-x svg{ width:14px;height:14px }
.l-modal-body{ padding:6px 20px 16px;overflow-y:auto }
.l-row{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 0;border-bottom:1px solid var(--border-soft);
}
.l-row:last-child{ border-bottom:none }
.l-row-tx{ flex:1;min-width:0 }
.l-row-tx b{ font-size:13px;font-weight:700;display:block }
.l-row-tx span{ font-size:11.5px;color:var(--muted);display:block;margin-top:2px;line-height:1.4 }
.l-row-btn{
  height:30px;padding:0 12px;border-radius:8px;font-weight:700;font-size:11.5px;
  background:rgba(255,255,255,.05);border:1px solid var(--border-soft);color:var(--text);
  cursor:pointer;transition:all .14s var(--ease);
  display:inline-flex;align-items:center;gap:6px;flex-shrink:0;
}
.l-row-btn:hover{ background:rgba(255,255,255,.08);border-color:var(--border) }
.l-row-btn:active{ transform:scale(.96) }
.l-row-btn.busy{ pointer-events:none;opacity:.7 }
.l-row-btn.busy svg{ animation:spin 1s linear infinite }
.l-row-btn svg{ width:12px;height:12px;color:var(--accent-2) }

.l-about{
  margin-top:12px;padding-top:14px;border-top:1px solid var(--border-soft);
  display:flex;align-items:center;gap:12px;
}
.l-about img{ width:32px;height:32px;opacity:.9 }
.l-about-tx{ flex:1;font-size:11.5px;color:var(--muted);line-height:1.55 }
.l-about-tx b{ color:var(--text);font-size:12.5px;font-weight:700;display:block;margin-bottom:1px }
.l-about-tx kbd{
  background:rgba(255,255,255,.05);border:1px solid var(--border-soft);border-radius:5px;
  padding:1px 6px;font-size:10px;font-family:inherit;font-weight:700;color:var(--text);
}

.l-row .switch{ flex-shrink:0 }
