/* ===== Window manager chrome ===== */

#windows-layer { position:absolute; inset:0; z-index:10; }
.ws-page { position:absolute; inset:0; overflow:hidden; }
.ws-page.offscreen-left { transform:translateX(-8%); opacity:0; pointer-events:none; }
.ws-page.offscreen-right { transform:translateX(8%); opacity:0; pointer-events:none; }
.ws-page { transition:transform .24s cubic-bezier(.4,0,.2,1), opacity .24s ease; }

.window {
  position:absolute; display:flex; flex-direction:column;
  background:var(--win-bg);
  border-radius:var(--radius-win);
  box-shadow:var(--shadow-win-unfocused);
  overflow:hidden; visibility:hidden;
  will-change:transform;
}
.window.mapped { visibility:visible; }
.window.focused { box-shadow:var(--shadow-win); }
.window.anim-open { animation:win-open .18s cubic-bezier(.25,.9,.35,1.15); }
@keyframes win-open { from { opacity:0; transform:scale(.92) translateY(14px); } }
.window.anim-close { animation:win-close .15s ease-in forwards; }
@keyframes win-close { to { opacity:0; transform:scale(.94); } }

/* headerbar */
.headerbar {
  height:46px; flex:none;
  display:flex; align-items:center; gap:6px;
  padding:0 9px 0 12px;
  background:var(--hb-bg);
  border-bottom:1px solid var(--border);
}
.window.focused .headerbar { background:var(--hb-bg); }
body[data-theme="dark"] .window:not(.focused) .headerbar { background:#292929; }
body[data-theme="light"] .window:not(.focused) .headerbar { background:#f0eff0; }
.hb-title {
  position:absolute; left:50%; transform:translateX(-50%);
  font-size:13.5px; font-weight:700; max-width:46%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  pointer-events:none;
}
.window:not(.focused) .hb-title { color:var(--fg-dim); }
.hb-left, .hb-right { display:flex; align-items:center; gap:6px; min-width:0; z-index:1; }
.hb-right { margin-left:auto; }
.hb-subtitle { font-size:12px; color:var(--fg-dim); font-weight:400; }

/* circular window controls (Yaru) */
.win-controls { display:flex; align-items:center; gap:7px; margin-left:2px; }
.wc-btn {
  width:20px; height:20px; border-radius:99px; border:none; cursor:pointer;
  background:#5c5c5c; color:#fff;
  display:flex; align-items:center; justify-content:center;
  transition:background .1s ease, transform .06s ease;
  box-shadow:inset 0 -1px 2px rgba(0,0,0,.28), inset 0 1px 1px rgba(255,255,255,.16);
}
.wc-btn svg { width:10px; height:10px; fill:#fff; opacity:.95; }
.wc-btn:hover { background:#757575; }
.wc-btn:active { transform:scale(.94); }
.wc-btn.close:hover { background:#e0433a; }
.wc-btn.close:active { background:#c33730; }
.window:not(.focused) .wc-btn { background:#8f8f8f; }
.window:not(.focused) .wc-btn svg { opacity:.65; }
body[data-theme="light"] .wc-btn { background:#454545; }
body[data-theme="light"] .window:not(.focused) .wc-btn { background:#b3b0b3; }

/* resize handles */
.rz { position:absolute; z-index:5; }
.rz.n { top:-5px; left:10px; right:10px; height:9px; cursor:n-resize; }
.rz.s { bottom:-5px; left:10px; right:10px; height:9px; cursor:s-resize; }
.rz.e { right:-5px; top:10px; bottom:10px; width:9px; cursor:e-resize; }
.rz.w { left:-5px; top:10px; bottom:10px; width:9px; cursor:w-resize; }
.rz.ne { top:-6px; right:-6px; width:16px; height:16px; cursor:ne-resize; }
.rz.nw { top:-6px; left:-6px; width:16px; height:16px; cursor:nw-resize; }
.rz.se { bottom:-6px; right:-6px; width:16px; height:16px; cursor:se-resize; }
.rz.sw { bottom:-6px; left:-6px; width:16px; height:16px; cursor:sw-resize; }
.window.maximized .rz, .window.tiled-h .rz.e, .window.tiled-h .rz.w { display:none; }

.win-content { flex:1; min-height:0; position:relative; display:flex; flex-direction:column; background:var(--win-bg); }

/* snap / tile preview */
#snap-preview {
  position:absolute; z-index:5000; border-radius:14px; pointer-events:none;
  background:color-mix(in srgb, var(--accent) 26%, transparent);
  border:2px solid color-mix(in srgb, var(--accent) 70%, transparent);
  opacity:0; transition:all .14s cubic-bezier(.3,.8,.4,1);
  backdrop-filter:blur(2px);
}
#snap-preview.show { opacity:1; }

/* window menu (right-click headerbar) */
.win-menu-min { min-width:210px; }

/* ---------- alt-tab switcher ---------- */
#alttab {
  position:fixed; inset:0; z-index:9000; display:none;
  align-items:center; justify-content:center;
  background:rgba(0,0,0,.25);
}
#alttab.show { display:flex; }
#alttab .at-box {
  background:color-mix(in srgb, #1c1c1c 88%, transparent);
  -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
  border-radius:22px; padding:22px 26px; max-width:80vw;
  display:flex; flex-wrap:wrap; gap:14px; justify-content:center;
  box-shadow:0 18px 60px rgba(0,0,0,.55);
}
#alttab .at-item {
  width:110px; padding:12px 8px 10px; border-radius:14px; text-align:center;
  color:#fff; outline:3px solid transparent;
}
#alttab .at-item.selected { background:rgba(255,255,255,.14); outline-color:rgba(255,255,255,.85); }
#alttab .at-item img, #alttab .at-item svg.app-svg { width:56px; height:56px; margin-bottom:8px; }
#alttab .at-item .at-label { font-size:12px; font-weight:500; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

/* modal attached to a window */
.win-modal-backdrop {
  position:absolute; inset:0; z-index:40;
  background:rgba(0,0,0,.32);
  display:flex; align-items:center; justify-content:center;
  animation:fade-in .14s ease;
  border-radius:inherit;
}
@keyframes fade-in { from { opacity:0; } }
.gdialog {
  width:min(400px, calc(100% - 48px));
  background:var(--win-bg); border-radius:16px; overflow:hidden;
  box-shadow:0 16px 50px rgba(0,0,0,.45), 0 0 0 1px var(--border);
  animation:dialog-in .18s cubic-bezier(.3,1.1,.4,1);
}
@keyframes dialog-in { from { opacity:0; transform:scale(.96) translateY(8px); } }
.gdialog .gd-title { font-size:15px; font-weight:700; text-align:center; padding:18px 22px 4px; }
.gdialog .gd-body { padding:8px 22px 16px; font-size:13.5px; color:var(--fg-dim); text-align:center; line-height:1.45; user-select:text; }
.gdialog .gd-body input {
  width:100%; margin-top:10px; height:34px; border-radius:8px; border:1px solid var(--border-strong);
  background:var(--entry-bg); padding:0 10px; font-size:13.5px; outline:none; user-select:text; color:var(--fg);
}
.gdialog .gd-body input:focus { border-color:var(--accent); box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 30%, transparent); }
.gdialog .gd-actions { display:flex; border-top:1px solid var(--border); }
.gdialog .gd-actions button {
  flex:1; height:44px; border:none; background:transparent; font-size:13.5px; font-weight:700; cursor:pointer; color:var(--fg);
}
.gdialog .gd-actions button + button { border-left:1px solid var(--border); }
.gdialog .gd-actions button:hover { background:var(--hover-row); }
.gdialog .gd-actions button.suggested { color:var(--accent); }
.gdialog .gd-actions button.destructive { color:var(--danger); }