/* ========================================
   Linux theme — retro GNOME2 / Ubuntu desktop
   with a green-phosphor CRT gnome-terminal.
   ======================================== */

[data-theme="linux"] .site-normal { display: none; }
[data-theme="linux"] .theme-switcher { display: none; }

.site-linux {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 5000;
  overflow: hidden;
  font-family: 'Ubuntu', 'DejaVu Sans', 'Inter', 'Segoe UI', sans-serif;
  font-size: 13px;
  color: #fff;
}

/* ---------- Boot / Shutdown ---------- */
.linux-boot,
.linux-shutdown {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 99999;
  background: #05060a;
  flex-direction: column;
  justify-content: center;
  padding: 6vh 8vw;
}
.linux-boot-log,
.linux-shutdown-text {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 13px;
  line-height: 1.7;
  color: #b9c2b9;
}
.lx-bl { white-space: pre-wrap; }
.lx-bl .ok { color: #3ad14f; font-weight: 600; }
.linux-boot .lx-bl {
  opacity: 0;
  animation: lx-bootline 0.28s ease forwards;
}
.linux-boot .lx-bl:nth-child(1)  { animation-delay: 0.05s; }
.linux-boot .lx-bl:nth-child(2)  { animation-delay: 0.25s; }
.linux-boot .lx-bl:nth-child(3)  { animation-delay: 0.45s; }
.linux-boot .lx-bl:nth-child(4)  { animation-delay: 0.70s; }
.linux-boot .lx-bl:nth-child(5)  { animation-delay: 0.95s; }
.linux-boot .lx-bl:nth-child(6)  { animation-delay: 1.20s; }
.linux-boot .lx-bl:nth-child(7)  { animation-delay: 1.45s; }
.linux-boot .lx-bl:nth-child(8)  { animation-delay: 1.70s; }
.linux-boot .lx-bl:nth-child(9)  { animation-delay: 1.95s; }
.linux-boot .lx-bl:nth-child(10) { animation-delay: 2.15s; }
@keyframes lx-bootline { to { opacity: 1; } }
.lx-boot-caret { animation: lx-blink 1s steps(1) infinite; }
@keyframes lx-blink { 50% { opacity: 0; } }
.linux-boot.done, .linux-shutdown.off { animation: lx-fade 0.5s ease forwards; }
@keyframes lx-fade { to { opacity: 0; } }

/* ---------- Desktop ---------- */
.linux-desktop {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(130% 110% at 50% 125%, #dd4814 0%, #772953 26%, #2c001e 72%, #1a0012 100%);
  overflow: hidden;
  user-select: none;
}

/* ---------- Top panel ---------- */
.linux-top-panel {
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 26px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  background: linear-gradient(#faf9f8, #d7d2cb);
  border-bottom: 1px solid #8f8b85;
  box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset;
  color: #2b2b2b;
  z-index: 30;
  font-size: 12.5px;
}
.linux-menus { display: flex; gap: 2px; }
.linux-menu {
  padding: 3px 8px;
  border-radius: 3px;
  cursor: pointer;
}
.linux-menu:hover, .linux-menu.open { background: #c9a3d6; color: #2c001e; }
.linux-menu-static { cursor: default; }
.linux-menu-static:hover { background: transparent; color: inherit; }
.linux-top-right { display: flex; align-items: center; gap: 12px; }
.linux-tux-mini { font-size: 14px; color: #2b2b2b; }
.linux-clock { font-size: 12.5px; font-weight: 600; color: #2b2b2b; }

/* Dropdown menus */
.linux-appmenu {
  display: none;
  position: absolute;
  top: 26px;
  left: 6px;
  min-width: 210px;
  background: #f7f6f4;
  border: 1px solid #8f8b85;
  border-top: none;
  box-shadow: 0 6px 18px rgba(0,0,0,0.35);
  padding: 4px;
  z-index: 40;
}
.linux-appmenu.open { display: block; }
.linux-sysmenu { left: auto; }
.linux-appmenu-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px;
  border-radius: 3px;
  color: #2b2b2b;
  cursor: pointer;
  white-space: nowrap;
}
.linux-appmenu-item i { width: 18px; text-align: center; color: #77216f; }
.linux-appmenu-item:hover { background: #dd4814; color: #fff; }
.linux-appmenu-item:hover i { color: #fff; }
.linux-appmenu-sep { height: 1px; background: #d0ccc6; margin: 4px 6px; }

/* ---------- Desktop icons ---------- */
.linux-desktop-icons {
  position: absolute;
  top: 38px; left: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 10;
}
.linux-desk-icon {
  width: 76px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 6px 4px;
  border: 1px solid transparent;
  border-radius: 5px;
  cursor: pointer;
  text-align: center;
}
.linux-desk-icon i { font-size: 30px; color: #f2f2f2; filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.6)); }
.linux-desk-icon span {
  font-size: 12px; color: #fff;
  text-shadow: 0 1px 2px rgba(0,0,0,0.8);
  line-height: 1.2; word-break: break-word;
}
.linux-desk-icon:hover { background: rgba(255,255,255,0.12); border-color: rgba(255,255,255,0.25); }
.linux-desk-icon.selected { background: rgba(221,72,20,0.4); border-color: rgba(255,255,255,0.5); }

/* nicer icon accents */
.linux-desk-icon[data-cmd="__terminal"] i { color: #e6e6e6; }
.linux-desk-icon[data-cmd="projects"] i { color: #f6c667; }
.linux-desk-icon[data-cmd="__resume"] i { color: #ff6f61; }
.linux-desk-icon[data-action="logout"] i { color: #e0e0e0; }

/* ---------- Terminal window ---------- */
.linux-window {
  position: absolute;
  display: none;
  flex-direction: column;
  min-width: 320px;
  min-height: 200px;
  background: #1b1b1b;
  border: 1px solid #000;
  border-radius: 7px 7px 4px 4px;
  box-shadow: 0 16px 50px rgba(0,0,0,0.6), 0 0 0 1px rgba(255,255,255,0.06) inset;
  z-index: 20;
  overflow: hidden;
}
.linux-titlebar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 30px;
  padding: 0 8px 0 12px;
  background: linear-gradient(#504e4a, #3a3936);
  border-bottom: 1px solid #2a2925;
  cursor: default;
  flex-shrink: 0;
}
.linux-title-text {
  color: #f2f0ed;
  font-size: 12.5px;
  font-weight: 600;
  display: flex; align-items: center; gap: 8px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.linux-title-text i { color: #cfccc6; font-size: 12px; }
.linux-title-controls { display: flex; gap: 8px; align-items: center; }
.lx-ctl {
  width: 14px; height: 14px;
  border: none; border-radius: 50%;
  cursor: pointer; padding: 0;
  position: relative;
  background: #5a5854;
}
.lx-min  { background: #f6c667; }
.lx-max  { background: #6bc46b; }
.lx-close { background: #e05c4a; }
.lx-ctl:hover { filter: brightness(1.18); }

.linux-term {
  position: relative;
  flex: 1;
  overflow-y: auto;
  background: #0a0d0a;
  padding: 12px 14px 14px;
  font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  font-size: 13px;
  line-height: 1.5;
  color: #33ff66;
  text-shadow: 0 0 6px rgba(51,255,102,0.35);
  cursor: text;
}
.linux-term-output { white-space: pre-wrap; word-break: break-word; }
.linux-term-line { display: flex; align-items: baseline; gap: 8px; }
.lx-prompt { color: #47ff7a; flex-shrink: 0; white-space: nowrap; }
.lx-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #b6ffcb;
  caret-color: #47ff7a;
  font-family: inherit;
  font-size: inherit;
  text-shadow: inherit;
  padding: 0;
  min-width: 0;
}
.linux-term .lx-line { white-space: pre-wrap; word-break: break-word; margin-bottom: 2px; }
.linux-term .lx-echo { color: #cfe9d6; }
.linux-term .lx-echo .lx-prompt { color: #47ff7a; }
.linux-term .lx-dim { color: #2aa84a; }
.linux-term .lx-white { color: #dfeee2; text-shadow: none; }
.linux-term .lx-err { color: #ff6b5e; text-shadow: 0 0 6px rgba(255,107,94,0.3); }
.linux-term .lx-accent { color: #ff9e64; }
.linux-term a, .linux-term .lx-cmd {
  color: #6bd0ff; text-decoration: underline; cursor: pointer;
}
.linux-term a:hover, .linux-term .lx-cmd:hover { color: #bfe9ff; }
.linux-term .lx-cmd { color: #f6c667; }
.linux-term .lx-cmd:hover { color: #ffe1a0; }

/* neofetch */
.lx-neofetch { display: flex; gap: 18px; margin: 2px 0 6px; }
.lx-neo-art { color: #47ff7a; white-space: pre; line-height: 1.15; font-size: 12px; }
.lx-neo-info { line-height: 1.55; }
.lx-neo-info .k { color: #ff9e64; font-weight: 600; }
.lx-neo-info .u { color: #6bd0ff; }
.lx-neo-bar { margin-top: 4px; letter-spacing: 1px; }

/* CRT overlay on the terminal body */
.linux-crt {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,0.16) 0px, rgba(0,0,0,0.16) 1px, transparent 1px, transparent 3px),
    radial-gradient(120% 120% at 50% 50%, transparent 62%, rgba(0,0,0,0.5) 100%);
  mix-blend-mode: multiply;
  animation: lx-flicker 5s infinite steps(60);
}
@keyframes lx-flicker { 0%,100% { opacity: 0.9; } 50% { opacity: 0.78; } }

/* scrollbar */
.linux-term::-webkit-scrollbar { width: 10px; }
.linux-term::-webkit-scrollbar-thumb { background: #1e3a25; border-radius: 5px; }
.linux-term::-webkit-scrollbar-track { background: #060806; }

/* inactive window titlebar is dimmer */
.linux-window:not(.linux-win-active) .linux-titlebar { background: linear-gradient(#59574f, #47463f); }
.linux-window:not(.linux-win-active) .linux-title-text,
.linux-window:not(.linux-win-active) .linux-title-text i { color: #c3bfb7; }

/* ---------- Generic GUI app body ---------- */
.linux-win-body { flex: 1; min-height: 0; overflow: auto; background: #f4f3f1; color: #2b2b2b; }
.linux-statusbar {
  height: 22px; flex: none;
  display: flex; align-items: center;
  padding: 0 10px;
  background: #ecebe8; border-top: 1px solid #c9c6c0;
  font-size: 11.5px; color: #5a5854;
}

/* ---------- Files (Nautilus) ---------- */
.linux-nautilus { overflow: hidden; display: flex; flex-direction: column; }
.lx-naut-toolbar { display: flex; align-items: center; gap: 6px; padding: 5px 8px; background: #eceae7; border-bottom: 1px solid #c9c6c0; flex: none; }
.lx-naut-btn { width: 26px; height: 24px; border: 1px solid #bdbab4; background: linear-gradient(#fff, #e6e3dd); border-radius: 4px; color: #3a3936; cursor: pointer; font-size: 11px; }
.lx-naut-btn:hover { background: #f2efe9; }
.lx-naut-path { flex: 1; background: #fff; border: 1px solid #bdbab4; border-radius: 4px; padding: 3px 8px; font-size: 12px; color: #333; }
.lx-naut-main { flex: 1; display: flex; min-height: 0; }
.lx-naut-side { width: 148px; flex: none; background: #eceae7; border-right: 1px solid #c9c6c0; padding: 8px 4px; }
.lx-naut-place { display: flex; align-items: center; gap: 8px; padding: 5px 10px; border-radius: 4px; font-size: 12.5px; color: #3a3936; cursor: pointer; }
.lx-naut-place i { width: 16px; text-align: center; color: #8a8681; }
.lx-naut-place:hover { background: #dedbd5; }
.lx-naut-place.active { background: #dd4814; color: #fff; }
.lx-naut-place.active i { color: #fff; }
.lx-naut-files { flex: 1; display: flex; flex-wrap: wrap; align-content: flex-start; gap: 6px; padding: 12px; overflow: auto; background: #fff; }
.lx-file { width: 92px; height: 88px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; padding: 8px 4px; border: 1px solid transparent; border-radius: 6px; cursor: pointer; text-align: center; }
.lx-file i { font-size: 34px; }
.lx-file span { font-size: 12px; color: #2b2b2b; word-break: break-word; line-height: 1.2; }
.lx-file:hover { background: #eef4ff; }
.lx-file.sel { background: #d3e5ff; border-color: #9cc2f5; }

/* ---------- Firefox ---------- */
.linux-firefox { overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.lx-ff-tabs { display: flex; gap: 2px; background: #d7d4cf; padding: 5px 6px 0; flex: none; }
.lx-ff-tab { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; font-size: 12px; color: #4a4a4a; background: #e9e7e3; border: 1px solid #c4c1bb; border-bottom: none; border-radius: 6px 6px 0 0; cursor: pointer; }
.lx-ff-tab.active { background: #fff; color: #222; }
.lx-ff-tab i { font-size: 12px; }
.lx-naut-empty { color: #888; padding: 18px; font-size: 12.5px; }
.lx-blog-head { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.lx-blog-head i { font-size: 34px; color: #111; }
.lx-blog-head h1 { margin: 0; font-size: 22px; color: #222; }
.lx-blog-head p { margin: 3px 0 0; color: #666; font-size: 13px; }
.lx-blog-list { display: flex; flex-direction: column; gap: 14px; }
.lx-blog-post { display: block; padding: 16px 18px; background: #fff; border: 1px solid #e2e0e6; border-radius: 10px; text-decoration: none; transition: box-shadow 0.15s, transform 0.15s; }
.lx-blog-post:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.08); }
.lx-blog-title { font-size: 15px; font-weight: 600; color: #1a1a1a; }
.lx-blog-meta { font-size: 11.5px; color: #999; margin: 4px 0 8px; }
.lx-blog-ex { font-size: 12.5px; color: #555; line-height: 1.5; }
.lx-blog-empty { color: #666; }
.lx-ff-toolbar { display: flex; align-items: center; gap: 6px; padding: 6px 8px; background: #e9e8e6; border-bottom: 1px solid #cfccc6; flex: none; }
.lx-ff-btn { width: 26px; height: 24px; border: none; background: transparent; border-radius: 4px; color: #555; cursor: pointer; }
.lx-ff-btn:hover { background: #d8d6d2; }
.lx-ff-address { flex: 1; background: #fff; border: 1px solid #c4c1bb; border-radius: 14px; padding: 4px 12px; font-size: 12px; color: #333; display: flex; align-items: center; gap: 7px; }
.lx-ff-address i { color: #3a9e57; font-size: 11px; }
.lx-ff-page { flex: 1; overflow: auto; padding: 34px 26px; background: linear-gradient(#fbfbfd, #eeeef3); color: #2b2b2b; }
.lx-ff-hero { text-align: center; margin-bottom: 26px; }
.lx-ff-logo { font-size: 42px; color: #ff7139; margin-bottom: 8px; }
.lx-ff-hero h1 { margin: 0; font-size: 26px; color: #2c2c2c; letter-spacing: -0.02em; }
.lx-ff-hero p { margin: 6px 0 0; color: #666; font-size: 13px; }
.lx-ff-section { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: #999; margin: 0 0 12px; }
.lx-ff-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 12px; }
.lx-ff-tile { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 16px 8px; background: #fff; border: 1px solid #e2e0e6; border-radius: 10px; color: #333; text-decoration: none; transition: transform 0.15s, box-shadow 0.15s; }
.lx-ff-tile i { font-size: 26px; }
.lx-ff-tile span { font-size: 12px; }
.lx-ff-tile:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.1); }

/* ---------- Text editor (gedit) ---------- */
.linux-gedit { overflow: hidden; display: flex; flex-direction: column; background: #fff; }
.lx-gedit-tabs { display: flex; background: #dedbd5; border-bottom: 1px solid #c4c1bb; padding: 4px 4px 0; flex: none; }
.lx-gedit-tab { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; background: #fff; border: 1px solid #c4c1bb; border-bottom: none; border-radius: 5px 5px 0 0; font-size: 12px; color: #333; }
.lx-gedit-text { flex: 1; overflow: auto; margin: 0; padding: 16px 18px; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 12.5px; line-height: 1.7; color: #2b2b2b; white-space: pre-wrap; }

/* ---------- Bottom panel ---------- */
.linux-bottom-panel {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 30px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 8px;
  background: linear-gradient(#e9e5df, #cdc8c0);
  border-top: 1px solid #8f8b85;
  box-shadow: 0 1px 0 rgba(255,255,255,0.6) inset;
  z-index: 30;
}
.linux-show-desktop {
  width: 24px; height: 22px;
  border: 1px solid #9a958e;
  background: linear-gradient(#fdfdfc, #ded9d2);
  border-radius: 3px; cursor: pointer;
  color: #3a3936; font-size: 12px;
}
.linux-show-desktop:hover { background: #efece7; }
.linux-panel-sep { width: 1px; height: 20px; background: #9a958e; }
.linux-tasklist { flex: 1; display: flex; gap: 4px; overflow: hidden; }
.linux-task {
  height: 22px;
  min-width: 150px; max-width: 210px;
  display: flex; align-items: center; gap: 7px;
  padding: 0 10px;
  border: 1px solid #9a958e;
  border-radius: 3px;
  background: linear-gradient(#fbfaf9, #e3ded7);
  color: #2b2b2b;
  font-size: 12px; cursor: pointer;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.linux-task.active { background: linear-gradient(#c9a3d6, #b083c4); color: #2c001e; font-weight: 600; }
.linux-task i { font-size: 11px; }
.linux-workspaces { display: flex; gap: 3px; }
.linux-workspaces .ws {
  width: 22px; height: 16px;
  border: 1px solid #9a958e;
  background: #b9b3ab; border-radius: 2px;
}
.linux-workspaces .ws.active { background: #77216f; }

/* ---------- Launcher button (theme switcher) ---------- */
.theme-btn-linux i { color: inherit; }          /* follow the switcher colour so it shows in light too */
.theme-btn-linux:hover i { color: #dd4814; }    /* Ubuntu orange on hover */

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .linux-desktop-icons { top: 34px; left: 8px; gap: 6px; }
  .linux-desk-icon { width: 62px; }
  .linux-desk-icon i { font-size: 24px; }
  .linux-desk-icon span { font-size: 10px; }
  .lx-neofetch { flex-direction: column; gap: 6px; }
  .lx-neo-art { font-size: 9px; }
  .linux-task { min-width: 90px; }
}

@media (prefers-reduced-motion: reduce) {
  .linux-boot .lx-bl { opacity: 1; animation: none; }
  .linux-crt { animation: none; }
  .lx-boot-caret { animation: none; }
}