/* Retro Wave pentru Windows — fila BROWSER */
body.brwo #grid, body.brwo #empty, body.brwo #sub, body.brwo #lv, body.brwo #stage, body.brwo #nowbar, body.brwo #osd,
body.brwo #legend, body.brwo #t_cc, body.brwo #t_search, body.brwo #wfan, body.brwo #ssong { display: none !important; }
#t_browser.act { color: #1a0f00; background: linear-gradient(#ffd966, #e69a00); border-color: #5a3a00; text-shadow: 0 1px 0 rgba(255,255,255,.4); }

/* temă implicită (Neon Retro) — orice altă temă suprascrie aceste variabile direct pe #brw */
#brw {
  --brwBg0: #1a0e3d; --brwBg1: #13092e; --brwBg2: #271452; --brwBg3: #3a1d7a;
  --brwAccent: #ffd23f; --brwAccent2: #ff5fa8; --brwAccentText: #1a0f00; --brwText: #f5f0ff; --brwDim: #b7a6e8; --brwBorder: #4a2a9a;
  display: none; position: absolute; left: 0; top: 112px; width: 1920px; height: 968px; z-index: 13;
  background: radial-gradient(1200px 700px at 15% -10%, var(--brwBg3) 0%, transparent 60%), linear-gradient(165deg, var(--brwBg0), #050108 75%);
  color: var(--brwText); font-family: inherit; overflow: hidden;
}
body.brwo #brw { display: block; }
body.brwo.brwImm #top, body.brwo.brwImm #sub { display: none !important; }
body.brwo.brwImm #brw { top: 0; height: 1080px; }
#brw * { box-sizing: border-box; }
#brw .btn { display: inline-block; height: 48px; line-height: 42px; padding: 0 20px; font-size: 21px; font-weight: bold; color: var(--brwText); background: linear-gradient(180deg, var(--brwBg3), var(--brwBg2)); border: 2px solid var(--brwBorder); border-radius: 10px; cursor: pointer; user-select: none; white-space: nowrap; box-shadow: 0 3px 0 rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.12); }
#brw .btn:hover { filter: brightness(1.2); }
#brw .btn:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(0,0,0,.35); }
#brw .btn.go { color: var(--brwAccentText); background: linear-gradient(135deg, var(--brwAccent), var(--brwAccent2)); border-color: var(--brwAccent); box-shadow: 0 3px 10px color-mix(in srgb, var(--brwAccent) 55%, transparent), inset 0 1px 0 rgba(255,255,255,.4); }

