/* ==============================================
   Theme Toggle Button
   ============================================== */
.theme-toggle-btn {
  background: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  padding: 4px 10px;
  cursor: pointer;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  transition: all 0.3s ease;
}

/* Classic theme: show ">_" icon, hide "A" */
.theme-classic .toggle-icon-classic { display: inline; }
.theme-classic .toggle-icon-terminal { display: none; }
.theme-classic .theme-toggle-btn {
  color: #222;
  border-color: #ccc;
}
.theme-classic .theme-toggle-btn:hover {
  background: #f0f0f0;
}

/* Terminal theme: show "A" icon, hide ">_" */
.theme-terminal .toggle-icon-classic { display: none; }
.theme-terminal .toggle-icon-terminal { display: inline; }
.theme-terminal .theme-toggle-btn {
  color: #7AA2F7;
  border-color: #3B4261;
  background: #1A1B26;
}
.theme-terminal .theme-toggle-btn:hover {
  background: #24283B;
  border-color: #7AA2F7;
}

/* ==============================================
   Terminal Title Bar
   ============================================== */
.terminal-bar {
  background: #16161E;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #24283B;
}

.terminal-dots {
  display: flex;
  gap: 8px;
}

.dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  display: inline-block;
}
.dot-red { background: #FF5F57; }
.dot-yellow { background: #FEBC2E; }
.dot-green { background: #28C840; }

.terminal-title {
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 500;
  color: #565F89;
}

/* ==============================================
   Terminal Cursor (footer)
   ============================================== */
.terminal-cursor {
  text-align: left;
  padding: 16px 0 32px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 15px;
}
.terminal-cursor .prompt { color: #7AA2F7; font-weight: 700; }
.terminal-cursor .cursor-block {
  color: #7AA2F7;
  animation: blink 1s step-end infinite;
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* ==============================================
   Classic Theme (no terminal elements)
   ============================================== */
.theme-classic .terminal-bar { display: none !important; }
.theme-classic .terminal-cursor { display: none !important; }

/* ==============================================
   Terminal Theme - Full Override
   ============================================== */

/* --- Page background & base --- */
.theme-terminal {
  background: #1A1B26 !important;
  transition: background-color 0.4s ease, color 0.4s ease;
}

/* Subtle scanline overlay */
.theme-terminal::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 9999;
  background: repeating-linear-gradient(
    0deg,
    transparent,
    transparent 2px,
    rgba(0, 0, 0, 0.03) 2px,
    rgba(0, 0, 0, 0.03) 4px
  );
}

.theme-terminal .terminal-bar {
  display: flex !important;
}

.theme-terminal .terminal-cursor {
  display: block !important;
}

/* --- All text defaults --- */
.theme-terminal,
.theme-terminal * {
  font-family: 'JetBrains Mono', monospace !important;
  color: #9AA5CE;
}

.theme-terminal .container {
  max-width: 900px;
}

/* --- Navbar --- */
.theme-terminal .navbar-brand {
  color: #C0CAF5 !important;
  font-weight: 700;
  font-size: 1.4rem !important;
  text-decoration: none !important;
}
.theme-terminal .navbar-brand:hover {
  color: #7AA2F7 !important;
  text-decoration: none !important;
  text-shadow: 0 0 8px rgba(122, 162, 247, 0.4);
}
.theme-terminal nav.navbar {
  border: none;
}
.theme-terminal hr {
  border-color: #24283B;
}

/* --- Headings as terminal commands --- */
.theme-terminal #content h2 {
  color: #7AA2F7 !important;
  font-size: 1.1rem !important;
  font-weight: 700 !important;
  margin-top: 2.5rem !important;
  margin-bottom: 0.8rem !important;
  padding-bottom: 0.4rem !important;
  border-bottom: 1px dashed #3B4261 !important;
  text-shadow: 0 0 6px rgba(122, 162, 247, 0.3);
}
.theme-terminal #content h2::before {
  content: 'fuka@portfolio:~$ ';
  color: #73DACA;
  text-shadow: none;
}

.theme-terminal #content h3 {
  color: #BB9AF7 !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  margin-top: 1.8rem !important;
  margin-bottom: 0.4rem !important;
}
.theme-terminal #content h3::before {
  content: '>> ';
  color: #565F89;
}

