/*
 * Custom styles — loaded alongside the Tailwind CDN (development) or a
 * Tailwind CLI build (production). This file contains ONLY:
 *   - CSS custom properties (variables) consumed by Tailwind via var()
 *   - Scrollbar styles
 *   - Print styles
 *   - Non-utility component classes (app-background, titlebar-drag, etc.)
 *   - Keyframe animations not managed by Tailwind
 *
 * Tailwind utility classes (bg-*, text-*, flex, etc.) are NOT defined here;
 * they are generated by the Tailwind CDN script in index.html.
 */

:root {
  --background: #ffffff;
  --foreground: #171717;
  
  /* VSCode Theme Colors */
  --vscode-bg: #1e1e1e;
  --vscode-sidebar-bg: #252526;
  --vscode-titlebar-bg: #323233;
  --vscode-statusbar-bg: #007acc;
  --vscode-border: #2d2d30;
  --vscode-text: #d4d4d4;
  --vscode-text-dim: #858585;
  --vscode-accent: #007acc;
  --vscode-active-bg: #37373d;
  --vscode-hover-bg: #2a2d2e;
  --vscode-line-number: #858585;
  --vscode-tab-inactive: #2d2d2e;
  --vscode-tab-active: #1e1e1e;
  
  /* Syntax Highlighting Colors */
  --syntax-keyword: #569cd6;
  --syntax-string: #ce9178;
  --syntax-comment: #6a9955;
  --syntax-function: #dcdcaa;
  --syntax-type: #4ec9b0;
  --syntax-number: #b5cea8;
  --syntax-variable: #9cdcfe;
  --syntax-property: #9cdcfe;
  
  /* macOS Window Control Colors */
  --mac-red: #ff5f56;
  --mac-yellow: #ffbd2e;
  --mac-green: #27c93f;
  
  /* Print Colors */
  --print-heading1: #1a202c;
  --print-heading2: #2d3748;
  --print-heading3: #4a5568;
  --print-bold: #2c5282;
  --print-text: #2d3748;
  --print-separator: #a0aec0;
}

/* Custom scrollbar */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: var(--vscode-sidebar-bg);
  border-radius: 0;
}

::-webkit-scrollbar-thumb {
  background: #4d4d4d;
  border-radius: 0;
}

::-webkit-scrollbar-thumb:hover {
  background: #5e5e5e;
}

/* Thin scrollbar for tabs */
.scrollbar-thin::-webkit-scrollbar {
  height: 3px;
}

.scrollbar-thin::-webkit-scrollbar-thumb {
  background: var(--vscode-accent);
  border-radius: 3px;
}

/* Hide scrollbar */
.scrollbar-hide::-webkit-scrollbar {
  display: none;
}

.scrollbar-hide {
  -ms-overflow-style: none;
  scrollbar-width: none;
}



/* Print-only content */
.print-only-content {
  visibility: hidden;
  position: fixed;
  left: -9999px;
  top: 0;
  width: 100%;
  z-index: -1;
  height: 0;
  overflow: hidden;
}

/* Screen-only content */
.screen-only {
  display: flex;
}

/* Print Styles */
@media print {
  @page {
    size: letter;
    margin: 0.5in 0.6in;
  }

  * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }

  html, body {
    background: white !important;
    color: #1a1a1a !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100%;
    height: auto !important;
    overflow: visible !important;
    min-height: auto !important;
    max-height: none !important;
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 10pt;
    line-height: 1.4;
  }

  body > * {
    background: white !important;
    background-image: none !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    position: static !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
    visibility: visible !important;
  }

  .screen-only {
    display: none !important;
    visibility: hidden !important;
    position: absolute !important;
    left: -9999px !important;
  }

  .print-only-content {
    display: block !important;
    visibility: visible !important;
    position: static !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: white !important;
    color: #1a1a1a !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    z-index: 9999 !important;
    height: auto !important;
  }

  script, title, meta, head {
    display: none !important;
  }

  body > *:not(.print-only-content) {
    display: none !important;
  }

  /* Resume header */
  .print-header {
    text-align: center;
    padding-bottom: 0.3rem;
    border-bottom: 2px solid #333;
    margin-bottom: 0.35rem;
    page-break-after: avoid;
  }

  .print-header h1 {
    font-size: 20pt;
    font-weight: 700;
    margin: 0;
    color: #111 !important;
    letter-spacing: 0.02em;
  }

  .print-header .print-title {
    font-size: 11pt;
    color: #333 !important;
    margin: 0.15rem 0;
    font-weight: 400;
  }

  .print-header .print-location {
    font-size: 9pt;
    color: #555 !important;
    margin: 0;
  }

  .print-header .print-contacts {
    font-size: 9pt;
    color: #333 !important;
    margin-top: 0.25rem;
  }

  .print-header .print-contacts a {
    color: #333 !important;
    text-decoration: none;
  }

  .print-sep {
    margin: 0 0.4rem;
    color: #999 !important;
  }

  /* Sections */
  .print-section {
    margin-bottom: 0.3rem;
    page-break-inside: auto;
  }

  .print-section-title {
    font-size: 11pt;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #111 !important;
    border-bottom: 1px solid #ccc;
    padding-bottom: 0.1rem;
    margin: 0 0 0.2rem 0;
    page-break-after: avoid;
  }

  .print-text {
    font-size: 10pt;
    color: #333 !important;
    margin: 0;
    line-height: 1.35;
  }

  .print-text[style*="pre-line"] {
    line-height: 1.4;
  }

  /* Experience / Education entries */
  .print-entry {
    margin-bottom: 0.3rem;
    page-break-inside: avoid;
  }

  .print-entry-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }

  .print-entry-header strong {
    font-size: 10pt;
    color: #111 !important;
  }

  .print-period {
    font-size: 9pt;
    color: #555 !important;
    white-space: nowrap;
    flex-shrink: 0;
    margin-left: 1rem;
  }

  .print-entry-sub {
    font-size: 9.5pt;
    color: #444 !important;
    margin-bottom: 0.1rem;
  }

  .print-location-sm {
    color: #666 !important;
  }

  .print-list {
    margin: 0.05rem 0 0 1.2rem;
    padding: 0;
    list-style: disc;
  }

  .print-list li {
    font-size: 9.5pt;
    color: #333 !important;
    line-height: 1.3;
    margin-bottom: 0;
  }
}

/* App layout */
.app-background {
  background-image: url(/img/background.webp);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.titlebar-drag {
  -webkit-app-region: drag;
}

.tab-welcome {
  background-color: var(--vscode-tab-active, var(--vscode-bg));
}

@keyframes slide {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(300%); }
}