/* ============================================================
   THEME: portfolio mode (default)
   Azul clasico Windows — inspirado en arxiu normal theme
   ============================================================ */
:root {
  /* fondo */
  --bg: #3a6ea5;
  --bg-dot: #2a5e95;
  --bg-dot-size: 1.05px;
  --bg-dot-gap: 21px;
  --bg-opacity: 0.4;

  /* ventana */
  --win-bg: #ece9d8;
  --win-border-hi: #ffffff;
  --win-border-lo: #808080;
  --win-border-dk: #404040;
  --win-shadow: 2px 2px 8px rgba(0, 0, 0, 0.35);

  /* titlebar */
  --tb-bg: linear-gradient(180deg, #0a246a 0%, #3a6ea5 100%);
  --tb-text: #ffffff;

  /* toolbar */
  --tool-bg: #ece9d8;
  --tool-border: #aca899;

  /* statusbar */
  --status-bg: #ece9d8;
  --status-border: #aca899;
  --status-text: #555555;

  /* contenido */
  --content-bg: #ffffff;

  /* iconos desktop */
  --icon-label: #ffffff;
  --icon-label-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
  --icon-select-bg: rgba(10, 36, 106, 0.4);
  --icon-select-border: rgba(10, 36, 106, 0.7);

  /* tags/botones */
  --tag-bg: #ece9d8;
  --tag-border: #aca899;
  --tag-text: #0a246a;
  --tag-bg-active: #0a246a;
  --tag-text-active: #ffffff;

  /* botones genericos */
  --btn-bg: #ece9d8;
  --btn-fg: #000000;
  --btn-border-hi: #ffffff;
  --btn-border-lo: #808080;
  --btn-border-dk: #404040;
  --btn-active-bg: #0a246a;
  --btn-active-fg: #ffffff;

  /* inputs */
  --input-bg: #ffffff;
  --input-border: #7f9db9;
  --input-focus: #0a246a;

  /* texto */
  --text-primary: #000000;
  --text-secondary: #333333;
  --text-muted: #808080;

  /* taskbar */
  --taskbar-bg: linear-gradient(180deg, #3168d5 0%, #4180e0 3%, #2456b8 50%, #1941a5 97%, #1638a0 100%);
  --taskbar-border-top: #5c9eed;
  --taskbar-btn-bg: rgba(255, 255, 255, 0.12);
  --taskbar-btn-active: rgba(255, 255, 255, 0.25);
  --taskbar-text: #ffffff;
  --taskbar-height: 40px;

  /* start menu */
  --start-bg: #ece9d8;
  --start-header-bg: linear-gradient(180deg, #0a246a 0%, #3a6ea5 100%);
  --start-header-text: #ffffff;
  --start-separator: #aca899;

  /* dots titlebar */
  --dot-close: #ff5f57;
  --dot-minimize: #ffbd2e;
  --dot-maximize: #28c840;

  /* fuentes */
  --font: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
  --font-mono: "Lucida Console", "Courier New", monospace;
  --font-display: 'Gill Sans MT Light', 'Gill Sans', sans-serif;

  /* overlay */
  --overlay-bg: rgba(0, 0, 0, 0.35);
}


/* ============================================================
   THEME: personal mode
   Oscuro, rojo/marron — inspirado en arxiu +18 y diegosanmarcos personal
   ============================================================ */
body.mode-personal {
  --bg: #1a0a0a;
  --bg-dot: #3a1515;
  --bg-opacity: 0.5;

  --win-bg: #2a1a18;
  --win-border-hi: #4a3230;
  --win-border-lo: #1a0a08;
  --win-border-dk: #0a0000;
  --win-shadow: 2px 2px 8px rgba(0, 0, 0, 0.5);

  --tb-bg: linear-gradient(180deg, #3a1010 0%, #6a2020 100%);
  --tb-text: #ffcccc;

  --tool-bg: #2a1a18;
  --tool-border: #4a3230;

  --status-bg: #2a1a18;
  --status-border: #4a3230;
  --status-text: #8a6e6e;

  --content-bg: #1e1210;

  --icon-label: #ffcccc;
  --icon-label-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
  --icon-select-bg: rgba(120, 25, 25, 0.4);
  --icon-select-border: rgba(120, 25, 25, 0.7);

  --tag-bg: #2a1a18;
  --tag-border: #4a3230;
  --tag-text: #ff8888;
  --tag-bg-active: #781919;
  --tag-text-active: #ffffff;

  --btn-bg: #2a1a18;
  --btn-fg: #ffcccc;
  --btn-border-hi: #4a3230;
  --btn-border-lo: #1a0a08;
  --btn-border-dk: #0a0000;
  --btn-active-bg: #781919;
  --btn-active-fg: #ffffff;

  --input-bg: #1e1210;
  --input-border: #4a3230;
  --input-focus: #ff5555;

  --text-primary: #ffcccc;
  --text-secondary: #c99;
  --text-muted: #6a4e4e;

  --taskbar-bg: linear-gradient(180deg, #5a1515 0%, #4a1212 3%, #3a0e0e 50%, #2a0808 97%, #200505 100%);
  --taskbar-border-top: #7a2020;
  --taskbar-btn-bg: rgba(255, 255, 255, 0.08);
  --taskbar-btn-active: rgba(255, 255, 255, 0.18);
  --taskbar-text: #ffcccc;

  --start-bg: #2a1a18;
  --start-header-bg: linear-gradient(180deg, #3a1010 0%, #6a2020 100%);
  --start-header-text: #ffcccc;
  --start-separator: #4a3230;

  --overlay-bg: rgba(0, 0, 0, 0.55);
}


/* ============================================================
   RETRO BORDER UTILITIES (from arxiu)
   ============================================================ */
.retro-outset {
  border: 2px solid;
  border-color: var(--win-border-hi) var(--win-border-dk) var(--win-border-dk) var(--win-border-hi);
}

.retro-inset {
  border: 2px solid;
  border-color: var(--win-border-dk) var(--win-border-hi) var(--win-border-hi) var(--win-border-dk);
}