.theme-terminal #content h4 {
  color: #73DACA !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  margin-top: 1rem !important;
  margin-bottom: 0.2rem !important;
}
.theme-terminal #content h4::before {
  content: '# ';
  color: #565F89;
}

/* --- Paragraphs --- */
.theme-terminal #content p {
  color: #9AA5CE !important;
  font-size: 13px !important;
  line-height: 1.7 !important;
  margin-bottom: 0.5rem !important;
}

/* --- Links --- */
.theme-terminal #content a {
  color: #7DCFFF !important;
  text-decoration: none !important;
  word-break: break-all;
  font-size: inherit !important;
}
.theme-terminal #content a:hover {
  color: #89DDFF !important;
  text-decoration: underline !important;
  text-shadow: 0 0 6px rgba(125, 207, 255, 0.4);
}

/* --- Lists --- */
.theme-terminal #content ul {
  list-style: none !important;
  padding-left: 0 !important;
}
.theme-terminal #content ul > li {
  list-style: none !important;
  margin-left: 0 !important;
  padding-left: 1.8em;
  position: relative;
  font-size: 13px !important;
  line-height: 1.7;
  color: #9AA5CE !important;
}
.theme-terminal #content ul > li::before {
  content: '❯';
  position: absolute;
  left: 0.2em;
  color: #73DACA;
  font-weight: 600;
  font-size: 11px;
}

/* --- Ordered lists --- */
.theme-terminal #content ol {
  counter-reset: terminal-list;
  list-style: none !important;
  padding-left: 0 !important;
}
.theme-terminal #content ol > li {
  counter-increment: terminal-list;
  padding-left: 2.5em;
  position: relative;
  font-size: 13px !important;
  line-height: 1.7;
}
.theme-terminal #content ol > li::before {
  content: '[' counter(terminal-list) ']';
  position: absolute;
  left: 0;
  color: #E0AF68;
  font-weight: 600;
}

/* --- Tables (career history) --- */
.theme-terminal #content table {
  border: none !important;
  border-collapse: collapse !important;
  width: 100%;
  font-size: 13px !important;
}
.theme-terminal #content table th,
.theme-terminal #content table td {
  border: none !important;
  border-bottom: 1px solid #24283B !important;
  padding: 8px 16px 8px 0 !important;
  font-size: 13px !important;
  background: transparent !important;
}
.theme-terminal #content table th {
  color: #565F89 !important;
  font-weight: 600;
  text-transform: uppercase;
  font-size: 11px !important;
  letter-spacing: 1px;
}
.theme-terminal #content table td:first-child {
  color: #E0AF68 !important;
  font-weight: 600;
  white-space: nowrap;
}
.theme-terminal #content table td:first-child::before {
  content: '▪ ';
  color: #3B4261;
}
.theme-terminal #content table tr:nth-child(2n) {
  background: transparent !important;
}
.theme-terminal #content table tr:hover td {
  background: rgba(36, 40, 59, 0.6) !important;
}

/* --- Horizontal rules as ASCII dividers --- */
.theme-terminal #content hr {
  border: none;
  height: auto;
  text-align: center;
  margin: 2.5rem 0;
  overflow: visible;
}
.theme-terminal #content hr::after {
  content: '════════════════════════════════════════════════';
  display: block;
  color: #24283B;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  letter-spacing: 2px;
}

/* --- Avatar --- */
.theme-terminal .avatar > img {
  border-radius: 4px !important;
  border: 1px solid #3B4261;
  filter: grayscale(20%) contrast(1.05);
  transition: filter 0.3s ease;
}
.theme-terminal .avatar > img:hover {
  filter: grayscale(0%) contrast(1.1);
  border-color: #7AA2F7;
}

/* --- Blockquote --- */
.theme-terminal #content blockquote {
  border-left: 3px solid #7AA2F7 !important;
  background: #16161E;
  padding: 12px 16px !important;
  border-radius: 0;
  margin-left: 0 !important;
}
.theme-terminal #content blockquote p {
  color: #9AA5CE !important;
}
.theme-terminal #content blockquote::before {
  content: '/* ';
  color: #565F89;
  font-size: 12px;
}
.theme-terminal #content blockquote::after {
  content: ' */';
  color: #565F89;
  font-size: 12px;
}

/* --- Code --- */
.theme-terminal #content code {
  background: #16161E !important;
  border: 1px solid #3B4261 !important;
  color: #9ECE6A !important;
  border-radius: 2px !important;
  padding: 1px 6px !important;
  font-size: 12px !important;
}