/* ---------- rândul de taburi ---------- */
#brwTop { position: absolute; left: 0; top: 0; right: 0; height: 52px; background: linear-gradient(180deg, var(--brwBg2), var(--brwBg1)); border-bottom: 2px solid var(--brwBorder); white-space: nowrap; overflow: hidden; box-shadow: 0 2px 14px rgba(0,0,0,.35); }
#brwTabs { position: absolute; left: 10px; top: 8px; right: 144px; height: 40px; white-space: nowrap; overflow: hidden; }
.brwtab { display: inline-flex; align-items: center; height: 38px; max-width: 220px; min-width: 120px; padding: 0 10px; margin-right: 4px; border-radius: 9px 9px 0 0; background: color-mix(in srgb, var(--brwBg2) 70%, transparent); color: var(--brwDim); font-size: 17px; cursor: pointer; vertical-align: top; transition: background .12s; }
.brwtab.on { background: linear-gradient(180deg, var(--brwBg3), var(--brwBg2)); color: var(--brwText); box-shadow: inset 0 3px 0 var(--brwAccent), 0 2px 8px rgba(0,0,0,.3); }
.brwtab .brwfav { width: 16px; height: 16px; margin-right: 6px; border-radius: 3px; flex: none; background: #333; }
.brwtab .brwttl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; }
.brwtab .brwx { margin-left: 8px; opacity: .6; font-size: 20px; line-height: 1; flex: none; }
.brwtab .brwx:hover { opacity: 1; color: #ff8a8a; }
.brwtab.loading .brwfav { background: linear-gradient(90deg, var(--brwAccent), var(--brwAccent2), var(--brwAccent)); background-size: 200% 100%; animation: brwld 1s linear infinite; }
@keyframes brwld { to { background-position: -200% 0; } }
.brwico { position: absolute; top: 8px; width: 40px; height: 38px; line-height: 38px; text-align: center; font-size: 22px; color: var(--brwDim); background: linear-gradient(180deg, var(--brwBg3), var(--brwBg2)); border-radius: 9px; cursor: pointer; box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.brwico:hover { color: var(--brwAccent); filter: brightness(1.2); }
.brwico.on { color: var(--brwAccentText); background: linear-gradient(135deg, var(--brwAccent), var(--brwAccent2)); box-shadow: 0 0 14px color-mix(in srgb, var(--brwAccent) 65%, transparent); }
#brwNewTab { right: 98px; }
#brwImmB { right: 54px; }
#brwMenuB { right: 8px; }

/* ---------- bara de adresă ---------- */
#brwBar { position: absolute; left: 0; top: 52px; right: 0; height: 56px; background: linear-gradient(180deg, var(--brwBg1), var(--brwBg0)); border-bottom: 2px solid var(--brwBorder); padding: 0 10px; display: flex; align-items: center; }
.brwnav { width: 38px; height: 38px; line-height: 36px; text-align: center; font-size: 20px; color: var(--brwDim); cursor: pointer; border-radius: 8px; flex: none; transition: .12s; }
.brwnav:hover { color: var(--brwText); background: var(--brwBg2); box-shadow: 0 0 10px color-mix(in srgb, var(--brwAccent) 30%, transparent); }
.brwnav.off { opacity: .3; pointer-events: none; }
.brwnav.star.on { color: var(--brwAccent); text-shadow: 0 0 10px color-mix(in srgb, var(--brwAccent) 70%, transparent); }
#brwAddrWrap { flex: 1; margin: 0 8px; height: 40px; background: color-mix(in srgb, var(--brwBg0) 85%, black); border: 2px solid var(--brwBorder); border-radius: 20px; display: flex; align-items: center; padding: 0 14px; box-shadow: inset 0 2px 6px rgba(0,0,0,.4); transition: box-shadow .15s, border-color .15s; }
#brwAddrWrap:focus-within { border-color: var(--brwAccent); box-shadow: inset 0 2px 6px rgba(0,0,0,.4), 0 0 14px color-mix(in srgb, var(--brwAccent) 45%, transparent); }
#brwLock { font-size: 15px; margin-right: 8px; opacity: .7; }
#brwLock.bad { color: #ffb24a; }
#brwAddr { flex: 1; background: transparent; border: none; outline: none; color: var(--brwText); font-size: 19px; font-family: inherit; }
#brwAddr::placeholder { color: var(--brwDim); }

/* ---------- pagini ---------- */
#brwViews { position: absolute; left: 0; top: 108px; right: 0; bottom: 0; background: #000; }
body.brwImm #brwViews { top: 108px; }
#brwViews webview { position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: none; }
#brwViews webview.on { display: flex; }

/* ---------- panou lateral (meniu / favorite / istoric / setări) ---------- */
#brwPanel { position: absolute; right: -420px; top: 108px; bottom: 0; width: 400px; background: linear-gradient(165deg, var(--brwBg2), var(--brwBg1) 70%); border-left: 3px solid var(--brwBorder); box-shadow: -10px 0 30px rgba(0,0,0,.4); transition: right .18s ease; overflow-y: auto; z-index: 2; }
#brw.panelOn #brwPanel { right: 0; }
#brwPanelHead { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 2px solid var(--brwBorder); background: var(--brwBg2); }
#brwPanelT { font-size: 22px; color: var(--brwAccent); letter-spacing: 1px; }
#brwPanelHead .btn { height: 38px; line-height: 32px; font-size: 16px; padding: 0 14px; }
#brwPanelBody { padding: 10px 16px 24px; }
.brwrow { display: flex; align-items: center; justify-content: space-between; padding: 12px 4px; border-bottom: 1px solid var(--brwBorder); font-size: 17px; color: var(--brwText); cursor: default; }
.brwrow span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brwrow span[onclick], .brwrow > span:first-child { cursor: pointer; }
.brwrow i { font-style: normal; color: var(--brwDim); font-size: 14px; margin-left: 6px; }
.brwrow i.ok { color: #5fe37a; }
.brwrow i.bad { color: #ff8a8a; }
.brwrow .brwx { cursor: pointer; opacity: .6; font-size: 20px; }
.brwrow .brwx:hover { opacity: 1; color: #ff8a8a; }
.brwhint { font-size: 15px; color: var(--brwDim); line-height: 1.5; padding: 8px 4px 16px; }
.brwhint.ok { color: #5fe37a; }
.brwhint.bad { color: #ff8a8a; }
#brwPanelBody hr { border: none; border-top: 1px solid var(--brwBorder); margin: 10px 0; }
.brwsec { font-size: 14px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--brwDim); margin: 18px 4px 6px; }
.brwsec:first-child { margin-top: 4px; }

/* selecte / câmpuri din Setări */
.brwsel, .brwtxt { width: 100%; margin-top: 6px; padding: 10px 12px; font-size: 16px; font-family: inherit; color: var(--brwText); background: var(--brwBg1); border: 2px solid var(--brwBorder); border-radius: 8px; }
.brwsel option { background: var(--brwBg1); color: var(--brwText); }
.brwfield { padding: 10px 4px; border-bottom: 1px solid var(--brwBorder); }
.brwfield > b { display: block; font-size: 17px; font-weight: normal; color: var(--brwText); }
.brwradio { display: flex; align-items: center; gap: 8px; padding: 6px 4px; font-size: 16px; cursor: pointer; }
.brwradio input { accent-color: var(--brwAccent); width: 18px; height: 18px; }

/* comutator (bifă) */
.brwsw { position: relative; display: inline-block; width: 46px; height: 26px; flex: none; }
.brwsw input { opacity: 0; width: 0; height: 0; }
.brwsw i { position: absolute; inset: 0; background: var(--brwBg3); border-radius: 13px; transition: .15s; }
.brwsw i::before { content: ''; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; background: var(--brwDim); border-radius: 50%; transition: .15s; }
.brwsw input:checked + i { background: linear-gradient(135deg, var(--brwAccent), var(--brwAccent2)); box-shadow: 0 0 10px color-mix(in srgb, var(--brwAccent) 55%, transparent); }
.brwsw input:checked + i::before { transform: translateX(20px); background: #fff; }

/* teme: grilă de mostre de culoare, cu luciu 3D */
#brwThemes { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 10px; }
.brwswatch { height: 64px; border-radius: 12px; border: 3px solid transparent; cursor: pointer; position: relative; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.25); transition: transform .12s, box-shadow .12s; }
.brwswatch:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 8px 16px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.3); }
.brwswatch::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 50%; background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0)); pointer-events: none; }
.brwswatch.sel { border-color: #fff; box-shadow: 0 0 0 2px var(--brwAccent, #fff), 0 6px 14px rgba(0,0,0,.4); }
.brwswatch span { position: absolute; left: 7px; bottom: 5px; font-size: 11px; font-weight: bold; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.9); z-index: 1; }

/* mesaj scurt (descărcări) */
#brwToast { position: absolute; left: 50%; bottom: 24px; transform: translate(-50%, 20px); background: linear-gradient(165deg, var(--brwBg3), var(--brwBg1)); border: 2px solid var(--brwAccent); border-radius: 12px; padding: 12px 22px; font-size: 17px; color: var(--brwText); opacity: 0; pointer-events: none; transition: .2s; z-index: 5; max-width: 80%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: 0 6px 20px rgba(0,0,0,.4), 0 0 18px color-mix(in srgb, var(--brwAccent) 35%, transparent); }
#brwToast.on { opacity: 1; transform: translate(-50%, 0); }