/* --- Footer --- */
.theme-terminal #footer {
  border-top: 1px solid #24283B;
}
.theme-terminal #footer hr {
  display: none;
}
.theme-terminal #footer a {
  color: #565F89 !important;
  transition: color 0.2s ease, text-shadow 0.2s ease;
}
.theme-terminal #footer a.fa-brands {
  font-family: 'Font Awesome 6 Brands' !important;
  font-size: 1.2rem !important;
}
.theme-terminal #footer a:hover {
  color: #7AA2F7 !important;
  text-shadow: 0 0 8px rgba(122, 162, 247, 0.3);
}
.theme-terminal .footer-text {
  color: #565F89 !important;
  font-size: 12px !important;
}

/* --- Section-specific coloring --- */
/* Competition section */
.theme-terminal #content h2[id*="competit"] {
  color: #E0AF68 !important;
  text-shadow: 0 0 6px rgba(224, 175, 104, 0.3);
}
.theme-terminal #content h2[id*="competit"]::before {
  content: 'fuka@portfolio:~$ ';
  color: #73DACA;
  text-shadow: none;
}

/* Hobby section */
.theme-terminal #content h2[id*="hobby"] {
  color: #9ECE6A !important;
  text-shadow: 0 0 6px rgba(158, 206, 106, 0.3);
}
.theme-terminal #content h2[id*="hobby"]::before {
  content: 'fuka@portfolio:~$ ';
  color: #73DACA;
  text-shadow: none;
}

/* Side Work section */
.theme-terminal #content h2[id*="side"] {
  color: #FF9E64 !important;
  text-shadow: 0 0 6px rgba(255, 158, 100, 0.3);
}
.theme-terminal #content h2[id*="side"]::before {
  content: 'fuka@portfolio:~$ ';
  color: #73DACA;
  text-shadow: none;
}

/* --- Selection highlight --- */
.theme-terminal ::selection {
  background: rgba(122, 162, 247, 0.3);
  color: #C0CAF5;
}

/* --- Smooth transition for all elements --- */
.theme-terminal #content,
.theme-terminal #content *,
.theme-terminal .navbar-brand,
.theme-terminal #footer,
.theme-terminal #footer * {
  transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
}

/* --- Scrollbar styling for terminal --- */
.theme-terminal::-webkit-scrollbar {
  width: 6px;
}
.theme-terminal::-webkit-scrollbar-track {
  background: #1A1B26;
}
.theme-terminal::-webkit-scrollbar-thumb {
  background: #3B4261;
  border-radius: 3px;
}
.theme-terminal::-webkit-scrollbar-thumb:hover {
  background: #565F89;
}

/* ==============================================
   Mobile Responsive
   ============================================== */
@media (max-width: 768px) {
  /* Shorter prompt prefix on mobile */
  .theme-terminal #content h2::before {
    content: '~$ ';
  }
  .theme-terminal #content h2[id*="competit"]::before,
  .theme-terminal #content h2[id*="hobby"]::before,
  .theme-terminal #content h2[id*="side"]::before {
    content: '~$ ';
  }

  .theme-terminal #content h2 {
    font-size: 1rem !important;
  }

  .theme-terminal #content h3 {
    font-size: 0.9rem !important;
  }

  /* Table: allow wrapping on first column */
  .theme-terminal #content table td:first-child {
    white-space: normal;
    font-size: 12px !important;
  }
  .theme-terminal #content table th,
  .theme-terminal #content table td {
    padding: 6px 8px 6px 0 !important;
    font-size: 12px !important;
  }

  /* Shorter ASCII divider */
  .theme-terminal #content hr::after {
    content: '══════════════════════';
    font-size: 11px;
  }

  /* Container padding */
  .theme-terminal .container {
    padding-left: 12px;
    padding-right: 12px;
  }

  /* Terminal bar */
  .terminal-title {
    font-size: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Navbar */
  .theme-terminal .navbar-brand {
    font-size: 1.1rem !important;
  }

  /* Smaller text */
  .theme-terminal #content p {
    font-size: 12px !important;
  }
  .theme-terminal #content ul > li,
  .theme-terminal #content ol > li {
    font-size: 12px !important;
  }

  /* Footer icons spacing */
  .theme-terminal #footer a.fa-brands {
    font-size: 1rem !important;
  }
}