/* GitMorph Custom CSS Overrides - GitHub UI Clone */
/* Version: 2.0 - Full GitHub UI Matching */
/* Last Updated: 2026-01-16 */

/* ==========================================================================
   1. VARIABLE MAPPINGS - Connect to github-primer.css variables
   ========================================================================== */

:root {
  /* Map shorthand variables to github-primer.css naming */
  --gh-canvas-default: var(--gh-color-canvas-default);
  --gh-canvas-overlay: var(--gh-color-canvas-overlay);
  --gh-canvas-inset: var(--gh-color-canvas-inset);
  --gh-canvas-subtle: var(--gh-color-canvas-subtle);
  
  --gh-fg-default: var(--gh-color-fg-default);
  --gh-fg-muted: var(--gh-color-fg-muted);
  --gh-fg-subtle: var(--gh-color-fg-subtle);
  
  --gh-border-default: var(--gh-color-border-default);
  --gh-border-muted: var(--gh-color-border-muted);
  --gh-border-subtle: var(--gh-color-border-subtle);
  
  --gh-accent-fg: var(--gh-color-accent-fg);
  --gh-accent-emphasis: var(--gh-color-accent-emphasis);
  --gh-success-fg: var(--gh-color-success-fg);
  --gh-success-emphasis: var(--gh-color-success-emphasis);
  --gh-danger-fg: var(--gh-color-danger-fg);
  --gh-danger-emphasis: var(--gh-color-danger-emphasis);
  --gh-attention-fg: var(--gh-color-attention-fg);
  --gh-attention-emphasis: var(--gh-color-attention-emphasis, #9e6a03);
  --gh-attention-subtle: var(--gh-color-attention-subtle, rgba(187, 128, 9, 0.15));
  --gh-attention-muted: var(--gh-color-attention-muted, rgba(187, 128, 9, 0.4));
  --gh-done-fg: var(--gh-color-done-fg);
  --gh-done-emphasis: var(--gh-color-done-emphasis, #8957e5);
  --gh-closed-emphasis: var(--gh-color-closed-emphasis, #f85149);
  --gh-open-emphasis: var(--gh-color-open-emphasis, #3fb950);

  --gh-neutral-muted: var(--gh-color-neutral-muted);

  /* Contribution calendar colors - GitHub green scale */
  --gh-color-calendar-graph-day-bg: #161b22;
  --gh-color-calendar-graph-day-L1-bg: #0e4429;
  --gh-color-calendar-graph-day-L2-bg: #006d32;
  --gh-color-calendar-graph-day-L3-bg: #26a641;
  --gh-color-calendar-graph-day-L4-bg: #39d353;

  /* Open/merged/closed states */
  --gh-primer-fg-open: #f78166;
  
  --gh-open-bgColor: var(--gh-color-open-subtle);
  --gh-open-fgColor: var(--gh-color-open-fg);
  --gh-closed-bgColor: var(--gh-color-danger-subtle);
  --gh-closed-fgColor: var(--gh-color-danger-fg);
  --gh-done-bgColor: var(--gh-color-done-emphasis);
  --gh-done-fgColor: #ffffff;

  /* Header - dark by default (GitHub style) */
  --gh-header-bg: #010409;
  --gh-header-text: rgba(255, 255, 255, 0.9);
  --gh-header-hover: rgba(255, 255, 255, 0.1);
  --gh-header-divider: #21262d;
  --gh-header-search-bg: rgba(255, 255, 255, 0.08);
  --gh-header-search-border: #30363d;

  /* Button styles */
  --gh-btn-bg: var(--gh-color-canvas-subtle);
  --gh-btn-border: var(--gh-color-border-default);
  --gh-btn-text: var(--gh-color-fg-default, #e6edf3);
  --gh-btn-hoverBg: #30363d;
  --gh-btn-hoverBorder: #9198a1;
  --gh-btn-hover-bg: #30363d;
  --gh-btn-hover-border: #9198a1;
  --gh-btn-shadow: 0 1px 0 rgba(27, 31, 36, 0.04);
  --gh-btn-inset-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);

  /* Navigation */
  --gh-navitem-hoverBg: rgba(177, 186, 196, 0.12);
  
  --gh-btn-primary-bg: #238636;
  --gh-btn-primary-border: #238636;
  --gh-btn-primary-text: #ffffff;
  --gh-btn-primary-hoverBg: #2ea043;
  --gh-btn-primary-hoverBorder: #2ea043;
  
  --gh-btn-danger-bg: transparent;
  --gh-btn-danger-border: var(--gh-color-border-default);
  --gh-btn-danger-hoverBg: var(--gh-color-danger-emphasis);

  /* Shadows */
  --gh-shadow-sm: var(--gh-shadow-resting-small);
  --gh-shadow-md: var(--gh-shadow-resting-medium);
  --gh-shadow-lg: var(--gh-shadow-floating-large);
  --gh-shadow-inset: inset 0 1px 0 rgba(255, 255, 255, 0.03);

  /* UnderlineNav */
  --gh-underlinenav-borderColor-active: #f78166;

  /* ActionList */
  --gh-actionListItem-default-hoverBg: rgba(177, 186, 196, 0.12);

  /* GitHub typography - fallback */
  --font-size-small: 12px;
  --font-size-normal: 14px;
  --font-size-medium: 16px;
  --font-size-large: 20px;
  --font-size-xl: 24px;
  --font-size-xxl: 32px;

  /* GitHub spacing */
  --spacing-1: 4px;
  --spacing-2: 8px;
  --spacing-3: 16px;
  --spacing-4: 24px;
  --spacing-5: 32px;
  --spacing-6: 40px;

  /* GitHub border radius */
  --radius-small: 3px;
  --radius-medium: 6px;
  --radius-large: 12px;
}

body {
  font-family: var(--gh-fontStack-system, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji") !important;
  font-size: var(--gh-text-body-size, 14px) !important;
  line-height: var(--gh-text-body-lineHeight, 1.5) !important;
  color: var(--gh-color-fg-default) !important;
  background-color: var(--gh-color-canvas-default) !important;
}

/* ==========================================================================
   DARK MODE TEXT COLOR FIXES
   Force all text to use proper dark mode colors
   ========================================================================== */

[data-theme="gitea-dark"],
[data-theme="gitea-dark"] body,
[data-theme="gitmorph"],
[data-theme="gitmorph"] body {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
}

/* Dark mode - Force text colors on common elements */
[data-theme="gitea-dark"] h1,
[data-theme="gitea-dark"] h2,
[data-theme="gitea-dark"] h3,
[data-theme="gitea-dark"] h4,
[data-theme="gitea-dark"] h5,
[data-theme="gitea-dark"] h6,
[data-theme="gitea-dark"] p,
[data-theme="gitea-dark"] span,
[data-theme="gitea-dark"] div,
[data-theme="gitea-dark"] li,
[data-theme="gitea-dark"] td,
[data-theme="gitea-dark"] th,
[data-theme="gitea-dark"] label,
[data-theme="gitmorph"] h1,
[data-theme="gitmorph"] h2,
[data-theme="gitmorph"] h3,
[data-theme="gitmorph"] h4,
[data-theme="gitmorph"] h5,
[data-theme="gitmorph"] h6,
[data-theme="gitmorph"] p,
[data-theme="gitmorph"] span,
[data-theme="gitmorph"] div,
[data-theme="gitmorph"] li,
[data-theme="gitmorph"] td,
[data-theme="gitmorph"] th,
[data-theme="gitmorph"] label {
  color: inherit;
}

/* Dark mode - Explicit text color for main content areas */
[data-theme="gitea-dark"] .page-content,
[data-theme="gitea-dark"] .full.height,
[data-theme="gitea-dark"] .dashboard,
[data-theme="gitea-dark"] .repository,
[data-theme="gitea-dark"] .user,
[data-theme="gitea-dark"] .explore,
[data-theme="gitmorph"] .page-content,
[data-theme="gitmorph"] .full.height,
[data-theme="gitmorph"] .dashboard,
[data-theme="gitmorph"] .repository,
[data-theme="gitmorph"] .user,
[data-theme="gitmorph"] .explore {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
}

/* Dark mode - Muted text */
[data-theme="gitea-dark"] .text.grey,
[data-theme="gitea-dark"] .text.light,
[data-theme="gitea-dark"] .muted,
[data-theme="gitea-dark"] .meta,
[data-theme="gitea-dark"] time,
[data-theme="gitea-dark"] .age,
[data-theme="gitea-dark"] .meta a,
[data-theme="gitmorph"] .text.grey,
[data-theme="gitmorph"] .text.light,
[data-theme="gitmorph"] .muted,
[data-theme="gitmorph"] .meta,
[data-theme="gitmorph"] time,
[data-theme="gitmorph"] .age,
[data-theme="gitmorph"] .meta a,
[data-theme="gitmorph"] .meta .tw-text-primary {
  color: #9198a1 !important;
}

/* Dark mode - Links */
[data-theme="gitea-dark"] a,
[data-theme="gitmorph"] a {
  color: #58a6ff !important;
}

[data-theme="gitea-dark"] a:hover,
[data-theme="gitmorph"] a:hover {
  color: #58a6ff !important;
}

/* Dark mode - Inputs and form elements */
[data-theme="gitea-dark"] input,
[data-theme="gitea-dark"] textarea,
[data-theme="gitea-dark"] select,
[data-theme="gitea-dark"] .ui.input input,
[data-theme="gitea-dark"] .ui.form input,
[data-theme="gitea-dark"] .ui.form textarea,
[data-theme="gitmorph"] input,
[data-theme="gitmorph"] textarea,
[data-theme="gitmorph"] select,
[data-theme="gitmorph"] .ui.input input,
[data-theme="gitmorph"] .ui.form input,
[data-theme="gitmorph"] .ui.form textarea {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

/* Dark mode - Tables */
[data-theme="gitea-dark"] .ui.table,
[data-theme="gitea-dark"] .ui.table th,
[data-theme="gitea-dark"] .ui.table td,
[data-theme="gitea-dark"] table,
[data-theme="gitea-dark"] table th,
[data-theme="gitea-dark"] table td,
[data-theme="gitmorph"] .ui.table,
[data-theme="gitmorph"] .ui.table th,
[data-theme="gitmorph"] .ui.table td,
[data-theme="gitmorph"] table,
[data-theme="gitmorph"] table th,
[data-theme="gitmorph"] table td {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

[data-theme="gitea-dark"] .ui.table thead th,
[data-theme="gitea-dark"] table thead th,
[data-theme="gitmorph"] .ui.table thead th,
[data-theme="gitmorph"] table thead th {
  background-color: #161b22 !important;
}

/* Dark mode - Segments and cards */
[data-theme="gitea-dark"] .ui.segment,
[data-theme="gitea-dark"] .ui.card,
[data-theme="gitea-dark"] .ui.cards > .card,
[data-theme="gitmorph"] .ui.segment,
[data-theme="gitmorph"] .ui.card,
[data-theme="gitmorph"] .ui.cards > .card {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

/* Dark mode - Buttons */
[data-theme="gitea-dark"] .ui.button,
[data-theme="gitea-dark"] button,
[data-theme="gitmorph"] .ui.button,
[data-theme="gitmorph"] button {
  color: #e6edf3 !important;
  background-color: #21262d !important;
  border-color: #30363d !important;
}

[data-theme="gitea-dark"] .ui.button:hover,
[data-theme="gitea-dark"] button:hover,
[data-theme="gitmorph"] .ui.button:hover,
[data-theme="gitmorph"] button:hover {
  background-color: #30363d !important;
  border-color: #9198a1 !important;
}

/* Dark mode - Primary buttons stay green */
[data-theme="gitea-dark"] .ui.primary.button,
[data-theme="gitea-dark"] .ui.green.button,
[data-theme="gitmorph"] .ui.primary.button,
[data-theme="gitmorph"] .ui.green.button {
  color: #ffffff !important;
  background-color: #238636 !important;
  border-color: #238636 !important;
}

/* Dark mode - Labels */
[data-theme="gitea-dark"] .ui.label,
[data-theme="gitmorph"] .ui.label {
  color: #e6edf3 !important;
  background-color: #21262d !important;
}

/* Dark mode - Dropdowns */
[data-theme="gitea-dark"] .ui.dropdown,
[data-theme="gitea-dark"] .ui.dropdown .menu,
[data-theme="gitea-dark"] .ui.dropdown .menu .item,
[data-theme="gitmorph"] .ui.dropdown,
[data-theme="gitmorph"] .ui.dropdown .menu,
[data-theme="gitmorph"] .ui.dropdown .menu .item {
  color: #e6edf3 !important;
  background-color: #161b22 !important;
  border-color: #30363d !important;
}

/* Dark mode - Menu items */
[data-theme="gitea-dark"] .ui.menu .item,
[data-theme="gitea-dark"] .ui.tabular.menu .item,
[data-theme="gitmorph"] .ui.menu .item,
[data-theme="gitmorph"] .ui.tabular.menu .item {
  color: #e6edf3 !important;
}

/* Dark mode - Messages */
[data-theme="gitea-dark"] .ui.message,
[data-theme="gitmorph"] .ui.message {
  color: #e6edf3 !important;
  background-color: #161b22 !important;
  border-color: #30363d !important;
}

/* Dark mode - Footer */
[data-theme="gitea-dark"] footer,
[data-theme="gitea-dark"] .footer,
[data-theme="gitmorph"] footer,
[data-theme="gitmorph"] .footer {
  color: #9198a1 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

/* Dark mode - Code blocks */
[data-theme="gitea-dark"] pre,
[data-theme="gitea-dark"] code,
[data-theme="gitea-dark"] .highlight,
[data-theme="gitmorph"] pre,
[data-theme="gitmorph"] code,
[data-theme="gitmorph"] .highlight {
  color: #e6edf3 !important;
  background-color: #161b22 !important;
}

/* Dark mode - Activity heatmap text */
[data-theme="gitea-dark"] .heatmap-total-contributions,
[data-theme="gitea-dark"] .activity-heatmap,
[data-theme="gitea-dark"] .contribution-calendar,
[data-theme="gitmorph"] .heatmap-total-contributions,
[data-theme="gitmorph"] .activity-heatmap,
[data-theme="gitmorph"] .contribution-calendar {
  color: #e6edf3 !important;
}

/* Dark mode - Feed/News items */
[data-theme="gitea-dark"] .feeds .item,
[data-theme="gitea-dark"] .feed-item,
[data-theme="gitea-dark"] .news-item,
[data-theme="gitmorph"] .feeds .item,
[data-theme="gitmorph"] .feed-item,
[data-theme="gitmorph"] .news-item {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

/* Dark mode - Repository list */
[data-theme="gitea-dark"] .repository-list .item,
[data-theme="gitea-dark"] .repo-list .item,
[data-theme="gitmorph"] .repository-list .item,
[data-theme="gitmorph"] .repo-list .item {
  color: #e6edf3 !important;
  background-color: #0d1117 !important;
  border-color: #30363d !important;
}

/* Dark mode - Modals */
[data-theme="gitea-dark"] .ui.modal,
[data-theme="gitea-dark"] .ui.modal > .header,
[data-theme="gitea-dark"] .ui.modal > .content,
[data-theme="gitea-dark"] .ui.modal > .actions,
[data-theme="gitmorph"] .ui.modal,
[data-theme="gitmorph"] .ui.modal > .header,
[data-theme="gitmorph"] .ui.modal > .content,
[data-theme="gitmorph"] .ui.modal > .actions {
  color: #e6edf3 !important;
  background-color: #161b22 !important;
  border-color: #30363d !important;
}

/* ==========================================================================
   2. NAVIGATION BAR - GitHub Header Style
   ========================================================================== */

#navbar {
  background: var(--gh-header-bg) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  height: 62px !important;
  padding: 0 16px !important;
  box-shadow: none !important;
}

/* Logo area */
#navbar #navbar-logo {
  padding: 0 !important;
  margin-right: 16px !important;
}

#navbar #navbar-logo .svg {
  width: 32px !important;
  height: 32px !important;
}

/* Nav items styling - ALWAYS white text on dark header */
#navbar .navbar-left > .item,
#navbar .navbar-right > .item,
#navbar a.item,
#navbar .item {
  font-size: var(--font-size-normal) !important;
  font-weight: 600 !important;
  padding: 6px 12px !important;
  border-radius: var(--radius-medium) !important;
  color: rgba(255, 255, 255, 0.9) !important;
}

#navbar .navbar-left > .item:hover,
#navbar .navbar-right > .item:hover,
#navbar a.item:hover,
#navbar button.item:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
}

/* Ensure all navbar text is white */
#navbar,
#navbar * {
  color: rgba(255, 255, 255, 0.9) !important;
}

#navbar a,
#navbar a:visited {
  color: rgba(255, 255, 255, 0.9) !important;
}

#navbar a:hover {
  color: #ffffff !important;
}

#navbar .svg {
  fill: rgba(255, 255, 255, 0.9) !important;
}

#navbar input,
#navbar input::placeholder {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Search bar - GitHub style */
#navbar .search-bar-container,
#navbar .ui.search {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  height: 32px !important;
  min-width: 280px !important;
  padding: 0 12px !important;
  color: var(--gh-fg-muted) !important;
}

#navbar .search-bar-container:focus-within,
#navbar .ui.search:focus-within {
  border-color: var(--gh-accent-fg) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Search bar input */
#navbar .search-bar-container {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#navbar .search-bar-container .search-icon {
  color: #9198a1 !important;
  fill: #9198a1 !important;
  flex-shrink: 0 !important;
}

#navbar .search-bar-container input,
#navbar #navbar-search-input {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  width: 100% !important;
  font-size: 14px !important;
  color: #e6edf3 !important;
  padding: 0 !important;
}

#navbar .search-bar-container input::placeholder,
#navbar #navbar-search-input::placeholder {
  color: #9198a1 !important;
}

/* Search shortcut hint "/" */
#navbar .search-bar-container .search-shortcut {
  background: #30363d !important;
  border: 1px solid #484f58 !important;
  border-radius: 5px !important;
  color: #9198a1 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0px 6px !important;
  line-height: 20px !important;
  flex-shrink: 0 !important;
}

/* Create dropdown (+ button) */
#navbar .ui.dropdown[data-tooltip-content*="create"],
#navbar .ui.dropdown[data-tooltip-content*="Create"] {
  background: transparent !important;
}

#navbar .ui.dropdown .text svg.octicon-plus {
  width: 16px !important;
  height: 16px !important;
}

#navbar .ui.dropdown .text svg.octicon-triangle-down {
  width: 12px !important;
  height: 12px !important;
  margin-left: 2px !important;
}

/* Dropdown menus */
#navbar .ui.dropdown .menu {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  padding: 8px 0 !important;
  min-width: 200px !important;
  margin-top: 8px !important;
}

#navbar .ui.dropdown .menu::before {
  display: none !important;
}

#navbar .ui.dropdown .menu .header {
  background: transparent !important;
  border-bottom: 1px solid #30363d !important;
  color: #e6edf3 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 8px 16px 12px !important;
  margin-bottom: 8px !important;
}

#navbar .ui.dropdown .menu .divider {
  background: #30363d !important;
  margin: 8px 0 !important;
  height: 1px !important;
}

#navbar .ui.dropdown .menu .item,
#navbar .ui.dropdown .menu a.item {
  background: transparent !important;
  color: #e6edf3 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  padding: 8px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  border-radius: 0 !important;
}

#navbar .ui.dropdown .menu .item:hover,
#navbar .ui.dropdown .menu a.item:hover {
  background: #30363d !important;
  color: #ffffff !important;
}

#navbar .ui.dropdown .menu .item svg,
#navbar .ui.dropdown .menu a.item svg {
  width: 16px !important;
  height: 16px !important;
  fill: #9198a1 !important;
  flex-shrink: 0 !important;
}

#navbar .ui.dropdown .menu .item:hover svg,
#navbar .ui.dropdown .menu a.item:hover svg {
  fill: #e6edf3 !important;
}

/* User menu (avatar dropdown) */
#navbar .ui.dropdown .menu.user-menu {
  min-width: 220px !important;
}

/* Notifications bell */
#navbar .item[href*="notifications"] {
  position: relative !important;
}

#navbar .item[href*="notifications"] .tw-relative {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
}

#navbar .item[href*="notifications"] svg {
  width: 20px !important;
  height: 20px !important;
}

/* Notification count badge */
#navbar .notification_count {
  position: absolute !important;
  top: -6px !important;
  right: -8px !important;
  background: #0969da !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  min-width: 16px !important;
  height: 16px !important;
  padding: 0 5px !important;
  border-radius: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* Stopwatch indicator */
#navbar .active-stopwatch {
  position: relative !important;
}

#navbar .header-stopwatch-dot {
  position: absolute !important;
  top: -2px !important;
  right: -4px !important;
  width: 8px !important;
  height: 8px !important;
  background: #238636 !important;
  border-radius: 50% !important;
  border: 2px solid var(--gh-header-bg) !important;
}

/* Admin server icon */
#navbar .item[href*="admin"] svg {
  width: 18px !important;
  height: 18px !important;
}

/* User avatar in navbar */
#navbar .ui.dropdown .text img.avatar,
#navbar .ui.dropdown .text .avatar {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* Navigation links (Issues, PRs, etc) */
#navbar .navbar-left a.item[href*="issues"],
#navbar .navbar-left a.item[href*="pulls"],
#navbar .navbar-left a.item[href*="milestones"],
#navbar .navbar-left a.item[href*="explore"] {
  font-weight: 500 !important;
  padding: 8px 12px !important;
  margin: 0 2px !important;
}

#navbar .navbar-left a.item.active {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Sign in / Register buttons */
#navbar a.item[href*="sign_up"],
#navbar a.item[href*="login"] {
  font-weight: 600 !important;
}

#navbar a.item[href*="login"] {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

#navbar a.item[href*="login"]:hover {
  border-color: rgba(255, 255, 255, 0.4) !important;
}

/* Mobile menu button */
#navbar #navbar-expand-toggle {
  background: transparent !important;
  border: none !important;
  padding: 8px !important;
}

#navbar #navbar-expand-toggle svg {
  width: 20px !important;
  height: 20px !important;
}

/* ==========================================================================
   3. REPOSITORY PAGE HEADER & TABS
   ========================================================================== */

/* Repository header bar with tabs */
.repo-header,
.repository .header-wrapper {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 16px 0 0 0 !important;
}

/* Repository tab navigation */
.repo-header .repo-tabs,
.repo-header .tabular.menu,
.repository .tabular.menu,
.ui.secondary.menu.tabular {
  border-bottom: none !important;
  background: transparent !important;
  margin: 0 !important;
  padding: 0 24px !important;
  gap: 0 !important;
}

.repo-header .repo-tabs .item,
.repo-header .tabular.menu .item,
.repository .tabular.menu .item,
.ui.secondary.menu.tabular .item {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-normal) !important;
  font-weight: 400 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  margin-bottom: -1px !important;
}

.repo-header .repo-tabs .item:hover,
.repo-header .tabular.menu .item:hover,
.repository .tabular.menu .item:hover,
.ui.secondary.menu.tabular .item:hover {
  background: var(--gh-canvas-subtle) !important;
  border-bottom-color: var(--gh-border-muted) !important;
}

.repo-header .repo-tabs .item.active,
.repo-header .tabular.menu .item.active,
.repository .tabular.menu .item.active,
.ui.secondary.menu.tabular .item.active {
  background: var(--gh-canvas-default) !important;
  border-bottom: 2px solid #f78166 !important;
  font-weight: 600 !important;
}

/* Tab count badges */
.repo-header .item .ui.label,
.repository .tabular.menu .item .ui.label {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 6px !important;
  margin-left: 6px !important;
  border-radius: 2em !important;
  min-width: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
}

/* ==========================================================================
   4. REPOSITORY BUTTONS (Watch/Fork/Star)
   ========================================================================== */

.repo-buttons .ui.button,
.repo-header-button,
.button-row .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
  padding: 3px 12px !important;
  height: 28px !important;
  line-height: 20px !important;
}

.repo-buttons .ui.button:hover,
.repo-header-button:hover,
.button-row .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Button with count - grouped buttons */
.repo-buttons .ui.labeled.button {
  display: inline-flex !important;
}

.repo-buttons .ui.labeled.button > .button {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-right: none !important;
}

.repo-buttons .ui.labeled.button > .label {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-left: none !important;
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   5. FILE LIST & REPOSITORY CONTENT
   ========================================================================== */

/* Quick guide box for empty repos */
.quick-guide,
.empty-repo-guide,
.ui.segment.empty-repo {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 24px !important;
  margin: 16px 0 !important;
}

.quick-guide h4,
.empty-repo-guide h4 {
  font-size: var(--font-size-medium) !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
}

/* Quick guide command blocks - ensure proper display */
.repository.quickstart pre,
.quick-guide pre,
.empty-repo-guide pre {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
  margin: 8px 0 !important;
  overflow-x: auto !important;
  white-space: pre !important;
}

.repository.quickstart pre code,
.quick-guide pre code,
.empty-repo-guide pre code {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  white-space: pre !important;
  display: block !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: var(--font-size-small) !important;
  line-height: 1.6 !important;
  color: var(--gh-fg-default) !important;
}

/* Clone URL box */
.clone-panel,
.clone-url-container,
.ui.action.input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
}

/* Protocol tabs (HTTPS, SSH, etc) */
.clone-panel .ui.menu .item,
.clone-buttons .button,
.ui.buttons .button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
  padding: 5px 16px !important;
}

.clone-panel .ui.menu .item.active,
.clone-buttons .button.active,
.ui.buttons .button.active {
  background: var(--gh-canvas-subtle) !important;
  border-color: var(--gh-border-default) !important;
}

/* Clone URL input */
.clone-panel input,
.clone-url,
.ui.action.input input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: var(--font-size-small) !important;
  padding: 5px 12px !important;
}

/* Code blocks - pre elements */
pre,
.highlight pre,
.markup pre {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: var(--font-size-small) !important;
  padding: 16px !important;
  overflow-x: auto !important;
  white-space: pre !important;
  line-height: 1.6 !important;
}

/* Code inside pre blocks - inherit from pre, don't add extra styling */
pre code,
pre > code,
.highlight pre code,
.markup pre code {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  white-space: pre !important;
  display: block !important;
  line-height: inherit !important;
}

/* Inline code (not inside pre) */
code:not(pre code),
.markup code:not(pre code) {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-small) !important;
  color: var(--gh-fg-default) !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 85% !important;
  padding: 0.2em 0.4em !important;
  white-space: nowrap !important;
}

/* File list table */
.repo-file-list,
.file-table,
#repo-files-table,
.ui.table {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  overflow: hidden !important;
}

.repo-file-list thead,
.file-table thead,
#repo-files-table thead,
.ui.table thead {
  background: var(--gh-canvas-subtle) !important;
}

.repo-file-list th,
.file-table th,
#repo-files-table th,
.ui.table th {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
}

.repo-file-list td,
.file-table td,
#repo-files-table td,
.ui.table td {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-normal) !important;
  padding: 8px 16px !important;
}

.repo-file-list tr:last-child td,
.file-table tr:last-child td,
.ui.table tr:last-child td {
  border-bottom: none !important;
}

.repo-file-list tr:hover td,
.file-table tr:hover td,
.ui.table tr:hover td {
  background: var(--gh-canvas-subtle) !important;
}

/* File names as links */
.repo-file-list a,
.file-table a {
  color: var(--gh-accent-fg) !important;
}

.repo-file-list a:hover,
.file-table a:hover {
  text-decoration: underline !important;
}

/* ==========================================================================
   6. SIDEBAR (About section)
   ========================================================================== */

.repo-home-sidebar-top,
.repo-sidebar {
  padding-left: 24px !important;
}

.repo-sidebar-section {
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

.repo-sidebar-section:last-child {
  border-bottom: none !important;
}

.repo-sidebar-section h4,
.repo-description-header {
  font-size: var(--font-size-normal) !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

/* About section links */
.repo-sidebar a {
  color: var(--gh-accent-fg) !important;
  font-size: var(--font-size-small) !important;
}

.repo-sidebar a:hover {
  text-decoration: underline !important;
}

/* Stats (stars, watchers, forks) */
.repo-sidebar .flex-item,
.repo-stats {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 0 !important;
  color: var(--gh-fg-muted) !important;
  font-size: var(--font-size-small) !important;
}

/* Language Bar - GitHub-style horizontal color bar */
.language-stats {
  display: flex !important;
  height: 8px !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin: 8px 0 !important;
  background: var(--gh-canvas-subtle) !important;
}

.language-stats .bar {
  height: 100% !important;
  transition: width 0.3s ease !important;
}

.language-stats .bar:first-child {
  border-radius: 6px 0 0 6px !important;
}

.language-stats .bar:last-child {
  border-radius: 0 6px 6px 0 !important;
}

.language-stats .bar:only-child {
  border-radius: 6px !important;
}

/* Language Stats Details - GitHub-style list */
.language-stats-details {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
}

.language-stats-details .item {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
}

.language-stats-details .item:hover {
  color: var(--gh-accent-fg) !important;
  cursor: pointer !important;
}

.language-stats-details .item .color-icon {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

.language-stats-details .item .tw-font-semibold {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* Repository Sidebar Bottom - Releases & Languages */
.repo-home-sidebar-bottom {
  padding-left: 16px !important;
}

.repo-home-sidebar-bottom .flex-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

.repo-home-sidebar-bottom .flex-item {
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

.repo-home-sidebar-bottom .flex-item-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 12px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.repo-home-sidebar-bottom .flex-item-title a {
  color: var(--gh-fg-default) !important;
}

.repo-home-sidebar-bottom .flex-item-title a:hover {
  color: var(--gh-accent-fg) !important;
}

.repo-home-sidebar-bottom .flex-item-title .ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border: none !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
  border-radius: 10px !important;
}

/* Latest Release styling */
.repo-home-sidebar-bottom .flex-item .flex-item {
  padding: 8px 0 !important;
  margin-left: 0 !important;
}

.repo-home-sidebar-bottom .flex-item-leading svg {
  color: var(--gh-success-emphasis) !important;
}

.repo-home-sidebar-bottom .flex-item-header .flex-item-title {
  margin-bottom: 0 !important;
}

.repo-home-sidebar-bottom .flex-item-header .flex-item-title a {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-accent-fg) !important;
}

.repo-home-sidebar-bottom .flex-item-body .time {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* ==========================================================================
   7. BUTTONS - GitHub Style
   ========================================================================== */

/* Default button */
.ui.button,
button.ui {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-normal) !important;
  font-weight: 500 !important;
  padding: 5px 16px !important;
  line-height: 20px !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: background 80ms, border-color 80ms !important;
}

.ui.button:hover,
button.ui:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Primary button (green) */
.ui.primary.button,
.ui.green.button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-bg) !important;
  color: #ffffff !important;
}

.ui.primary.button:hover,
.ui.green.button:hover {
  background: var(--gh-btn-primary-hover-bg) !important;
  border-color: var(--gh-btn-primary-hover-bg) !important;
}

/* Danger button (red) */
.ui.red.button,
.ui.negative.button {
  background: transparent !important;
  border-color: var(--gh-btn-border) !important;
  color: var(--gh-danger-fg) !important;
}

.ui.red.button:hover,
.ui.negative.button:hover {
  background: #da36362e !important;
  border-color: var(--gh-danger-fg) !important;
}

/* Small buttons */
.ui.small.button,
.ui.mini.button,
.ui.tiny.button {
  font-size: var(--font-size-small) !important;
  padding: 3px 12px !important;
}

/* ==========================================================================
   8. FORMS & INPUTS
   ========================================================================== */

.ui.input input,
.ui.form input[type="text"],
.ui.form input[type="email"],
.ui.form input[type="password"],
.ui.form input[type="url"],
.ui.form textarea,
textarea,
input[type="text"],
input[type="email"],
input[type="password"] {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-normal) !important;
  padding: 5px 12px !important;
  line-height: 20px !important;
}

.ui.input input:focus,
.ui.form input:focus,
.ui.form textarea:focus,
textarea:focus,
input:focus {
  border-color: var(--gh-accent-fg) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
  outline: none !important;
}

/* Select / Dropdown */
.ui.dropdown,
.ui.selection.dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  min-height: auto !important;
  padding: 5px 12px !important;
}

.ui.dropdown .menu,
.ui.selection.dropdown .menu {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.5) !important;
}

.ui.dropdown .menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-default) !important;
  padding: 8px 16px !important;
}

.ui.dropdown .menu .item:hover {
  background: var(--gh-canvas-inset) !important;
}

/* ==========================================================================
   9. LABELS & BADGES
   ========================================================================== */

.ui.label {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid transparent !important;
  border-radius: 2em !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
  padding: 0 7px !important;
  line-height: 18px !important;
}

/* Issue labels (colored) */
.issue-label,
.repo-label {
  border-radius: 2em !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
  padding: 0 7px !important;
  line-height: 18px !important;
}

/* ==========================================================================
   10. SEGMENTS & CARDS
   ========================================================================== */

.ui.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  box-shadow: none !important;
  padding: 16px !important;
}

.ui.segment.attached {
  border-radius: 0 !important;
}

.ui.segment.attached:first-child,
.ui.segment.top.attached {
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
}

.ui.segment.attached:last-child,
.ui.segment.bottom.attached {
  border-radius: 0 0 var(--radius-medium) var(--radius-medium) !important;
}

/* Cards */
.ui.card,
.ui.cards > .card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  box-shadow: none !important;
}

.ui.card:hover,
.ui.cards > .card:hover {
  border-color: var(--gh-border-default) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

/* ==========================================================================
   11. MESSAGES & ALERTS
   ========================================================================== */

.ui.message {
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
  border-width: 1px !important;
  border-style: solid !important;
}

.ui.info.message {
  background: rgba(56, 139, 253, 0.1) !important;
  border-color: rgba(56, 139, 253, 0.4) !important;
  color: var(--gh-accent-fg) !important;
}

.ui.success.message,
.ui.positive.message {
  background: rgba(46, 160, 67, 0.15) !important;
  border-color: rgba(46, 160, 67, 0.4) !important;
  color: var(--gh-success-fg) !important;
}

.ui.warning.message {
  background: rgba(187, 128, 9, 0.15) !important;
  border-color: rgba(187, 128, 9, 0.4) !important;
  color: var(--gh-attention-fg) !important;
}

.ui.error.message,
.ui.negative.message {
  background: rgba(248, 81, 73, 0.1) !important;
  border-color: rgba(248, 81, 73, 0.4) !important;
  color: var(--gh-danger-fg) !important;
}

/* ==========================================================================
   12. FOOTER
   ========================================================================== */

footer,
.footer {
  background: var(--gh-canvas-default) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: var(--font-size-small) !important;
  padding: 24px 0 !important;
}

footer a,
.footer a {
  color: var(--gh-accent-fg) !important;
}

footer a:hover,
.footer a:hover {
  text-decoration: underline !important;
}

/* ==========================================================================
   13. ISSUES & PULL REQUESTS LIST
   ========================================================================== */

/* Issue list header with filters */
.issue-list-header,
.list-header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
  padding: 16px !important;
}

/* Issue list items */
.issue-list .item,
.issue-item,
.flex-item {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  padding: 16px !important;
}

.issue-list .item:last-child,
.issue-item:last-child,
.flex-item:last-child {
  border-radius: 0 0 var(--radius-medium) var(--radius-medium) !important;
}

.issue-list .item:hover,
.issue-item:hover,
.flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Issue title */
.issue-list .item .title,
.issue-item .title {
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-medium) !important;
  font-weight: 600 !important;
}

.issue-list .item .title:hover,
.issue-item .title:hover {
  color: var(--gh-accent-fg) !important;
}

/* Issue metadata */
.issue-list .item .meta,
.issue-item .meta {
  color: var(--gh-fg-muted) !important;
  font-size: var(--font-size-small) !important;
}

/* ==========================================================================
   14. DASHBOARD / HOME PAGE
   ========================================================================== */

/* Dashboard sidebar */
.dashboard .dashboard-sidebar {
  background: var(--gh-canvas-default) !important;
  border-right: 1px solid var(--gh-border-default) !important;
}

/* Repository list on dashboard */
.dashboard .repo-list .item {
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 12px 16px !important;
}

.dashboard .repo-list .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Activity feed */
.dashboard .feed .item {
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 16px 0 !important;
}

/* ==========================================================================
   15. MISC OVERRIDES
   ========================================================================== */

/* Remove box shadows from Fomantic UI */
.ui.segment,
.ui.card,
.ui.menu,
.ui.dropdown .menu {
  box-shadow: none !important;
}

/* Links */
a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

a:hover {
  text-decoration: underline !important;
}

/* Horizontal rules */
hr {
  border: none !important;
  border-top: 1px solid var(--gh-border-default) !important;
  margin: 16px 0 !important;
}

/* Breadcrumb styling */
.breadcrumb {
  font-size: var(--font-size-normal) !important;
}

.breadcrumb a {
  color: var(--gh-accent-fg) !important;
}

.breadcrumb .divider {
  color: var(--gh-fg-muted) !important;
  margin: 0 4px !important;
}

/* Tooltips */
.tippy-box {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
}

/* Page container */
.page-content,
.full.height {
  background: var(--gh-canvas-default) !important;
}

/* Main content area padding */
.repository.file.list,
.repository.view.issue,
.repository.diff {
  padding: 0 32px !important;
}

@media (max-width: 768px) {
  .repository.file.list,
  .repository.view.issue,
  .repository.diff {
    padding: 0 16px !important;
  }
}

/* Modals */
.ui.modal {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-large) !important;
}

.ui.modal > .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
}

.ui.modal > .actions {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

/* Pagination */
.ui.pagination.menu {
  background: transparent !important;
  border: none !important;
}

.ui.pagination.menu .item {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  margin: 0 2px !important;
}

.ui.pagination.menu .item:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.ui.pagination.menu .item.active {
  background: var(--gh-accent-emphasis) !important;
  border-color: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
}

/* Empty state */
.empty-placeholder {
  color: var(--gh-fg-muted) !important;
  text-align: center !important;
  padding: 48px !important;
}

/* Avatar styling */
.avatar,
.ui.avatar.image {
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Commit list */
.commit-list .item {
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 16px !important;
}

.commit-list .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Branch selector */
.branch-selector {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
}

/* Diff view */
.diff-file-box {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin-bottom: 16px !important;
}

.diff-file-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Code review comments */
.comment-box {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin: 16px 0 !important;
}

.comment-box .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
}

.comment-box .content {
  padding: 16px !important;
}

/* Timeline */
.timeline-item {
  border-left: 2px solid var(--gh-border-default) !important;
  padding-left: 16px !important;
  margin-left: 16px !important;
}

.timeline-item::before {
  background: var(--gh-canvas-default) !important;
  border: 2px solid var(--gh-border-default) !important;
}

/* Loading spinner */
.ui.loader {
  color: var(--gh-accent-fg) !important;
}

/* Toast notifications */
.toastify {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
}

/* ==========================================================================
   16. DASHBOARD IMPROVEMENTS
   ========================================================================== */

/* Dashboard layout */
.dashboard {
  background: var(--gh-canvas-default) !important;
}

.dashboard .secondary-nav {
  background: var(--gh-header-bg) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
}

/* User selector in dashboard */
.dashboard .secondary-nav .ui.dropdown {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-default) !important;
}

/* Heatmap calendar */
.heatmap {
  margin: 16px 0 !important;
}

.heatmap rect {
  rx: 2 !important;
  ry: 2 !important;
}

/* Activity feed */
.dashboard .feeds,
.feed-item,
.news-item {
  background: var(--gh-canvas-default) !important;
}

.dashboard .feeds .item,
.feed-item,
.news-item {
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 16px !important;
}

.dashboard .feeds .item:hover,
.feed-item:hover,
.news-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Repository list sidebar */
.dashboard .repository-list,
.repo-list {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
}

.dashboard .repository-list .item,
.repo-list .item {
  padding: 8px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.dashboard .repository-list .item:last-child,
.repo-list .item:last-child {
  border-bottom: none !important;
}

.dashboard .repository-list .item:hover,
.repo-list .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Repository/Organization tabs */
.dashboard .ui.tabular.menu {
  border-bottom: 1px solid var(--gh-border-default) !important;
  background: transparent !important;
}

.dashboard .ui.tabular.menu .item {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  color: var(--gh-fg-default) !important;
  padding: 8px 16px !important;
  margin-bottom: -1px !important;
}

.dashboard .ui.tabular.menu .item.active {
  border-bottom-color: #f78166 !important;
  font-weight: 600 !important;
}

/* New repository button */
.dashboard .repo-list-header .ui.button,
.new-repo-button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-bg) !important;
  color: #ffffff !important;
  font-size: var(--font-size-small) !important;
  padding: 3px 12px !important;
}

/* ==========================================================================
   17. FILE BROWSER IMPROVEMENTS
   ========================================================================== */

/* Branch/tag selector */
.choose.reference,
.branch-selector-dropdown,
#branch-dropdown-button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  font-size: var(--font-size-small) !important;
  padding: 5px 12px !important;
}

/* Latest commit bar */
.latest-commit,
.commit-info-bar {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
  padding: 8px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.latest-commit .avatar,
.commit-info-bar .avatar {
  width: 24px !important;
  height: 24px !important;
}

.latest-commit .commit-message,
.commit-info-bar .commit-message {
  flex: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.latest-commit .sha,
.commit-info-bar .sha {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: var(--font-size-small) !important;
  color: var(--gh-accent-fg) !important;
}

/* File tree / file list */
#repo-files-table {
  border-top: none !important;
  border-radius: 0 0 var(--radius-medium) var(--radius-medium) !important;
}

#repo-files-table tbody tr {
  border-bottom: 1px solid var(--gh-border-default) !important;
}

#repo-files-table tbody tr:last-child {
  border-bottom: none !important;
}

#repo-files-table tbody tr:hover {
  background: var(--gh-canvas-subtle) !important;
}

#repo-files-table td {
  padding: 8px 16px !important;
  vertical-align: middle !important;
}

/* File/folder icons */
#repo-files-table .svg {
  color: var(--gh-fg-muted) !important;
  margin-right: 8px !important;
}

/* File name column */
#repo-files-table .name {
  font-weight: 400 !important;
}

#repo-files-table .name a {
  color: var(--gh-accent-fg) !important;
}

/* Commit message column */
#repo-files-table .message {
  color: var(--gh-fg-muted) !important;
  max-width: 400px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Age column */
#repo-files-table .age {
  color: var(--gh-fg-muted) !important;
  white-space: nowrap !important;
  text-align: right !important;
}

/* ==========================================================================
   18. README AND MARKDOWN CONTENT
   ========================================================================== */

/* README box */
.readme-box,
.markdown-body,
#readme {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 24px !important;
  margin-top: 16px !important;
}

/* README header */
.readme-box .header,
#readme .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
  margin: -24px -24px 24px -24px !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
}

/* Markdown styling */
.markdown-body h1,
.markup h1 {
  font-size: 2em !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding-bottom: 0.3em !important;
  margin-bottom: 16px !important;
}

.markdown-body h2,
.markup h2 {
  font-size: 1.5em !important;
  font-weight: 600 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding-bottom: 0.3em !important;
  margin-top: 24px !important;
  margin-bottom: 16px !important;
}

.markdown-body h3,
.markup h3 {
  font-size: 1.25em !important;
  font-weight: 600 !important;
  margin-top: 24px !important;
  margin-bottom: 16px !important;
}

.markdown-body ul,
.markup ul {
  padding-left: 2em !important;
  margin-bottom: 16px !important;
}

.markdown-body li,
.markup li {
  margin-bottom: 4px !important;
}

.markdown-body blockquote,
.markup blockquote {
  border-left: 4px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  padding: 0 1em !important;
  margin: 0 0 16px 0 !important;
}

.markdown-body img,
.markup img {
  max-width: 100% !important;
  border-radius: var(--radius-medium) !important;
}

/* ==========================================================================
   19. ISSUE/PR DETAIL VIEW
   ========================================================================== */

/* Issue header */
.issue-title,
.pull-title {
  font-size: var(--font-size-xxl) !important;
  font-weight: 400 !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.25 !important;
  margin-bottom: 8px !important;
}

.issue-title-number,
.pull-title-number {
  color: var(--gh-fg-muted) !important;
  font-weight: 300 !important;
}

/* Issue state labels */
.issue-state-label,
.state-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  border-radius: 2em !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
}

.issue-state-label.open,
.state-label.green {
  background: var(--gh-success-emphasis) !important;
  color: #ffffff !important;
}

.issue-state-label.closed,
.state-label.purple {
  background: var(--gh-done-fg) !important;
  color: #ffffff !important;
}

.issue-state-label.merged,
.state-label.purple.merged {
  background: var(--gh-done-fg) !important;
  color: #ffffff !important;
}

/* Comment thread */
.comment-list .comment,
.timeline-comment {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin-bottom: 16px !important;
}

.comment-list .comment .header,
.timeline-comment .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
}

.comment-list .comment .content,
timeline-comment .content {
  padding: 16px !important;
}

/* Sidebar in issue view */
.issue-content .issue-sidebar,
.pull-request-sidebar {
  border-left: 1px solid var(--gh-border-default) !important;
  padding-left: 16px !important;
}

/* ==========================================================================
   20. EXPLORE PAGE
   ========================================================================== */

/* Explore page header */
.explore .ui.secondary.pointing.menu {
  border-bottom: 1px solid var(--gh-border-default) !important;
}

/* Repository cards in explore */
.explore .repository-card,
.repo-card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

.explore .repository-card:hover,
.repo-card:hover {
  border-color: var(--gh-border-default) !important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) !important;
}

/* ==========================================================================
   21. SETTINGS PAGES
   ========================================================================== */

/* Settings sidebar */
.user-settings .ui.vertical.menu,
.repo-settings .ui.vertical.menu {
  background: transparent !important;
  border: none !important;
}

.user-settings .ui.vertical.menu .item,
.repo-settings .ui.vertical.menu .item {
  background: transparent !important;
  border-radius: var(--radius-medium) !important;
  color: var(--gh-fg-default) !important;
  padding: 8px 12px !important;
  margin: 2px 0 !important;
}

.user-settings .ui.vertical.menu .item:hover,
.repo-settings .ui.vertical.menu .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

.user-settings .ui.vertical.menu .item.active,
.repo-settings .ui.vertical.menu .item.active {
  background: var(--gh-canvas-subtle) !important;
  font-weight: 600 !important;
}

/* Settings form sections */
.user-settings .ui.form .field,
.repo-settings .ui.form .field {
  margin-bottom: 16px !important;
}

.user-settings .ui.form label,
.repo-settings .ui.form label {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  margin-bottom: 4px !important;
}

/* Danger zone */
.danger-zone {
  border: 1px solid var(--gh-danger-fg) !important;
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
  margin-top: 24px !important;
}

.danger-zone h4 {
  color: var(--gh-danger-fg) !important;
  margin-bottom: 16px !important;
}

/* ==========================================================================
   22. ADDITIONAL REFINEMENTS
   ========================================================================== */

/* Secondary navigation */
.secondary-nav {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 0 !important;
}

/* Action bar above file list */
.repo-button-row,
.action-row {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 0 !important;
}

/* Go to file button */
.goto-file-button,
.search-button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
}

/* Add file dropdown */
.add-file-dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
}

/* Code button (green) */
.clone-button,
.code-button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-bg) !important;
  color: #ffffff !important;
}

/* Star count badge */
.star-count,
.fork-count,
.watch-count {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-left: none !important;
  padding: 3px 10px !important;
  font-size: var(--font-size-small) !important;
  font-weight: 600 !important;
}

/* About section in sidebar */
.repo-sidebar .about,
.repository-summary {
  margin-bottom: 16px !important;
}

.repo-sidebar .about p,
.repository-summary p {
  color: var(--gh-fg-default) !important;
  line-height: 1.5 !important;
  margin-bottom: 16px !important;
}

/* Topics/Tags */
.topic-tag,
.repo-topic {
  display: inline-block !important;
  background: rgba(56, 139, 253, 0.15) !important;
  color: var(--gh-accent-fg) !important;
  padding: 0 10px !important;
  font-size: var(--font-size-small) !important;
  font-weight: 500 !important;
  line-height: 22px !important;
  border-radius: 2em !important;
  margin: 0 4px 4px 0 !important;
}

.topic-tag:hover,
.repo-topic:hover {
  background: rgba(56, 139, 253, 0.25) !important;
  text-decoration: none !important;
}

/* Language color dots */
.language-color {
  display: inline-block !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  margin-right: 4px !important;
}

/* Contributors avatars */
.contributors-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.contributors-list .avatar {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
}

/* Empty state improvements */
.empty-state,
.no-results {
  text-align: center !important;
  padding: 48px !important;
  color: var(--gh-fg-muted) !important;
}

.empty-state .svg,
.no-results .svg {
  width: 48px !important;
  height: 48px !important;
  margin-bottom: 16px !important;
  opacity: 0.5 !important;
}

/* 404 page */
.page-404 {
  text-align: center !important;
  padding: 100px 20px !important;
}

.page-404 h1 {
  font-size: 48px !important;
  color: var(--gh-fg-muted) !important;
}

/* ==========================================================================
   23. SINGLE FILE CODE VIEW - GitHub Style
   ========================================================================== */

/* File header with breadcrumb and actions */
.file-header,
.file-view-header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) var(--radius-medium) 0 0 !important;
  padding: 8px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  font-size: var(--font-size-small) !important;
}

.file-header .file-path,
.file-view-header .file-path {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
}

.file-header .file-path a {
  color: var(--gh-accent-fg) !important;
}

.file-header .file-actions,
.file-view-header .file-actions {
  display: flex !important;
  gap: 4px !important;
}

/* Code view container */
.file-view.code-view {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 var(--radius-medium) var(--radius-medium) !important;
}

/* Line numbers */
.file-view.code-view .lines-num {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-muted) !important;
  text-align: right !important;
  padding: 0 16px 0 16px !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
  line-height: 20px !important;
  vertical-align: top !important;
  user-select: none !important;
  width: 1% !important;
  min-width: 50px !important;
  border-right: 1px solid var(--gh-border-default) !important;
}

.file-view.code-view .lines-num:hover {
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
}

/* Code content */
.file-view.code-view .lines-code {
  background: var(--gh-canvas-default) !important;
  padding: 0 16px !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
  line-height: 20px !important;
  white-space: pre !important;
  overflow-x: auto !important;
}

/* Active/selected line highlight */
.file-view tr.active .lines-num,
.file-view tr.active .lines-code {
  background: rgba(255, 235, 59, 0.15) !important;
}

.file-view tr.active .lines-num::before {
  background: #f78166 !important;
}

/* Blame view */
.blame-info {
  background: var(--gh-canvas-subtle) !important;
  border-right: 1px solid var(--gh-border-default) !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  white-space: nowrap !important;
  min-width: 200px !important;
}

.blame-info .commit-message {
  color: var(--gh-fg-muted) !important;
  max-width: 300px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* ==========================================================================
   24. ISSUE DETAIL PAGE - GitHub Style
   ========================================================================== */

/* Issue header */
.issue-title-header {
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  margin-bottom: 16px !important;
}

.issue-title-header h1 {
  font-size: 32px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
}

.issue-title-header .issue-number {
  color: var(--gh-fg-muted) !important;
  font-weight: 300 !important;
}

/* Issue state label */
.issue-state-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  border-radius: 2em !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.issue-state-label.open {
  background: var(--gh-success-emphasis) !important;
  color: #ffffff !important;
}

.issue-state-label.closed {
  background: #8957e5 !important;
  color: #ffffff !important;
}

/* Issue meta info */
.issue-meta {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  margin-bottom: 16px !important;
}

.issue-meta a {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* Timeline */
.timeline-container,
.issue-timeline {
  position: relative !important;
}

.timeline-container::before,
.issue-timeline::before {
  content: "" !important;
  position: absolute !important;
  left: 27px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 2px !important;
  background: var(--gh-border-muted) !important;
}

/* Timeline items */
.timeline-item {
  position: relative !important;
  padding-left: 60px !important;
  margin-bottom: 16px !important;
}

.timeline-item .avatar {
  position: absolute !important;
  left: 0 !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  z-index: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 2px solid var(--gh-canvas-default) !important;
}

/* Comment box */
.timeline-item .comment,
.comment-box {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  overflow: hidden !important;
}

.timeline-item .comment .comment-header,
.comment-box .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
}

.timeline-item .comment .comment-header .author,
.comment-box .header .author {
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.timeline-item .comment .comment-header .timestamp,
.comment-box .header .timestamp {
  color: var(--gh-fg-muted) !important;
}

.timeline-item .comment .comment-header .author-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.timeline-item .comment .comment-header .author-wrapper a {
  color: var(--gh-fg-muted) !important;
}

.timeline-item .comment .comment-header .author-wrapper a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

.timeline-item .comment .comment-body,
.comment-box .body,
.comment-box .content {
  padding: 16px !important;
  background: var(--gh-canvas-default) !important;
}

/* Author badge */
.author-badge {
  display: inline-block !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 2em !important;
  color: var(--gh-fg-muted) !important;
  margin-left: 4px !important;
}

/* Issue sidebar */
.issue-sidebar,
.pull-request-sidebar {
  width: 240px !important;
  min-width: 240px !important;
  padding-left: 16px !important;
}

.issue-sidebar-section,
.sidebar-section {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

.issue-sidebar-section:last-child,
.sidebar-section:last-child {
  border-bottom: none !important;
}

.issue-sidebar-section h4,
.sidebar-section h4 {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 8px !important;
  text-transform: uppercase !important;
}

/* ==========================================================================
   25. PULL REQUEST PAGES - GitHub Style
   ========================================================================== */

/* PR conversation page */
.pr-merge-box {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin: 16px 0 !important;
}

.pr-merge-box .merge-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.pr-merge-box .merge-header .status-icon {
  width: 24px !important;
  height: 24px !important;
}

.pr-merge-box .merge-header .status-icon.success {
  color: var(--gh-success-fg) !important;
}

.pr-merge-box .merge-header .status-icon.pending {
  color: var(--gh-attention-fg) !important;
}

.pr-merge-box .merge-header .status-icon.failure {
  color: var(--gh-danger-fg) !important;
}

.pr-merge-box .merge-content {
  padding: 16px !important;
}

.pr-merge-box .merge-actions {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
}

/* PR checks */
.pr-checks-list {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  overflow: hidden !important;
}

.pr-check-item {
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.pr-check-item:last-child {
  border-bottom: none !important;
}

.pr-check-item .check-status {
  width: 16px !important;
  height: 16px !important;
}

.pr-check-item .check-status.success {
  color: var(--gh-success-fg) !important;
}

.pr-check-item .check-status.failure {
  color: var(--gh-danger-fg) !important;
}

.pr-check-item .check-status.pending {
  color: var(--gh-attention-fg) !important;
}

/* PR branch info */
.pr-branch-info {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.pr-branch-info .branch-name {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: rgba(56, 139, 253, 0.15) !important;
  color: var(--gh-accent-fg) !important;
  padding: 2px 8px !important;
  border-radius: var(--radius-small) !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
}

/* PR files changed tab */
.diff-stats-bar {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin-bottom: 16px !important;
}

.diff-stats-bar .stats-item {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 14px !important;
}

.diff-stats-bar .additions {
  color: var(--gh-success-fg) !important;
}

.diff-stats-bar .deletions {
  color: var(--gh-danger-fg) !important;
}

/* File diff box */
.diff-file-box {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  margin-bottom: 16px !important;
  overflow: hidden !important;
}

.diff-file-box .diff-file-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 8px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.diff-file-box .diff-file-header .file-path {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
  flex: 1 !important;
}

.diff-file-box .diff-file-header .file-actions {
  display: flex !important;
  gap: 4px !important;
}

/* Diff table */
.diff-file-box .diff-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
}

.diff-file-box .diff-table td {
  padding: 0 10px !important;
  line-height: 20px !important;
  vertical-align: top !important;
}

.diff-file-box .diff-table .line-num {
  width: 1% !important;
  min-width: 50px !important;
  text-align: right !important;
  color: var(--gh-fg-muted) !important;
  background: var(--gh-canvas-subtle) !important;
  border-right: 1px solid var(--gh-border-default) !important;
  user-select: none !important;
}

.diff-file-box .diff-table .line-content {
  white-space: pre !important;
}

/* Diff line highlighting */
.diff-line-add {
  background: rgba(46, 160, 67, 0.15) !important;
}

.diff-line-add .line-num {
  background: rgba(46, 160, 67, 0.25) !important;
}

.diff-line-del {
  background: rgba(248, 81, 73, 0.15) !important;
}

.diff-line-del .line-num {
  background: rgba(248, 81, 73, 0.25) !important;
}

/* Diff hunk header */
.diff-hunk-header {
  background: rgba(56, 139, 253, 0.1) !important;
  color: var(--gh-accent-fg) !important;
  padding: 4px 10px !important;
}

/* ==========================================================================
   26. USER PROFILE PAGE - GitHub Style
   ========================================================================== */

/* Profile container */
.user-profile {
  display: flex !important;
  gap: 24px !important;
  padding: 24px 0 !important;
}

/* Profile sidebar */
.profile-sidebar {
  width: 296px !important;
  min-width: 296px !important;
}

.profile-sidebar .avatar {
  width: 296px !important;
  height: 296px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

.profile-sidebar .name {
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin-top: 16px !important;
}

.profile-sidebar .username {
  font-size: 20px !important;
  font-weight: 300 !important;
  color: var(--gh-fg-muted) !important;
  line-height: 24px !important;
}

.profile-sidebar .bio {
  margin-top: 16px !important;
  font-size: 16px !important;
  color: var(--gh-fg-default) !important;
}

.profile-sidebar .user-stats {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 16px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

.profile-sidebar .user-stats a {
  color: var(--gh-fg-muted) !important;
}

.profile-sidebar .user-stats a:hover {
  color: var(--gh-accent-fg) !important;
}

.profile-sidebar .user-stats strong {
  color: var(--gh-fg-default) !important;
}

/* Profile content */
.profile-content {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Pinned repositories */
.pinned-repos {
  margin-bottom: 24px !important;
}

.pinned-repos h2 {
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.pinned-repos .pinned-repo-card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
}

.pinned-repos .pinned-repo-card:hover {
  border-color: var(--gh-border-muted) !important;
}

/* Contribution graph */
.contribution-graph {
  margin-bottom: 24px !important;
}

.contribution-graph h2 {
  font-size: 16px !important;
  font-weight: 400 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

/* ==========================================================================
   27. EXPLORE PAGE - GitHub Style
   ========================================================================== */

/* Explore header */
.explore-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 24px 0 !important;
}

.explore-header h1 {
  font-size: 32px !important;
  font-weight: 600 !important;
}

/* Explore tabs */
.explore-tabs {
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 0 16px !important;
}

.explore-tabs .item {
  color: var(--gh-fg-muted) !important;
  padding: 16px 16px !important;
  font-weight: 400 !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px !important;
}

.explore-tabs .item:hover {
  color: var(--gh-fg-default) !important;
}

.explore-tabs .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  border-bottom-color: #f78166 !important;
}

/* Repository card in explore */
.explore-repo-card,
.repository-card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

.explore-repo-card:hover,
.repository-card:hover {
  border-color: var(--gh-border-muted) !important;
}

.explore-repo-card .repo-title,
.repository-card .repo-title {
  font-size: 16px !important;
  font-weight: 600 !important;
}

.explore-repo-card .repo-title a,
.repository-card .repo-title a {
  color: var(--gh-accent-fg) !important;
}

.explore-repo-card .repo-title a:hover,
.repository-card .repo-title a:hover {
  text-decoration: underline !important;
}

.explore-repo-card .repo-description,
.repository-card .repo-description {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  margin: 8px 0 !important;
}

.explore-repo-card .repo-meta,
.repository-card .repo-meta {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* ==========================================================================
   28. MOBILE RESPONSIVE FIXES
   ========================================================================== */

@media (max-width: 1011px) {
  .user-profile {
    flex-direction: column !important;
  }

  .profile-sidebar {
    width: 100% !important;
    min-width: 100% !important;
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 16px !important;
  }

  .profile-sidebar .avatar {
    width: 96px !important;
    height: 96px !important;
  }
}

@media (max-width: 768px) {
  .issue-content {
    flex-direction: column !important;
  }

  .issue-sidebar,
  .pull-request-sidebar {
    width: 100% !important;
    min-width: 100% !important;
    padding-left: 0 !important;
    padding-top: 16px !important;
    border-left: none !important;
    border-top: 1px solid var(--gh-border-default) !important;
  }

  .timeline-container::before,
  .issue-timeline::before {
    left: 15px !important;
  }

  .timeline-item {
    padding-left: 40px !important;
  }

  .timeline-item .avatar {
    width: 28px !important;
    height: 28px !important;
  }
}

/* ==========================================================================
   29. PRINT STYLES
   ========================================================================== */

@media print {
  #navbar,
  .repo-tabs,
  .ui.tabular.menu,
  .issue-sidebar,
  .pull-request-sidebar,
  footer {
    display: none !important;
  }

  body {
    background: white !important;
    color: black !important;
  }

  .file-view.code-view,
  .diff-file-box,
  .comment-box {
    border: 1px solid #ddd !important;
  }
}

/* ==========================================================================
   30. GITEA-AUTO THEME DARK MODE SUPPORT
   Apply dark mode styles when system prefers dark color scheme
   ========================================================================== */

@media (prefers-color-scheme: dark) {
  [data-theme="gitea-auto"],
  [data-theme="gitea-auto"] body {
    color: #e6edf3 !important;
    background-color: #0d1117 !important;
  }

  /* Auto dark mode - Force text colors on common elements */
  [data-theme="gitea-auto"] h1,
  [data-theme="gitea-auto"] h2,
  [data-theme="gitea-auto"] h3,
  [data-theme="gitea-auto"] h4,
  [data-theme="gitea-auto"] h5,
  [data-theme="gitea-auto"] h6,
  [data-theme="gitea-auto"] p,
  [data-theme="gitea-auto"] span,
  [data-theme="gitea-auto"] div,
  [data-theme="gitea-auto"] li,
  [data-theme="gitea-auto"] td,
  [data-theme="gitea-auto"] th,
  [data-theme="gitea-auto"] label {
    color: inherit;
  }

  /* Auto dark mode - Main content areas */
  [data-theme="gitea-auto"] .page-content,
  [data-theme="gitea-auto"] .full.height,
  [data-theme="gitea-auto"] .dashboard,
  [data-theme="gitea-auto"] .repository,
  [data-theme="gitea-auto"] .user,
  [data-theme="gitea-auto"] .explore {
    color: #e6edf3 !important;
    background-color: #0d1117 !important;
  }

  /* Auto dark mode - Muted text */
  [data-theme="gitea-auto"] .text.grey,
  [data-theme="gitea-auto"] .text.light,
  [data-theme="gitea-auto"] .muted,
  [data-theme="gitea-auto"] .meta,
  [data-theme="gitea-auto"] time,
  [data-theme="gitea-auto"] .age,
  [data-theme="gitea-auto"] .meta a,
  [data-theme="gitmorph"] .text.grey,
  [data-theme="gitmorph"] .text.light,
  [data-theme="gitmorph"] .muted,
  [data-theme="gitmorph"] .meta,
  [data-theme="gitmorph"] time,
  [data-theme="gitmorph"] .age,
  [data-theme="gitmorph"] .meta .tw-text-primary {
    color: #9198a1 !important;
  }

  /* Auto dark mode - Links */
  [data-theme="gitea-auto"] a {
    color: #58a6ff !important;
  }

  /* Auto dark mode - Inputs */
  [data-theme="gitea-auto"] input,
  [data-theme="gitea-auto"] textarea,
  [data-theme="gitea-auto"] select,
  [data-theme="gitea-auto"] .ui.input input,
  [data-theme="gitea-auto"] .ui.form input,
  [data-theme="gitea-auto"] .ui.form textarea {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
  }

  /* Auto dark mode - Tables */
  [data-theme="gitea-auto"] table,
  [data-theme="gitea-auto"] .ui.table {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.table thead th {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.table tbody td {
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Segments/Cards */
  [data-theme="gitea-auto"] .ui.segment,
  [data-theme="gitea-auto"] .ui.segments,
  [data-theme="gitea-auto"] .ui.card,
  [data-theme="gitea-auto"] .ui.cards > .card {
    background-color: #0d1117 !important;
    border-color: #30363d !important;
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Buttons */
  [data-theme="gitea-auto"] .ui.button {
    background-color: #21262d !important;
    color: #c9d1d9 !important;
    border-color: #30363d !important;
  }

  [data-theme="gitea-auto"] .ui.button:hover {
    background-color: #30363d !important;
    border-color: #9198a1 !important;
  }

  [data-theme="gitea-auto"] .ui.primary.button {
    background-color: #238636 !important;
    color: #ffffff !important;
    border-color: #238636 !important;
  }

  /* Auto dark mode - Labels/Tags */
  [data-theme="gitea-auto"] .ui.label {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Dropdowns */
  [data-theme="gitea-auto"] .ui.dropdown .menu,
  [data-theme="gitea-auto"] .ui.selection.dropdown .menu {
    background-color: #161b22 !important;
    border-color: #30363d !important;
  }

  [data-theme="gitea-auto"] .ui.dropdown .menu > .item {
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.dropdown .menu > .item:hover {
    background-color: #21262d !important;
  }

  /* Auto dark mode - Menu items */
  [data-theme="gitea-auto"] .ui.menu {
    background-color: #0d1117 !important;
  }

  [data-theme="gitea-auto"] .ui.menu .item {
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.secondary.menu .item {
    color: #9198a1 !important;
  }

  [data-theme="gitea-auto"] .ui.secondary.menu .active.item {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Messages */
  [data-theme="gitea-auto"] .ui.message {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Footer */
  [data-theme="gitea-auto"] footer,
  [data-theme="gitea-auto"] .page-footer {
    background-color: #0d1117 !important;
    color: #9198a1 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Code blocks */
  [data-theme="gitea-auto"] pre,
  [data-theme="gitea-auto"] code,
  [data-theme="gitea-auto"] .code-view,
  [data-theme="gitea-auto"] .file-view {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Activity heatmap */
  [data-theme="gitea-auto"] .activity-heatmap,
  [data-theme="gitea-auto"] .heatmap-container {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Feed items */
  [data-theme="gitea-auto"] .feed .item,
  [data-theme="gitea-auto"] .feeds .item,
  [data-theme="gitea-auto"] .news .item {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Repository list */
  [data-theme="gitea-auto"] .repo-list .item,
  [data-theme="gitea-auto"] .repository-list .item {
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Issue/PR lists */
  [data-theme="gitea-auto"] .issue-list .item,
  [data-theme="gitea-auto"] .pulls .item {
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Timeline */
  [data-theme="gitea-auto"] .timeline .item,
  [data-theme="gitea-auto"] .comment {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Modals */
  [data-theme="gitea-auto"] .ui.modal {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.modal > .header {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  [data-theme="gitea-auto"] .ui.modal > .content {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .ui.modal > .actions {
    background-color: #161b22 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Diff view */
  [data-theme="gitea-auto"] .diff-file-box {
    background-color: #0d1117 !important;
    border-color: #30363d !important;
  }

  [data-theme="gitea-auto"] .diff-file-header {
    background-color: #161b22 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .lines-code,
  [data-theme="gitea-auto"] .lines-num {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Repo header breadcrumb */
  [data-theme="gitea-auto"] .repo-header {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .repo-header .repo-path {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - File list */
  [data-theme="gitea-auto"] .repo-file-list,
  [data-theme="gitea-auto"] #repo-files-table {
    background-color: #0d1117 !important;
    color: #e6edf3 !important;
    border-color: #30363d !important;
  }

  [data-theme="gitea-auto"] .repo-file-list tbody tr,
  [data-theme="gitea-auto"] #repo-files-table tbody tr {
    border-color: #21262d !important;
  }

  [data-theme="gitea-auto"] .repo-file-list tbody tr:hover,
  [data-theme="gitea-auto"] #repo-files-table tbody tr:hover {
    background-color: #161b22 !important;
  }

  /* Auto dark mode - Empty states */
  [data-theme="gitea-auto"] .empty-placeholder,
  [data-theme="gitea-auto"] .blankslate {
    color: #9198a1 !important;
    background-color: #0d1117 !important;
  }

  /* Auto dark mode - Tabs */
  [data-theme="gitea-auto"] .ui.tabular.menu .item {
    color: #9198a1 !important;
    background-color: transparent !important;
  }

  [data-theme="gitea-auto"] .ui.tabular.menu .active.item {
    color: #e6edf3 !important;
    background-color: #0d1117 !important;
    border-color: #30363d !important;
  }

  /* Auto dark mode - Sidebar sections */
  [data-theme="gitea-auto"] .repo-sidebar,
  [data-theme="gitea-auto"] .issue-sidebar,
  [data-theme="gitea-auto"] .dashboard-sidebar {
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Markdown content */
  [data-theme="gitea-auto"] .markup,
  [data-theme="gitea-auto"] .markdown {
    color: #e6edf3 !important;
  }

  [data-theme="gitea-auto"] .markup h1,
  [data-theme="gitea-auto"] .markup h2,
  [data-theme="gitea-auto"] .markup h3,
  [data-theme="gitea-auto"] .markup h4,
  [data-theme="gitea-auto"] .markup h5,
  [data-theme="gitea-auto"] .markup h6,
  [data-theme="gitea-auto"] .markdown h1,
  [data-theme="gitea-auto"] .markdown h2,
  [data-theme="gitea-auto"] .markdown h3,
  [data-theme="gitea-auto"] .markdown h4,
  [data-theme="gitea-auto"] .markdown h5,
  [data-theme="gitea-auto"] .markdown h6 {
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Branch selector */
  [data-theme="gitea-auto"] .branch-selector,
  [data-theme="gitea-auto"] .ref-selector {
    background-color: #21262d !important;
    color: #e6edf3 !important;
  }

  /* Auto dark mode - Commit list */
  [data-theme="gitea-auto"] .commit-list .item,
  [data-theme="gitea-auto"] .commits-list .item {
    color: #e6edf3 !important;
    border-color: #21262d !important;
  }

  /* Auto dark mode - Action buttons in headers */
  [data-theme="gitea-auto"] .repo-button-row {
    background-color: #0d1117 !important;
  }
}

/* ==========================================================================
   NEW REPOSITORY PAGE - GitHub Style
   ========================================================================== */

.gh-new-repo-container {
  max-width: 768px !important;
  padding: 24px 16px !important;
}

.gh-new-repo-title {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 4px !important;
}

.gh-new-repo-subtitle {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 24px !important;
}

.gh-link {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.gh-link:hover {
  text-decoration: underline !important;
}

/* Section styling */
.gh-section {
  background: var(--gh-canvas-overlay, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
  overflow: hidden !important;
}

.gh-section-header {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-default, #30363d) !important;
  background: var(--gh-canvas-subtle, #0d1117) !important;
}

.gh-section-number {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  background: var(--gh-neutral-muted, #848d97) !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.gh-section-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.gh-section-content {
  padding: 16px !important;
}

/* Form fields */
.gh-form-row {
  display: flex !important;
  align-items: flex-end !important;
  gap: 8px !important;
  margin-bottom: 4px !important;
}

.gh-form-field {
  display: flex !important;
  flex-direction: column !important;
}

.gh-owner-field {
  flex: 0 0 auto !important;
}

.gh-repo-name-field {
  flex: 1 !important;
}

.gh-separator {
  font-size: 20px !important;
  color: var(--gh-fg-muted) !important;
  padding-bottom: 8px !important;
}

.gh-label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.gh-required {
  color: var(--gh-danger-fg) !important;
}

.gh-optional {
  font-weight: 400 !important;
  color: var(--gh-fg-muted) !important;
}

.gh-input {
  width: 100% !important;
  height: 32px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  line-height: 20px !important;
  color: var(--gh-fg-default) !important;
  background-color: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium, 6px) !important;
  outline: none !important;
  box-shadow: var(--gh-shadow-inset) !important;
}

.gh-input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.gh-input::placeholder {
  color: var(--gh-fg-subtle) !important;
}

.gh-help-text {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 4px !important;
  margin-bottom: 16px !important;
}

.gh-suggestion-btn {
  background: none !important;
  border: none !important;
  color: var(--gh-accent-fg) !important;
  cursor: pointer !important;
  padding: 0 !important;
  font-size: 12px !important;
}

.gh-suggestion-btn:hover {
  text-decoration: underline !important;
}

.gh-description-field {
  margin-top: 8px !important;
}

.gh-char-count {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 4px !important;
}

/* Dropdown styling */
.gh-dropdown-trigger {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  height: 32px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium, 6px) !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.gh-dropdown-trigger:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

.gh-owner-dropdown,
.gh-visibility-dropdown,
.gh-template-dropdown,
.gh-select-dropdown {
  position: relative !important;
}

.gh-dropdown-menu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 100 !important;
  min-width: 200px !important;
  max-height: 300px !important;
  overflow-y: auto !important;
  margin-top: 4px !important;
  padding: 4px 0 !important;
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium, 6px) !important;
  box-shadow: var(--gh-shadow-lg) !important;
  display: none !important;
}

.gh-dropdown-menu.active,
.gh-dropdown-menu.gh-show {
  display: block !important;
}

.gh-loading {
  color: var(--gh-fg-muted) !important;
  font-style: italic !important;
}

.gh-dropdown-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
}

.gh-dropdown-item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.gh-dropdown-icon {
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.gh-avatar {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

/* Visibility dropdown */
.gh-visibility-trigger {
  min-width: 100px !important;
}

.gh-visibility-trigger.gh-public {
  background: rgba(46, 160, 67, 0.15) !important;
  border-color: rgba(46, 160, 67, 0.4) !important;
  color: var(--gh-success-fg) !important;
}

.gh-visibility-trigger.gh-private {
  background: rgba(187, 128, 9, 0.15) !important;
  border-color: rgba(187, 128, 9, 0.4) !important;
  color: var(--gh-attention-fg) !important;
}

.gh-visibility-icon {
  flex-shrink: 0 !important;
}

.gh-visibility-menu {
  min-width: 260px !important;
}

.gh-visibility-option {
  align-items: flex-start !important;
  padding: 12px 16px !important;
}

.gh-visibility-info {
  flex: 1 !important;
}

.gh-visibility-name {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
}

.gh-visibility-desc {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin: 2px 0 0 0 !important;
}

/* Config rows - Fixed layout for new repo page */
.gh-config-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: center !important;
  padding: 12px 0 !important;
  gap: 24px !important;
}

.gh-config-label {
  min-width: 0 !important;
}

.gh-config-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}

.gh-config-desc {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin: 4px 0 0 0 !important;
  line-height: 1.5 !important;
  max-width: none !important;
}

.gh-divider {
  border: none !important;
  border-top: 1px solid var(--gh-border-default) !important;
  margin: 12px 0 !important;
}

/* Toggle switch */
.gh-toggle {
  position: relative !important;
  display: inline-block !important;
  width: 44px !important;
  height: 24px !important;
  flex-shrink: 0 !important;
}

.gh-toggle input {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.gh-toggle-slider {
  position: absolute !important;
  cursor: pointer !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-color: var(--gh-neutral-muted) !important;
  border-radius: 12px !important;
  transition: 0.15s !important;
}

.gh-toggle-slider:before {
  position: absolute !important;
  content: "" !important;
  height: 20px !important;
  width: 20px !important;
  left: 2px !important;
  bottom: 2px !important;
  background-color: white !important;
  border-radius: 50% !important;
  transition: 0.15s !important;
}

.gh-toggle input:checked + .gh-toggle-slider {
  background-color: var(--gh-success-emphasis, #238636) !important;
}

.gh-toggle input:checked + .gh-toggle-slider:before {
  transform: translateX(20px) !important;
}

/* Select dropdown */
.gh-select-trigger {
  min-width: 140px !important;
  justify-content: space-between !important;
}

.gh-select-menu {
  min-width: 180px !important;
  right: 0 !important;
  left: auto !important;
}

.gh-select-text {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Template options */
.gh-template-units {
  padding: 12px 0 !important;
  border-top: 1px solid var(--gh-border-default) !important;
  margin-top: 12px !important;
}

.gh-template-options {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 8px !important;
}

.gh-checkbox-label {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
}

.gh-checkbox-label input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--gh-success-emphasis, #238636) !important;
}

/* Error message */
.gh-error-message {
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
  color: var(--gh-danger-fg) !important;
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.4) !important;
  border-radius: var(--radius-medium, 6px) !important;
  text-align: center !important;
}

/* Form actions */
.gh-form-actions {
  display: flex !important;
  justify-content: flex-end !important;
  margin-top: 16px !important;
}

.gh-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  border-radius: var(--radius-medium, 6px) !important;
  cursor: pointer !important;
  border: 1px solid transparent !important;
  transition: 0.1s !important;
}

.gh-btn-primary {
  background: var(--gh-btn-primary-bg, #238636) !important;
  border-color: var(--gh-btn-primary-border, #238636) !important;
  color: var(--gh-btn-primary-text, #ffffff) !important;
}

.gh-btn-primary:hover {
  background: var(--gh-btn-primary-hoverBg, #2ea043) !important;
  border-color: var(--gh-btn-primary-hoverBorder, #2ea043) !important;
}

.gh-btn-create {
  min-width: 150px !important;
}

/* New repo page - Fomantic UI dropdown overrides */
.new-repo-form .ui.selection.dropdown {
  background: var(--gh-btn-bg, #21262d) !important;
  border: 1px solid var(--gh-btn-border, #30363d) !important;
  border-radius: var(--radius-medium, 6px) !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  min-height: 32px !important;
  padding: 6px 12px !important;
  min-width: 140px !important;
}

.new-repo-form .ui.selection.dropdown:hover {
  background: var(--gh-btn-hover-bg, #30363d) !important;
  border-color: var(--gh-btn-hover-border, #9198a1) !important;
}

.new-repo-form .ui.selection.dropdown .text,
.new-repo-form .ui.selection.dropdown .default.text {
  color: var(--gh-fg-default, #e6edf3) !important;
}

.new-repo-form .ui.selection.dropdown .default.text {
  color: var(--gh-fg-muted, #8d96a0) !important;
}

.new-repo-form .ui.selection.dropdown .dropdown.icon {
  color: var(--gh-fg-muted, #8d96a0) !important;
}

.new-repo-form .ui.selection.dropdown .menu {
  background: var(--gh-canvas-overlay, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: var(--radius-medium, 6px) !important;
  box-shadow: var(--gh-shadow-lg, 0 8px 24px rgba(0, 0, 0, 0.5)) !important;
  max-height: 300px !important;
  margin-top: 4px !important;
}

.new-repo-form .ui.selection.dropdown .menu .item {
  background: transparent !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  padding: 8px 16px !important;
  border: none !important;
}

.new-repo-form .ui.selection.dropdown .menu .item:hover,
.new-repo-form .ui.selection.dropdown .menu .item.selected {
  background: var(--gh-actionListItem-default-hoverBg, rgba(177, 186, 196, 0.12)) !important;
}

.new-repo-form .ui.selection.dropdown .menu .item.active {
  background: var(--gh-actionListItem-default-selectedBg, rgba(177, 186, 196, 0.08)) !important;
  font-weight: 600 !important;
}

/* Owner dropdown avatar styling */
.new-repo-form .gh-owner-dropdown .truncated-item-container {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.new-repo-form .gh-owner-dropdown .mini.gh-avatar,
.new-repo-form .gh-owner-dropdown img.mini {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
}

/* Checkbox styling */
.new-repo-form .ui.checkbox {
  font-size: 14px !important;
}

.new-repo-form .ui.checkbox label {
  color: var(--gh-fg-default, #e6edf3) !important;
}

.new-repo-form .ui.checkbox input:checked ~ label:before {
  background: var(--gh-success-emphasis, #238636) !important;
  border-color: var(--gh-success-emphasis, #238636) !important;
}

/* Branch input */
.gh-branch-input {
  width: 200px !important;
  min-width: 150px !important;
}

/* Dropdowns in config rows */
.gh-config-row .ui.selection.dropdown,
.gh-config-row .gh-select-dropdown {
  min-width: 200px !important;
  width: 200px !important;
}

/* Checkbox in config rows */
.gh-config-row .inline.field {
  justify-self: end !important;
}

/* Visibility checkbox specific styling */
.gh-config-row .gh-visibility-checkbox {
  white-space: nowrap !important;
}

.gh-config-row .gh-visibility-checkbox label {
  white-space: nowrap !important;
}

/* ==========================================================================
   30. REPOSITORY HEADER - GitHub Style
   ========================================================================== */

/* Main header wrapper */
.gh-repo-header-wrapper {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

/* Header content area */
.gh-repo-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 0 !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
}

/* Repo title group - icon, name, badges */
.gh-repo-title-group {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}

.gh-repo-title-group .svg {
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.gh-repo-title {
  font-size: 20px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

.gh-repo-owner {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

.gh-repo-owner:hover {
  text-decoration: underline !important;
}

.gh-repo-separator {
  color: var(--gh-fg-muted) !important;
  margin: 0 4px !important;
}

.gh-repo-name {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

.gh-repo-name:hover {
  text-decoration: underline !important;
}

/* Visibility badges */
.gh-visibility-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 2em !important;
  color: var(--gh-fg-muted) !important;
  white-space: nowrap !important;
  margin-left: 4px !important;
}

.gh-visibility-badge.gh-public {
  border-color: var(--gh-border-default) !important;
}

.gh-visibility-badge.gh-internal {
  border-color: var(--gh-attention-emphasis) !important;
  color: var(--gh-attention-fg) !important;
}

.gh-visibility-badge.gh-archived {
  border-color: var(--gh-attention-emphasis) !important;
  color: var(--gh-attention-fg) !important;
}

.gh-visibility-badge.gh-template {
  border-color: var(--gh-done-emphasis) !important;
  color: var(--gh-done-fg) !important;
}

/* Repository actions - Watch/Fork/Star buttons */
.gh-repo-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* Button group container */
.gh-button-group {
  display: inline-flex !important;
  align-items: stretch !important;
}

/* Base button styles */
.gh-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  white-space: nowrap !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: var(--radius-medium) !important;
  background: var(--gh-btn-bg) !important;
  color: var(--gh-btn-text) !important;
  cursor: pointer !important;
  transition: 0.1s ease-in-out !important;
}

.gh-btn:hover {
  background: var(--gh-btn-hoverBg) !important;
  border-color: var(--gh-btn-hoverBorder) !important;
}

.gh-btn .svg {
  flex-shrink: 0 !important;
}

/* Small button variant */
.gh-btn-sm {
  padding: 3px 12px !important;
  font-size: 12px !important;
  line-height: 20px !important;
}

/* Button within button group - remove right border radius */
.gh-button-group > .gh-btn:first-child:not(:last-child),
.gh-button-group > .gh-watch-dropdown > .gh-btn:first-child,
.gh-button-group > form > .gh-btn:first-child {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* Count badge attached to button */
.gh-btn-count {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 20px !important;
  color: var(--gh-btn-text) !important;
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-left: none !important;
  border-top-right-radius: var(--radius-medium) !important;
  border-bottom-right-radius: var(--radius-medium) !important;
  transition: 0.1s ease-in-out !important;
}

.gh-btn-count:hover {
  color: var(--gh-accent-fg) !important;
}

/* Starred button state */
.gh-btn.gh-starred {
  color: var(--gh-attention-fg) !important;
}

.gh-btn.gh-starred .svg {
  color: var(--gh-attention-fg) !important;
}

/* Watch dropdown */
.gh-watch-dropdown {
  position: relative !important;
  display: inline-flex !important;
}

.gh-dropdown-caret {
  margin-left: 4px !important;
  opacity: 0.8 !important;
}

.gh-watch-menu {
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  z-index: 100 !important;
  min-width: 300px !important;
  margin-top: 4px !important;
  padding: 0 !important;
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: var(--radius-medium) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
  display: none !important;
}

.gh-watch-menu.active,
.gh-watch-dropdown:focus-within .gh-watch-menu {
  display: block !important;
}

.gh-watch-menu .gh-dropdown-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  cursor: pointer !important;
  border: none !important;
  background: transparent !important;
  width: 100% !important;
  text-align: left !important;
}

.gh-watch-menu .gh-dropdown-item:hover {
  background: var(--gh-navitem-hoverBg) !important;
}

.gh-dropdown-item-content {
  flex: 1 !important;
}

.gh-dropdown-item-content strong {
  display: block !important;
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

.gh-dropdown-item-content span {
  display: block !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  margin-top: 2px !important;
}

/* Fork/mirror info bar */
.gh-repo-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 0 !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.gh-repo-meta .svg {
  color: var(--gh-fg-muted) !important;
}

.gh-repo-meta a {
  color: var(--gh-accent-fg) !important;
}

.gh-repo-meta a:hover {
  text-decoration: underline !important;
}

/* Transfer bar */
.gh-repo-transfer-bar {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 16px !important;
  margin-top: 8px !important;
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-radius: var(--radius-medium) !important;
  font-size: 14px !important;
  color: var(--gh-attention-fg) !important;
}

.gh-btn-danger {
  background: var(--gh-danger-emphasis) !important;
  border-color: var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

.gh-btn-danger:hover {
  background: #da3633 !important;
}

/* ==========================================================================
   31. REPOSITORY UNDERLINE NAVIGATION - GitHub Style
   ========================================================================== */

.gh-repo-nav-wrapper {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  overflow-x: auto !important;
}

.gh-underline-nav {
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.gh-underline-nav-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 30px !important;
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  border-bottom: 2px solid transparent !important;
  transition: border-color 0.1s ease-in-out !important;
}

.gh-underline-nav-item:hover {
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
  border-bottom-color: var(--gh-neutral-muted) !important;
}

.gh-underline-nav-item.gh-selected {
  font-weight: 600 !important;
  border-bottom-color: var(--gh-primer-fg-open) !important;
}

.gh-underline-nav-item .svg {
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.gh-underline-nav-item.gh-selected .svg {
  color: var(--gh-fg-default) !important;
}

/* Counter badge for tabs */
.gh-counter {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 20px !important;
  padding: 0 6px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  background: var(--gh-neutral-muted) !important;
  border-radius: 2em !important;
  color: var(--gh-fg-default) !important;
}

/* ==========================================================================
   32. MOBILE RESPONSIVE FIXES
   ========================================================================== */

@media (max-width: 768px) {
  .gh-repo-header {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .gh-repo-actions {
    width: 100% !important;
    justify-content: flex-start !important;
  }

  .gh-underline-nav {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .gh-underline-nav-item {
    padding: 8px 12px !important;
  }
}

/* ==========================================================================
   PHASE 2.3: REPOSITORY HOME - GitHub Style Enhancements
   ========================================================================== */

/* ---------------------------------------------------------------------------
   File List (repo-files-table) - GitHub Style
   --------------------------------------------------------------------------- */

#repo-files-table {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  background: var(--gh-canvas-default) !important;
  overflow: hidden !important;
}

/* Latest commit header bar */
#repo-files-table .repo-file-last-commit {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

#repo-files-table .repo-file-last-commit .latest-commit {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .avatar {
  flex-shrink: 0 !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .author-wrapper {
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .author-wrapper:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .commit-summary {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  flex: 1 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .commit-summary .message-wrapper {
  color: var(--gh-fg-muted) !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .commit-summary .message-wrapper a {
  color: var(--gh-fg-muted) !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .commit-summary .message-wrapper a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .ellipsis-button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  margin-left: 4px !important;
  cursor: pointer !important;
  color: var(--gh-fg-muted) !important;
}

#repo-files-table .repo-file-last-commit .latest-commit .ellipsis-button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Time ago in latest commit bar */
#repo-files-table .repo-file-last-commit > div:last-child {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

/* Parent directory link (..) */
#repo-files-table .parent-link {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  border-top: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

#repo-files-table .parent-link:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-accent-fg) !important;
}

/* File rows */
#repo-files-table .repo-file-item:hover > .repo-file-cell {
  background: var(--gh-canvas-subtle) !important;
}

#repo-files-table .repo-file-cell {
  padding: 8px 16px !important;
  border-top: 1px solid var(--gh-border-default) !important;
  font-size: 14px !important;
  background: var(--gh-canvas-default) !important;
}

#repo-files-table .repo-file-cell.name {
  gap: 10px !important;
}

#repo-files-table .repo-file-cell.name .svg {
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

#repo-files-table .repo-file-cell.name a.entry-name,
#repo-files-table .repo-file-cell.name span.entry-name {
  color: var(--gh-accent-fg) !important;
  font-weight: 400 !important;
}

#repo-files-table .repo-file-cell.name a.entry-name:hover {
  text-decoration: underline !important;
}

#repo-files-table .repo-file-cell.message {
  color: var(--gh-fg-muted) !important;
}

#repo-files-table .repo-file-cell.message a {
  color: var(--gh-fg-muted) !important;
}

#repo-files-table .repo-file-cell.message a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

#repo-files-table .repo-file-cell.age {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

/* ---------------------------------------------------------------------------
   Clone Panel - GitHub Style
   --------------------------------------------------------------------------- */

.clone-panel-popup {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  padding: 0 !important;
  min-width: 320px !important;
}

.clone-panel-popup .clone-panel-field {
  padding: 12px 16px !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.clone-panel-popup .clone-panel-field .svg {
  color: var(--gh-fg-muted) !important;
}

.clone-panel-popup .clone-panel-tab {
  display: flex !important;
  padding: 0 16px !important;
  gap: 0 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  margin: 0 !important;
}

.clone-panel-popup .clone-panel-tab .item {
  padding: 8px 16px !important;
  background: none !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -1px !important;
  transition: border-color 0.1s ease !important;
}

.clone-panel-popup .clone-panel-tab .item:hover {
  color: var(--gh-fg-default) !important;
}

.clone-panel-popup .clone-panel-tab .item.active {
  color: var(--gh-fg-default) !important;
  border-bottom-color: var(--gh-primer-fg-open) !important;
  font-weight: 600 !important;
}

.clone-panel-popup .clone-panel-field .ui.input {
  width: 100% !important;
}

.clone-panel-popup .clone-panel-field .ui.input input {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 0 0 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  padding: 5px 12px !important;
}

.clone-panel-popup .clone-panel-field .ui.input .button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-left: none !important;
  border-radius: 0 6px 6px 0 !important;
  color: var(--gh-fg-muted) !important;
}

.clone-panel-popup .clone-panel-field .ui.input .button:hover {
  background: var(--gh-btn-hover-bg) !important;
  color: var(--gh-fg-default) !important;
}

.clone-panel-popup .clone-panel-list {
  padding: 8px !important;
  margin: 0 !important;
}

.clone-panel-popup .clone-panel-list .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 8px !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  margin: 0 !important;
}

.clone-panel-popup .clone-panel-list .item:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

.clone-panel-popup .clone-panel-list .item .svg {
  color: var(--gh-fg-muted) !important;
}

.clone-panel-popup .divider {
  border-top: 1px solid var(--gh-border-default) !important;
  margin: 0 !important;
}

/* Clone button (Code button) - GitHub green style */
.js-btn-clone-panel {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  cursor: pointer !important;
  transition: background-color 0.1s ease !important;
}

.js-btn-clone-panel:hover {
  background: var(--gh-btn-primary-hover-bg) !important;
}

.js-btn-clone-panel .svg {
  margin-right: 4px !important;
}

.js-btn-clone-panel .dropdown.icon {
  margin-left: 4px !important;
  font-size: 10px !important;
}

/* ---------------------------------------------------------------------------
   About Sidebar - GitHub Style
   --------------------------------------------------------------------------- */

.repo-home-sidebar-top {
  padding-left: 16px !important;
}

.repo-home-sidebar-top .flex-item {
  padding: 0 !important;
  border: none !important;
}

.repo-home-sidebar-top .flex-item-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.repo-home-sidebar-top .repo-description {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.5 !important;
}

.repo-home-sidebar-top .flex-text-block {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.repo-home-sidebar-top .flex-text-block .svg {
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.repo-home-sidebar-top .flex-text-block a,
.repo-home-sidebar-top .flex-text-block span.tw-text-primary {
  color: var(--gh-accent-fg) !important;
}

.repo-home-sidebar-top .flex-text-block a:hover {
  text-decoration: underline !important;
}

/* Topic badges */
.repo-topic {
  display: inline-flex !important;
  align-items: center !important;
  background: var(--gh-accent-subtle) !important;
  border: none !important;
  border-radius: 2em !important;
  padding: 0 10px !important;
  height: 24px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
  transition: background-color 0.1s ease !important;
}

.repo-topic:hover {
  background: var(--gh-accent-emphasis) !important;
  color: #fff !important;
}

/* Manage topics button */
#manage_topic {
  background: none !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  cursor: pointer !important;
  padding: 0 !important;
}

#manage_topic:hover {
  color: var(--gh-accent-fg) !important;
}

/* ---------------------------------------------------------------------------
   Branch Selector Dropdown - GitHub Style
   --------------------------------------------------------------------------- */

#branch-dropdown,
.branch-dropdown-btn {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  cursor: pointer !important;
}

#branch-dropdown:hover,
.branch-dropdown-btn:hover {
  background: var(--gh-btn-hover-bg) !important;
}

#branch-dropdown .svg,
.branch-dropdown-btn .svg {
  color: var(--gh-fg-muted) !important;
}

/* Branch dropdown menu */
.branch-dropdown-popup {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  min-width: 300px !important;
  max-height: 400px !important;
  overflow: hidden !important;
}

/* ---------------------------------------------------------------------------
   Add File Dropdown - GitHub Style
   --------------------------------------------------------------------------- */

.repo-add-file-dropdown .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
}

.repo-add-file-dropdown .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* ---------------------------------------------------------------------------
   Breadcrumb Path - GitHub Style
   --------------------------------------------------------------------------- */

.repo-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 16px !important;
}

.repo-breadcrumb a {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

.repo-breadcrumb a:hover {
  text-decoration: underline !important;
}

.repo-breadcrumb .breadcrumb-divider {
  color: var(--gh-fg-muted) !important;
}

/* ---------------------------------------------------------------------------
   Go to File Button - GitHub Style
   --------------------------------------------------------------------------- */

.repo-file-search-container button,
.repo-file-search-container a {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-btn-border) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  cursor: pointer !important;
  text-decoration: none !important;
}

.repo-file-search-container button:hover,
.repo-file-search-container a:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* ---------------------------------------------------------------------------
   README Section - GitHub Style
   --------------------------------------------------------------------------- */

.readme-container,
.markup-container {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  margin-top: 16px !important;
  overflow: hidden !important;
}

.readme-header,
.markup-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 10px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.readme-header h4,
.markup-header h4 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
}

.readme-header .svg,
.markup-header .svg {
  color: var(--gh-fg-muted) !important;
}

.readme-content,
.markup-content {
  padding: 16px !important;
}

/* ---------------------------------------------------------------------------
   Commit Status Icons - GitHub Style
   --------------------------------------------------------------------------- */

.commit-status-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

.commit-status-icon.success {
  background: var(--gh-success-emphasis) !important;
  color: #fff !important;
}

.commit-status-icon.pending {
  background: var(--gh-attention-emphasis) !important;
  color: #fff !important;
}

.commit-status-icon.failure {
  background: var(--gh-danger-emphasis) !important;
  color: #fff !important;
}

/* ---------------------------------------------------------------------------
   File Icons - GitHub Style Colors
   --------------------------------------------------------------------------- */

#repo-files-table .svg.octicon-file-directory,
#repo-files-table .svg.octicon-file-directory-fill,
#repo-files-table .svg.octicon-file-directory-open-fill {
  color: var(--gh-accent-fg) !important;
}

#repo-files-table .svg.octicon-file-submodule {
  color: var(--gh-fg-muted) !important;
}

/* ---------------------------------------------------------------------------
   Repository Button Groups - Consistent Sizing
   --------------------------------------------------------------------------- */

.repo-button-group {
  display: inline-flex !important;
  align-items: stretch !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.repo-button-group > * {
  border-radius: 0 !important;
}

.repo-button-group > *:first-child {
  border-radius: 6px 0 0 6px !important;
}

.repo-button-group > *:last-child {
  border-radius: 0 6px 6px 0 !important;
}

.repo-button-group > *:only-child {
  border-radius: 6px !important;
}

/* ---------------------------------------------------------------------------
   Repository Action Bar - GitHub Style
   --------------------------------------------------------------------------- */

.repo-action-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
}

.repo-action-bar-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.repo-action-bar-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* ---------------------------------------------------------------------------
   Empty Repository Message - GitHub Style
   --------------------------------------------------------------------------- */

.empty-repo-message {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 32px !important;
  text-align: center !important;
  background: var(--gh-canvas-default) !important;
}

.empty-repo-message h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.empty-repo-message p {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

/* ---------------------------------------------------------------------------
   Setup Instructions - GitHub Style
   --------------------------------------------------------------------------- */

.setup-instructions {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  background: var(--gh-canvas-default) !important;
  margin-top: 16px !important;
}

.setup-instructions-header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 12px 16px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.setup-instructions pre {
  margin: 0 !important;
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  line-height: 1.5 !important;
  overflow-x: auto !important;
}

.setup-instructions code {
  font-family: inherit !important;
  font-size: inherit !important;
}

/* ---------------------------------------------------------------------------
   Branch Selector Dropdown - GitHub Style (actual class names)
   --------------------------------------------------------------------------- */

.branch-selector-dropdown,
.branch-selector-dropdown .branch-dropdown-button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  cursor: pointer !important;
  height: auto !important;
  min-height: 32px !important;
}

.branch-selector-dropdown:hover,
.branch-selector-dropdown .branch-dropdown-button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.branch-selector-dropdown .svg,
.branch-selector-dropdown .dropdown.icon {
  color: var(--gh-fg-muted) !important;
}

.branch-selector-dropdown .flex-text-block {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.branch-selector-dropdown strong {
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

/* ---------------------------------------------------------------------------
   Add File Dropdown - GitHub Style (actual class names)
   --------------------------------------------------------------------------- */

.repo-add-file {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  min-height: 32px !important;
}

.repo-add-file:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.repo-add-file .dropdown.icon {
  color: var(--gh-fg-muted) !important;
}

.repo-add-file > .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  padding: 8px 0 !important;
  margin-top: 4px !important;
  min-width: 200px !important;
}

.repo-add-file > .menu .item {
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  display: flex !important;
  align-items: center !important;
}

.repo-add-file > .menu .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* ---------------------------------------------------------------------------
   Repo Button Row - GitHub Style Enhanced
   --------------------------------------------------------------------------- */

.repo-button-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 16px 0 !important;
  padding: 0 !important;
}

.repo-button-row-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  flex: 1 !important;
  min-width: 0 !important;
}

.repo-button-row-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* All buttons in repo-button-row */
.repo-button-row .ui.button,
.repo-button-row .ui.compact.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  min-height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.repo-button-row .ui.button:hover,
.repo-button-row .ui.compact.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.repo-button-row .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.repo-button-row .ui.primary.button:hover {
  background: var(--gh-btn-primary-hover-bg) !important;
}

/* Breadcrumb in repo button row */
.repo-button-row .breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  font-size: 16px !important;
  margin-left: 8px !important;
}

.repo-button-row .breadcrumb .section a,
.repo-button-row .breadcrumb a.section {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.repo-button-row .breadcrumb .section a:hover,
.repo-button-row .breadcrumb a.section:hover {
  text-decoration: underline !important;
}

.repo-button-row .breadcrumb .breadcrumb-divider {
  color: var(--gh-fg-muted) !important;
  margin: 0 2px !important;
}

.repo-button-row .breadcrumb .active.section {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* New PR button */
#new-pull-request {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 10px !important;
  color: var(--gh-fg-default) !important;
}

#new-pull-request:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* ---------------------------------------------------------------------------
   File Search Container - GitHub Style
   --------------------------------------------------------------------------- */

.repo-file-search-container .ui.input input {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 5px 12px !important;
}

.repo-file-search-container .ui.input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* ===========================================================================
   PHASE 2.4: FILE VIEWER - GitHub Style
   =========================================================================== */

/* File commit box */
#repo-file-commit-box {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 10px 16px !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#repo-file-commit-box .latest-commit {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex: 1 !important;
  min-width: 0 !important;
}

#repo-file-commit-box .age {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  white-space: nowrap !important;
}

/* File header */
.file-header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
}

.file-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.file-header-left .svg {
  color: var(--gh-fg-muted) !important;
}

.file-header-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* File action buttons */
.file-header-right .ui.buttons {
  border-radius: 6px !important;
  overflow: hidden !important;
}

.file-header-right .ui.buttons .button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  padding: 5px 10px !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

.file-header-right .ui.buttons .button:first-child {
  border-radius: 6px 0 0 6px !important;
}

.file-header-right .ui.buttons .button:last-child {
  border-radius: 0 6px 6px 0 !important;
  border-left: none !important;
}

.file-header-right .ui.buttons .button:not(:first-child) {
  border-left: none !important;
}

.file-header-right .ui.buttons .button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.file-header-right .ui.buttons .button.active {
  background: var(--gh-btn-active-bg) !important;
}

/* Icon buttons (download, copy, edit, delete) */
.btn-octicon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  transition: all 0.1s ease !important;
}

.btn-octicon:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

.btn-octicon.disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

.btn-octicon-danger:hover {
  background: var(--gh-danger-subtle) !important;
  color: var(--gh-danger-fg) !important;
}

/* File view toggle buttons */
.file-view-toggle-buttons {
  border-radius: 6px !important;
  overflow: hidden !important;
  border: 1px solid var(--gh-border-default) !important;
}

.file-view-toggle-buttons .button {
  background: var(--gh-btn-bg) !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 5px 8px !important;
  margin: 0 !important;
}

.file-view-toggle-buttons .button:hover {
  background: var(--gh-btn-hover-bg) !important;
  color: var(--gh-fg-default) !important;
}

.file-view-toggle-buttons .button.active {
  background: var(--gh-btn-active-bg) !important;
  color: var(--gh-fg-default) !important;
}

/* Code view container */
.non-diff-file-content .ui.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Code table */
.code-view table {
  width: 100% !important;
  border-collapse: collapse !important;
}

.code-view table tr {
  border: none !important;
}

.code-view table tr:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Line numbers */
.code-view .lines-num {
  min-width: 50px !important;
  padding: 0 16px 0 16px !important;
  text-align: right !important;
  background: var(--gh-canvas-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  user-select: none !important;
  vertical-align: top !important;
  line-height: 20px !important;
  border-right: 1px solid var(--gh-border-default) !important;
}

.code-view .lines-num span {
  cursor: pointer !important;
}

.code-view .lines-num span::before {
  content: attr(data-line-number) !important;
}

.code-view .lines-num span:hover::before {
  color: var(--gh-accent-fg) !important;
}

/* Code content */
.code-view .lines-code {
  padding: 0 16px !important;
  vertical-align: top !important;
  line-height: 20px !important;
}

.code-view .lines-code .code-inner {
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
  white-space: pre !important;
  word-wrap: normal !important;
  overflow: visible !important;
  display: block !important;
  line-height: 20px !important;
}

/* Escape button column */
.code-view .lines-escape {
  padding: 0 !important;
  width: 20px !important;
  text-align: center !important;
  vertical-align: top !important;
}

/* Markdown/Rendered view */
.file-view.markup {
  padding: 16px !important;
  background: var(--gh-canvas-default) !important;
}

/* Plain text view */
.file-view.plain-text {
  padding: 16px !important;
  background: var(--gh-canvas-default) !important;
}

.file-view.plain-text pre {
  margin: 0 !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  line-height: 20px !important;
  color: var(--gh-fg-default) !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
}

/* Raw file view (images, video, audio) */
.view-raw {
  padding: 32px !important;
  text-align: center !important;
  background: var(--gh-canvas-default) !important;
}

.view-raw img {
  max-width: 100% !important;
  height: auto !important;
  border-radius: 6px !important;
}

.view-raw video,
.view-raw audio {
  max-width: 100% !important;
  border-radius: 6px !important;
}

/* File too large message */
.file-view-raw-prompt {
  text-align: center !important;
  padding: 32px !important;
}

.file-view-raw-prompt a {
  color: var(--gh-accent-fg) !important;
}

/* Line context menu */
.code-line-menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  padding: 8px 0 !important;
  min-width: 200px !important;
}

.code-line-menu .item {
  display: block !important;
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  cursor: pointer !important;
}

.code-line-menu .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Unicode escape prompt */
.ui.message.unicode-escape-prompt {
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-emphasis) !important;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  color: var(--gh-attention-fg) !important;
}

/* ==========================================================================
   PHASE 3.1: ISSUE LIST STYLING - GitHub-style
   ========================================================================== */

/* Issue List Page Container */
.page-content.issue-list .ui.container {
  max-width: 1280px !important;
  padding: 0 16px !important;
}

/* Issue List Header - Search, Labels, Milestones, New Issue buttons */
.issue-list .list-header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 16px 0 !important;
  flex-wrap: wrap !important;
}

.issue-list .list-header .ui.small.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  transition: background 80ms cubic-bezier(0.33, 1, 0.68, 1), border-color 80ms cubic-bezier(0.33, 1, 0.68, 1) !important;
}

.issue-list .list-header .ui.small.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

.issue-list .list-header .ui.small.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.issue-list .list-header .ui.small.primary.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
  border-color: var(--gh-btn-primary-hoverBorder) !important;
}

/* Issue Search Input */
.issue-list .issue-search-input,
.issue-list #issue-search-input {
  flex: 1 !important;
  min-width: 200px !important;
  max-width: 500px !important;
  position: relative !important;
}

.issue-list .issue-search-input input,
.issue-list #issue-search-input input {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  padding-left: 32px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 20px !important;
}

.issue-list .issue-search-input input:focus,
.issue-list #issue-search-input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.issue-list .issue-search-input .icon,
.issue-list #issue-search-input .icon {
  position: absolute !important;
  left: 10px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: var(--gh-fg-muted) !important;
}

/* Issue List Toolbar (Filters Bar) */
.issue-list-toolbar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.issue-list-toolbar-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.issue-list-toolbar-right {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* Open/Closed Counter Menu */
.issue-list-toolbar .small-menu-items {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.issue-list-toolbar .small-menu-items .item {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  text-decoration: none !important;
}

.issue-list-toolbar .small-menu-items .item:hover {
  color: var(--gh-fg-default) !important;
}

.issue-list-toolbar .small-menu-items .item.active {
  color: var(--gh-fg-default) !important;
}

.issue-list-toolbar .small-menu-items .item svg {
  width: 16px !important;
  height: 16px !important;
}

/* Filter Dropdown Buttons */
.issue-list-toolbar .ui.dropdown {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
}

.issue-list-toolbar .ui.dropdown:hover {
  color: var(--gh-fg-default) !important;
}

.issue-list-toolbar .ui.dropdown .text {
  color: inherit !important;
  font-weight: 500 !important;
}

.issue-list-toolbar .ui.dropdown > .dropdown.icon {
  margin-left: 4px !important;
}

/* Filter Dropdown Menu */
.issue-list-toolbar .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.5) !important;
  padding: 4px 0 !important;
  min-width: 200px !important;
  max-height: 400px !important;
  overflow-y: auto !important;
}

.issue-list-toolbar .ui.dropdown .menu .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  border-radius: 0 !important;
  cursor: pointer !important;
}

.issue-list-toolbar .ui.dropdown .menu .item:hover {
  background: var(--gh-navitem-hoverBg) !important;
}

.issue-list-toolbar .ui.dropdown .menu .item.active,
.issue-list-toolbar .ui.dropdown .menu .item.selected {
  font-weight: 600 !important;
  background: transparent !important;
}

.issue-list-toolbar .ui.dropdown .menu .item.active::before,
.issue-list-toolbar .ui.dropdown .menu .item.selected::before {
  content: "✓" !important;
  margin-right: 8px !important;
  color: var(--gh-fg-default) !important;
}

.issue-list-toolbar .ui.dropdown .menu .divider {
  margin: 4px 0 !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

.issue-list-toolbar .ui.dropdown .menu .header {
  padding: 8px 16px 4px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.issue-list-toolbar .ui.dropdown .menu .ui.search.input {
  margin: 8px !important;
  width: calc(100% - 16px) !important;
}

.issue-list-toolbar .ui.dropdown .menu .ui.search.input input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 8px !important;
  padding-left: 28px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
}

.issue-list-toolbar .ui.dropdown .menu .ui.search.input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Issue List Container */
#issue-list,
.flex-list {
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  background: var(--gh-canvas-default) !important;
}

/* When toolbar is hidden and this is the first element */
#issue-list:first-child,
.flex-list:first-child {
  border-top: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
}

/* Issue List Item */
#issue-list .flex-item,
.flex-list .flex-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  transition: background 100ms ease !important;
}

#issue-list .flex-item:last-child,
.flex-list .flex-item:last-child {
  border-bottom: none !important;
}

#issue-list .flex-item:hover,
.flex-list .flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Issue Item Leading (Checkbox + Icon) */
#issue-list .flex-item-leading,
.flex-list .flex-item-leading {
  display: flex !important;
  align-items: flex-start !important;
  padding-top: 2px !important;
}

#issue-list .flex-item-leading .issue-checkbox,
.flex-list .flex-item-leading .issue-checkbox {
  width: 16px !important;
  height: 16px !important;
  margin-right: 8px !important;
  accent-color: var(--gh-accent-emphasis) !important;
}

/* Issue State Icon */
#issue-list .flex-item-leading svg,
.flex-list .flex-item-leading svg {
  width: 16px !important;
  height: 16px !important;
}

/* Open Issue Icon - Green */
#issue-list .flex-item-leading .octicon-issue-opened,
.flex-list .flex-item-leading .octicon-issue-opened {
  color: var(--gh-success-fg) !important;
}

/* Closed Issue Icon - Purple */
#issue-list .flex-item-leading .octicon-issue-closed,
.flex-list .flex-item-leading .octicon-issue-closed {
  color: var(--gh-done-emphasis) !important;
}

/* Open PR Icon - Green */
#issue-list .flex-item-leading .octicon-git-pull-request,
.flex-list .flex-item-leading .octicon-git-pull-request {
  color: var(--gh-success-fg) !important;
}

/* Merged PR Icon - Purple */
#issue-list .flex-item-leading .octicon-git-merge,
.flex-list .flex-item-leading .octicon-git-merge {
  color: var(--gh-done-emphasis) !important;
}

/* Closed PR Icon - Red */
#issue-list .flex-item-leading .octicon-git-pull-request-closed,
.flex-list .flex-item-leading .octicon-git-pull-request-closed {
  color: var(--gh-danger-fg) !important;
}

/* Issue Item Main Content */
#issue-list .flex-item-main,
.flex-list .flex-item-main {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Issue Title Row */
#issue-list .flex-item-header,
.flex-list .flex-item-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 8px !important;
  margin-bottom: 4px !important;
}

/* Issue Title */
#issue-list .flex-item-title,
.flex-list .flex-item-title {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

#issue-list .flex-item-title .issue-title,
.flex-list .flex-item-title .issue-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.4 !important;
  word-break: break-word !important;
}

#issue-list .flex-item-title .issue-title:hover,
.flex-list .flex-item-title .issue-title:hover {
  color: var(--gh-accent-fg) !important;
}

/* Issue Labels */
#issue-list .labels-list,
.flex-list .labels-list {
  display: inline-flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

#issue-list .labels-list a,
.flex-list .labels-list a {
  text-decoration: none !important;
}

#issue-list .labels-list .label,
.flex-list .labels-list .label {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  border-radius: 2em !important;
  white-space: nowrap !important;
}

/* Issue Meta Info */
#issue-list .flex-item-body,
.flex-list .flex-item-body {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  line-height: 1.5 !important;
}

#issue-list .flex-item-body a,
.flex-list .flex-item-body a {
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

#issue-list .flex-item-body a:hover,
.flex-list .flex-item-body a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

#issue-list .flex-item-body .index,
.flex-list .flex-item-body .index {
  color: var(--gh-fg-muted) !important;
}

/* Branch Pills in PR List */
#issue-list .branches,
.flex-list .branches {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#issue-list .branches .branch,
.flex-list .branches .branch {
  display: inline-flex !important;
  align-items: center !important;
}

#issue-list .branches .branch a,
.flex-list .branches .branch a {
  display: inline-flex !important;
  align-items: center !important;
  padding: 2px 6px !important;
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.1)) !important;
  color: var(--gh-accent-fg) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  text-decoration: none !important;
}

#issue-list .branches .branch a:hover,
.flex-list .branches .branch a:hover {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

#issue-list .branches svg,
.flex-list .branches svg {
  color: var(--gh-fg-muted) !important;
}

/* Milestone, Project, Ref badges */
#issue-list .flex-item-body .milestone,
#issue-list .flex-item-body .project,
#issue-list .flex-item-body .ref,
.flex-list .flex-item-body .milestone,
.flex-list .flex-item-body .project,
.flex-list .flex-item-body .ref {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
}

#issue-list .flex-item-body .milestone svg,
#issue-list .flex-item-body .project svg,
#issue-list .flex-item-body .ref svg,
.flex-list .flex-item-body .milestone svg,
.flex-list .flex-item-body .project svg,
.flex-list .flex-item-body .ref svg {
  flex-shrink: 0 !important;
}

/* Checklist progress */
#issue-list .checklist,
.flex-list .checklist {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#issue-list .checklist progress,
.flex-list .checklist progress {
  width: 50px !important;
  height: 5px !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  background: var(--gh-neutral-muted) !important;
}

#issue-list .checklist progress::-webkit-progress-bar,
.flex-list .checklist progress::-webkit-progress-bar {
  background: var(--gh-neutral-muted) !important;
  border-radius: 3px !important;
}

#issue-list .checklist progress::-webkit-progress-value,
.flex-list .checklist progress::-webkit-progress-value {
  background: var(--gh-success-emphasis) !important;
  border-radius: 3px !important;
}

#issue-list .checklist progress::-moz-progress-bar,
.flex-list .checklist progress::-moz-progress-bar {
  background: var(--gh-success-emphasis) !important;
  border-radius: 3px !important;
}

/* Due Date */
#issue-list .due-date,
.flex-list .due-date {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#issue-list .due-date .text.red,
.flex-list .due-date .text.red {
  color: var(--gh-danger-fg) !important;
}

/* PR Review Status */
#issue-list .approvals,
.flex-list .approvals {
  color: var(--gh-success-fg) !important;
}

#issue-list .rejects,
.flex-list .rejects {
  color: var(--gh-danger-fg) !important;
}

#issue-list .waiting,
.flex-list .waiting {
  color: var(--gh-fg-muted) !important;
}

#issue-list .conflicting,
.flex-list .conflicting {
  color: var(--gh-danger-fg) !important;
}

/* Tracked Time */
#issue-list .flex-item-header .text.grey,
.flex-list .flex-item-header .text.grey {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

/* Issue Item Trailing (Assignees + Comments) */
#issue-list .flex-item-trailing,
.flex-list .flex-item-trailing {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-shrink: 0 !important;
}

/* Assignee Avatars */
#issue-list .flex-item-trailing .assignee,
.flex-list .flex-item-trailing .assignee {
  display: inline-flex !important;
  align-items: center !important;
  margin-left: -4px !important;
}

#issue-list .flex-item-trailing .assignee:first-child,
.flex-list .flex-item-trailing .assignee:first-child {
  margin-left: 0 !important;
}

#issue-list .flex-item-trailing .assignee img,
#issue-list .flex-item-trailing .assignee .avatar,
.flex-list .flex-item-trailing .assignee img,
.flex-list .flex-item-trailing .assignee .avatar {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
  border: 2px solid var(--gh-canvas-default) !important;
}

/* Comment Count */
#issue-list .flex-item-trailing a.muted,
.flex-list .flex-item-trailing a.muted {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

#issue-list .flex-item-trailing a.muted:hover,
.flex-list .flex-item-trailing a.muted:hover {
  color: var(--gh-accent-fg) !important;
}

#issue-list .flex-item-trailing a.muted svg,
.flex-list .flex-item-trailing a.muted svg {
  width: 16px !important;
  height: 16px !important;
}

/* Empty State */
#issue-list .tw-text-center,
.flex-list .tw-text-center {
  padding: 64px 32px !important;
  color: var(--gh-fg-muted) !important;
}

#issue-list .tw-text-center h3,
.flex-list .tw-text-center h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

/* Pinned Issues Section */
#issue-pins {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
  gap: 16px !important;
  padding: 16px 0 !important;
  margin-bottom: 16px !important;
}

#issue-pins .issue-card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  transition: box-shadow 200ms ease !important;
}

#issue-pins .issue-card:hover {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) !important;
}

#issue-pins .issue-card.tw-cursor-grab {
  cursor: grab !important;
}

#issue-pins .issue-card.tw-cursor-grab:active {
  cursor: grabbing !important;
}

/* Pagination */
.issue-list .pagination,
.issue-list .center.page.buttons {
  display: flex !important;
  justify-content: center !important;
  padding: 16px 0 !important;
  gap: 4px !important;
}

.issue-list .pagination .item,
.issue-list .pagination a,
.issue-list .center.page.buttons a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 8px !important;
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-accent-fg) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background 80ms ease !important;
}

.issue-list .pagination .item:hover,
.issue-list .pagination a:hover,
.issue-list .center.page.buttons a:hover {
  background: var(--gh-canvas-subtle) !important;
}

.issue-list .pagination .item.active,
.issue-list .pagination a.active,
.issue-list .center.page.buttons a.active {
  background: var(--gh-accent-emphasis) !important;
  border-color: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
}

.issue-list .pagination .item.disabled,
.issue-list .pagination a.disabled {
  color: var(--gh-fg-muted) !important;
  cursor: not-allowed !important;
  opacity: 0.5 !important;
}

/* Secondary Filter Menu (Labels dropdown etc.) */
.issue-list-toolbar .ui.secondary.filter.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  min-height: auto !important;
}

.issue-list-toolbar .ui.secondary.filter.menu .item {
  margin: 0 !important;
  padding: 4px 8px !important;
}

/* Issue checkbox all */
.issue-list-toolbar .issue-checkbox-all {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--gh-accent-emphasis) !important;
}

/* Issue Actions bar (shown when items are selected) */
#issue-actions {
  padding: 12px 16px !important;
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-radius: 6px !important;
  margin-bottom: 8px !important;
}

#issue-actions .ui.dropdown {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
}

#issue-actions .ui.dropdown:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Commit Status on PR List */
#issue-list .commit-status,
.flex-list .commit-status {
  display: inline-flex !important;
  align-items: center !important;
  margin-left: 4px !important;
}

#issue-list .commit-status svg,
.flex-list .commit-status svg {
  width: 16px !important;
  height: 16px !important;
}

/* Success status */
#issue-list .commit-status.green svg,
.flex-list .commit-status.green svg {
  color: var(--gh-success-fg) !important;
}

/* Pending status */
#issue-list .commit-status.yellow svg,
.flex-list .commit-status.yellow svg {
  color: var(--gh-attention-emphasis) !important;
}

/* Failed status */
#issue-list .commit-status.red svg,
.flex-list .commit-status.red svg {
  color: var(--gh-danger-fg) !important;
}

/* ==========================================================================
   PHASE 3.2: ISSUE DETAIL STYLING - GitHub-style
   ========================================================================== */

/* Issue Detail Page Container */
.page-content.view.issue .ui.container,
.page-content.view.issue.pull .ui.container {
  max-width: 1280px !important;
  padding: 0 16px !important;
}

/* Issue Title Header */
.issue-title-header {
  padding: 16px 0 !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  margin-bottom: 16px !important;
}

.issue-title-header .issue-title {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
}

.issue-title-header .issue-title h1 {
  font-size: 32px !important;
  font-weight: 400 !important;
  line-height: 1.25 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
  flex: 1 !important;
  word-break: break-word !important;
}

.issue-title-header .issue-title h1 .index {
  color: var(--gh-fg-muted) !important;
  font-weight: 300 !important;
}

/* Issue Title Buttons */
.issue-title-header .issue-title-buttons {
  display: flex !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

.issue-title-header .issue-title-buttons .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  transition: background 80ms ease !important;
}

.issue-title-header .issue-title-buttons .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

.issue-title-header .issue-title-buttons .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border-color: var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.issue-title-header .issue-title-buttons .ui.primary.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
  border-color: var(--gh-btn-primary-hoverBorder) !important;
}

/* Issue Title Edit Form */
.issue-title-header form.issue-title {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
}

.issue-title-header form.issue-title input {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 16px !important;
  color: var(--gh-fg-default) !important;
}

.issue-title-header form.issue-title input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Issue Title Meta */
.issue-title-header .issue-title-meta {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 8px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

/* Issue State Labels */
.issue-state-label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  border-radius: 2em !important;
  white-space: nowrap !important;
}

.issue-state-label svg {
  width: 16px !important;
  height: 16px !important;
}

/* Open State - Green */
.issue-state-label.green,
.ui.green.label.issue-state-label {
  background: var(--gh-success-emphasis) !important;
  color: #ffffff !important;
  border: none !important;
}

/* Closed State - Red */
.issue-state-label.red,
.ui.red.label.issue-state-label {
  background: var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
  border: none !important;
}

/* Merged State - Purple */
.issue-state-label.purple,
.ui.purple.label.issue-state-label {
  background: var(--gh-done-emphasis) !important;
  color: #ffffff !important;
  border: none !important;
}

/* Draft State - Grey */
.issue-state-label.grey,
.ui.grey.label.issue-state-label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border: none !important;
}

/* Pull Request Branch Info */
.issue-title-meta .pull-desc,
.issue-title-meta .time-desc {
  color: var(--gh-fg-muted) !important;
}

.issue-title-meta a {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.issue-title-meta a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Branch names in pull request meta */
.issue-title-meta code,
.issue-title-meta .branch-link {
  padding: 2px 6px !important;
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.1)) !important;
  color: var(--gh-accent-fg) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
}

/* Issue Content Layout */
.issue-content {
  display: flex !important;
  gap: 16px !important;
  padding-top: 16px !important;
}

.issue-content-left {
  flex: 1 !important;
  min-width: 0 !important;
}

.issue-content-right {
  width: 296px !important;
  flex-shrink: 0 !important;
}

/* Timeline */
.ui.timeline {
  position: relative !important;
  padding-left: 0 !important;
}

/* Timeline Item (Comment) */
.ui.timeline .timeline-item {
  position: relative !important;
  display: flex !important;
  gap: 16px !important;
  padding-bottom: 16px !important;
}

.ui.timeline .timeline-item.comment {
  padding-bottom: 24px !important;
}

/* Timeline Avatar */
.ui.timeline .timeline-avatar {
  flex-shrink: 0 !important;
  width: 40px !important;
  height: 40px !important;
}

.ui.timeline .timeline-avatar img,
.ui.timeline .timeline-avatar .avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
}

/* Comment Container */
.ui.timeline .comment-container {
  flex: 1 !important;
  min-width: 0 !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  background: var(--gh-canvas-default) !important;
}

/* Comment Header */
.comment-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
}

.comment-header-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  flex-wrap: wrap !important;
}

.comment-header-left .inline-timeline-avatar {
  display: none !important;
}

.comment-header-left a {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.comment-header-left a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

.comment-header-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Role badges (Author, Owner, Member, etc.) */
.comment-header .role-label,
.comment-header .ui.label {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  border-radius: 2em !important;
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
}

/* Comment Body */
.comment-body {
  padding: 16px !important;
  background: var(--gh-canvas-default) !important;
  border-radius: 0 0 6px 6px !important;
  border: none !important;
  box-shadow: none !important;
}

.comment-body.ui.attached.segment {
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
}

/* Comment Content Markdown */
.comment-body .render-content,
.comment-body .markup {
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--gh-fg-default) !important;
}

.comment-body .render-content p,
.comment-body .markup p {
  margin-bottom: 16px !important;
}

.comment-body .render-content p:last-child,
.comment-body .markup p:last-child {
  margin-bottom: 0 !important;
}

.comment-body .no-content {
  color: var(--gh-fg-muted) !important;
  font-style: italic !important;
}

/* Code blocks in comments */
.comment-body .render-content pre,
.comment-body .markup pre {
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border-radius: 6px !important;
  overflow-x: auto !important;
  font-size: 85% !important;
}

.comment-body .render-content code,
.comment-body .markup code {
  padding: 0.2em 0.4em !important;
  background: var(--gh-neutral-muted) !important;
  border-radius: 6px !important;
  font-size: 85% !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
}

.comment-body .render-content pre code,
.comment-body .markup pre code {
  padding: 0 !important;
  background: transparent !important;
}

/* Arrow pointing to comment header */
.comment-header.avatar-content-left-arrow::before {
  content: "" !important;
  position: absolute !important;
  top: 12px !important;
  left: -8px !important;
  width: 8px !important;
  height: 16px !important;
  background: transparent !important;
  clip-path: polygon(0 50%, 100% 0, 100% 100%) !important;
  border: none !important;
}

.comment-container {
  position: relative !important;
}

.comment-container::before {
  content: "" !important;
  position: absolute !important;
  top: 11px !important;
  left: -8px !important;
  width: 0 !important;
  height: 0 !important;
  border: 8px solid transparent !important;
  border-right-color: var(--gh-border-default) !important;
  border-left: 0 !important;
}

.comment-container::after {
  content: "" !important;
  position: absolute !important;
  top: 12px !important;
  left: -7px !important;
  width: 0 !important;
  height: 0 !important;
  border: 7px solid transparent !important;
  border-right-color: var(--gh-canvas-subtle) !important;
  border-left: 0 !important;
}

/* Reactions */
.comment-container .reactions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  padding: 8px 16px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

.comment-container .reactions .reaction {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px !important;
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 100px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  transition: background 100ms ease !important;
}

.comment-container .reactions .reaction:hover {
  background: var(--gh-canvas-subtle) !important;
  border-color: var(--gh-border-default) !important;
}

.comment-container .reactions .reaction.active,
.comment-container .reactions .reaction.user-reacted {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.1)) !important;
  border-color: var(--gh-accent-emphasis) !important;
}

/* Add reaction button */
.comment-header-right .add-reaction,
.comment-header-right .add_reaction,
.comment-header-right [data-tooltip-content*="reaction"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

.comment-header-right .add-reaction:hover,
.comment-header-right .add_reaction:hover,
.comment-header-right [data-tooltip-content*="reaction"]:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

/* Comment Context Menu */
.comment-header-right .context-menu,
.comment-header-right .ui.dropdown {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

.comment-header-right .context-menu:hover,
.comment-header-right .ui.dropdown:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

.comment-header-right .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.5) !important;
  padding: 4px 0 !important;
  min-width: 160px !important;
}

.comment-header-right .ui.dropdown .menu .item {
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
}

.comment-header-right .ui.dropdown .menu .item:hover {
  background: var(--gh-navitem-hoverBg) !important;
}

.comment-header-right .ui.dropdown .menu .item.text.red,
.comment-header-right .ui.dropdown .menu .item.danger {
  color: var(--gh-danger-fg) !important;
}

.comment-header-right .ui.dropdown .menu .divider {
  margin: 4px 0 !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

/* Timeline Event Items (non-comment events) */
.ui.timeline .timeline-item.event {
  padding-left: 56px !important;
  padding-bottom: 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.ui.timeline .timeline-item.event::before {
  content: "" !important;
  position: absolute !important;
  left: 19px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 2px !important;
  background: var(--gh-border-muted) !important;
}

.ui.timeline .timeline-item.event .svg {
  position: absolute !important;
  left: 12px !important;
  width: 16px !important;
  height: 16px !important;
  background: var(--gh-canvas-default) !important;
  border-radius: 50% !important;
  z-index: 1 !important;
}

/* Comment Form */
.ui.timeline .timeline-item.comment.form {
  padding-bottom: 0 !important;
}

.ui.timeline .timeline-item.comment.form .content {
  flex: 1 !important;
}

.ui.timeline .timeline-item.comment.form .ui.segment {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  background: var(--gh-canvas-default) !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Comment Tab (Markdown Editor) */
.comment-form .comment-editor-tab,
.comment-form .combo-editor-tab {
  display: flex !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 0 !important;
  margin: 0 !important;
  background: var(--gh-canvas-subtle) !important;
  border-radius: 6px 6px 0 0 !important;
}

.comment-form .comment-editor-tab .item,
.comment-form .combo-editor-tab .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  border: none !important;
  background: transparent !important;
  cursor: pointer !important;
}

.comment-form .comment-editor-tab .item:hover,
.comment-form .combo-editor-tab .item:hover {
  color: var(--gh-fg-default) !important;
}

.comment-form .comment-editor-tab .item.active,
.comment-form .combo-editor-tab .item.active {
  color: var(--gh-fg-default) !important;
  border-bottom: 2px solid var(--gh-primer-fg-open) !important;
  margin-bottom: -1px !important;
}

/* Comment Textarea */
.comment-form textarea,
.combo-markdown-editor textarea {
  width: 100% !important;
  min-height: 150px !important;
  padding: 12px !important;
  background: var(--gh-canvas-default) !important;
  border: none !important;
  border-radius: 0 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: var(--gh-fg-default) !important;
  resize: vertical !important;
}

.comment-form textarea:focus,
.combo-markdown-editor textarea:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* Comment Form Footer */
.comment-form .field.footer {
  padding: 8px 12px !important;
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  border-radius: 0 0 6px 6px !important;
}

.comment-form .field.footer .flex-text-block {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

/* Comment Form Buttons */
.comment-form #status-button,
.comment-form #comment-button {
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  line-height: 20px !important;
}

.comment-form #status-button {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
}

.comment-form #status-button:hover {
  background: var(--gh-canvas-subtle) !important;
}

.comment-form #status-button.ui.red {
  border-color: var(--gh-danger-fg) !important;
  color: var(--gh-danger-fg) !important;
}

.comment-form #status-button.ui.red:hover {
  background: var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

.comment-form #comment-button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.comment-form #comment-button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Issue Sidebar */
.issue-content-right.ui.segment {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Sidebar Section */
.issue-content-right .divider {
  margin: 16px 0 !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

/* Sidebar Labels */
.issue-content-right .labels-list,
.issue-content-right .sidebar-labels {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

/* Sidebar Section Headers */
.issue-content-right .ui.sub.header,
.issue-content-right .section-header {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 8px !important;
  text-transform: none !important;
}

/* Sidebar Select Dropdowns */
.issue-content-right .select-label,
.issue-content-right .select-assignees,
.issue-content-right .select-milestone,
.issue-content-right .select-project,
.issue-content-right .select-reviewer {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
}

.issue-content-right .select-label:hover,
.issue-content-right .select-assignees:hover,
.issue-content-right .select-milestone:hover,
.issue-content-right .select-project:hover,
.issue-content-right .select-reviewer:hover {
  color: var(--gh-accent-fg) !important;
}

/* Sidebar Assignees */
.issue-content-right .user-list,
.issue-content-right .assignee-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.issue-content-right .user-list .item,
.issue-content-right .assignee-list .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.issue-content-right .user-list .item img,
.issue-content-right .user-list .item .avatar,
.issue-content-right .assignee-list .item img,
.issue-content-right .assignee-list .item .avatar {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

.issue-content-right .user-list .item a,
.issue-content-right .assignee-list .item a {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.issue-content-right .user-list .item a:hover,
.issue-content-right .assignee-list .item a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Sidebar Milestone */
.issue-content-right .milestone-name {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

.issue-content-right .milestone-progress {
  margin-top: 4px !important;
}

.issue-content-right .milestone-progress progress {
  width: 100% !important;
  height: 8px !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  background: var(--gh-neutral-muted) !important;
}

.issue-content-right .milestone-progress progress::-webkit-progress-bar {
  background: var(--gh-neutral-muted) !important;
  border-radius: 4px !important;
}

.issue-content-right .milestone-progress progress::-webkit-progress-value {
  background: var(--gh-success-emphasis) !important;
  border-radius: 4px !important;
}

/* Sidebar Participants */
.issue-content-right .participants-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.issue-content-right .participants-list img,
.issue-content-right .participants-list .avatar {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
}

/* Sidebar Reference/Link section */
.issue-content-right .reference-link code {
  display: block !important;
  padding: 8px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
  word-break: break-all !important;
}

/* Attachments */
.comment-body .attachments,
.attachments-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

.comment-body .attachments .attachment,
.attachments-list .attachment {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
}

.comment-body .attachments .attachment:hover,
.attachments-list .attachment:hover {
  background: var(--gh-canvas-inset) !important;
  border-color: var(--gh-border-default) !important;
}

/* Issue Lock Notice */
.ui.warning.message {
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-radius: 6px !important;
  color: var(--gh-attention-fg) !important;
  padding: 16px !important;
}

/* Sign In Required Notice */
.ui.warning.message a {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   PHASE 3.6: PULL REQUEST DIFF VIEW - GitHub-style
   ========================================================================== */

/* Diff Detail Box (Stats Bar) */
.diff-detail-box {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.diff-detail-box .diff-detail-stats {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.diff-detail-box .diff-detail-stats svg {
  color: var(--gh-fg-muted) !important;
}

/* Diff Detail Actions */
.diff-detail-box .diff-detail-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

/* File Tree Toggle Button */
.diff-toggle-file-tree-button {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 4px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

.diff-toggle-file-tree-button:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

/* Viewed Files Progress */
.diff-detail-actions #viewed-files-summary-label {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.diff-detail-actions #viewed-files-summary {
  width: 100px !important;
  height: 5px !important;
  border-radius: 3px !important;
  overflow: hidden !important;
  background: var(--gh-neutral-muted) !important;
}

.diff-detail-actions #viewed-files-summary::-webkit-progress-bar {
  background: var(--gh-neutral-muted) !important;
  border-radius: 3px !important;
}

.diff-detail-actions #viewed-files-summary::-webkit-progress-value {
  background: var(--gh-success-emphasis) !important;
  border-radius: 3px !important;
}

/* Diff Options Dropdown */
.diff-detail-actions .ui.dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
}

.diff-detail-actions .ui.dropdown:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.diff-detail-actions .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.5) !important;
  padding: 4px 0 !important;
  min-width: 180px !important;
}

.diff-detail-actions .ui.dropdown .menu .item {
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
}

.diff-detail-actions .ui.dropdown .menu .item:hover {
  background: var(--gh-navitem-hoverBg) !important;
}

/* Review Button */
.diff-detail-actions .js-review-submit-button,
.diff-detail-actions .review-box-toggle {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.diff-detail-actions .js-review-submit-button:hover,
.diff-detail-actions .review-box-toggle:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Diff Container Layout */
#diff-container {
  display: flex !important;
  gap: 16px !important;
}

/* Diff File Tree Sidebar */
#diff-file-tree {
  width: 260px !important;
  flex-shrink: 0 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  max-height: calc(100vh - 200px) !important;
  overflow-y: auto !important;
  position: sticky !important;
  top: 80px !important;
}

#diff-file-tree .list-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
  cursor: pointer !important;
  border-left: 2px solid transparent !important;
}

#diff-file-tree .list-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

#diff-file-tree .list-item.active,
#diff-file-tree .list-item.selected {
  background: var(--gh-canvas-subtle) !important;
  border-left-color: var(--gh-primer-fg-open) !important;
}

#diff-file-tree .list-item .file-icon {
  width: 16px !important;
  height: 16px !important;
  flex-shrink: 0 !important;
}

#diff-file-tree .list-item .file-name {
  flex: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
}

/* Diff File Boxes Container */
#diff-file-boxes {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Diff File Box */
.diff-file-box {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
  background: var(--gh-canvas-default) !important;
  overflow: hidden !important;
}

/* Diff File Header */
.diff-file-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 8px 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.diff-file-header.sticky-2nd-row {
  position: sticky !important;
  top: 0 !important;
  z-index: 10 !important;
}

/* Diff File Name */
.diff-file-name {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  min-width: 0 !important;
  flex: 1 !important;
}

.diff-file-name .fold-file {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  padding: 2px !important;
  border-radius: 4px !important;
}

.diff-file-name .fold-file:hover {
  background: var(--gh-canvas-inset) !important;
  color: var(--gh-fg-default) !important;
}

.diff-file-name .file-link {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
  word-break: break-all !important;
}

.diff-file-name .file-link:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Copy Path Button */
.diff-file-name button[data-clipboard-text] {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  padding: 4px !important;
  border-radius: 4px !important;
}

.diff-file-name button[data-clipboard-text]:hover {
  background: var(--gh-canvas-inset) !important;
  color: var(--gh-fg-default) !important;
}

/* File Labels (LFS, Generated, Vendored) */
.diff-file-header .ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 2px 6px !important;
  border-radius: 4px !important;
  border: none !important;
}

/* Diff File Header Actions */
.diff-file-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Diff Stats (+/- counts) */
.diff-file-header-actions .diff-stats {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
}

.diff-file-header-actions .diff-stats .add-code,
.diff-file-header-actions .diff-stats .addition,
.diff-file-header-actions .text.green {
  color: var(--gh-success-fg) !important;
}

.diff-file-header-actions .diff-stats .del-code,
.diff-file-header-actions .diff-stats .deletion,
.diff-file-header-actions .text.red {
  color: var(--gh-danger-fg) !important;
}

/* File View Toggle Buttons */
.diff-file-header-actions .ui.compact.icon.buttons {
  display: inline-flex !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.diff-file-header-actions .ui.compact.icon.buttons .button {
  background: var(--gh-canvas-default) !important;
  border: none !important;
  border-right: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  padding: 4px 8px !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

.diff-file-header-actions .ui.compact.icon.buttons .button:last-child {
  border-right: none !important;
}

.diff-file-header-actions .ui.compact.icon.buttons .button:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

.diff-file-header-actions .ui.compact.icon.buttons .button.active {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

/* Viewed Checkbox */
.diff-file-header-actions .viewed-file-form {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
}

.diff-file-header-actions .viewed-file-form input[type="checkbox"] {
  accent-color: var(--gh-accent-emphasis) !important;
}

/* Header Kebab Menu */
.diff-file-header-actions .diff-header-popup-btn {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 4px !important;
  border-radius: 4px !important;
  cursor: pointer !important;
}

.diff-file-header-actions .diff-header-popup-btn:hover {
  background: var(--gh-canvas-inset) !important;
  color: var(--gh-fg-default) !important;
}

/* Diff File Body */
.diff-file-body {
  overflow-x: auto !important;
  background: var(--gh-canvas-default) !important;
  border: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.diff-file-body.ui.attached.segment {
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Folded File */
.diff-file-box[data-folded="true"] .diff-file-body {
  display: none !important;
}

/* Binary/Suppressed File Notice */
.diff-file-body.binary,
.diff-file-body .binary {
  padding: 32px 16px !important;
  text-align: center !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

/* Diff Code Table */
.diff-file-body table.chroma {
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  table-layout: fixed !important;
}

/* Line Number Columns */
.diff-file-body .lines-num {
  width: 50px !important;
  min-width: 50px !important;
  padding: 0 10px !important;
  text-align: right !important;
  vertical-align: top !important;
  color: var(--gh-fg-muted) !important;
  user-select: none !important;
  cursor: pointer !important;
  background: var(--gh-canvas-default) !important;
}

.diff-file-body .lines-num:hover {
  color: var(--gh-fg-default) !important;
}

.diff-file-body .lines-num span {
  display: block !important;
  padding: 1px 0 !important;
}

/* Line Type Marker Column (+/-) */
.diff-file-body .lines-type-marker {
  width: 20px !important;
  padding: 0 4px !important;
  text-align: center !important;
  vertical-align: top !important;
  user-select: none !important;
}

/* Escape Button Column */
.diff-file-body .lines-escape {
  width: 20px !important;
  padding: 0 !important;
  vertical-align: top !important;
}

/* Code Line */
.diff-file-body .lines-code {
  padding: 1px 10px !important;
  vertical-align: top !important;
  white-space: pre !important;
  word-wrap: normal !important;
  overflow: visible !important;
  line-height: 20px !important;
}

/* Addition Line (Green) */
.diff-file-body tr.add-code,
.diff-file-body tr[data-line-type="add"] {
  background: var(--gh-color-diff-blob-addition-line-bg, rgba(46, 160, 67, 0.15)) !important;
}

.diff-file-body tr.add-code .lines-num,
.diff-file-body tr[data-line-type="add"] .lines-num {
  background: var(--gh-color-diff-blob-addition-num-bg, rgba(46, 160, 67, 0.3)) !important;
}

.diff-file-body tr.add-code .lines-type-marker,
.diff-file-body tr[data-line-type="add"] .lines-type-marker {
  color: var(--gh-success-fg) !important;
}

/* Word-level addition highlight */
.diff-file-body .added-code {
  background: var(--gh-color-diff-blob-addition-word-bg, rgba(46, 160, 67, 0.4)) !important;
  border-radius: 2px !important;
}

/* Deletion Line (Red) */
.diff-file-body tr.del-code,
.diff-file-body tr[data-line-type="del"] {
  background: var(--gh-color-diff-blob-deletion-line-bg, rgba(248, 81, 73, 0.15)) !important;
}

.diff-file-body tr.del-code .lines-num,
.diff-file-body tr[data-line-type="del"] .lines-num {
  background: var(--gh-color-diff-blob-deletion-num-bg, rgba(248, 81, 73, 0.3)) !important;
}

.diff-file-body tr.del-code .lines-type-marker,
.diff-file-body tr[data-line-type="del"] .lines-type-marker {
  color: var(--gh-danger-fg) !important;
}

/* Word-level deletion highlight */
.diff-file-body .removed-code {
  background: var(--gh-color-diff-blob-deletion-word-bg, rgba(248, 81, 73, 0.4)) !important;
  border-radius: 2px !important;
}

/* Hunk Header (@@) */
.diff-file-body tr[data-line-type="empty"],
.diff-file-body .blob-hunk {
  background: var(--gh-color-diff-blob-hunk-bg, rgba(56, 139, 253, 0.1)) !important;
  color: var(--gh-fg-muted) !important;
}

.diff-file-body .blob-hunk td {
  padding: 8px 10px !important;
  color: var(--gh-accent-fg) !important;
  font-style: normal !important;
}

/* Expansion Buttons in Hunk */
.diff-file-body .blob-excerpt {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.diff-file-body .blob-excerpt .btn {
  background: transparent !important;
  border: none !important;
  color: var(--gh-accent-fg) !important;
  padding: 4px 8px !important;
  cursor: pointer !important;
}

.diff-file-body .blob-excerpt .btn:hover {
  background: var(--gh-canvas-inset) !important;
  border-radius: 4px !important;
}

/* Add Comment Button */
.diff-file-body .add-code-comment {
  position: absolute !important;
  left: 4px !important;
  display: none !important;
  width: 22px !important;
  height: 22px !important;
  padding: 0 !important;
  background: var(--gh-accent-emphasis) !important;
  border: none !important;
  border-radius: 4px !important;
  color: #ffffff !important;
  cursor: pointer !important;
  z-index: 5 !important;
  align-items: center !important;
  justify-content: center !important;
}

.diff-file-body tr:hover .add-code-comment {
  display: inline-flex !important;
}

.diff-file-body .add-code-comment svg {
  width: 14px !important;
  height: 14px !important;
}

/* Line Comments Container */
.diff-file-body tr.add-comment {
  background: var(--gh-canvas-default) !important;
}

.diff-file-body tr.add-comment td {
  padding: 16px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

/* Diff Conversation/Comment Thread */
.diff-file-body .conversation-holder {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  margin: 8px 0 !important;
}

.diff-file-body .conversation-holder .comment {
  padding: 8px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.diff-file-body .conversation-holder .comment:last-child {
  border-bottom: none !important;
}

/* Split Diff View */
.code-diff-split table.chroma {
  table-layout: fixed !important;
}

.code-diff-split .lines-num-old,
.code-diff-split .lines-code-old {
  border-right: 1px solid var(--gh-border-muted) !important;
}

/* Diff Stats Visualization */
.diff-stats-bar {
  display: inline-flex !important;
  align-items: center !important;
  width: 60px !important;
  height: 8px !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  background: var(--gh-neutral-muted) !important;
}

.diff-stats-bar .bar-addition {
  height: 100% !important;
  background: var(--gh-success-emphasis) !important;
}

.diff-stats-bar .bar-deletion {
  height: 100% !important;
  background: var(--gh-danger-emphasis) !important;
}

/* Image Diff */
.diff-file-body .image-diff {
  padding: 16px !important;
  text-align: center !important;
}

.diff-file-body .image-diff img {
  max-width: 100% !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
}

.diff-file-body .image-diff-container {
  display: flex !important;
  justify-content: center !important;
  gap: 32px !important;
  flex-wrap: wrap !important;
}

.diff-file-body .image-diff-container .image-diff-box {
  text-align: center !important;
}

.diff-file-body .image-diff-container .image-diff-label {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 8px !important;
}

/* Submodule Diff */
.diff-file-body .tw-p-3 {
  padding: 12px 16px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

/* Info Message (Single Commit, Commit Range) */
.ui.info.message {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.1)) !important;
  border: 1px solid var(--gh-accent-muted, rgba(56, 139, 253, 0.4)) !important;
  border-radius: 6px !important;
  color: var(--gh-accent-fg) !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
}

.ui.info.message a {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

/* Incomplete Diff Message */
#diff-incomplete {
  border: 1px dashed var(--gh-border-default) !important;
  border-radius: 6px !important;
}

#diff-incomplete .header {
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

#diff-incomplete .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
}

#diff-incomplete .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Changed Since Last Review Badge */
.changed-since-last-review {
  font-size: 12px !important;
  color: var(--gh-attention-fg) !important;
  background: var(--gh-attention-subtle) !important;
  padding: 2px 8px !important;
  border-radius: 2em !important;
}

/* Protected File Badge */
.diff-file-header .ui.basic.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 2em !important;
}

/* ==========================================================================
   PHASE 2.5: FILE EDITOR - GitHub-style file editor styling
   ========================================================================== */

/* Editor Page Container */
.page-content.file.editor.edit,
.page-content.repository.file.editor.edit {
  background: var(--gh-canvas-default) !important;
}

.page-content.file.editor.edit .ui.container.fluid.padded {
  padding: 0 24px 24px 24px !important;
}

/* Editor Header with Breadcrumb */
.repo-editor-header {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 0 !important;
  margin-bottom: 8px !important;
}

.repo-editor-header .breadcrumb {
  font-size: 14px !important;
}

.repo-editor-header .breadcrumb a {
  color: var(--gh-accent-fg) !important;
}

.repo-editor-header .breadcrumb a:hover {
  text-decoration: underline !important;
}

.repo-editor-header .breadcrumb .divider {
  color: var(--gh-fg-muted) !important;
  margin: 0 4px !important;
}

.repo-editor-header .breadcrumb input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-accent-emphasis) !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  box-shadow: inset 0 0 0 1px var(--gh-accent-emphasis), 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.repo-editor-header .breadcrumb input:focus {
  outline: none !important;
}

/* Editor Tabs (Edit/Preview/Diff) */
.repo-editor-menu,
.ui.compact.small.menu.small-menu-items.repo-editor-menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  display: flex !important;
  gap: 0 !important;
}

.repo-editor-menu .item {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-bottom: none !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.repo-editor-menu .item:hover {
  color: var(--gh-fg-default) !important;
}

.repo-editor-menu .item.active {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-bottom: 1px solid var(--gh-canvas-default) !important;
  color: var(--gh-fg-default) !important;
  position: relative !important;
  z-index: 1 !important;
  margin-bottom: -1px !important;
}

.repo-editor-menu .item svg {
  width: 16px !important;
  height: 16px !important;
}

/* Tab Header Container */
.ui.edit.form .field .ui.top.attached.header,
.page-content.file.editor .ui.top.attached.header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
}

/* Tab Content Container */
.ui.edit.form .field .ui.bottom.attached.segment,
.page-content.file.editor .ui.bottom.attached.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Monaco Editor Container */
.ui.edit.form .tab[data-tab="write"],
.page-content.file.editor .tab[data-tab="write"] {
  min-height: 400px !important;
}

.ui.edit.form .tab[data-tab="write"] .CodeMirror,
.ui.edit.form .tab[data-tab="write"] .monaco-editor {
  border-radius: 0 0 6px 6px !important;
}

/* Editor Loading State */
.editor-loading.is-loading {
  min-height: 400px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--gh-canvas-default) !important;
}

/* Preview Tab */
.ui.edit.form .tab[data-tab="preview"],
.page-content.file.editor .tab[data-tab="preview"] {
  background: var(--gh-canvas-default) !important;
  min-height: 200px !important;
  padding: 16px !important;
}

.ui.edit.form .tab[data-tab="preview"] .markup,
.page-content.file.editor .tab[data-tab="preview"] .markup {
  color: var(--gh-fg-default) !important;
}

/* Diff Tab */
.ui.edit.form .tab[data-tab="diff"],
.page-content.file.editor .tab[data-tab="diff"] {
  background: var(--gh-canvas-default) !important;
  padding: 0 !important;
  min-height: 200px !important;
}

/* ========== COMMIT FORM STYLING ========== */

.commit-form-wrapper {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  margin-top: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

.commit-form-wrapper .commit-avatar {
  flex-shrink: 0 !important;
  border-radius: 50% !important;
}

/* Commit Form Card with Arrow */
.commit-form.avatar-content-left-arrow {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  position: relative !important;
}

.commit-form.avatar-content-left-arrow::before {
  content: "" !important;
  position: absolute !important;
  left: -8px !important;
  top: 14px !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 8px solid transparent !important;
  border-bottom: 8px solid transparent !important;
  border-right: 8px solid var(--gh-border-default) !important;
}

.commit-form.avatar-content-left-arrow::after {
  content: "" !important;
  position: absolute !important;
  left: -6px !important;
  top: 15px !important;
  width: 0 !important;
  height: 0 !important;
  border-top: 7px solid transparent !important;
  border-bottom: 7px solid transparent !important;
  border-right: 7px solid var(--gh-canvas-default) !important;
}

/* Commit Form Header */
.commit-form h3 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 0 16px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.commit-form h3 svg {
  width: 24px !important;
  height: 24px !important;
  color: var(--gh-fg-muted) !important;
}

/* Commit Summary Input */
.commit-form .field input[name="commit_summary"] {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.5 !important;
}

.commit-form .field input[name="commit_summary"]:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.commit-form .field input[name="commit_summary"]::placeholder {
  color: var(--gh-fg-subtle) !important;
}

/* Commit Message Textarea */
.commit-form .field textarea[name="commit_message"] {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  font-family: inherit !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.5 !important;
  resize: vertical !important;
  min-height: 100px !important;
}

.commit-form .field textarea[name="commit_message"]:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.commit-form .field textarea[name="commit_message"]::placeholder {
  color: var(--gh-fg-subtle) !important;
}

/* Sign-off Checkbox */
.commit-form .inline.field .ui.checkbox {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.commit-form .inline.field .ui.checkbox input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  border-radius: 3px !important;
  border: 1px solid var(--gh-border-default) !important;
  background: var(--gh-canvas-default) !important;
  margin: 0 !important;
}

.commit-form .inline.field .ui.checkbox label {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  padding-left: 0 !important;
}

/* Quick Pull Choice Section */
.quick-pull-choice {
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

.quick-pull-choice .field {
  margin-bottom: 12px !important;
}

.quick-pull-choice .field:last-child {
  margin-bottom: 0 !important;
}

/* Radio Buttons */
.quick-pull-choice .ui.radio.checkbox {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

.quick-pull-choice .ui.radio.checkbox input[type="radio"] {
  width: 16px !important;
  height: 16px !important;
  margin: 2px 0 0 0 !important;
  flex-shrink: 0 !important;
}

.quick-pull-choice .ui.radio.checkbox label {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  padding-left: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

.quick-pull-choice .ui.radio.checkbox label svg {
  display: inline !important;
  width: 16px !important;
  height: 16px !important;
  vertical-align: middle !important;
  margin-right: 4px !important;
  color: var(--gh-fg-muted) !important;
}

/* Disabled Radio */
.quick-pull-choice .ui.radio.checkbox.disabled {
  opacity: 0.5 !important;
}

/* Warning Message in Commit Options */
.quick-pull-choice .ui.visible.small.warning.message {
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
  color: var(--gh-attention-fg) !important;
}

.quick-pull-choice .ui.visible.small.warning.message ul {
  margin: 8px 0 0 16px !important;
  padding: 0 !important;
}

.quick-pull-choice .ui.visible.small.warning.message li {
  margin-bottom: 4px !important;
}

/* New Branch Name Input */
.quick-pull-branch-name {
  margin-top: 12px !important;
  padding-left: 24px !important;
}

.new-branch-name-input {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.new-branch-name-input svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.new-branch-name-input input {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.new-branch-name-input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

.new-branch-name-input .text-muted {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* Commit Email Dropdown */
.commit-form .field label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
  display: block !important;
}

.commit-form .ui.selection.dropdown {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  min-width: 200px !important;
}

.commit-form .ui.selection.dropdown:hover {
  border-color: var(--gh-border-muted) !important;
}

.commit-form .ui.selection.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

.commit-form .ui.selection.dropdown .menu .item {
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  border: none !important;
}

.commit-form .ui.selection.dropdown .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

/* Commit Form Buttons */
.commit-form-wrapper > .ui.button,
.commit-form-wrapper #commit-button {
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  margin-top: 16px !important;
}

/* Primary Commit Button */
.commit-form-wrapper #commit-button,
.commit-form-wrapper .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.commit-form-wrapper #commit-button:hover,
.commit-form-wrapper .ui.primary.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
  border-color: var(--gh-btn-primary-hoverBorder) !important;
}

/* Cancel Button */
.commit-form-wrapper .ui.button.red,
.commit-form-wrapper a.ui.button.red {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-danger-fg) !important;
  margin-left: 8px !important;
}

.commit-form-wrapper .ui.button.red:hover,
.commit-form-wrapper a.ui.button.red:hover {
  background: var(--gh-danger-emphasis) !important;
  border-color: var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

/* ========== FILE NOT EDITABLE MESSAGE ========== */

.ui.edit.form .field .ui.segment.tw-text-center {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 32px !important;
  text-align: center !important;
}

.ui.edit.form .field .ui.segment h4 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.ui.edit.form .field .ui.segment p {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  margin: 0 !important;
}

/* ========== EDITOR COMMON TEMPLATES ========== */

/* Editor Hidden Fields and CSRF */
.ui.edit.form input[type="hidden"],
.ui.edit.form .csrf {
  display: none !important;
}

/* Form Fetch Action Indicator */
.form-fetch-action.is-loading {
  opacity: 0.6 !important;
  pointer-events: none !important;
}

/* Delete File Page Specific */
.page-content.file.editor.delete .file-info {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

/* Upload Files Page Specific */
.page-content.file.editor.upload .dropzone {
  background: var(--gh-canvas-default) !important;
  border: 2px dashed var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 32px !important;
  text-align: center !important;
  transition: border-color 0.2s, background-color 0.2s !important;
}

.page-content.file.editor.upload .dropzone:hover,
.page-content.file.editor.upload .dropzone.dz-drag-hover {
  border-color: var(--gh-accent-emphasis) !important;
  background: var(--gh-canvas-subtle) !important;
}

.page-content.file.editor.upload .dropzone .dz-message {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.file.editor.upload .dropzone .dz-message svg {
  width: 48px !important;
  height: 48px !important;
  color: var(--gh-fg-subtle) !important;
  margin-bottom: 8px !important;
}

/* Uploaded File Preview */
.page-content.file.editor.upload .dropzone .dz-preview {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px !important;
  margin: 8px !important;
}

.page-content.file.editor.upload .dropzone .dz-preview .dz-filename {
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.file.editor.upload .dropzone .dz-preview .dz-size {
  font-size: 11px !important;
  color: var(--gh-fg-muted) !important;
}

/* Patch File Editor */
.page-content.file.editor.patch .monaco-editor-container {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* Cherry-pick Editor */
.page-content.file.editor.cherry-pick .commit-info {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
}

.page-content.file.editor.cherry-pick .commit-info .commit-sha {
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
  color: var(--gh-accent-fg) !important;
  background: var(--gh-neutral-muted) !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
}

/* ==========================================================================
   PHASE 2.6 & 2.7: COMMITS PAGE & SINGLE COMMIT VIEW
   GitHub-style commits list and commit detail pages
   ========================================================================== */

/* ========== COMMITS LIST PAGE ========== */

.page-content.repository.commits {
  background: var(--gh-canvas-default) !important;
}

.page-content.repository.commits .ui.container {
  padding-top: 0 !important;
}

/* Commits Table Header */
.commits-table.ui.top.attached.header,
h4.ui.top.attached.header.commits-table {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
}

.commits-table-left {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.commits-table-right {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.commits-table-right .ui.sha.label {
  background: var(--gh-neutral-muted) !important;
  border: none !important;
  color: var(--gh-fg-default) !important;
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
}

/* Commits Search Form */
.page-content.repository.commits .ui.attached.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  padding: 12px 16px !important;
  margin: 0 !important;
}

.page-content.repository.commits .ui.small.fluid.action.input {
  display: flex !important;
  gap: 8px !important;
  align-items: center !important;
}

.page-content.repository.commits .ui.small.fluid.action.input input {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.commits .ui.small.fluid.action.input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Search Dropdown */
.page-content.repository.commits .ui.small.fluid.action.input .ui.dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.commits .ui.small.fluid.action.input .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

.page-content.repository.commits .ui.small.fluid.action.input .ui.dropdown .menu .item {
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.commits .ui.small.fluid.action.input .ui.dropdown .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

/* Search Button */
.page-content.repository.commits .ui.small.fluid.action.input .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.commits .ui.small.fluid.action.input .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Commit Table Container */
.ui.attached.table.segment.commit-table {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

/* Commits Table */
#commits-table.ui.very.basic.striped.table {
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
}

#commits-table thead tr {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

#commits-table thead th {
  background: transparent !important;
  border: none !important;
  padding: 10px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
  text-transform: none !important;
}

#commits-table tbody tr {
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

#commits-table tbody tr:last-child {
  border-bottom: none !important;
}

#commits-table tbody tr:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

#commits-table tbody td {
  background: transparent !important;
  border: none !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  vertical-align: middle !important;
}

/* Author Column */
#commits-table .author {
  white-space: nowrap !important;
}

#commits-table .author .tw-flex {
  align-items: center !important;
  gap: 8px !important;
}

#commits-table .author img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

#commits-table .author a.author-wrapper,
#commits-table .author span.author-wrapper {
  color: var(--gh-fg-default) !important;
  font-weight: 500 !important;
}

#commits-table .author a.author-wrapper:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* SHA Column */
#commits-table .sha {
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
}

#commits-table .sha .ui.sha.label,
#commits-table .sha a.ui.sha.label {
  background: var(--gh-neutral-muted) !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--gh-accent-fg) !important;
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
}

#commits-table .sha .ui.sha.label:hover {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  border-color: var(--gh-accent-emphasis) !important;
}

/* Message Column */
#commits-table .message {
  max-width: 0 !important;
}

#commits-table .message .message-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  overflow: hidden !important;
}

#commits-table .message .commit-summary {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--gh-fg-default) !important;
}

#commits-table .message .commit-summary a {
  color: var(--gh-fg-default) !important;
}

#commits-table .message .commit-summary a:hover {
  color: var(--gh-accent-fg) !important;
}

#commits-table .message .commit-summary.grey.text {
  color: var(--gh-fg-muted) !important;
}

/* Ellipsis Button for Multi-line Messages */
#commits-table .message .ellipsis-button {
  background: var(--gh-neutral-muted) !important;
  border: none !important;
  border-radius: 6px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 0 6px !important;
  cursor: pointer !important;
  line-height: 1.2 !important;
  flex-shrink: 0 !important;
}

#commits-table .message .ellipsis-button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Commit Body (Expanded) */
#commits-table .message .commit-body {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-muted) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  margin-top: 8px !important;
  font-size: 13px !important;
  color: var(--gh-fg-muted) !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
}

/* Commit Status */
#commits-table .message .commit-status {
  flex-shrink: 0 !important;
}

/* Tag Labels */
#commits-table .message .ui.label {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 2em !important;
  margin-left: 8px !important;
}

/* Date Column */
#commits-table td.tw-text-right {
  white-space: nowrap !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

/* Action Buttons Column */
#commits-table td.tw-text-right.tw-py-0 {
  padding: 8px !important;
}

#commits-table .btn.interact-bg {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 4px !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

#commits-table .btn.interact-bg:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

#commits-table .btn.interact-bg svg {
  width: 16px !important;
  height: 16px !important;
}

/* Commit Sign Badge */
#commits-table .sha .gitea-lock {
  color: var(--gh-success-fg) !important;
}

#commits-table .sha .gitea-unlock {
  color: var(--gh-fg-muted) !important;
}

/* ========== SINGLE COMMIT VIEW (Phase 2.7) ========== */

/* Commit Header */
.page-content.repository.diff .commit-header,
.ui.top.attached.header.clearing.segment.commit-header {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 16px !important;
  margin: 0 !important;
}

.commit-header h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  word-wrap: break-word !important;
}

.commit-header h3 .commit-summary {
  color: var(--gh-fg-default) !important;
}

.commit-header h3 a {
  color: var(--gh-accent-fg) !important;
}

.commit-header h3 a:hover {
  text-decoration: underline !important;
}

/* Commit Header Buttons */
.commit-header-buttons {
  display: flex !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

.commit-header-buttons .ui.button,
.commit-header-buttons .ui.primary.tiny.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.commit-header-buttons .ui.button:hover,
.commit-header-buttons .ui.primary.tiny.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Operations Dropdown */
.commit-header-buttons .ui.dropdown.primary.tiny.button {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.commit-header-buttons .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 4px 0 !important;
  min-width: 200px !important;
}

.commit-header-buttons .ui.dropdown .menu .header {
  padding: 8px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
}

.commit-header-buttons .ui.dropdown .menu .divider {
  margin: 4px 0 !important;
  border-color: var(--gh-border-muted) !important;
}

.commit-header-buttons .ui.dropdown .menu .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
}

.commit-header-buttons .ui.dropdown .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

/* Commit Body in Header */
.commit-header .commit-body {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin-top: 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
}

/* Branches and Tags Container */
.commit-header .commit-branches-and-tags {
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

/* Bottom Segment (Author Info) */
.page-content.repository.diff .ui.bottom.attached.segment,
.page-content.repository.diff .ui.bottom.attached.segment.flex-text-block {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px 16px !important;
}

.page-content.repository.diff .flex-text-inline {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.page-content.repository.diff .flex-text-inline img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

.page-content.repository.diff .flex-text-inline a {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

.page-content.repository.diff .flex-text-inline a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

.page-content.repository.diff .flex-text-inline span.text.grey {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

/* Parent/Commit SHA Labels */
.page-content.repository.diff .ui.label.commit-id-short,
.page-content.repository.diff a.ui.label.commit-id-short {
  background: var(--gh-neutral-muted) !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--gh-accent-fg) !important;
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
}

.page-content.repository.diff .ui.label.commit-id-short:hover,
.page-content.repository.diff a.ui.label.commit-id-short:hover {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  border-color: var(--gh-accent-emphasis) !important;
}

/* Git Notes */
.page-content.repository.diff .git-notes.ui.top.attached.header.segment {
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 12px 16px !important;
  margin-top: 16px !important;
  font-size: 14px !important;
  color: var(--gh-attention-fg) !important;
}

.page-content.repository.diff .git-notes.ui.top.attached.header.segment svg {
  color: var(--gh-attention-fg) !important;
}

.page-content.repository.diff .git-notes.ui.bottom.attached.info.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 12px 16px !important;
}

.page-content.repository.diff .git-notes .commit-body {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  white-space: pre-wrap !important;
}

/* Commit Sign Badge in Single View */
.page-content.repository.diff .commit-sign-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 8px !important;
  border-radius: 2em !important;
  font-size: 12px !important;
}

.page-content.repository.diff .commit-sign-badge.verified {
  background: var(--gh-success-subtle, rgba(46, 160, 67, 0.15)) !important;
  color: var(--gh-success-fg) !important;
  border: 1px solid var(--gh-success-muted, rgba(46, 160, 67, 0.4)) !important;
}

.page-content.repository.diff .commit-sign-badge.unverified {
  background: var(--gh-attention-subtle) !important;
  color: var(--gh-attention-fg) !important;
  border: 1px solid var(--gh-attention-muted) !important;
}

/* Cherry Pick Modal */
#cherry-pick-modal.ui.modal,
#create-branch-modal.ui.modal,
#create-tag-modal.ui.modal {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

#cherry-pick-modal .header,
#create-branch-modal .header,
#create-tag-modal .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 16px 20px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

#cherry-pick-modal .content,
#create-branch-modal .content,
#create-tag-modal .content {
  background: var(--gh-canvas-overlay) !important;
  padding: 20px !important;
}

#cherry-pick-modal .content p,
#create-branch-modal .content p {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
}

#cherry-pick-modal .content .ui.form .field label,
#create-branch-modal .content .ui.form .field label,
#create-tag-modal .content .ui.form .field label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

#cherry-pick-modal .content .ui.form input,
#create-branch-modal .content .ui.form input,
#create-tag-modal .content .ui.form input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

#cherry-pick-modal .content .ui.form input:focus,
#create-branch-modal .content .ui.form input:focus,
#create-tag-modal .content .ui.form input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

#cherry-pick-modal .actions,
#create-branch-modal .actions,
#create-tag-modal .actions {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  border-radius: 0 0 12px 12px !important;
  padding: 16px 20px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

#cherry-pick-modal .actions .ui.cancel.button,
#create-branch-modal .actions .ui.cancel.button,
#create-tag-modal .actions .ui.cancel.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

#cherry-pick-modal .actions .ui.primary.button,
#create-branch-modal .actions .ui.primary.button,
#create-tag-modal .actions .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* Graph Button */
.page-content.repository.commits .repo-button-row .ui.basic.small.compact.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.page-content.repository.commits .repo-button-row .ui.basic.small.compact.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.page-content.repository.commits .repo-button-row .ui.basic.small.compact.button svg {
  width: 16px !important;
  height: 16px !important;
}

/* ==========================================================================
   PHASE 2.8: BRANCHES PAGE - GitHub-style branch list
   ========================================================================== */

.page-content.ui.repository.branches {
  background: var(--gh-canvas-default) !important;
}

.page-content.repository.branches .ui.container {
  padding-top: 0 !important;
}

/* Section Headers */
.page-content.repository.branches h4.ui.top.attached.header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 16px 0 0 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.page-content.repository.branches h4.ui.top.attached.header:first-of-type {
  margin-top: 0 !important;
}

.page-content.repository.branches h4.ui.top.attached.header a {
  color: var(--gh-fg-muted) !important;
}

.page-content.repository.branches h4.ui.top.attached.header a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.repository.branches h4.ui.top.attached.header svg {
  width: 16px !important;
  height: 16px !important;
}

/* Search Section */
.page-content.repository.branches .ui.attached.segment:not(.table) {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  padding: 12px 16px !important;
  margin: 0 !important;
}

.page-content.repository.branches .ui.attached.segment form {
  display: flex !important;
  gap: 8px !important;
}

.page-content.repository.branches .ui.attached.segment form input {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.branches .ui.attached.segment form input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Branch Table */
.page-content.repository.branches .ui.attached.table.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

.page-content.repository.branches .ui.very.basic.striped.fixed.table {
  background: transparent !important;
  border: none !important;
  margin: 0 !important;
}

.page-content.repository.branches .ui.very.basic.striped.fixed.table tbody tr {
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.page-content.repository.branches .ui.very.basic.striped.fixed.table tbody tr:last-child {
  border-bottom: none !important;
}

.page-content.repository.branches .ui.very.basic.striped.fixed.table tbody tr:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.page-content.repository.branches .ui.very.basic.striped.fixed.table td {
  background: transparent !important;
  border: none !important;
  padding: 12px 16px !important;
  vertical-align: middle !important;
}

/* Branch Name */
.page-content.repository.branches .flex-text-block {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.page-content.repository.branches .branch-name {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.page-content.repository.branches .branch-name:hover {
  text-decoration: underline !important;
}

.page-content.repository.branches span.branch-name {
  color: var(--gh-fg-muted) !important;
}

/* Protected Branch Icon */
.page-content.repository.branches .flex-text-block [data-tooltip-content*="protected"] svg,
.page-content.repository.branches .flex-text-block .octicon-shield-lock {
  color: var(--gh-attention-fg) !important;
  width: 16px !important;
  height: 16px !important;
}

/* Copy Button */
.page-content.repository.branches .btn.interact-fg {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 2px !important;
  cursor: pointer !important;
  border-radius: 4px !important;
}

.page-content.repository.branches .btn.interact-fg:hover {
  color: var(--gh-fg-default) !important;
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

/* Branch Info Line */
.page-content.repository.branches .info {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin: 4px 0 0 0 !important;
}

.page-content.repository.branches .info a {
  color: var(--gh-accent-fg) !important;
  font-family: var(--gh-fontStack-monospace) !important;
}

.page-content.repository.branches .info a:hover {
  text-decoration: underline !important;
}

.page-content.repository.branches .info .commit-message {
  color: var(--gh-fg-muted) !important;
}

.page-content.repository.branches .info .commit-message a {
  color: var(--gh-accent-fg) !important;
  font-family: inherit !important;
}

.page-content.repository.branches .info svg {
  width: 14px !important;
  height: 14px !important;
  color: var(--gh-fg-muted) !important;
}

/* Commit Divergence Bars */
.commit-divergence {
  display: flex !important;
  gap: 2px !important;
  align-items: center !important;
}

.commit-divergence .bar-group {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 50px !important;
}

.commit-divergence .count {
  font-size: 11px !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 2px !important;
}

.commit-divergence .count-behind {
  text-align: right !important;
}

.commit-divergence .count-ahead {
  text-align: left !important;
}

.commit-divergence .bar {
  height: 4px !important;
  border-radius: 2px !important;
  min-width: 2px !important;
}

.commit-divergence .bar-behind {
  background: var(--gh-neutral-muted) !important;
}

.commit-divergence .bar-ahead {
  background: var(--gh-success-emphasis) !important;
}

/* PR Status Labels */
.page-content.repository.branches .ui.orange.large.label {
  background: var(--gh-attention-subtle) !important;
  border: 1px solid var(--gh-attention-muted) !important;
  color: var(--gh-attention-fg) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 10px !important;
  border-radius: 2em !important;
}

.page-content.repository.branches .ui.purple.large.label {
  background: var(--gh-done-emphasis) !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 10px !important;
  border-radius: 2em !important;
}

.page-content.repository.branches .ui.red.large.label {
  background: var(--gh-danger-emphasis) !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 10px !important;
  border-radius: 2em !important;
}

.page-content.repository.branches .ui.green.large.label {
  background: var(--gh-success-emphasis) !important;
  border: none !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 10px !important;
  border-radius: 2em !important;
}

.page-content.repository.branches .ui.large.label svg {
  width: 14px !important;
  height: 14px !important;
}

/* Compare Changes Button */
.page-content.repository.branches .ui.compact.basic.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.page-content.repository.branches .ui.compact.basic.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* PR Reference Link */
.page-content.repository.branches .ref-issue {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

.page-content.repository.branches .ref-issue:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Action Buttons */
.page-content.repository.branches .btn.interact-bg {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 6px !important;
  cursor: pointer !important;
  border-radius: 6px !important;
}

.page-content.repository.branches .btn.interact-bg:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.branches .btn.interact-bg svg {
  width: 16px !important;
  height: 16px !important;
}

/* Download Dropdown */
.page-content.repository.branches .ui.dropdown.btn.interact-bg .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 4px 0 !important;
  min-width: 120px !important;
}

.page-content.repository.branches .ui.dropdown.btn.interact-bg .menu .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.page-content.repository.branches .ui.dropdown.btn.interact-bg .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.page-content.repository.branches .ui.dropdown.btn.interact-bg .menu .item svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
}

/* Delete Button */
.page-content.repository.branches .delete-branch-button {
  color: var(--gh-danger-fg) !important;
}

.page-content.repository.branches .delete-branch-button:hover {
  background: var(--gh-danger-subtle, rgba(248, 81, 73, 0.15)) !important;
  color: var(--gh-danger-fg) !important;
}

/* Restore Button */
.page-content.repository.branches .restore-branch-button .text.blue {
  color: var(--gh-accent-fg) !important;
}

/* Modals */
.page-content.repository.branches .ui.mini.modal,
.page-content.repository.branches .ui.delete.modal {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

.page-content.repository.branches .ui.mini.modal .header,
.page-content.repository.branches .ui.delete.modal .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 16px 20px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.branches .ui.mini.modal .header svg,
.page-content.repository.branches .ui.delete.modal .header svg {
  width: 20px !important;
  height: 20px !important;
  margin-right: 8px !important;
  vertical-align: middle !important;
}

.page-content.repository.branches .ui.delete.modal .header svg {
  color: var(--gh-danger-fg) !important;
}

.page-content.repository.branches .ui.mini.modal .content,
.page-content.repository.branches .ui.delete.modal .content {
  background: var(--gh-canvas-overlay) !important;
  padding: 20px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.branches .ui.mini.modal .content .field label,
.page-content.repository.branches .ui.delete.modal .content .field label {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
  display: block !important;
}

.page-content.repository.branches .ui.mini.modal .content input,
.page-content.repository.branches .ui.delete.modal .content input {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.branches .ui.mini.modal .content input:focus,
.page-content.repository.branches .ui.delete.modal .content input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Rename Warning */
.page-content.repository.branches .default-branch-warning .text.red {
  color: var(--gh-danger-fg) !important;
  font-size: 14px !important;
}

/* Modal Actions */
.page-content.repository.branches .ui.mini.modal .actions,
.page-content.repository.branches .ui.delete.modal .actions {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  border-radius: 0 0 12px 12px !important;
  padding: 16px 20px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

.page-content.repository.branches .ui.mini.modal .actions .ui.button,
.page-content.repository.branches .ui.delete.modal .actions .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.page-content.repository.branches .ui.mini.modal .actions .ui.primary.button,
.page-content.repository.branches .ui.delete.modal .actions .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.page-content.repository.branches .ui.delete.modal .actions .ui.red.button {
  background: var(--gh-danger-emphasis) !important;
  border: 1px solid var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   PHASE 2.9: RELEASES/TAGS PAGE - GitHub-style release list
   ========================================================================== */

.page-content.repository.releases {
  background: var(--gh-canvas-default) !important;
}

/* Release/Tag Header */
.page-content.repository.releases .flex-text-block {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
}

/* Tab Menu */
.page-content.repository.releases h2.ui.compact.small.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  display: flex !important;
  gap: 0 !important;
}

.page-content.repository.releases h2.ui.compact.small.menu .item {
  background: transparent !important;
  border: none !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 6px !important;
}

.page-content.repository.releases h2.ui.compact.small.menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.releases h2.ui.compact.small.menu .item.active {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* RSS Button */
.page-content.repository.releases .ui.small.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.page-content.repository.releases .ui.small.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.page-content.repository.releases .ui.small.button svg {
  width: 16px !important;
  height: 16px !important;
}

/* New Release Button */
.page-content.repository.releases .ui.small.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

.page-content.repository.releases .ui.small.primary.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Divider */
.page-content.repository.releases > .ui.container > .divider {
  border-color: var(--gh-border-default) !important;
  margin: 16px 0 !important;
}

/* Release List */
#release-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Release Entry */
.release-entry {
  display: flex !important;
  gap: 24px !important;
  padding: 24px 0 !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.release-entry:first-child {
  padding-top: 0 !important;
}

.release-entry:last-child {
  border-bottom: none !important;
}

/* Meta Column (Left) */
.release-entry .meta {
  width: 200px !important;
  flex-shrink: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

.release-entry .meta a.muted {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  display: flex !important;
  align-items: center !important;
}

.release-entry .meta a.muted:hover {
  color: var(--gh-accent-fg) !important;
}

.release-entry .meta a.muted svg {
  width: 16px !important;
  height: 16px !important;
}

.release-entry .meta a.tw-font-mono {
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
}

/* Compare Dropdown */
.release-branch-tag-selector {
  margin-top: 8px !important;
}

.release-branch-tag-selector .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
}

/* Detail Column (Right) */
.release-entry .ui.segment.detail {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin: 0 !important;
  box-shadow: none !important;
}

/* Release Title */
.release-list-title {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.release-list-title a.muted {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.release-list-title a.muted:hover {
  text-decoration: underline !important;
}

/* Release Labels */
.release-entry .ui.label {
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 4px 10px !important;
  border-radius: 2em !important;
  margin: 0 !important;
}

.release-entry .ui.green.label {
  background: var(--gh-success-emphasis) !important;
  color: #ffffff !important;
  border: none !important;
}

.release-entry .ui.yellow.label {
  background: var(--gh-attention-subtle) !important;
  color: var(--gh-attention-fg) !important;
  border: 1px solid var(--gh-attention-muted) !important;
}

.release-entry .ui.orange.label {
  background: var(--gh-attention-subtle) !important;
  color: var(--gh-attention-fg) !important;
  border: 1px solid var(--gh-attention-muted) !important;
}

/* Edit Button */
.release-entry .detail a[data-tooltip-content*="Edit"] {
  color: var(--gh-fg-muted) !important;
  padding: 4px !important;
  border-radius: 6px !important;
}

.release-entry .detail a[data-tooltip-content*="Edit"]:hover {
  color: var(--gh-fg-default) !important;
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.release-entry .detail a[data-tooltip-content*="Edit"] svg {
  width: 16px !important;
  height: 16px !important;
}

/* Author Info */
.release-entry .text.grey {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  margin-top: 8px !important;
}

.release-entry .text.grey .author {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.release-entry .text.grey .author img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

.release-entry .text.grey .author a {
  color: var(--gh-fg-default) !important;
  font-weight: 500 !important;
}

.release-entry .text.grey .author a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

.release-entry .text.grey .ahead a {
  color: var(--gh-accent-fg) !important;
}

/* Release Notes */
.release-entry .render-content.markup {
  margin-top: 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.6 !important;
}

.release-entry .render-content.markup h1,
.release-entry .render-content.markup h2,
.release-entry .render-content.markup h3 {
  border-bottom: 1px solid var(--gh-border-muted) !important;
  padding-bottom: 8px !important;
  margin-top: 24px !important;
  margin-bottom: 16px !important;
}

.release-entry .render-content.markup h1:first-child,
.release-entry .render-content.markup h2:first-child,
.release-entry .render-content.markup h3:first-child {
  margin-top: 0 !important;
}

.release-entry .render-content.markup code {
  background: var(--gh-neutral-muted) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  font-size: 85% !important;
}

.release-entry .render-content.markup pre {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  overflow-x: auto !important;
}

.release-entry .render-content.markup pre code {
  background: transparent !important;
  padding: 0 !important;
}

/* Divider */
.release-entry .divider {
  border-color: var(--gh-border-muted) !important;
  margin: 16px 0 !important;
}

/* Downloads Section */
.release-entry details.download {
  margin-top: 16px !important;
}

.release-entry details.download summary {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
  list-style: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.release-entry details.download summary::-webkit-details-marker {
  display: none !important;
}

.release-entry details.download summary::before {
  content: "▶" !important;
  font-size: 10px !important;
  color: var(--gh-fg-muted) !important;
  transition: transform 0.2s !important;
}

.release-entry details.download[open] summary::before {
  transform: rotate(90deg) !important;
}

/* Attachment List */
.release-entry .attachment-list {
  margin-top: 12px !important;
  padding: 0 !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.release-entry .attachment-list .item {
  display: flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  gap: 8px !important;
}

.release-entry .attachment-list .item:last-child {
  border-bottom: none !important;
}

.release-entry .attachment-list .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.release-entry .attachment-list .item a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.release-entry .attachment-list .item a:hover {
  text-decoration: underline !important;
}

.release-entry .attachment-list .item a strong {
  font-weight: 500 !important;
}

.release-entry .attachment-list .item .download-icon {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
}

.release-entry .attachment-right-info {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

/* Archive Links */
.release-entry .archive-link {
  color: var(--gh-accent-fg) !important;
}

/* Delete Modal */
.page-content.repository.releases .ui.delete.modal {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

.page-content.repository.releases .ui.delete.modal .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 16px 20px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.releases .ui.delete.modal .header svg {
  color: var(--gh-danger-fg) !important;
  margin-right: 8px !important;
}

.page-content.repository.releases .ui.delete.modal .content {
  background: var(--gh-canvas-overlay) !important;
  padding: 20px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.releases .ui.delete.modal .actions {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  border-radius: 0 0 12px 12px !important;
  padding: 16px 20px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

.page-content.repository.releases .ui.delete.modal .actions .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

.page-content.repository.releases .ui.delete.modal .actions .ui.red.button {
  background: var(--gh-danger-emphasis) !important;
  border: 1px solid var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   PHASE 4: USER DASHBOARD - GitHub-style dashboard
   ========================================================================== */

.page-content.dashboard {
  background: var(--gh-canvas-default) !important;
}

.page-content.dashboard.feeds {
  padding-bottom: 32px !important;
}

/* Secondary Nav (Context Switcher) */
.secondary-nav {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 0 24px !important;
}

.secondary-nav .ui.secondary.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin: 0 !important;
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
}

.secondary-nav .ui.secondary.menu .item {
  padding: 12px 16px !important;
  margin: 0 !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.secondary-nav .ui.secondary.menu .item:hover {
  background: transparent !important;
}

.secondary-nav .ui.secondary.menu .item.active {
  font-weight: 600 !important;
  background: transparent !important;
  border-bottom: 2px solid var(--gh-primer-fg-open) !important;
  border-radius: 0 !important;
}

/* Context User Dropdown */
.secondary-nav .ui.floating.dropdown.jump {
  display: flex !important;
  align-items: center !important;
}

.secondary-nav .ui.floating.dropdown.jump .text {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.secondary-nav .ui.floating.dropdown.jump .text img {
  width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
}

.secondary-nav .ui.floating.dropdown.jump .text .dropdown.icon {
  color: var(--gh-fg-muted) !important;
}

/* Context Dropdown Menu */
.secondary-nav .ui.floating.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 8px 0 !important;
  min-width: 280px !important;
}

.secondary-nav .ui.floating.dropdown .menu .header {
  padding: 8px 16px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
}

.secondary-nav .ui.floating.dropdown .menu .scrolling.menu {
  max-height: 300px !important;
  overflow-y: auto !important;
  border: none !important;
  box-shadow: none !important;
}

.secondary-nav .ui.floating.dropdown .menu .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.secondary-nav .ui.floating.dropdown .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.secondary-nav .ui.floating.dropdown .menu .item.active,
.secondary-nav .ui.floating.dropdown .menu .item.selected {
  background: var(--gh-canvas-subtle) !important;
  font-weight: 600 !important;
}

.secondary-nav .ui.floating.dropdown .menu .item img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 50% !important;
}

.secondary-nav .ui.floating.dropdown .menu .item .ui.label {
  background: var(--gh-neutral-muted) !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 10px !important;
  padding: 2px 6px !important;
  border-radius: 2em !important;
}

/* Nav Items (Activities, Issues, PRs, Milestones) */
.secondary-nav .right.menu {
  margin-left: auto !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.secondary-nav .right.menu .item {
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  border-radius: 6px !important;
}

.secondary-nav .right.menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.secondary-nav .right.menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  background: transparent !important;
  border-bottom: 2px solid var(--gh-primer-fg-open) !important;
  border-radius: 0 !important;
}

.secondary-nav .right.menu .item svg {
  width: 16px !important;
  height: 16px !important;
}

/* View Home Button */
.secondary-nav .right.menu .ui.primary.basic.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

.secondary-nav .right.menu .ui.primary.basic.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Main Container - GitHub Layout: Sidebar LEFT, Feed CENTER */
.page-content.dashboard .flex-container {
  display: flex !important;
  flex-direction: row !important;
  gap: 24px !important;
  padding: 24px !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
}

/* Force sidebar to LEFT using order */
.page-content.dashboard .flex-container-sidebar,
.page-content.dashboard #dashboard-repo-list {
  order: -1 !important;
}

.page-content.dashboard .flex-container-main {
  flex: 1 !important;
  min-width: 0 !important;
  max-width: 850px !important;
  order: 1 !important;
}

/* Add "Home" header before feed - like GitHub */
.page-content.dashboard .flex-container-main::before {
  content: "Home" !important;
  display: block !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

/* Heatmap Container - GitHub-style Contribution Graph */
.activity-heatmap-container {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

#user-heatmap {
  overflow-x: auto !important;
}

/* Contribution count header */
#user-heatmap .contrib-number,
.activity-heatmap-container .total-contributions {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  font-weight: 400 !important;
  margin-bottom: 12px !important;
}

/* Calendar wrapper */
#user-heatmap .is-loading,
#user-heatmap > div {
  min-height: 110px !important;
}

/* Calendar cells - green color scheme matching GitHub */
#user-heatmap rect,
.activity-heatmap rect {
  rx: 2px !important;
  ry: 2px !important;
}

/* GitHub green color levels */
#user-heatmap .ContributionCalendar-day[data-level="0"],
.activity-heatmap .day[data-level="0"] {
  fill: var(--gh-color-calendar-graph-day-bg, #161b22) !important;
}

#user-heatmap .ContributionCalendar-day[data-level="1"],
.activity-heatmap .day[data-level="1"] {
  fill: var(--gh-color-calendar-graph-day-L1-bg, #0e4429) !important;
}

#user-heatmap .ContributionCalendar-day[data-level="2"],
.activity-heatmap .day[data-level="2"] {
  fill: var(--gh-color-calendar-graph-day-L2-bg, #006d32) !important;
}

#user-heatmap .ContributionCalendar-day[data-level="3"],
.activity-heatmap .day[data-level="3"] {
  fill: var(--gh-color-calendar-graph-day-L3-bg, #26a641) !important;
}

#user-heatmap .ContributionCalendar-day[data-level="4"],
.activity-heatmap .day[data-level="4"] {
  fill: var(--gh-color-calendar-graph-day-L4-bg, #39d353) !important;
}

/* Month labels */
#user-heatmap text,
.activity-heatmap text {
  fill: var(--gh-fg-muted) !important;
  font-size: 10px !important;
}

/* Legend - "Less" / "More" */
#user-heatmap .heatmap-legend,
.activity-heatmap .legend {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 11px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 8px !important;
  justify-content: flex-end !important;
}

#user-heatmap .heatmap-legend span,
.activity-heatmap .legend-text {
  margin: 0 4px !important;
}

/* Tooltip for heatmap cells */
#user-heatmap .tippy-box,
.activity-heatmap .tooltip {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  padding: 8px 10px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

/* Heatmap Divider */
.page-content.dashboard .activity-heatmap-container + .divider,
.page-content.user.profile .activity-heatmap-container + .divider {
  display: none !important;
}

/* Profile page specific heatmap styling */
.page-content.user.profile .activity-heatmap-container {
  margin-top: 0 !important;
}

/* Activity Feed - GitHub-style cards with action-specific colors */
#activity-feed {
  background: transparent !important;
}

/* Feed Section Header with Filter Button */
#activity-feed {
  position: relative !important;
}

#activity-feed::before {
  content: "Feed" !important;
  display: block !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

/* Filter button visual - positioned to the right of Feed header */
#activity-feed::after {
  content: "⊞ Filter" !important;
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default) !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

#activity-feed:hover::after {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

#activity-feed .flex-item {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 12px !important;
  display: flex !important;
  gap: 12px !important;
  transition: border-color 0.15s ease, background 0.15s ease !important;
  position: relative !important;
  border-left: 3px solid var(--gh-accent-emphasis) !important;
}

#activity-feed .flex-item:hover {
  border-color: var(--gh-border-muted) !important;
  background: var(--gh-canvas-subtle) !important;
}

/* Three-dot menu on activity cards - GitHub style */
#activity-feed .flex-item::after {
  content: "⋯" !important;
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  width: 28px !important;
  height: 28px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 16px !important;
  color: var(--gh-fg-muted) !important;
  background: transparent !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  opacity: 0 !important;
  transition: opacity 0.15s ease, background 0.15s ease !important;
}

#activity-feed .flex-item:hover::after {
  opacity: 1 !important;
}

#activity-feed .flex-item::after:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

/* Action-type specific left borders via icon detection */
/* Merged PRs - purple border */
#activity-feed .flex-item:has(.octicon-git-merge) {
  border-left-color: var(--gh-done-emphasis, #a371f7) !important;
}

/* Commits/pushes - green border */
#activity-feed .flex-item:has(.octicon-repo-push) {
  border-left-color: var(--gh-success-emphasis) !important;
}

/* Create repo - green border */
#activity-feed .flex-item:has(.octicon-repo):not(:has(.octicon-git-merge)):not(:has(.octicon-repo-push)) {
  border-left-color: var(--gh-success-emphasis) !important;
}

/* Issues opened - green */
#activity-feed .flex-item:has(.octicon-issue-opened) {
  border-left-color: var(--gh-success-emphasis) !important;
}

/* Issues closed - red */
#activity-feed .flex-item:has(.octicon-issue-closed) {
  border-left-color: var(--gh-closed-emphasis, #f85149) !important;
}

/* PRs opened - green */
#activity-feed .flex-item:has(.octicon-git-pull-request):not(:has(.octicon-git-merge)) {
  border-left-color: var(--gh-success-emphasis) !important;
}

/* Comments - blue */
#activity-feed .flex-item:has(.octicon-comment) {
  border-left-color: var(--gh-accent-emphasis) !important;
}

/* Tags - yellow */
#activity-feed .flex-item:has(.octicon-tag) {
  border-left-color: var(--gh-attention-emphasis) !important;
}

/* Releases - green */
#activity-feed .flex-item:has(.octicon-package) {
  border-left-color: #3fb950 !important;
}

/* Fallback for browsers without :has() */
@supports not selector(:has(*)) {
  #activity-feed .flex-item:nth-child(3n+1) {
    border-left-color: var(--gh-accent-emphasis) !important;
  }
  #activity-feed .flex-item:nth-child(3n+2) {
    border-left-color: var(--gh-success-emphasis) !important;
  }
  #activity-feed .flex-item:nth-child(3n) {
    border-left-color: var(--gh-done-emphasis, #a371f7) !important;
  }
}

#activity-feed .flex-item-leading {
  flex-shrink: 0 !important;
}

#activity-feed .flex-item-leading img {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
}

#activity-feed .flex-item-main {
  flex: 1 !important;
  min-width: 0 !important;
}

#activity-feed .flex-item-main a {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

#activity-feed .flex-item-main a:hover {
  text-decoration: underline !important;
}

#activity-feed .flex-item-main > div:first-child {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.5 !important;
}

/* Commit Info in Activity */
#activity-feed .flex-text-block {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 8px !important;
  font-size: 13px !important;
}

#activity-feed .flex-text-block img {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
}

#activity-feed .ui.sha.label {
  background: var(--gh-neutral-muted) !important;
  border: none !important;
  color: var(--gh-accent-fg) !important;
  font-family: var(--gh-fontStack-monospace) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
}

#activity-feed .text.truncate {
  color: var(--gh-fg-muted) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Issue Title in Activity */
#activity-feed .issue.title {
  color: var(--gh-fg-default) !important;
  font-weight: 500 !important;
  display: block !important;
  margin-top: 4px !important;
}

/* Comment Preview in Activity */
#activity-feed .render-content.markup {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-top: 8px !important;
  font-size: 13px !important;
  color: var(--gh-fg-default) !important;
  max-height: 100px !important;
  overflow: hidden !important;
}

/* Activity Icon */
#activity-feed .flex-item-trailing {
  flex-shrink: 0 !important;
  display: flex !important;
  align-items: flex-start !important;
}

#activity-feed .flex-item-trailing svg {
  width: 24px !important;
  height: 24px !important;
  color: var(--gh-fg-muted) !important;
}

/* Compare Commits Link */
#activity-feed a[href*="/compare/"] {
  font-size: 12px !important;
  color: var(--gh-accent-fg) !important;
  margin-top: 8px !important;
  display: inline-block !important;
}

/* Merged PR Badge - Purple "Merged" pill */
#activity-feed .flex-item:has(.octicon-git-merge) .flex-item-body.text {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 8px !important;
}

#activity-feed .flex-item:has(.octicon-git-merge) .flex-item-body.text::before {
  content: "Merged" !important;
  display: inline-block !important;
  background: var(--gh-done-emphasis, #a371f7) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 16px !important;
  text-transform: capitalize !important;
}

/* Merged icon styling */
#activity-feed .flex-item:has(.octicon-git-merge) .flex-item-trailing svg {
  color: var(--gh-done-emphasis, #a371f7) !important;
}

/* Issue/PR state badges in activity */
#activity-feed .flex-item:has(.octicon-issue-opened) .flex-item-trailing svg {
  color: var(--gh-success-emphasis) !important;
}

#activity-feed .flex-item:has(.octicon-issue-closed) .flex-item-trailing svg {
  color: var(--gh-closed-emphasis, #f85149) !important;
}

#activity-feed .flex-item:has(.octicon-git-pull-request) .flex-item-trailing svg {
  color: var(--gh-success-emphasis) !important;
}

#activity-feed .flex-item:has(.octicon-repo-push) .flex-item-trailing svg {
  color: var(--gh-success-emphasis) !important;
}

/* Activity card repo info - enhance repo link styling */
#activity-feed .flex-item-main > div:first-child a[href*="/"] {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

/* Repository name in activity cards */
#activity-feed .flex-item-main > div:first-child a[href*="/"]:first-of-type {
  color: var(--gh-fg-default) !important;
}

/* Timestamp in activity */
#activity-feed .flex-item-main > div:first-child .time-since,
#activity-feed .flex-item-main > div:first-child relative-time,
#activity-feed .flex-item-main > div:first-child time-since {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  margin-left: 4px !important;
}

/* Repo List Sidebar - GitHub-style LEFT sidebar */
#dashboard-repo-list {
  width: 280px !important;
  flex-shrink: 0 !important;
  order: -1 !important; /* Force to left side */
}

/* Ensure sidebar is on left at all screen sizes */
.page-content.dashboard .flex-container-sidebar,
.page-content.dashboard #dashboard-repo-list {
  order: -1 !important;
}

/* Repo List Header - "Top repositories" style */
#dashboard-repo-list .repo-panel-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 0 12px 0 !important;
  margin-bottom: 8px !important;
  border-bottom: none !important;
}

#dashboard-repo-list .repo-panel-header h4 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
}

/* Green "New" button for creating repos */
#dashboard-repo-list .repo-panel-header .ui.button,
#dashboard-repo-list .repo-panel-header a.ui.button {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  min-height: auto !important;
  line-height: 1 !important;
}

#dashboard-repo-list .repo-panel-header .ui.button:hover,
#dashboard-repo-list .repo-panel-header a.ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
}

/* Repo Search - "Find a repository..." */
#dashboard-repo-list .repo-search {
  margin-bottom: 8px !important;
}

#dashboard-repo-list .repo-search input {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
}

#dashboard-repo-list .repo-search input::placeholder {
  color: var(--gh-fg-muted) !important;
}

#dashboard-repo-list .repo-search input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Repo Filter Tabs */
#dashboard-repo-list .repo-filter {
  display: flex !important;
  gap: 4px !important;
  margin-bottom: 12px !important;
  flex-wrap: wrap !important;
}

#dashboard-repo-list .repo-filter .item {
  padding: 4px 10px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 6px !important;
  cursor: pointer !important;
}

#dashboard-repo-list .repo-filter .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

#dashboard-repo-list .repo-filter .item.active {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  color: var(--gh-accent-fg) !important;
  font-weight: 500 !important;
}

/* Repo List Items */
#dashboard-repo-list .repo-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

#dashboard-repo-list .repo-list .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
}

#dashboard-repo-list .repo-list .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

#dashboard-repo-list .repo-list .item svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

#dashboard-repo-list .repo-list .item .repo-name {
  flex: 1 !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  font-weight: 500 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

#dashboard-repo-list .repo-list .item .repo-owner {
  color: var(--gh-fg-muted) !important;
  font-weight: 400 !important;
}

#dashboard-repo-list .repo-list .item .repo-star {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* Org List */
#dashboard-repo-list .org-panel {
  margin-top: 24px !important;
  padding-top: 24px !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

#dashboard-repo-list .org-panel h4 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 0 12px 0 !important;
}

#dashboard-repo-list .org-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}

#dashboard-repo-list .org-list .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
}

#dashboard-repo-list .org-list .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

#dashboard-repo-list .org-list .item img {
  width: 20px !important;
  height: 20px !important;
  border-radius: 6px !important;
}

#dashboard-repo-list .org-list .item span {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

/* Pagination */
#activity-feed .ui.pagination.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  margin-top: 16px !important;
}

#activity-feed .ui.pagination.menu .item {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  margin: 0 2px !important;
}

#activity-feed .ui.pagination.menu .item:hover {
  background: var(--gh-btn-hover-bg) !important;
}

#activity-feed .ui.pagination.menu .item.active {
  background: var(--gh-accent-emphasis) !important;
  border-color: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
}

/* Guide (Empty State) */
.page-content.dashboard .guide {
  text-align: center !important;
  padding: 48px 24px !important;
}

.page-content.dashboard .guide h4 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.page-content.dashboard .guide p {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 16px !important;
}

.page-content.dashboard .guide .ui.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   PHASE 4.2: USER PROFILE PAGE - GitHub-style
   ========================================================================== */

/* Profile Page Container */
.page-content.user.profile {
  background: var(--gh-canvas-default) !important;
  padding-top: 24px !important;
}

.page-content.user.profile > .ui.container {
  max-width: 1280px !important;
  padding: 0 32px !important;
}

.page-content.user.profile > .ui.container > .ui.grid {
  margin: 0 !important;
}

/* Profile Sidebar (4-wide column) */
.page-content.user.profile .four.wide.column {
  padding-right: 24px !important;
}

/* Profile Avatar Card */
#profile-avatar-card {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

#profile-avatar-card .content {
  padding: 0 !important;
  border: none !important;
}

/* Profile Avatar */
#profile-avatar {
  margin-bottom: 16px !important;
}

#profile-avatar .image {
  display: block !important;
  width: 100% !important;
  max-width: 296px !important;
}

#profile-avatar img,
#profile-avatar-card img.avatar {
  width: 100% !important;
  height: auto !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Profile Name and Username */
.profile-avatar-name {
  padding: 0 !important;
  background: transparent !important;
}

.profile-avatar-name .header {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}

.profile-avatar-name .username {
  font-size: 20px !important;
  font-weight: 300 !important;
  color: var(--gh-fg-muted) !important;
  line-height: 24px !important;
  display: block !important;
}

.profile-avatar-name .username a {
  color: var(--gh-fg-muted) !important;
}

/* Followers/Following Stats */
.profile-avatar-name > div {
  margin-top: 16px !important;
}

.profile-avatar-name a.muted {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

.profile-avatar-name a.muted:hover {
  color: var(--gh-accent-fg) !important;
}

.profile-avatar-name a.muted svg {
  vertical-align: text-bottom !important;
}

/* Profile Extra Content (Info List) */
#profile-avatar-card .extra.content {
  padding: 16px 0 0 0 !important;
  background: transparent !important;
  border-top: 1px solid var(--gh-border-default) !important;
  margin-top: 16px !important;
}

#profile-avatar-card .extra.content ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#profile-avatar-card .extra.content li {
  display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  padding: 4px 0 !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

#profile-avatar-card .extra.content li svg {
  flex-shrink: 0 !important;
  margin-top: 2px !important;
  color: var(--gh-fg-muted) !important;
}

#profile-avatar-card .extra.content li a {
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
  word-break: break-all !important;
}

#profile-avatar-card .extra.content li a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Blocked User Warning */
#profile-avatar-card .extra.content li.text.red {
  color: var(--gh-danger-fg) !important;
}

#profile-avatar-card .extra.content li.text.small.red {
  font-size: 12px !important;
  color: var(--gh-danger-fg) !important;
}

/* Organizations List in Profile */
#profile-avatar-card .user-orgs {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#profile-avatar-card .user-orgs li {
  padding: 0 !important;
}

#profile-avatar-card .user-orgs a {
  display: block !important;
}

#profile-avatar-card .user-orgs img {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Badges List */
#profile-avatar-card .user-badges {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

#profile-avatar-card .user-badges li {
  padding: 0 !important;
}

#profile-avatar-card .user-badges img {
  width: 48px !important;
  height: 48px !important;
  border-radius: 6px !important;
}

/* Follow/Unfollow Button */
#profile-avatar-card li.follow {
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

#profile-avatar-card li.follow .ui.button {
  width: 100% !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  text-align: center !important;
  justify-content: center !important;
}

#profile-avatar-card li.follow .ui.button.primary {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

#profile-avatar-card li.follow .ui.button.primary:hover {
  background: var(--gh-btn-primary-hover-bg) !important;
}

#profile-avatar-card li.follow .ui.button.red {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-danger-fg) !important;
}

#profile-avatar-card li.follow .ui.button.red:hover {
  background: var(--gh-danger-fg) !important;
  border-color: var(--gh-danger-fg) !important;
  color: #ffffff !important;
}

/* Block User Link */
#profile-avatar-card .extra.content li > a.show-modal,
#profile-avatar-card .extra.content li > a[href*="blocked_users"] {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

#profile-avatar-card .extra.content li > a.show-modal:hover,
#profile-avatar-card .extra.content li > a[href*="blocked_users"]:hover {
  color: var(--gh-danger-fg) !important;
  text-decoration: underline !important;
}

/* Profile Main Content (12-wide column) */
.page-content.user.profile .twelve.wide.column {
  padding-left: 24px !important;
}

/* Profile Tab Navigation */
.page-content.user.profile overflow-menu.ui.secondary.pointing.tabular.menu {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  margin-bottom: 16px !important;
  padding: 0 !important;
}

.page-content.user.profile overflow-menu .overflow-menu-items {
  display: flex !important;
  gap: 0 !important;
}

.page-content.user.profile overflow-menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  border-radius: 6px 6px 0 0 !important;
}

.page-content.user.profile overflow-menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.page-content.user.profile overflow-menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  background: transparent !important;
}

.page-content.user.profile overflow-menu .item.active::after {
  content: "" !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: var(--gh-primer-fg-open) !important;
  border-radius: 6px 6px 0 0 !important;
}

.page-content.user.profile overflow-menu .item svg {
  color: var(--gh-fg-muted) !important;
}

.page-content.user.profile overflow-menu .item.active svg {
  color: var(--gh-fg-default) !important;
}

/* Counter Labels in Tabs */
.page-content.user.profile overflow-menu .item .ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 0 6px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  min-width: 18px !important;
  text-align: center !important;
  line-height: 18px !important;
}

/* Profile README Content */
#readme_profile {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 32px !important;
  margin-bottom: 16px !important;
}

/* User Cards (Followers, Following, Organizations) */
.user-cards {
  background: transparent !important;
}

.user-cards h2.ui.dividing.header {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding-bottom: 8px !important;
  margin-bottom: 16px !important;
}

.user-cards .list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 16px !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.user-cards .list .item {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  box-shadow: none !important;
}

.user-cards .list .item:hover {
  border-color: var(--gh-border-muted) !important;
}

.user-cards .list .item > a:first-child {
  flex-shrink: 0 !important;
}

.user-cards .list .item img {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

.user-cards .list .item h3.name {
  font-size: 16px !important;
  font-weight: 600 !important;
  margin: 0 0 4px 0 !important;
}

.user-cards .list .item h3.name a {
  color: var(--gh-fg-default) !important;
  text-decoration: none !important;
}

.user-cards .list .item h3.name a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

.user-cards .list .item .meta {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.user-cards .list .item .meta svg {
  width: 12px !important;
  height: 12px !important;
}

.user-cards .list .item .meta a {
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

.user-cards .list .item .meta a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Stars Tab - Repo Search and List (already styled in shared/repo) */
.page-content.user.profile .stars {
  background: transparent !important;
}

/* Profile Page Repo List - GitHub "Pinned" Repo Card Style */
.page-content.user.profile .flex-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.page-content.user.profile .flex-list > .flex-item {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  transition: border-color 0.15s ease !important;
}

.page-content.user.profile .flex-list > .flex-item:hover {
  border-color: var(--gh-border-muted) !important;
}

/* Repo icon in profile list */
.page-content.user.profile .flex-list > .flex-item .flex-item-leading {
  flex-shrink: 0 !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-leading svg {
  color: var(--gh-fg-muted) !important;
}

/* Repo title and badges */
.page-content.user.profile .flex-list > .flex-item .flex-item-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-title a.name {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-title a.name:hover {
  text-decoration: underline !important;
}

/* Visibility/status badges */
.page-content.user.profile .flex-list > .flex-item .label-list {
  display: inline-flex !important;
  gap: 4px !important;
}

.page-content.user.profile .flex-list > .flex-item .label-list .ui.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 16px !important;
  padding: 1px 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

/* Repo stats (language, stars, forks) */
.page-content.user.profile .flex-list > .flex-item .flex-item-trailing {
  display: flex !important;
  gap: 16px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-trailing a {
  color: var(--gh-fg-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.user.profile .flex-list > .flex-item .flex-item-trailing svg {
  width: 16px !important;
  height: 16px !important;
}

/* Language color dot */
.page-content.user.profile .flex-list > .flex-item .color-icon {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  display: inline-block !important;
}

/* Repo description */
.page-content.user.profile .flex-list > .flex-item .flex-item-body {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 8px !important;
  line-height: 1.5 !important;
}

/* Topic labels */
.page-content.user.profile .flex-list > .flex-item .label-list a.ui.label {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  border: none !important;
  color: var(--gh-accent-fg) !important;
  font-size: 12px !important;
  padding: 2px 10px !important;
  border-radius: 16px !important;
  font-weight: 500 !important;
}

.page-content.user.profile .flex-list > .flex-item .label-list a.ui.label:hover {
  background: var(--gh-accent-muted, rgba(56, 139, 253, 0.25)) !important;
}

/* ==========================================================================
   PHASE 4.3: ORGANIZATION PROFILE PAGE - GitHub-style
   ========================================================================== */

/* Org Profile Container */
.page-content.organization.profile {
  background: var(--gh-canvas-default) !important;
}

/* Org Header */
.page-content.organization.profile > .ui.container:first-of-type {
  padding: 24px 32px !important;
  max-width: 1280px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

/* Org Avatar */
.page-content.organization.profile .org-avatar {
  width: 100px !important;
  height: 100px !important;
  border-radius: 6px !important;
  border: 1px solid var(--gh-border-default) !important;
  flex-shrink: 0 !important;
}

/* Org Info */
#org-info {
  min-width: 0 !important;
}

#org-info .ui.header {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin: 0 0 4px 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Org Visibility Badge */
#org-info .org-visibility .ui.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
  text-transform: capitalize !important;
}

/* Org Description */
#org-info .render-content {
  font-size: 16px !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

/* Org Meta Info (Location, Website, Email) */
#org-info .text.light.meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

#org-info .text.light.meta .flex-text-block {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

#org-info .text.light.meta svg {
  color: var(--gh-fg-muted) !important;
}

#org-info .text.light.meta a {
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

#org-info .text.light.meta a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Org RSS and Follow Buttons */
#org-info > .ui.header > span:last-child {
  margin-left: auto !important;
}

#org-info .ui.basic.label.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
}

#org-info .ui.basic.label.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

/* Org Follow/Unfollow Button */
.page-content.organization.profile .follow-org-button .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

.page-content.organization.profile .follow-org-button .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
}

.page-content.organization.profile .follow-org-button .ui.button.primary {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
}

/* Org Menu/Tabs */
.page-content.organization.profile overflow-menu.ui.secondary.pointing.tabular.menu,
.page-content.organization.profile .ui.secondary.pointing.menu {
  background: var(--gh-canvas-default) !important;
  border: none !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 0 32px !important;
  margin: 0 !important;
}

.page-content.organization.profile overflow-menu .overflow-menu-items,
.page-content.organization.profile .ui.secondary.pointing.menu {
  display: flex !important;
  gap: 0 !important;
}

.page-content.organization.profile overflow-menu .item,
.page-content.organization.profile .ui.secondary.pointing.menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.page-content.organization.profile overflow-menu .item:hover,
.page-content.organization.profile .ui.secondary.pointing.menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.page-content.organization.profile overflow-menu .item.active,
.page-content.organization.profile .ui.secondary.pointing.menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  background: transparent !important;
}

.page-content.organization.profile overflow-menu .item.active::after,
.page-content.organization.profile .ui.secondary.pointing.menu .item.active::after {
  content: "" !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: var(--gh-primer-fg-open) !important;
  border-radius: 6px 6px 0 0 !important;
}

/* Org Main Content */
.page-content.organization.profile > .ui.container:last-of-type {
  max-width: 1280px !important;
  padding: 24px 32px !important;
}

.page-content.organization.profile > .ui.container:last-of-type > .ui.grid {
  margin: 0 !important;
}

/* Org 11-wide Column (Main Content) */
.page-content.organization.profile .eleven.wide.column {
  padding-right: 24px !important;
}

/* Org 5-wide Column (Sidebar) */
.page-content.organization.profile .five.wide.column {
  padding-left: 24px !important;
}

/* Org Create Repo/Migrate Buttons */
.page-content.organization.profile .five.wide.column > div:first-child .ui.primary.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

.page-content.organization.profile .five.wide.column > div:first-child .ui.primary.button:hover {
  background: var(--gh-btn-primary-hover-bg) !important;
}

.page-content.organization.profile .five.wide.column .divider {
  margin: 16px 0 !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

/* View As Dropdown */
#org-home-view-as-dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

#org-home-view-as-dropdown .text {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

#org-home-view-as-dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 4px 0 !important;
  min-width: 160px !important;
}

#org-home-view-as-dropdown .menu .item {
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

#org-home-view-as-dropdown .menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

#org-home-view-as-dropdown .menu .item.selected {
  font-weight: 600 !important;
}

/* Members Section */
.page-content.organization.profile .ui.top.attached.header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-bottom: none !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.page-content.organization.profile .ui.top.attached.header strong {
  font-weight: 600 !important;
}

.page-content.organization.profile .ui.top.attached.header a {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  text-decoration: none !important;
}

.page-content.organization.profile .ui.top.attached.header a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.organization.profile .ui.attached.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  padding: 16px !important;
  margin: 0 !important;
}

.page-content.organization.profile .ui.attached.segment.members {
  border-radius: 0 0 6px 6px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.page-content.organization.profile .ui.attached.segment.members a {
  display: block !important;
}

.page-content.organization.profile .ui.attached.segment.members img {
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Teams Section */
.page-content.organization.profile .ui.attached.table.segment.teams {
  border-radius: 0 !important;
  padding: 0 !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .item {
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .item:last-child {
  border-bottom: none !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .team-name {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .text.grey {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 4px !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .text.grey a {
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

.page-content.organization.profile .ui.attached.table.segment.teams .text.grey a:hover {
  color: var(--gh-accent-fg) !important;
}

/* Create Team Button */
.page-content.organization.profile .ui.bottom.attached.segment {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 12px 16px !important;
  text-align: center !important;
}

.page-content.organization.profile .ui.bottom.attached.segment .ui.primary.small.button {
  background: var(--gh-btn-primary-bg) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  color: var(--gh-btn-primary-text) !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

/* Org Profile README */
.page-content.organization.profile #readme_profile {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 24px !important;
  margin-bottom: 16px !important;
}

/* Block User Modal */
#block-user-modal {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

#block-user-modal .header {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 16px 24px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

#block-user-modal .content {
  background: var(--gh-canvas-overlay) !important;
  padding: 24px !important;
}

#block-user-modal .actions {
  background: var(--gh-canvas-subtle) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  border-radius: 0 0 12px 12px !important;
  padding: 16px 24px !important;
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}

#block-user-modal .actions .ui.button {
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
}

#block-user-modal .actions .ui.button:not(.red) {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
}

#block-user-modal .actions .ui.button.red {
  background: var(--gh-danger-emphasis) !important;
  border: 1px solid var(--gh-danger-emphasis) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   PHASE 5: EXPLORE PAGES - GitHub-style
   ========================================================================== */

/* Explore Page Container */
.page-content.explore {
  background: var(--gh-canvas-default) !important;
}

/* Explore Secondary Nav */
.page-content.explore overflow-menu.secondary-nav,
.page-content.explore .ui.secondary.pointing.tabular.menu.secondary-nav {
  background: var(--gh-canvas-default) !important;
  border: none !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.page-content.explore overflow-menu .overflow-menu-items {
  display: flex !important;
  justify-content: center !important;
  gap: 0 !important;
  padding: 0 24px !important;
}

.page-content.explore overflow-menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.page-content.explore overflow-menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.page-content.explore overflow-menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

.page-content.explore overflow-menu .item.active::after {
  content: "" !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  right: 0 !important;
  height: 2px !important;
  background: var(--gh-primer-fg-open) !important;
  border-radius: 6px 6px 0 0 !important;
}

/* Explore Main Content */
.page-content.explore > .ui.container {
  max-width: 1280px !important;
  padding: 24px 32px !important;
}

/* Repo Search Form */
.ui.small.secondary.filter.menu {
  background: transparent !important;
  border: none !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}

.ui.small.secondary.filter.menu .ui.small.fluid.action.input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.ui.small.secondary.filter.menu .ui.small.fluid.action.input input {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
}

.ui.small.secondary.filter.menu .ui.small.fluid.action.input button,
.ui.small.secondary.filter.menu .ui.small.fluid.action.input .ui.button {
  background: var(--gh-btn-bg) !important;
  border: none !important;
  border-left: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 0 !important;
  padding: 8px 16px !important;
}

/* Filter/Sort Dropdowns */
.ui.small.secondary.filter.menu .item.ui.small.dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 6px 12px !important;
}

.ui.small.secondary.filter.menu .item.ui.small.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 8px 0 !important;
}

/* Repo List (Flex List) */
.flex-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
}

.flex-list .flex-item {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 24px 0 !important;
  display: flex !important;
  gap: 16px !important;
}

.flex-list .flex-item:first-child {
  border-top: 1px solid var(--gh-border-default) !important;
}

.flex-list .flex-item-title {
  font-size: 16px !important;
  font-weight: 600 !important;
}

.flex-list .flex-item-title a.name {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.flex-list .flex-item-title a.name:hover {
  text-decoration: underline !important;
}

/* Repo Labels */
.flex-list .flex-item-title .label-list .ui.basic.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 0 6px !important;
  border-radius: 12px !important;
}

/* Repo Stats */
.flex-list .flex-item-trailing {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.flex-list .flex-item-trailing a {
  color: var(--gh-fg-muted) !important;
}

.flex-list .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

/* Repo Topics */
.flex-list .label-list a.ui.label {
  background: rgba(56, 139, 253, 0.15) !important;
  border: none !important;
  color: var(--gh-accent-fg) !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
}

/* ==========================================================================
   PHASE 6: NOTIFICATIONS PAGE - GitHub-style
   ========================================================================== */

.page-content.user.notification {
  background: var(--gh-canvas-default) !important;
  padding-top: 24px !important;
}

.page-content.user.notification > .ui.container {
  max-width: 1000px !important;
}

/* Notification Tabs */
.page-content.user.notification .small-menu-items.ui.compact.tiny.menu {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

.page-content.user.notification .small-menu-items .item {
  background: transparent !important;
  border-right: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  padding: 8px 16px !important;
}

.page-content.user.notification .small-menu-items .item.active {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* Notification Count Badge */
.page-content.user.notification .notifications-unread-count {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
  font-size: 12px !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
}

/* Notification Table */
#notification_table {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.notifications-item {
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 16px !important;
  display: flex !important;
  gap: 12px !important;
}

.notifications-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

.notifications-item .notifications-link .tw-text-16 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

/* Empty State */
.page-content.user.notification .empty-placeholder {
  text-align: center !important;
  padding: 48px !important;
  color: var(--gh-fg-muted) !important;
}

/* ==========================================================================
   PHASE 7: USER SETTINGS PAGES - GitHub-style
   ========================================================================== */

.page-content.user.settings {
  background: var(--gh-canvas-default) !important;
}

/* Settings Sidebar */
.flex-container-nav {
  width: 256px !important;
  flex-shrink: 0 !important;
}

.flex-container-nav .ui.fluid.vertical.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.flex-container-nav .ui.vertical.menu .header.item {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

.flex-container-nav .ui.vertical.menu .item {
  background: transparent !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
}

.flex-container-nav .ui.vertical.menu .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.flex-container-nav .ui.vertical.menu .item.active {
  background: var(--gh-canvas-subtle) !important;
  font-weight: 600 !important;
}

/* ==========================================================================
   PHASE 8: GLOBAL FOOTER - GitHub-style
   ========================================================================== */

.page-footer {
  background: var(--gh-canvas-default) !important;
  border-top: 1px solid var(--gh-border-default) !important;
  padding: 24px 32px !important;
  display: flex !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
}

.page-footer .left-links,
.page-footer .right-links {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.page-footer a,
.page-footer span {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

.page-footer a:hover {
  color: var(--gh-accent-fg) !important;
}

/* Footer Dropdowns */
.page-footer .ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

/* ==========================================================================
   PHASE 9: FORM CONTROLS - GitHub-style
   ========================================================================== */

/* Input Fields */
.ui.input input,
.ui.form input[type="text"],
.ui.form input[type="email"],
.ui.form input[type="password"],
.ui.form textarea,
.ui.form select {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
}

.ui.input input:focus,
.ui.form input:focus,
.ui.form textarea:focus {
  border-color: var(--gh-accent-fg) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Checkboxes */
.ui.checkbox label::before {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 3px !important;
}

.ui.checkbox input:checked ~ label::before {
  background: var(--gh-accent-emphasis) !important;
  border-color: var(--gh-accent-emphasis) !important;
}

/* Message/Alert Boxes */
.ui.message {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
}

.ui.message.info {
  background: rgba(56, 139, 253, 0.1) !important;
  border-color: rgba(56, 139, 253, 0.4) !important;
}

.ui.message.success {
  background: rgba(35, 134, 54, 0.1) !important;
  border-color: rgba(35, 134, 54, 0.4) !important;
}

.ui.message.warning {
  background: var(--gh-attention-subtle) !important;
  border-color: var(--gh-attention-muted) !important;
}

.ui.message.error {
  background: rgba(248, 81, 73, 0.1) !important;
  border-color: rgba(248, 81, 73, 0.4) !important;
}

/* ==========================================================================
   HEADER BUTTONS - New Repository & Import buttons
   ========================================================================== */

#navbar a.item.gh-header-btn,
.navbar-right a.item.gh-header-btn,
a.gh-header-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  border-radius: 6px !important;
  border: 1px solid var(--gh-btn-border, #30363d) !important;
  background: var(--gh-btn-bg, #21262d) !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  cursor: pointer !important;
  transition: background 0.1s, border-color 0.1s !important;
  margin-right: 8px !important;
}

#navbar a.item.gh-header-btn:hover,
.navbar-right a.item.gh-header-btn:hover,
a.gh-header-btn:hover {
  background: var(--gh-btn-hover-bg, #30363d) !important;
  border-color: var(--gh-btn-hover-border, #9198a1) !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

#navbar .gh-header-btn .svg,
a.gh-header-btn .svg {
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
}

.gh-btn-text {
  font-weight: 500 !important;
}

/* Green style for New Repository button - HIGH SPECIFICITY */
#navbar a.item.gh-new-repo-btn,
.navbar-right a.item.gh-new-repo-btn,
a.gh-new-repo-btn {
  background: #238636 !important;
  background-color: #238636 !important;
  border-color: #238636 !important;
  color: #ffffff !important;
}

#navbar a.item.gh-new-repo-btn:hover,
.navbar-right a.item.gh-new-repo-btn:hover,
a.gh-new-repo-btn:hover {
  background: #2ea043 !important;
  background-color: #2ea043 !important;
  border-color: #2ea043 !important;
  color: #ffffff !important;
}

/* Subtle style for Import button */
#navbar a.item.gh-migrate-btn,
.navbar-right a.item.gh-migrate-btn,
a.gh-migrate-btn {
  background: transparent !important;
  background-color: transparent !important;
  border-color: var(--gh-border-default, #30363d) !important;
}

#navbar a.item.gh-migrate-btn:hover,
.navbar-right a.item.gh-migrate-btn:hover,
a.gh-migrate-btn:hover {
  background: var(--gh-btn-hover-bg, #30363d) !important;
  background-color: var(--gh-btn-hover-bg, #30363d) !important;
}

/* ==========================================================================
   v31: ENHANCED UI - Closer GitHub Match
   ========================================================================== */

/* ---------------------------------------------------------------------------
   Flash Messages / Notification Banners - GitHub Style
   --------------------------------------------------------------------------- */

/* Info message - Blue notification banner */
.ui.info.message,
.flash-message.flash-info {
  background: rgba(56, 139, 253, 0.15) !important;
  border: 1px solid rgba(56, 139, 253, 0.4) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.ui.info.message::before {
  content: "" !important;
  display: none !important;
}

.ui.info.message p {
  margin: 0 !important;
  flex: 1 !important;
}

/* Success message - Green */
.ui.positive.message,
.ui.success.message,
.flash-message.flash-success {
  background: rgba(46, 160, 67, 0.15) !important;
  border: 1px solid rgba(46, 160, 67, 0.4) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
}

/* Error message - Red */
.ui.negative.message,
.ui.error.message,
.flash-message.flash-error {
  background: rgba(248, 81, 73, 0.15) !important;
  border: 1px solid rgba(248, 81, 73, 0.4) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
}

/* Warning message - Yellow */
.ui.warning.message,
.flash-message.flash-warning {
  background: rgba(187, 128, 9, 0.15) !important;
  border: 1px solid rgba(187, 128, 9, 0.4) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
}

/* ---------------------------------------------------------------------------
   Dashboard Sidebar - GitHub Style Repo List
   --------------------------------------------------------------------------- */

/* Sidebar container */
#dashboard-repo-list {
  width: 280px !important;
  flex-shrink: 0 !important;
  order: -1 !important;
}

/* Tab menu (Repository/Organization) */
#dashboard-repo-list .ui.two.item.menu {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  border-radius: 0 !important;
  margin-bottom: 16px !important;
}

#dashboard-repo-list .ui.two.item.menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  border-bottom: 2px solid transparent !important;
}

#dashboard-repo-list .ui.two.item.menu .item.active {
  color: var(--gh-fg-default) !important;
  border-bottom-color: var(--gh-underlinenav-borderColor-active, #f78166) !important;
  font-weight: 600 !important;
}

#dashboard-repo-list .ui.two.item.menu .item:hover {
  color: var(--gh-fg-default) !important;
}

/* Header "My Repos" with count */
#dashboard-repo-list .ui.top.attached.header {
  background: transparent !important;
  border: none !important;
  padding: 0 0 12px 0 !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

#dashboard-repo-list .ui.top.attached.header .ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border: none !important;
  padding: 2px 8px !important;
  font-size: 12px !important;
  border-radius: 10px !important;
  font-weight: 500 !important;
}

/* New repo button in header */
#dashboard-repo-list .ui.top.attached.header a.muted {
  color: var(--gh-fg-muted) !important;
  padding: 4px !important;
  border-radius: 6px !important;
}

#dashboard-repo-list .ui.top.attached.header a.muted:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

/* Search input */
#dashboard-repo-list .ui.attached.segment.repos-search {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 0 8px 0 !important;
}

#dashboard-repo-list .repos-search .ui.input input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  padding: 5px 12px 5px 32px !important;
}

#dashboard-repo-list .repos-search .ui.input input::placeholder {
  color: var(--gh-fg-muted) !important;
}

#dashboard-repo-list .repos-search .ui.input input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
  outline: none !important;
}

/* Filter dropdown button */
#dashboard-repo-list .repos-search .ui.dropdown.button {
  background: transparent !important;
  border: none !important;
  padding: 6px !important;
  margin: 0 !important;
  color: var(--gh-fg-muted) !important;
}

#dashboard-repo-list .repos-search .ui.dropdown.button:hover {
  color: var(--gh-fg-default) !important;
  background: var(--gh-actionListItem-default-hoverBg) !important;
  border-radius: 6px !important;
}

/* Filter tabs (All, Sources, Forks, etc.) */
#dashboard-repo-list .repos-filter {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 8px 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

#dashboard-repo-list .repos-filter .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  margin: 0 !important;
}

#dashboard-repo-list .repos-filter .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

#dashboard-repo-list .repos-filter .item.active {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  color: var(--gh-accent-fg) !important;
  font-weight: 500 !important;
}

#dashboard-repo-list .repos-filter .item .ui.label {
  background: transparent !important;
  color: inherit !important;
  font-size: 11px !important;
  padding: 0 0 0 4px !important;
  margin: 0 !important;
}

/* Repo list container */
#dashboard-repo-list .ui.attached.table.segment {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Individual repo items */
#dashboard-repo-list .repo-owner-name-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 2px !important;
}

#dashboard-repo-list .repo-owner-name-list li {
  padding: 6px 8px !important;
  border-radius: 6px !important;
  border: none !important;
  margin: 0 !important;
}

#dashboard-repo-list .repo-owner-name-list li:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

#dashboard-repo-list .repo-owner-name-list li.active {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

/* Repo link styling */
#dashboard-repo-list .repo-list-link {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
}

#dashboard-repo-list .repo-list-link:hover {
  color: var(--gh-accent-fg) !important;
}

#dashboard-repo-list .repo-list-link .repo-list-icon {
  color: var(--gh-fg-muted) !important;
}

#dashboard-repo-list .repo-list-link .text.truncate {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Pagination */
#dashboard-repo-list .ui.pagination.menu {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  gap: 4px !important;
}

#dashboard-repo-list .ui.pagination.menu .item {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  min-width: auto !important;
}

#dashboard-repo-list .ui.pagination.menu .item:hover:not(.disabled) {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

#dashboard-repo-list .ui.pagination.menu .item.active {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

#dashboard-repo-list .ui.pagination.menu .item.disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

/* ---------------------------------------------------------------------------
   Header Search Bar - GitHub Style
   --------------------------------------------------------------------------- */

#navbar .ui.search input,
.ui.top.menu .ui.search input,
header .search input {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--gh-header-search-border, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-header-text, rgba(255, 255, 255, 0.9)) !important;
  font-size: 14px !important;
  padding: 5px 12px 5px 32px !important;
  min-width: 240px !important;
  transition: all 0.15s ease !important;
}

#navbar .ui.search input::placeholder,
.ui.top.menu .ui.search input::placeholder,
header .search input::placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}

#navbar .ui.search input:focus,
.ui.top.menu .ui.search input:focus,
header .search input:focus {
  background: var(--gh-canvas-default) !important;
  border-color: var(--gh-accent-emphasis) !important;
  color: var(--gh-fg-default) !important;
  min-width: 320px !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Search icon */
#navbar .ui.search .icon,
.ui.top.menu .ui.search .icon {
  color: rgba(255, 255, 255, 0.5) !important;
}

#navbar .ui.search input:focus ~ .icon,
.ui.top.menu .ui.search input:focus ~ .icon {
  color: var(--gh-fg-muted) !important;
}

/* Keyboard shortcut hint */
#navbar .ui.search .shortcut-hint,
.search-shortcut-hint {
  position: absolute !important;
  right: 8px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 4px !important;
  padding: 1px 6px !important;
  font-size: 12px !important;
  color: rgba(255, 255, 255, 0.5) !important;
}

/* ---------------------------------------------------------------------------
   Activity Feed Enhancements
   --------------------------------------------------------------------------- */

/* Activity cards - better hover state */
#activity-feed .flex-item:hover {
  border-color: var(--gh-border-muted) !important;
  background: rgba(177, 186, 196, 0.08) !important;
}

/* User name link styling */
#activity-feed .flex-item-main > div:first-child > a:first-child {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

#activity-feed .flex-item-main > div:first-child > a:first-child:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Repository link styling */
#activity-feed .flex-item-main > div:first-child a[href*="/"]:not(:first-child) {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
}

/* Action text styling */
#activity-feed .flex-item-main > div:first-child {
  font-size: 14px !important;
  line-height: 1.5 !important;
}

/* Timestamp styling - relative time */
#activity-feed .flex-item-main > div:first-child relative-time,
#activity-feed .flex-item-main > div:first-child time-since,
#activity-feed .flex-item-main > div:first-child .time-since {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 400 !important;
}

/* Commit list styling */
#activity-feed .tw-flex.tw-flex-col.tw-gap-1 {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-top: 8px !important;
}

/* Individual commit entries */
#activity-feed .flex-text-block {
  padding: 4px 0 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

#activity-feed .flex-text-block:last-child {
  border-bottom: none !important;
}

/* SHA label */
#activity-feed .ui.sha.label {
  background: rgba(110, 118, 129, 0.4) !important;
  color: var(--gh-accent-fg) !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  border: none !important;
}

#activity-feed .ui.sha.label:hover {
  background: rgba(110, 118, 129, 0.6) !important;
  text-decoration: underline !important;
}

/* Commit message */
#activity-feed .text.truncate {
  color: var(--gh-fg-muted) !important;
  font-size: 13px !important;
  flex: 1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Compare link */
#activity-feed a[href*="/compare/"] {
  color: var(--gh-accent-fg) !important;
  font-size: 12px !important;
  margin-top: 8px !important;
  display: inline-block !important;
}

#activity-feed a[href*="/compare/"]:hover {
  text-decoration: underline !important;
}

/* Issue/PR title in activity */
#activity-feed .issue.title {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  display: block !important;
  margin-top: 4px !important;
}

#activity-feed .issue.title:hover {
  color: var(--gh-accent-fg) !important;
}

/* Comment preview */
#activity-feed .render-content.markup {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-top: 8px !important;
  font-size: 13px !important;
  color: var(--gh-fg-muted) !important;
  max-height: 80px !important;
  overflow: hidden !important;
  position: relative !important;
}

#activity-feed .render-content.markup::after {
  content: "" !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: 24px !important;
  background: linear-gradient(transparent, var(--gh-canvas-subtle)) !important;
}

/* Trailing icon styling */
#activity-feed .flex-item-trailing {
  opacity: 0.6 !important;
  transition: opacity 0.15s ease !important;
}

#activity-feed .flex-item:hover .flex-item-trailing {
  opacity: 1 !important;
}

/* ---------------------------------------------------------------------------
   GitMorph Branding - Footer Override (v36)
   Uses multiple approaches to ensure override works
   --------------------------------------------------------------------------- */

/* Hide "Powered by Gitea" text - multiple selector approaches for robustness */
body .page-footer .left-links a[href*="gitea.com"],
body .page-footer .left-links a[href*="about.gitea"],
body .page-footer .left-links a[href*="gitea.io"],
body .page-footer .left-links a[target="_blank"][href*="gitea"],
body footer .left-links a[href*="gitea"] {
  font-size: 0 !important;
  color: transparent !important;
  visibility: hidden !important;
  width: auto !important;
  position: relative !important;
}

/* Create replacement text with ::after */
body .page-footer .left-links a[href*="gitea.com"]::after,
body .page-footer .left-links a[href*="about.gitea"]::after,
body .page-footer .left-links a[href*="gitea.io"]::after,
body .page-footer .left-links a[target="_blank"][href*="gitea"]::after,
body footer .left-links a[href*="gitea"]::after {
  content: "Powered by GitMorph" !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  visibility: visible !important;
  position: relative !important;
  display: inline !important;
}

/* Alternative: Direct text replacement via first-link styling */
.page-footer .left-links > a:first-child {
  font-size: 0 !important;
  color: transparent !important;
  visibility: hidden !important;
  position: relative !important;
}

.page-footer .left-links > a:first-child::after {
  content: "Powered by GitMorph" !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  visibility: visible !important;
  display: inline !important;
}

/* Disable gitea link clicks */
.page-footer .left-links a[href*="gitea"] {
  pointer-events: none !important;
}

/* ---------------------------------------------------------------------------
   PROFILE PAGE - GitHub-Style Improvements (v35)
   --------------------------------------------------------------------------- */

/* Profile page main container - GitHub layout */
.page-content.user.profile {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 24px 32px !important;
}

/* Profile page grid layout */
.page-content.user.profile > .ui.stackable.grid {
  display: grid !important;
  grid-template-columns: 296px 1fr !important;
  gap: 24px !important;
}

/* Profile sidebar (left column) */
.page-content.user.profile .user-sidebar {
  position: sticky !important;
  top: 80px !important;
  align-self: start !important;
}

/* Profile avatar - larger like GitHub */
.page-content.user.profile .user-avatar {
  width: 296px !important;
  height: 296px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
  margin-bottom: 16px !important;
}

.page-content.user.profile .user-sidebar img.avatar,
.page-content.user.profile img.avatar-img {
  width: 100% !important;
  max-width: 296px !important;
  height: auto !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Username styling */
.page-content.user.profile .user-sidebar .header,
.page-content.user.profile .profile-header .username {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  line-height: 1.25 !important;
  margin-top: 8px !important;
  margin-bottom: 4px !important;
}

/* Full name below username */
.page-content.user.profile .user-sidebar .username,
.page-content.user.profile .profile-header .fullname {
  font-size: 20px !important;
  font-weight: 300 !important;
  color: var(--gh-fg-muted) !important;
  line-height: 24px !important;
}

/* Edit profile button - GitHub style */
.page-content.user.profile .user-sidebar .button,
.page-content.user.profile .user-sidebar .ui.button {
  width: 100% !important;
  margin-top: 16px !important;
  margin-bottom: 16px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background: var(--gh-btn-bg) !important;
  color: var(--gh-fg-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

.page-content.user.profile .user-sidebar .button:hover,
.page-content.user.profile .user-sidebar .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Follow button - green primary style */
.page-content.user.profile .user-sidebar .ui.primary.button,
.page-content.user.profile .user-sidebar .follow-btn {
  background: var(--gh-btn-primary-bg) !important;
  color: var(--gh-btn-primary-text) !important;
  border-color: var(--gh-btn-primary-border) !important;
}

.page-content.user.profile .user-sidebar .ui.primary.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Followers/Following count */
.page-content.user.profile .user-sidebar .user-info-links,
.page-content.user.profile .user-sidebar .follow-info,
.page-content.user.profile .user-info a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 16px 0 !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.user.profile .user-sidebar .user-info-links a,
.page-content.user.profile .user-sidebar .follow-info a {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

.page-content.user.profile .user-sidebar .user-info-links a:hover,
.page-content.user.profile .user-sidebar .follow-info a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.user.profile .user-sidebar .user-info-links svg,
.page-content.user.profile .user-sidebar .follow-info svg {
  color: var(--gh-fg-muted) !important;
  margin-right: 4px !important;
}

/* Profile metadata (email, location, website, etc.) */
.page-content.user.profile .user-sidebar .user-details,
.page-content.user.profile .user-info-details {
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-default) !important;
}

.page-content.user.profile .user-sidebar .user-details .item,
.page-content.user.profile .user-sidebar .meta-details .item,
.page-content.user.profile .user-info-details li {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 0 !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.user.profile .user-sidebar .user-details .item svg,
.page-content.user.profile .user-sidebar .meta-details .item svg,
.page-content.user.profile .user-info-details li svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.page-content.user.profile .user-sidebar .user-details .item a,
.page-content.user.profile .user-sidebar .meta-details .item a,
.page-content.user.profile .user-info-details li a {
  color: var(--gh-fg-default) !important;
}

.page-content.user.profile .user-sidebar .user-details .item a:hover {
  color: var(--gh-accent-fg) !important;
  text-decoration: underline !important;
}

/* Profile tabs - GitHub underline style */
.page-content.user.profile .ui.tabular.menu,
.page-content.user.profile .profile-tabs,
.page-content.user.profile .ui.secondary.pointing.menu {
  border-bottom: 1px solid var(--gh-border-default) !important;
  background: transparent !important;
  margin-bottom: 16px !important;
  display: flex !important;
  gap: 8px !important;
  box-shadow: none !important;
}

.page-content.user.profile .ui.tabular.menu .item,
.page-content.user.profile .profile-tabs .item,
.page-content.user.profile .ui.secondary.pointing.menu .item {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  margin-bottom: -1px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 0 !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.page-content.user.profile .ui.tabular.menu .item:hover,
.page-content.user.profile .profile-tabs .item:hover,
.page-content.user.profile .ui.secondary.pointing.menu .item:hover {
  color: var(--gh-fg-default) !important;
  border-bottom-color: var(--gh-neutral-muted) !important;
}

.page-content.user.profile .ui.tabular.menu .item.active,
.page-content.user.profile .profile-tabs .item.active,
.page-content.user.profile .ui.secondary.pointing.menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  border-bottom-color: var(--gh-accent-emphasis) !important;
  background: transparent !important;
}

/* Tab count badges */
.page-content.user.profile .ui.tabular.menu .item .ui.label,
.page-content.user.profile .profile-tabs .item .label,
.page-content.user.profile .ui.secondary.pointing.menu .item .ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 10px !important;
  padding: 0 6px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  margin-left: 6px !important;
  line-height: 18px !important;
}

/* Repository list in profile */
.page-content.user.profile .repository.list,
.page-content.user.profile .repo-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

/* Repository cards in profile - match GitHub style */
.page-content.user.profile .repository.list > .item,
.page-content.user.profile .flex-item.repository {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  transition: border-color 0.15s ease !important;
}

.page-content.user.profile .repository.list > .item:hover,
.page-content.user.profile .flex-item.repository:hover {
  border-color: var(--gh-border-muted) !important;
}

/* Repository name in card */
.page-content.user.profile .repository.list .header a,
.page-content.user.profile .flex-item.repository .flex-item-title a {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-accent-fg) !important;
}

.page-content.user.profile .repository.list .header a:hover,
.page-content.user.profile .flex-item.repository .flex-item-title a:hover {
  text-decoration: underline !important;
}

/* Repository description */
.page-content.user.profile .repository.list .description,
.page-content.user.profile .flex-item.repository .flex-item-body {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 4px !important;
  line-height: 1.5 !important;
}

/* Repository meta info (language, stars, forks) */
.page-content.user.profile .repository.list .meta,
.page-content.user.profile .flex-item.repository .flex-item-trailing {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.user.profile .repository.list .meta a,
.page-content.user.profile .flex-item.repository .flex-item-trailing a {
  color: var(--gh-fg-muted) !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.page-content.user.profile .repository.list .meta a:hover,
.page-content.user.profile .flex-item.repository .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

/* Language color dot */
.page-content.user.profile .repository.list .meta .language-color,
.page-content.user.profile .flex-item.repository .language-color {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  display: inline-block !important;
  margin-right: 4px !important;
}

/* Public/Private badge */
.page-content.user.profile .repository.list .ui.label.basic,
.page-content.user.profile .flex-item.repository .ui.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 7px !important;
  border-radius: 10px !important;
  line-height: 18px !important;
  margin-left: 8px !important;
}

/* ---------------------------------------------------------------------------
   EXPLORE PAGE - GitHub-Style Improvements (v35)
   --------------------------------------------------------------------------- */

/* Explore page container */
.page-content.explore {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 24px 32px !important;
}

/* Explore tabs - GitHub underline style */
.page-content.explore .ui.secondary.pointing.menu,
.page-content.explore .explore-tabs {
  border-bottom: 1px solid var(--gh-border-default) !important;
  background: transparent !important;
  margin-bottom: 24px !important;
  display: flex !important;
  justify-content: center !important;
  gap: 0 !important;
  box-shadow: none !important;
}

.page-content.explore .ui.secondary.pointing.menu .item,
.page-content.explore .explore-tabs .item {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 12px 16px !important;
  margin: 0 !important;
  margin-bottom: -1px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  border-radius: 0 !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.page-content.explore .ui.secondary.pointing.menu .item:hover,
.page-content.explore .explore-tabs .item:hover {
  color: var(--gh-fg-default) !important;
  border-bottom-color: var(--gh-neutral-muted) !important;
}

.page-content.explore .ui.secondary.pointing.menu .item.active,
.page-content.explore .explore-tabs .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  border-bottom-color: var(--gh-accent-emphasis) !important;
  background: transparent !important;
}

/* Search bar in explore */
.page-content.explore .ui.action.input,
.page-content.explore .search-form {
  max-width: 100% !important;
  margin-bottom: 16px !important;
}

.page-content.explore .ui.action.input input,
.page-content.explore .search-form input[type="text"],
.page-content.explore input[type="search"] {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  width: 100% !important;
}

.page-content.explore .ui.action.input input:focus,
.page-content.explore .search-form input[type="text"]:focus,
.page-content.explore input[type="search"]:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px var(--gh-accent-muted) !important;
}

.page-content.explore .ui.action.input input::placeholder,
.page-content.explore .search-form input::placeholder,
.page-content.explore input[type="search"]::placeholder {
  color: var(--gh-fg-subtle) !important;
}

/* Filter/Sort buttons in explore */
.page-content.explore .ui.dropdown,
.page-content.explore .filter-dropdown {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.explore .ui.dropdown:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Repository list in explore - GitHub card style (v41 - Enhanced) */
.page-content.explore .repository.list,
.page-content.explore .ui.repository.list,
.page-content.explore .flex-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.page-content.explore .repository.list > .item,
.page-content.explore .flex-item {
  background: var(--gh-canvas-default) !important;
  border: none !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  padding: 16px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  gap: 12px !important;
  transition: background 0.15s ease !important;
}

.page-content.explore .flex-item:last-child {
  border-bottom: none !important;
}

.page-content.explore .repository.list > .item:hover,
.page-content.explore .flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Repository/User row layout */
.page-content.explore .flex-item {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.page-content.explore .flex-item-leading {
  flex-shrink: 0 !important;
}

.page-content.explore .flex-item-leading img {
  width: 32px !important;
  height: 32px !important;
  border-radius: 6px !important;
}

.page-content.explore .flex-item-main {
  flex: 1 !important;
  min-width: 0 !important;
  margin-left: 12px !important;
}

/* Repository name link */
.page-content.explore .flex-item-title,
.page-content.explore .repository.list .header {
  font-size: 16px !important;
  font-weight: 600 !important;
}

.page-content.explore .flex-item-title a,
.page-content.explore .repository.list .header a {
  color: var(--gh-accent-fg) !important;
}

.page-content.explore .flex-item-title a:hover,
.page-content.explore .repository.list .header a:hover {
  text-decoration: underline !important;
}

/* Repository description */
.page-content.explore .flex-item-body,
.page-content.explore .repository.list .description {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  line-height: 1.5 !important;
  margin-top: 2px !important;
}

/* Updated timestamp */
.page-content.explore .flex-item .time-since,
.page-content.explore .repository.list .time {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* Stars/Forks count */
.page-content.explore .flex-item-trailing {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.explore .flex-item-trailing a {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
}

.page-content.explore .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.explore .flex-item-trailing svg {
  width: 16px !important;
  height: 16px !important;
}

/* User list in explore */
.page-content.explore .user.list .flex-item {
  padding: 12px 16px !important;
}

.page-content.explore .user.list .flex-item img {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
}

.page-content.explore .user.list .flex-item-main {
  margin-left: 16px !important;
}

.page-content.explore .user.list .flex-item-title {
  font-size: 16px !important;
  font-weight: 600 !important;
}

.page-content.explore .user.list .flex-item-body {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

/* Pagination in explore */
.page-content.explore .ui.pagination.menu {
  display: flex !important;
  justify-content: center !important;
  margin-top: 24px !important;
  gap: 4px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.page-content.explore .ui.pagination.menu .item {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 10px !important;
  min-width: 32px !important;
  justify-content: center !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  margin: 0 !important;
}

.page-content.explore .ui.pagination.menu .item:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

.page-content.explore .ui.pagination.menu .item.active {
  background: var(--gh-accent-emphasis) !important;
  color: white !important;
  border-color: var(--gh-accent-emphasis) !important;
}

.page-content.explore .ui.pagination.menu .item.disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

/* No results message */
.page-content.explore .ui.message,
.page-content.explore .empty-message {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 32px !important;
  text-align: center !important;
  color: var(--gh-fg-muted) !important;
}

/* ---------------------------------------------------------------------------
   GENERAL UI IMPROVEMENTS - Additional Polish (v35)
   --------------------------------------------------------------------------- */

/* Improve all buttons consistency */
.ui.button {
  font-weight: 500 !important;
  border-radius: 6px !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

/* All dropdown menus - consistent styling */
.ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: var(--gh-shadow-lg) !important;
  padding: 4px 0 !important;
}

.ui.dropdown .menu > .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  border-radius: 0 !important;
}

.ui.dropdown .menu > .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
  color: var(--gh-fg-default) !important;
}

.ui.dropdown .menu > .item.active,
.ui.dropdown .menu > .item.selected {
  background: var(--gh-actionListItem-default-activeBg) !important;
  color: var(--gh-fg-default) !important;
  font-weight: 500 !important;
}

.ui.dropdown .menu > .divider {
  background: var(--gh-border-default) !important;
  margin: 4px 0 !important;
}

/* Labels/badges consistency */
.ui.label {
  background: var(--gh-neutral-muted) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 10px !important;
  font-weight: 500 !important;
  font-size: 12px !important;
  padding: 0 7px !important;
  line-height: 18px !important;
}

.ui.label.basic {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Verified badge styling */
.verified-badge,
.octicon-verified {
  color: var(--gh-success-fg) !important;
}

/* Organization cards in explore */
.page-content.explore .organization.list .flex-item img,
.page-content.explore .org-avatar {
  border-radius: 6px !important;
}

/* Improve focus states for accessibility */
a:focus-visible,
button:focus-visible,
input:focus-visible,
.ui.button:focus-visible {
  outline: 2px solid var(--gh-accent-emphasis) !important;
  outline-offset: 2px !important;
}

/* Loading states */
.ui.loading.segment::before {
  background: var(--gh-canvas-default) !important;
}

.ui.loading.segment::after {
  border-color: var(--gh-accent-emphasis) transparent transparent !important;
}

/* Tooltips consistency */
.tippy-box {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  box-shadow: var(--gh-shadow-lg) !important;
}

.tippy-arrow {
  color: var(--gh-canvas-overlay) !important;
}

/* Empty state illustrations */
.ui.placeholder.segment {
  background: var(--gh-canvas-subtle) !important;
  border: 1px dashed var(--gh-border-default) !important;
  border-radius: 6px !important;
}

/* ---------------------------------------------------------------------------
   LANDING PAGE / HOME PAGE - GitHub-Style (v37)
   Complete redesign of the logged-out landing page
   --------------------------------------------------------------------------- */

/* Main container */
.page-content.home {
  padding: 0 !important;
  max-width: 100% !important;
}

/* Hero section at top */
.page-content.home > .tw-mb-8 {
  background: linear-gradient(180deg, #161b22 0%, #0d1117 100%) !important;
  padding: 80px 24px 60px !important;
  margin-bottom: 0 !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
}

.page-content.home .center {
  max-width: 900px !important;
  margin: 0 auto !important;
}

/* Logo styling */
.page-content.home .logo {
  width: 120px !important;
  height: 120px !important;
  margin-bottom: 24px !important;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3)) !important;
}

/* Hero text */
.page-content.home .hero {
  text-align: center !important;
}

.page-content.home .hero h1.title {
  font-size: 48px !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin: 0 0 16px 0 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.02em !important;
}

.page-content.home .hero h2 {
  font-size: 20px !important;
  font-weight: 400 !important;
  color: var(--gh-fg-muted) !important;
  margin: 0 !important;
  line-height: 1.5 !important;
}

/* Feature grid */
.page-content.home .ui.stackable.page.grid {
  max-width: 1200px !important;
  margin: 48px auto !important;
  padding: 0 24px !important;
  gap: 32px !important;
}

/* Feature cards */
.page-content.home .eight.wide.center.column {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  padding: 32px !important;
  transition: border-color 0.2s ease, transform 0.2s ease !important;
}

.page-content.home .eight.wide.center.column:hover {
  border-color: var(--gh-border-muted) !important;
  transform: translateY(-2px) !important;
}

/* Feature icons */
.page-content.home .hero.ui.icon.header {
  color: var(--gh-fg-default) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
}

.page-content.home .hero.ui.icon.header svg {
  color: var(--gh-accent-fg) !important;
  width: 28px !important;
  height: 28px !important;
}

/* Feature descriptions */
.page-content.home p.large {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

.page-content.home p.large a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.page-content.home p.large a:hover {
  text-decoration: underline !important;
}

/* Hide Gitea-specific links on landing page */
.page-content.home a[href*="gitea.com"],
.page-content.home a[href*="gitea.io"],
.page-content.home a[href*="docs.gitea"],
.page-content.home a[href*="code.gitea"],
.page-content.home a[href*="go-gitea"] {
  color: var(--gh-fg-muted) !important;
  pointer-events: none !important;
  text-decoration: none !important;
}

/* Replace gitea repo links with generic text styling */
.page-content.home a[href*="code.gitea.io/gitea"]::after,
.page-content.home a[href*="go-gitea/gitea"]::after {
  content: "" !important;
}

/* Better responsive layout for feature cards */
@media (max-width: 991px) {
  .page-content.home .ui.stackable.page.grid {
    padding: 0 16px !important;
    gap: 16px !important;
  }

  .page-content.home .eight.wide.center.column {
    padding: 24px !important;
  }

  .page-content.home .hero h1.title {
    font-size: 36px !important;
  }

  .page-content.home .hero h2 {
    font-size: 18px !important;
  }
}

@media (max-width: 767px) {
  .page-content.home > .tw-mb-8 {
    padding: 48px 16px 40px !important;
  }

  .page-content.home .logo {
    width: 80px !important;
    height: 80px !important;
  }

  .page-content.home .hero h1.title {
    font-size: 28px !important;
  }
}

/* ---------------------------------------------------------------------------
   EXPLORE PAGE - Enhanced Styling (v37)
   Make explore page more GitHub-like with better visual hierarchy
   --------------------------------------------------------------------------- */

/* Explore page header area */
.page-content.explore > .ui.container > .ui.secondary.pointing.menu {
  margin-bottom: 24px !important;
}

/* Better search bar on explore page */
.page-content.explore .search-form,
.page-content.explore .ui.action.input {
  display: flex !important;
  gap: 8px !important;
  margin-bottom: 16px !important;
}

.page-content.explore .ui.action.input input,
.page-content.explore .search-form input {
  flex: 1 !important;
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
}

.page-content.explore .ui.action.input input:focus,
.page-content.explore .search-form input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Explore action buttons (search, filter) */
.page-content.explore .ui.action.input button,
.page-content.explore .search-form button,
.page-content.explore .ui.button.filter-btn {
  background: var(--gh-btn-bg) !important;
  color: var(--gh-fg-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

.page-content.explore .ui.action.input button:hover,
.page-content.explore .search-form button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Explore tabs - better underline style */
.page-content.explore .ui.secondary.pointing.menu .item,
.page-content.explore .ui.tabular.menu .item {
  padding: 8px 16px !important;
  color: var(--gh-fg-muted) !important;
  font-weight: 500 !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  margin-bottom: -1px !important;
}

.page-content.explore .ui.secondary.pointing.menu .item:hover {
  color: var(--gh-fg-default) !important;
  background: transparent !important;
  border-color: transparent !important;
}

.page-content.explore .ui.secondary.pointing.menu .item.active {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  border-bottom-color: #f78166 !important;
  background: transparent !important;
}

/* Repository cards in explore - better hover effect */
.page-content.explore .flex-item,
.page-content.explore .repository.list > .item {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 8px !important;
  transition: border-color 0.15s ease !important;
}

.page-content.explore .flex-item:hover,
.page-content.explore .repository.list > .item:hover {
  border-color: var(--gh-border-muted) !important;
}

/* Repository title in explore */
.page-content.explore .flex-item-title a,
.page-content.explore .repository.list .header a {
  color: var(--gh-accent-fg) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.page-content.explore .flex-item-title a:hover,
.page-content.explore .repository.list .header a:hover {
  text-decoration: underline !important;
}

/* Repository description */
.page-content.explore .flex-item-body,
.page-content.explore .repository.list .description {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-top: 8px !important;
}

/* Repository metadata (stars, forks, language) */
.page-content.explore .flex-item-trailing {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-top: 12px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

.page-content.explore .flex-item-trailing a {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
}

.page-content.explore .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

.page-content.explore .flex-item-trailing svg {
  width: 16px !important;
  height: 16px !important;
}

/* Empty state in explore */
.page-content.explore .ui.message,
.page-content.explore .empty-state,
.page-content.explore .nothing {
  background: var(--gh-canvas-subtle) !important;
  border: 1px dashed var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 48px 24px !important;
  text-align: center !important;
  color: var(--gh-fg-muted) !important;
}

/* User cards in explore */
.page-content.explore .user.list .flex-item {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

.page-content.explore .user.list .flex-item img {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
}

/* Organization cards in explore */
.page-content.explore .organization.list .flex-item img {
  border-radius: 6px !important;
}

/* ---------------------------------------------------------------------------
   GENERAL UI POLISH (v37)
   Fine-tuning of various UI elements for production quality
   --------------------------------------------------------------------------- */

/* Better focus states */
:focus-visible {
  outline: 2px solid var(--gh-accent-emphasis) !important;
  outline-offset: 2px !important;
}

/* Smooth transitions on all interactive elements */
a, button, .ui.button, input, select, textarea {
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
}

/* Better scrollbar styling */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: var(--gh-canvas-default);
}

::-webkit-scrollbar-thumb {
  background: var(--gh-border-default);
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--gh-fg-muted);
}

/* Consistent border radius */
.ui.button,
.ui.input input,
.ui.dropdown,
.ui.segment,
.ui.message,
.ui.card {
  border-radius: 6px !important;
}

/* Consistent box shadows for elevated elements */
.ui.dropdown .menu,
.ui.popup,
.ui.modal,
.ui.card:hover {
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.4) !important;
}

/* Disabled states */
.ui.disabled.button,
.ui.button:disabled,
button:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

/* Selection colors */
::selection {
  background: rgba(31, 111, 235, 0.4) !important;
  color: var(--gh-fg-default) !important;
}

/* ---------------------------------------------------------------------------
   SIGN-IN / SIGN-UP PAGES - GitHub-Style (v38)
   Clean, centered authentication forms
   --------------------------------------------------------------------------- */

/* Auth page container */
.page-content.user.signin,
.page-content.user.signup,
.page-content.user.forgot-password,
.page-content.user.reset-password {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: calc(100vh - 120px) !important;
  padding: 48px 16px !important;
}

/* Auth form card */
.page-content.user .ui.form,
.page-content.user form {
  width: 100% !important;
  max-width: 340px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 24px !important;
  margin: 0 auto !important;
}

/* Auth page title/header */
.page-content.user .ui.form > .ui.header,
.page-content.user h2,
.page-content.user .header:first-child {
  text-align: center !important;
  font-size: 24px !important;
  font-weight: 300 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 24px !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* Form field labels */
.page-content.user .ui.form .field > label,
.page-content.user .field > label {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
}

/* Form inputs */
.page-content.user .ui.form input[type="text"],
.page-content.user .ui.form input[type="password"],
.page-content.user .ui.form input[type="email"],
.page-content.user input[type="text"],
.page-content.user input[type="password"],
.page-content.user input[type="email"] {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  width: 100% !important;
}

.page-content.user .ui.form input:focus,
.page-content.user input:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Primary action button (Sign In) */
.page-content.user .ui.primary.button,
.page-content.user button[type="submit"].primary,
.page-content.user .ui.green.button {
  width: 100% !important;
  background: var(--gh-btn-primary-bg) !important;
  color: var(--gh-btn-primary-text) !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 10px 16px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  margin-top: 16px !important;
}

.page-content.user .ui.primary.button:hover,
.page-content.user button[type="submit"].primary:hover,
.page-content.user .ui.green.button:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
}

/* Secondary buttons (Sign in with OpenID, etc.) */
.page-content.user .ui.button:not(.primary):not(.green),
.page-content.user .oauth-login-link {
  width: 100% !important;
  background: var(--gh-canvas-default) !important;
  color: var(--gh-fg-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 10px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  margin-top: 8px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-decoration: none !important;
}

.page-content.user .ui.button:not(.primary):not(.green):hover,
.page-content.user .oauth-login-link:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Divider "or" */
.page-content.user .divider,
.page-content.user .or-divider {
  text-align: center !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  margin: 16px 0 !important;
  position: relative !important;
}

/* Checkbox styling */
.page-content.user .ui.checkbox label,
.page-content.user input[type="checkbox"] + label {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
}

/* Links in auth forms */
.page-content.user a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.page-content.user a:hover {
  text-decoration: underline !important;
}

/* "Forgot password?" link positioning */
.page-content.user .field .right {
  float: right !important;
  font-size: 12px !important;
}

/* Bottom links (Need an account? Register now.) */
.page-content.user .ui.form + p,
.page-content.user .bottom-links {
  text-align: center !important;
  margin-top: 16px !important;
  padding: 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  max-width: 340px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

/* ---------------------------------------------------------------------------
   ERROR MESSAGES - GitHub-Style (v38)
   Clean error/warning/success message styling
   --------------------------------------------------------------------------- */

/* Error message banner */
.ui.negative.message,
.ui.error.message,
.flash-error,
.negative.message {
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.4) !important;
  border-radius: 6px !important;
  color: #f85149 !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
}

.ui.negative.message .header,
.ui.error.message .header {
  color: #f85149 !important;
  font-weight: 600 !important;
}

/* Warning message banner */
.ui.warning.message,
.flash-warning {
  background: rgba(187, 128, 9, 0.15) !important;
  border: 1px solid rgba(187, 128, 9, 0.4) !important;
  border-radius: 6px !important;
  color: #d29922 !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
}

/* Success message banner */
.ui.positive.message,
.ui.success.message,
.flash-success {
  background: rgba(63, 185, 80, 0.15) !important;
  border: 1px solid rgba(63, 185, 80, 0.4) !important;
  border-radius: 6px !important;
  color: #3fb950 !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
}

/* Info message banner */
.ui.info.message,
.flash-info {
  background: rgba(31, 111, 235, 0.15) !important;
  border: 1px solid rgba(31, 111, 235, 0.4) !important;
  border-radius: 6px !important;
  color: #58a6ff !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
}

/* ---------------------------------------------------------------------------
   404 / ERROR PAGES - GitHub-Style (v38)
   Clean error page styling
   --------------------------------------------------------------------------- */

.page-content.status-page,
.page-content.error-page {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: calc(100vh - 120px) !important;
  text-align: center !important;
  padding: 48px 24px !important;
}

.page-content.status-page h1,
.page-content.error-page h1,
body h1:only-child {
  font-size: 48px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
}

.page-content.status-page p,
.page-content.error-page p {
  font-size: 16px !important;
  color: var(--gh-fg-muted) !important;
  max-width: 500px !important;
}

/* ---------------------------------------------------------------------------
   FORM IMPROVEMENTS - GitHub-Style (v38)
   Better form styling across all pages
   --------------------------------------------------------------------------- */

/* All form inputs */
.ui.form input[type="text"],
.ui.form input[type="password"],
.ui.form input[type="email"],
.ui.form input[type="url"],
.ui.form input[type="number"],
.ui.form textarea,
.ui.form select {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
}

.ui.form input:focus,
.ui.form textarea:focus,
.ui.form select:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Form field spacing */
.ui.form .field {
  margin-bottom: 16px !important;
}

/* Form field labels */
.ui.form .field > label {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
}

/* Required field indicator */
.ui.form .field > label .required,
.ui.form .required.field > label::after {
  color: #f85149 !important;
}

/* Placeholder text */
.ui.form input::placeholder,
.ui.form textarea::placeholder {
  color: var(--gh-fg-muted) !important;
  opacity: 0.7 !important;
}

/* Dropdown styling */
.ui.dropdown,
.ui.selection.dropdown {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
}

.ui.dropdown .menu {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.4) !important;
}

.ui.dropdown .menu > .item {
  color: var(--gh-fg-default) !important;
  padding: 8px 12px !important;
  border-radius: 4px !important;
  margin: 2px 4px !important;
}

.ui.dropdown .menu > .item:hover {
  background: var(--gh-actionListItem-default-hoverBg) !important;
}

.ui.dropdown .menu > .item.selected,
.ui.dropdown .menu > .item.active {
  background: rgba(31, 111, 235, 0.15) !important;
  color: var(--gh-fg-default) !important;
}

/* ---------------------------------------------------------------------------
   NOTIFICATION BANNERS - GitHub-Style (v38)
   Dashboard notification styling
   --------------------------------------------------------------------------- */

/* Notification banner at top of page */
.ui.info.attached.segment,
.notification-banner,
.flash-message {
  background: rgba(31, 111, 235, 0.1) !important;
  border: 1px solid rgba(31, 111, 235, 0.3) !important;
  border-radius: 6px !important;
  padding: 12px 16px !important;
  margin-bottom: 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

.notification-banner .content {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.notification-banner .close,
.flash-message .close {
  cursor: pointer !important;
  color: var(--gh-fg-muted) !important;
  opacity: 0.7 !important;
}

.notification-banner .close:hover,
.flash-message .close:hover {
  opacity: 1 !important;
}

/* ---------------------------------------------------------------------------
   BUTTON REFINEMENTS - GitHub-Style (v38)
   More precise button styling
   --------------------------------------------------------------------------- */

/* Primary (green) button */
.ui.primary.button,
.ui.green.button,
button.primary {
  background: var(--gh-btn-primary-bg) !important;
  color: var(--gh-btn-primary-text) !important;
  border: 1px solid var(--gh-btn-primary-border) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  cursor: pointer !important;
  transition: background 0.15s ease !important;
}

.ui.primary.button:hover,
.ui.green.button:hover,
button.primary:hover {
  background: var(--gh-btn-primary-hoverBg) !important;
  border-color: var(--gh-btn-primary-hoverBorder) !important;
}

/* Secondary (default) button */
.ui.button:not(.primary):not(.green):not(.red):not(.blue),
button:not(.primary):not(.green):not(.red):not(.blue) {
  background: var(--gh-btn-bg) !important;
  color: var(--gh-fg-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

.ui.button:not(.primary):not(.green):not(.red):not(.blue):hover,
button:not(.primary):not(.green):not(.red):not(.blue):hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Danger (red) button */
.ui.red.button,
.ui.negative.button,
button.danger {
  background: transparent !important;
  color: #f85149 !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

.ui.red.button:hover,
.ui.negative.button:hover,
button.danger:hover {
  background: #da3633 !important;
  color: #ffffff !important;
  border-color: #da3633 !important;
}

/* Small buttons */
.ui.mini.button,
.ui.tiny.button,
.ui.small.button {
  padding: 3px 12px !important;
  font-size: 12px !important;
}

/* Icon-only buttons */
.ui.icon.button {
  padding: 6px 8px !important;
}

.ui.icon.button svg {
  margin: 0 !important;
}

/* ---------------------------------------------------------------------------
   v39 - INPUT FIELD VISIBILITY FIX
   Higher specificity selectors to override Fomantic UI defaults
   --------------------------------------------------------------------------- */

/* Force input visibility on ALL form inputs */
.ui.form input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
.ui.form input[type="text"],
.ui.form input[type="email"],
.ui.form input[type="password"],
.ui.form input[type="number"],
.ui.form input[type="url"],
.ui.form input[type="search"],
input.ui.input,
.ui.input input,
.ui.input > input {
  background: var(--gh-canvas-default) !important;
  background-color: #0d1117 !important;
  border: 1px solid var(--gh-border-default) !important;
  border-color: #30363d !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  color: #e6edf3 !important;
  height: auto !important;
  min-height: 36px !important;
  line-height: 20px !important;
}

/* Even higher specificity for auth pages */
.page-content.user.signin .ui.form input,
.page-content.user.signin form input,
.page-content.user.signup .ui.form input,
.page-content.user.signup form input,
.page-content.user .ui.form .field input,
.page-content.user form .field input,
body .page-content.user input[type="text"],
body .page-content.user input[type="email"],
body .page-content.user input[type="password"] {
  background: #0d1117 !important;
  background-color: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: #e6edf3 !important;
  width: 100% !important;
  height: auto !important;
  min-height: 36px !important;
  box-sizing: border-box !important;
  display: block !important;
}

/* Focus states for inputs */
.ui.form input:focus,
.page-content.user input:focus,
body .page-content.user input:focus {
  border-color: #1f6feb !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Placeholder styling */
.ui.form input::placeholder,
.page-content.user input::placeholder {
  color: #848d97 !important;
  opacity: 1 !important;
}

/* Field container styling */
.ui.form .field,
.page-content.user .field {
  margin-bottom: 16px !important;
}

/* Required field asterisk */
.ui.form .field.required > label::after,
.page-content.user .field.required > label::after {
  content: "*" !important;
  color: #f85149 !important;
  margin-left: 4px !important;
}

/* ---------------------------------------------------------------------------
   v39 - TEXTAREA VISIBILITY FIX
   --------------------------------------------------------------------------- */

.ui.form textarea,
body .ui.form textarea,
.page-content textarea {
  background: #0d1117 !important;
  background-color: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  color: #e6edf3 !important;
  min-height: 100px !important;
  resize: vertical !important;
}

.ui.form textarea:focus,
body .ui.form textarea:focus {
  border-color: #1f6feb !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* ---------------------------------------------------------------------------
   v39 - REPO PAGE IMPROVEMENTS
   Better file tree, tabs, and content styling
   --------------------------------------------------------------------------- */

/* Repository tabs */
.repo-header .repo-buttons,
.repository .ui.secondary.menu {
  border-bottom: 1px solid #21262d !important;
  background: transparent !important;
}

.repo-header .repo-buttons .item,
.repository .ui.secondary.menu .item {
  color: #e6edf3 !important;
  padding: 8px 16px !important;
  margin-bottom: -1px !important;
  border: 1px solid transparent !important;
  border-radius: 6px 6px 0 0 !important;
  font-weight: 500 !important;
}

.repo-header .repo-buttons .item:hover,
.repository .ui.secondary.menu .item:hover {
  color: #e6edf3 !important;
  background: #21262d !important;
}

.repo-header .repo-buttons .item.active,
.repository .ui.secondary.menu .item.active {
  color: #e6edf3 !important;
  background: #0d1117 !important;
  border-color: #21262d !important;
  border-bottom-color: #0d1117 !important;
}

/* File tree container */
.repo-file-list,
.file-tree-panel,
#repo-files-table {
  background: #0d1117 !important;
  border: 1px solid #21262d !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* File tree rows */
.repo-file-list tr,
#repo-files-table tr {
  border-bottom: 1px solid #21262d !important;
}

.repo-file-list tr:hover,
#repo-files-table tr:hover {
  background: #161b22 !important;
}

.repo-file-list td,
#repo-files-table td {
  padding: 8px 16px !important;
  vertical-align: middle !important;
}

/* File icons */
.repo-file-list .octicon,
#repo-files-table .octicon,
.file-tree-panel .octicon {
  color: #848d97 !important;
  margin-right: 8px !important;
}

/* Directory icons - blue */
.repo-file-list .octicon-file-directory-fill,
#repo-files-table .octicon-file-directory-fill {
  color: #54aeff !important;
}

/* File name links */
.repo-file-list a.muted,
#repo-files-table a.muted,
.file-tree-panel a {
  color: #e6edf3 !important;
  text-decoration: none !important;
}

.repo-file-list a.muted:hover,
#repo-files-table a.muted:hover,
.file-tree-panel a:hover {
  color: #58a6ff !important;
  text-decoration: underline !important;
}

/* Commit message in file list */
.repo-file-list .commit-message,
#repo-files-table td:nth-child(2) {
  color: #848d97 !important;
}

/* Commit message link */
.repo-file-list .commit-message a,
#repo-files-table td:nth-child(2) a {
  color: #848d97 !important;
}

.repo-file-list .commit-message a:hover,
#repo-files-table td:nth-child(2) a:hover {
  color: #58a6ff !important;
}

/* Time ago */
.repo-file-list .time-since,
#repo-files-table .time-since,
.repo-file-list time,
#repo-files-table time {
  color: #848d97 !important;
  font-size: 12px !important;
}

/* ---------------------------------------------------------------------------
   v39 - README CONTAINER STYLING
   --------------------------------------------------------------------------- */

.readme-box,
.markup,
.readme,
#readme {
  background: #0d1117 !important;
  border: 1px solid #21262d !important;
  border-radius: 6px !important;
  padding: 24px 32px !important;
}

/* README header */
.readme-box .header,
#readme .header,
.readme h2:first-child {
  padding: 12px 16px !important;
  border-bottom: 1px solid #21262d !important;
  margin: -24px -32px 24px -32px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: #e6edf3 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* README content typography */
.markup h1,
.readme-box h1 {
  font-size: 2em !important;
  font-weight: 600 !important;
  border-bottom: 1px solid #21262d !important;
  padding-bottom: 0.3em !important;
  margin-bottom: 16px !important;
  margin-top: 24px !important;
  color: #e6edf3 !important;
}

.markup h2,
.readme-box h2 {
  font-size: 1.5em !important;
  font-weight: 600 !important;
  border-bottom: 1px solid #21262d !important;
  padding-bottom: 0.3em !important;
  margin-bottom: 16px !important;
  margin-top: 24px !important;
  color: #e6edf3 !important;
}

.markup h3,
.readme-box h3 {
  font-size: 1.25em !important;
  font-weight: 600 !important;
  margin-bottom: 16px !important;
  margin-top: 24px !important;
  color: #e6edf3 !important;
}

.markup p,
.readme-box p {
  margin-bottom: 16px !important;
  line-height: 1.6 !important;
  color: #e6edf3 !important;
}

.markup code,
.readme-box code {
  background: rgba(110, 118, 129, 0.4) !important;
  padding: 0.2em 0.4em !important;
  border-radius: 6px !important;
  font-size: 85% !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  color: #e6edf3 !important;
}

.markup pre,
.readme-box pre {
  background: #161b22 !important;
  border: 1px solid #21262d !important;
  border-radius: 6px !important;
  padding: 16px !important;
  overflow-x: auto !important;
  margin-bottom: 16px !important;
}

.markup pre code,
.readme-box pre code {
  background: transparent !important;
  padding: 0 !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
}

/* ---------------------------------------------------------------------------
   v39 - ABOUT SIDEBAR (REPO PAGE RIGHT SIDE)
   --------------------------------------------------------------------------- */

.repo-home-sidebar,
.repository-sidebar,
.repo-summary {
  color: #e6edf3 !important;
}

.repo-home-sidebar .header,
.repository-sidebar .header {
  font-weight: 600 !important;
  font-size: 14px !important;
  margin-bottom: 8px !important;
  color: #e6edf3 !important;
}

/* Topics/Tags */
.topic-tag,
.label.topic {
  background: rgba(56, 139, 253, 0.15) !important;
  color: #58a6ff !important;
  padding: 4px 10px !important;
  border-radius: 16px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin: 2px 4px 2px 0 !important;
}

.topic-tag:hover,
.label.topic:hover {
  background: rgba(56, 139, 253, 0.25) !important;
  color: #58a6ff !important;
}

/* Languages bar */
.language-stats,
.repository-language-bar {
  display: flex !important;
  height: 8px !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin: 8px 0 !important;
}

/* Language legend */
.language-legend,
.repository-language-stats {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 16px !important;
  margin-top: 8px !important;
}

.language-legend .item,
.repository-language-stats .item {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 12px !important;
  color: #e6edf3 !important;
}

.language-legend .color,
.repository-language-stats .color {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
}

/* ---------------------------------------------------------------------------
   v39 - ISSUES LIST PAGE
   --------------------------------------------------------------------------- */

.issue-list,
.issue-list-container,
#issue-list {
  background: #0d1117 !important;
  border: 1px solid #21262d !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* Issue list header (filters row) */
.issue-list-header,
.list-header {
  background: #161b22 !important;
  border-bottom: 1px solid #21262d !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Issue row */
.issue-item,
.issue-list .item,
.flex-item {
  padding: 12px 16px !important;
  border-bottom: 1px solid #21262d !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
}

.issue-item:last-child,
.issue-list .item:last-child,
.flex-item:last-child {
  border-bottom: none !important;
}

.issue-item:hover,
.issue-list .item:hover,
.flex-item:hover {
  background: #161b22 !important;
}

/* Issue icon (open/closed) */
.issue-item .issue-icon,
.issue-state-icon {
  margin-top: 4px !important;
}

.issue-item .issue-icon.green,
.issue-state-icon.text-green {
  color: #3fb950 !important;
}

.issue-item .issue-icon.purple,
.issue-state-icon.text-purple {
  color: #a371f7 !important;
}

.issue-item .issue-icon.red,
.issue-state-icon.text-red {
  color: #f85149 !important;
}

/* Issue title */
.issue-item .title,
.issue-title,
.flex-item .title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #e6edf3 !important;
  text-decoration: none !important;
}

.issue-item .title:hover,
.issue-title:hover,
.flex-item .title:hover {
  color: #58a6ff !important;
}

/* Issue labels */
.issue-item .label,
.issue-label,
.flex-item .label {
  padding: 2px 8px !important;
  border-radius: 16px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  white-space: nowrap !important;
}

/* Issue metadata (opened by, comments count) */
.issue-item .meta,
.issue-meta,
.flex-item .desc {
  font-size: 12px !important;
  color: #848d97 !important;
  margin-top: 4px !important;
}

.issue-item .meta a,
.issue-meta a,
.flex-item .desc a {
  color: #848d97 !important;
}

.issue-item .meta a:hover,
.issue-meta a:hover,
.flex-item .desc a:hover {
  color: #58a6ff !important;
}

/* ---------------------------------------------------------------------------
   v39 - PR LIST IMPROVEMENTS
   --------------------------------------------------------------------------- */

/* PR state badges */
.pr-state,
.merge-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 8px !important;
  border-radius: 16px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

/* Open PR */
.pr-state.open,
.merge-status.open {
  background: rgba(63, 185, 80, 0.15) !important;
  color: #3fb950 !important;
}

/* Merged PR */
.pr-state.merged,
.merge-status.merged {
  background: rgba(163, 113, 247, 0.15) !important;
  color: #a371f7 !important;
}

/* Closed PR */
.pr-state.closed,
.merge-status.closed {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
}

/* ---------------------------------------------------------------------------
   v39 - PROFILE PAGE IMPROVEMENTS
   --------------------------------------------------------------------------- */

/* Profile header */
.user-profile,
.profile-header {
  display: flex !important;
  gap: 24px !important;
  padding: 24px 0 !important;
}

/* Avatar container */
.user-profile .avatar,
.profile-avatar {
  flex-shrink: 0 !important;
}

.user-profile .avatar img,
.profile-avatar img {
  width: 260px !important;
  height: 260px !important;
  border-radius: 50% !important;
  border: 1px solid #21262d !important;
}

/* Profile info */
.user-profile .profile-info,
.profile-info {
  flex-grow: 1 !important;
}

.user-profile .full-name,
.profile-info .full-name {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: #e6edf3 !important;
  margin-bottom: 4px !important;
}

.user-profile .username,
.profile-info .username {
  font-size: 20px !important;
  font-weight: 300 !important;
  color: #848d97 !important;
  margin-bottom: 16px !important;
}

/* Profile bio */
.user-profile .bio,
.profile-info .bio {
  font-size: 14px !important;
  color: #e6edf3 !important;
  margin-bottom: 16px !important;
}

/* Profile stats (followers, following, stars) */
.user-profile .profile-stats,
.profile-stats {
  display: flex !important;
  gap: 16px !important;
  margin-bottom: 16px !important;
}

.user-profile .profile-stats .stat,
.profile-stats .stat {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #848d97 !important;
  font-size: 14px !important;
}

.user-profile .profile-stats .stat strong,
.profile-stats .stat strong {
  color: #e6edf3 !important;
}

/* Profile tabs */
.profile-tabs,
.user-tabs {
  border-bottom: 1px solid #21262d !important;
  margin-bottom: 16px !important;
}

.profile-tabs .item,
.user-tabs .item {
  color: #e6edf3 !important;
  padding: 12px 16px !important;
  border-bottom: 2px solid transparent !important;
  font-weight: 500 !important;
}

.profile-tabs .item:hover,
.user-tabs .item:hover {
  border-bottom-color: #848d97 !important;
}

.profile-tabs .item.active,
.user-tabs .item.active {
  border-bottom-color: #f78166 !important;
  font-weight: 600 !important;
}

/* ---------------------------------------------------------------------------
   v39 - EMPTY STATE STYLING
   --------------------------------------------------------------------------- */

.empty-state,
.no-results,
.ui.placeholder.segment {
  background: #0d1117 !important;
  border: 1px dashed #21262d !important;
  border-radius: 6px !important;
  padding: 48px 24px !important;
  text-align: center !important;
  color: #848d97 !important;
}

.empty-state .icon,
.no-results .icon,
.ui.placeholder.segment .icon {
  font-size: 48px !important;
  color: #848d97 !important;
  margin-bottom: 16px !important;
}

.empty-state .header,
.no-results .header {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: #e6edf3 !important;
  margin-bottom: 8px !important;
}

.empty-state .sub-header,
.no-results .sub-header,
.empty-state p,
.no-results p {
  font-size: 14px !important;
  color: #848d97 !important;
}

/* ---------------------------------------------------------------------------
   v40 - NAVBAR IMPROVEMENTS
   Match GitHub header more closely
   --------------------------------------------------------------------------- */

/* Main navbar container */
#navbar,
.ui.secondary.menu.navbar,
header.navbar {
  background: #010409 !important;
  border-bottom: 1px solid #21262d !important;
  padding: 0 16px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
}

/* Logo styling */
#navbar .logo,
.navbar .logo {
  display: flex !important;
  align-items: center !important;
  margin-right: 16px !important;
}

#navbar .logo img,
.navbar .logo img {
  height: 32px !important;
  width: auto !important;
}

/* Search bar in navbar - GitHub style */
#navbar .search,
#navbar input[type="text"],
.navbar .search input,
#search-box,
.ui.search input {
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  color: #e6edf3 !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  height: 32px !important;
  min-width: 240px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

#navbar .search:focus,
#navbar input[type="text"]:focus,
.navbar .search input:focus,
#search-box:focus,
.ui.search input:focus {
  border-color: #1f6feb !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Search placeholder */
#navbar .search::placeholder,
#navbar input::placeholder,
.ui.search input::placeholder {
  color: #848d97 !important;
}

/* Keyboard shortcut indicator (/) */
.search-key,
.keyboard-hint,
kbd {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
  font-size: 11px !important;
  color: #848d97 !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace !important;
  margin-left: 4px !important;
}

/* Navbar links */
#navbar a.item,
.navbar a.item,
header a.item {
  color: #e6edf3 !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

#navbar a.item:hover,
.navbar a.item:hover,
header a.item:hover {
  background: #21262d !important;
  color: #e6edf3 !important;
}

/* Active navbar item */
#navbar a.item.active,
.navbar a.item.active,
header a.item.active {
  background: transparent !important;
  font-weight: 600 !important;
}

/* Navbar buttons - Remove green background from Explore */
#navbar .ui.button,
.navbar .ui.button {
  background: transparent !important;
  color: #e6edf3 !important;
  border: 1px solid transparent !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
}

#navbar .ui.button:hover,
.navbar .ui.button:hover {
  background: #21262d !important;
}

/* Sign In button - outlined style */
#navbar .ui.button.signin,
#navbar a[href*="login"],
.navbar a[href*="login"] {
  background: transparent !important;
  border: 1px solid #30363d !important;
  color: #e6edf3 !important;
}

#navbar .ui.button.signin:hover,
#navbar a[href*="login"]:hover,
.navbar a[href*="login"]:hover {
  background: #21262d !important;
  border-color: #848d97 !important;
}

/* Register button - subtle green */
#navbar .ui.button.register,
#navbar a[href*="sign_up"],
.navbar a[href*="sign_up"] {
  background: transparent !important;
  border: 1px solid #30363d !important;
  color: #e6edf3 !important;
}

#navbar .ui.button.register:hover,
#navbar a[href*="sign_up"]:hover,
.navbar a[href*="sign_up"]:hover {
  background: #21262d !important;
  border-color: #848d97 !important;
}

/* Navbar icons */
#navbar .svg,
#navbar svg,
.navbar .svg,
.navbar svg {
  fill: #e6edf3 !important;
  width: 16px !important;
  height: 16px !important;
}

/* ---------------------------------------------------------------------------
   v40 - EXPLORE PAGE IMPROVEMENTS
   Better tabs, search, and content styling
   --------------------------------------------------------------------------- */

/* Explore page tabs - GitHub style underline tabs */
.explore .ui.secondary.pointing.menu,
.explore .ui.tabular.menu,
.ui.secondary.pointing.menu {
  border-bottom: 1px solid #21262d !important;
  background: transparent !important;
  margin-bottom: 16px !important;
}

.explore .ui.secondary.pointing.menu .item,
.explore .ui.tabular.menu .item,
.ui.secondary.pointing.menu .item {
  color: #e6edf3 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  margin-bottom: -1px !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.explore .ui.secondary.pointing.menu .item:hover,
.explore .ui.tabular.menu .item:hover,
.ui.secondary.pointing.menu .item:hover {
  color: #e6edf3 !important;
  border-bottom-color: #848d97 !important;
  background: transparent !important;
}

.explore .ui.secondary.pointing.menu .item.active,
.explore .ui.tabular.menu .item.active,
.ui.secondary.pointing.menu .item.active {
  color: #e6edf3 !important;
  font-weight: 600 !important;
  border-bottom-color: #f78166 !important;
  background: transparent !important;
}

/* Explore search bar */
.explore .ui.search input,
.explore input[placeholder*="Search"],
.explore .search-input,
input[placeholder="Search repos..."],
input[placeholder*="Search"] {
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  color: #e6edf3 !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  min-width: 300px !important;
  height: 36px !important;
}

.explore .ui.search input:focus,
.explore input[placeholder*="Search"]:focus,
input[placeholder="Search repos..."]:focus {
  border-color: #1f6feb !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Filter and Sort dropdowns */
.explore .ui.dropdown,
.explore select,
.ui.dropdown.filter,
.ui.dropdown.sort {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  color: #e6edf3 !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  height: 32px !important;
  min-width: 80px !important;
}

.explore .ui.dropdown:hover,
.explore select:hover {
  background: #30363d !important;
  border-color: #848d97 !important;
}

.explore .ui.dropdown .menu,
.ui.dropdown.filter .menu,
.ui.dropdown.sort .menu {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.4) !important;
  margin-top: 4px !important;
}

.explore .ui.dropdown .menu .item,
.ui.dropdown.filter .menu .item,
.ui.dropdown.sort .menu .item {
  color: #e6edf3 !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
}

.explore .ui.dropdown .menu .item:hover {
  background: #21262d !important;
}

/* Explore results list */
.explore .repository-list,
.explore .user-list,
.explore .organization-list {
  background: transparent !important;
}

.explore .repository-item,
.explore .user-item,
.explore .list-item {
  padding: 16px !important;
  border-bottom: 1px solid #21262d !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
}

.explore .repository-item:hover,
.explore .user-item:hover,
.explore .list-item:hover {
  background: #161b22 !important;
}

.explore .repository-item:last-child,
.explore .user-item:last-child,
.explore .list-item:last-child {
  border-bottom: none !important;
}

/* Repository card in explore */
.explore .repository-name,
.explore .repo-name {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #58a6ff !important;
  text-decoration: none !important;
}

.explore .repository-name:hover,
.explore .repo-name:hover {
  text-decoration: underline !important;
}

.explore .repository-description,
.explore .repo-description {
  color: #9198a1 !important;
  font-size: 14px !important;
  margin-top: 4px !important;
  line-height: 1.5 !important;
}

/* ---------------------------------------------------------------------------
   v40 - FOOTER IMPROVEMENTS
   Clean, minimal footer
   --------------------------------------------------------------------------- */

footer,
.footer,
#footer {
  background: #010409 !important;
  border-top: 1px solid #21262d !important;
  padding: 24px 16px !important;
  color: #848d97 !important;
  font-size: 12px !important;
}

footer a,
.footer a,
#footer a {
  color: #848d97 !important;
  text-decoration: none !important;
}

footer a:hover,
.footer a:hover,
#footer a:hover {
  color: #58a6ff !important;
  text-decoration: underline !important;
}

/* Hide "Powered by" text if present */
footer .powered-by,
.footer .powered-by {
  display: none !important;
}

/* ---------------------------------------------------------------------------
   v40 - CARD STYLING
   Consistent card design across the app
   --------------------------------------------------------------------------- */

.ui.card,
.ui.cards > .card,
.card {
  background: #0d1117 !important;
  border: 1px solid #21262d !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: #e6edf3 !important;
}

.ui.card:hover,
.ui.cards > .card:hover,
.card:hover {
  border-color: #30363d !important;
  transform: none !important;
  box-shadow: 0 4px 12px rgba(1, 4, 9, 0.3) !important;
}

.ui.card .header,
.card .header {
  color: #e6edf3 !important;
  font-weight: 600 !important;
}

.ui.card .meta,
.card .meta {
  color: #848d97 !important;
  font-size: 12px !important;
}

.ui.card .description,
.card .description {
  color: #9198a1 !important;
}

.ui.card .content,
.card .content {
  padding: 16px !important;
  border-top: 1px solid #21262d !important;
}

.ui.card .content:first-child,
.card .content:first-child {
  border-top: none !important;
}

/* ---------------------------------------------------------------------------
   v40 - MODAL IMPROVEMENTS
   Better modal styling
   --------------------------------------------------------------------------- */

.ui.modal,
.modal {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 48px rgba(1, 4, 9, 0.6) !important;
}

.ui.modal > .header,
.modal > .header {
  background: #161b22 !important;
  border-bottom: 1px solid #21262d !important;
  color: #e6edf3 !important;
  font-weight: 600 !important;
  padding: 16px 24px !important;
  border-radius: 12px 12px 0 0 !important;
}

.ui.modal > .content,
.modal > .content {
  background: #161b22 !important;
  color: #e6edf3 !important;
  padding: 24px !important;
}

.ui.modal > .actions,
.modal > .actions {
  background: #0d1117 !important;
  border-top: 1px solid #21262d !important;
  padding: 16px 24px !important;
  border-radius: 0 0 12px 12px !important;
}

/* Modal close button */
.ui.modal > .close,
.modal > .close {
  color: #848d97 !important;
  top: 16px !important;
  right: 16px !important;
}

.ui.modal > .close:hover,
.modal > .close:hover {
  color: #e6edf3 !important;
}

/* ---------------------------------------------------------------------------
   v40 - CHECKBOX & RADIO STYLING
   --------------------------------------------------------------------------- */

.ui.checkbox input,
input[type="checkbox"],
input[type="radio"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 3px !important;
  cursor: pointer !important;
  vertical-align: middle !important;
  margin-right: 8px !important;
}

input[type="radio"] {
  border-radius: 50% !important;
}

.ui.checkbox input:checked,
input[type="checkbox"]:checked {
  background: #238636 !important;
  border-color: #238636 !important;
}

input[type="radio"]:checked {
  background: #238636 !important;
  border-color: #238636 !important;
  box-shadow: inset 0 0 0 3px #0d1117 !important;
}

.ui.checkbox input:focus,
input[type="checkbox"]:focus,
input[type="radio"]:focus {
  border-color: #1f6feb !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
  outline: none !important;
}

/* Checkbox checkmark */
.ui.checkbox input:checked::after,
input[type="checkbox"]:checked::after {
  content: "✓" !important;
  color: #ffffff !important;
  font-size: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
}

/* Checkbox label */
.ui.checkbox label,
input[type="checkbox"] + label,
input[type="radio"] + label {
  color: #e6edf3 !important;
  font-size: 14px !important;
  cursor: pointer !important;
}

/* ---------------------------------------------------------------------------
   v40 - TOOLTIP STYLING
   --------------------------------------------------------------------------- */

[data-tooltip],
.tooltip,
.ui.popup {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  color: #e6edf3 !important;
  font-size: 12px !important;
  padding: 8px 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.4) !important;
}

/* ---------------------------------------------------------------------------
   v40 - LOADING STATES
   --------------------------------------------------------------------------- */

.ui.loading,
.loading {
  opacity: 0.7 !important;
}

.ui.loader,
.loader {
  border-color: #30363d !important;
  border-top-color: #58a6ff !important;
}

/* Skeleton loading */
.skeleton,
.ui.placeholder {
  background: linear-gradient(90deg, #21262d 25%, #30363d 50%, #21262d 75%) !important;
  background-size: 200% 100% !important;
  animation: skeleton-loading 1.5s infinite !important;
  border-radius: 4px !important;
}

@keyframes skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ---------------------------------------------------------------------------
   v40 - PAGINATION STYLING
   --------------------------------------------------------------------------- */

.ui.pagination.menu,
.pagination {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: flex !important;
  gap: 4px !important;
}

.ui.pagination.menu .item,
.pagination .item,
.pagination a {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  color: #e6edf3 !important;
  padding: 6px 12px !important;
  font-size: 14px !important;
  min-width: 32px !important;
  text-align: center !important;
}

.ui.pagination.menu .item:hover,
.pagination .item:hover,
.pagination a:hover {
  background: #30363d !important;
  border-color: #848d97 !important;
  color: #e6edf3 !important;
}

.ui.pagination.menu .item.active,
.pagination .item.active,
.pagination a.active {
  background: #1f6feb !important;
  border-color: #1f6feb !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

.ui.pagination.menu .item.disabled,
.pagination .item.disabled,
.pagination a.disabled {
  background: #0d1117 !important;
  border-color: #21262d !important;
  color: #484f58 !important;
  cursor: not-allowed !important;
}

/* ---------------------------------------------------------------------------
   v40 - BREADCRUMB STYLING
   --------------------------------------------------------------------------- */

.ui.breadcrumb,
.breadcrumb {
  font-size: 14px !important;
  color: #848d97 !important;
}

.ui.breadcrumb a,
.breadcrumb a {
  color: #58a6ff !important;
  text-decoration: none !important;
}

.ui.breadcrumb a:hover,
.breadcrumb a:hover {
  text-decoration: underline !important;
}

.ui.breadcrumb .divider,
.breadcrumb .divider,
.breadcrumb .separator {
  color: #848d97 !important;
  margin: 0 8px !important;
}

.ui.breadcrumb .section.active,
.breadcrumb .active {
  color: #e6edf3 !important;
  font-weight: 600 !important;
}

/* ---------------------------------------------------------------------------
   v40 - ALERT/BANNER REFINEMENTS
   --------------------------------------------------------------------------- */

/* Info banner */
.ui.info.message,
.alert-info,
.banner-info {
  background: rgba(31, 111, 235, 0.1) !important;
  border: 1px solid rgba(31, 111, 235, 0.3) !important;
  border-radius: 6px !important;
  color: #58a6ff !important;
  padding: 12px 16px !important;
}

/* Success banner */
.ui.success.message,
.ui.positive.message,
.alert-success,
.banner-success {
  background: rgba(63, 185, 80, 0.1) !important;
  border: 1px solid rgba(63, 185, 80, 0.3) !important;
  border-radius: 6px !important;
  color: #3fb950 !important;
  padding: 12px 16px !important;
}

/* Warning banner */
.ui.warning.message,
.alert-warning,
.banner-warning {
  background: rgba(210, 153, 34, 0.1) !important;
  border: 1px solid rgba(210, 153, 34, 0.3) !important;
  border-radius: 6px !important;
  color: #d29922 !important;
  padding: 12px 16px !important;
}

/* Error banner */
.ui.error.message,
.ui.negative.message,
.alert-error,
.alert-danger,
.banner-error {
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.3) !important;
  border-radius: 6px !important;
  color: #f85149 !important;
  padding: 12px 16px !important;
}

/* Message header */
.ui.message .header,
.alert .header {
  font-weight: 600 !important;
  margin-bottom: 4px !important;
}

/* Message close button */
.ui.message .close,
.alert .close {
  opacity: 0.7 !important;
  cursor: pointer !important;
}

.ui.message .close:hover,
.alert .close:hover {
  opacity: 1 !important;
}

/* ===========================================================================
   v41 - ADDITIONAL UI POLISH
   =========================================================================== */

/* ---------------------------------------------------------------------------
   v41 - ENHANCED EMPTY STATES
   --------------------------------------------------------------------------- */

/* Empty state container */
.empty-placeholder,
.ui.placeholder.segment,
.no-results,
.empty-content,
.nothing-to-show {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 64px 24px !important;
  text-align: center !important;
  color: #9198a1 !important;
}

/* Empty state icon */
.empty-placeholder svg,
.empty-placeholder .octicon,
.no-results svg,
.empty-content svg {
  width: 64px !important;
  height: 64px !important;
  margin-bottom: 16px !important;
  color: #30363d !important;
  opacity: 0.6 !important;
}

/* Empty state title */
.empty-placeholder h3,
.empty-placeholder .title,
.no-results h3 {
  color: #e6edf3 !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

/* Empty state description */
.empty-placeholder p,
.empty-placeholder .description,
.no-results p {
  color: #9198a1 !important;
  font-size: 14px !important;
  max-width: 400px !important;
  line-height: 1.5 !important;
}

/* ---------------------------------------------------------------------------
   v41 - TABLE STYLING
   --------------------------------------------------------------------------- */

/* Base table styling */
.ui.table,
table.ui,
.file-table,
.repository table,
.issue-list table {
  background: transparent !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  width: 100% !important;
  overflow: hidden !important;
}

/* Table header */
.ui.table thead th,
.ui.table th,
table thead th {
  background: #161b22 !important;
  color: #9198a1 !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: none !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #30363d !important;
  border-left: none !important;
}

.ui.table thead th:first-child {
  border-top-left-radius: 6px !important;
}

.ui.table thead th:last-child {
  border-top-right-radius: 6px !important;
}

/* Table rows */
.ui.table tbody tr,
table tbody tr {
  background: #0d1117 !important;
  transition: background 0.15s ease !important;
}

.ui.table tbody tr:hover,
table tbody tr:hover {
  background: #161b22 !important;
}

/* Table cells */
.ui.table td,
table td {
  padding: 12px 16px !important;
  border-top: 1px solid #21262d !important;
  border-left: none !important;
  color: #e6edf3 !important;
  vertical-align: middle !important;
}

.ui.table tbody tr:first-child td {
  border-top: none !important;
}

/* Compact table variant */
.ui.table.compact td,
.ui.table.compact th {
  padding: 8px 12px !important;
}

/* ---------------------------------------------------------------------------
   v41 - AVATAR STYLING
   --------------------------------------------------------------------------- */

/* Base avatar */
.ui.avatar,
.ui.avatar.image,
img.avatar,
img.ui.avatar,
.avatar-user,
.avatar {
  border-radius: 50% !important;
  border: none !important;
  box-shadow: 0 0 0 1px rgba(27, 31, 36, 0.15) !important;
  background: #21262d !important;
  object-fit: cover !important;
}

/* Avatar sizes */
.ui.avatar.mini,
.avatar-small,
.avatar.sm {
  width: 20px !important;
  height: 20px !important;
}

.ui.avatar.tiny {
  width: 24px !important;
  height: 24px !important;
}

.ui.avatar.small {
  width: 32px !important;
  height: 32px !important;
}

.ui.avatar.medium,
.ui.avatar {
  width: 40px !important;
  height: 40px !important;
}

.ui.avatar.large {
  width: 48px !important;
  height: 48px !important;
}

.ui.avatar.big {
  width: 64px !important;
  height: 64px !important;
}

.ui.avatar.huge {
  width: 96px !important;
  height: 96px !important;
}

.ui.avatar.massive {
  width: 128px !important;
  height: 128px !important;
}

/* Organization/Repo avatar (square) */
.avatar-org,
.avatar-repo,
.avatar.org {
  border-radius: 6px !important;
}

/* ---------------------------------------------------------------------------
   v41 - BADGE/LABEL STYLING
   --------------------------------------------------------------------------- */

/* Base label */
.ui.label,
.label,
.tag,
.badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 8px !important;
  height: 20px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  border-radius: 10px !important;
  border: none !important;
  white-space: nowrap !important;
}

/* Default label style */
.ui.label:not(.basic):not(.primary):not(.secondary),
.label.default {
  background: #21262d !important;
  color: #9198a1 !important;
}

/* Language labels */
.ui.label.language,
.language-color,
.repo-language-color {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  display: inline-block !important;
  margin-right: 4px !important;
  padding: 0 !important;
}

/* Issue/PR state labels */
.ui.label.green,
.label.open,
.label.success,
.state-label.open {
  background: rgba(63, 185, 80, 0.2) !important;
  color: #3fb950 !important;
}

.ui.label.purple,
.label.merged,
.state-label.merged {
  background: rgba(163, 113, 247, 0.2) !important;
  color: #a371f7 !important;
}

.ui.label.red,
.label.closed,
.label.error,
.state-label.closed {
  background: rgba(248, 81, 73, 0.2) !important;
  color: #f85149 !important;
}

.ui.label.blue,
.label.draft,
.state-label.draft {
  background: rgba(110, 118, 129, 0.2) !important;
  color: #9198a1 !important;
}

/* Issue labels with custom colors */
.issue-label,
.repo-label,
.IssueLabel {
  padding: 2px 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  border-radius: 12px !important;
  border: 1px solid transparent !important;
}

/* Count badges */
.ui.label.circular,
.badge-count,
.counter {
  min-width: 20px !important;
  height: 20px !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  background: rgba(110, 118, 129, 0.4) !important;
  color: #e6edf3 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-align: center !important;
}

/* ---------------------------------------------------------------------------
   v41 - LINK HOVER STATES
   --------------------------------------------------------------------------- */

/* Default link styling */
a:not(.ui):not(.button):not(.item):not(.btn) {
  color: #58a6ff !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

a:not(.ui):not(.button):not(.item):not(.btn):hover {
  color: #79c0ff !important;
  text-decoration: underline !important;
}

/* Muted links */
a.muted-link,
.muted a,
.text-muted a {
  color: #9198a1 !important;
}

a.muted-link:hover,
.muted a:hover,
.text-muted a:hover {
  color: #58a6ff !important;
}

/* Repository name links */
.repo-name a,
a.repo-name,
.repository-title a,
a.repository-link {
  color: #58a6ff !important;
  font-weight: 600 !important;
}

.repo-name a:hover,
a.repo-name:hover,
.repository-title a:hover,
a.repository-link:hover {
  text-decoration: underline !important;
}

/* User/org links */
a.user-link,
a.org-link,
.author a,
.user-mention {
  color: #e6edf3 !important;
  font-weight: 600 !important;
}

a.user-link:hover,
a.org-link:hover,
.author a:hover,
.user-mention:hover {
  color: #58a6ff !important;
}

/* ---------------------------------------------------------------------------
   v41 - CODE/MONOSPACE STYLING
   --------------------------------------------------------------------------- */

/* Inline code */
code,
.code,
kbd,
samp,
.monospace,
.mono {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 85% !important;
  background: rgba(110, 118, 129, 0.4) !important;
  border-radius: 6px !important;
  padding: 0.2em 0.4em !important;
  color: #e6edf3 !important;
}

/* Code inside links */
a code {
  color: #58a6ff !important;
}

/* Commit SHA styling */
.sha,
.commit-sha,
.commit-id,
.hash,
code.sha,
a.sha {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
  background: rgba(110, 118, 129, 0.4) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  color: #58a6ff !important;
}

.sha:hover,
.commit-sha:hover,
a.sha:hover {
  background: rgba(56, 139, 253, 0.15) !important;
  text-decoration: none !important;
}

/* Pre/code blocks */
pre,
.code-block,
.highlight pre {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 16px !important;
  overflow-x: auto !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  color: #e6edf3 !important;
}

pre code {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  font-size: inherit !important;
}

/* ---------------------------------------------------------------------------
   v41 - FILE TREE REFINEMENTS
   --------------------------------------------------------------------------- */

/* File tree container */
.file-tree,
.tree-list,
.files-table {
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* File tree header */
.file-tree-header,
.tree-header {
  background: #161b22 !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #30363d !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* File tree rows */
.file-tree-row,
.tree-item,
.file-row {
  display: flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  border-top: 1px solid #21262d !important;
  transition: background 0.15s ease !important;
}

.file-tree-row:first-child {
  border-top: none !important;
}

.file-tree-row:hover,
.tree-item:hover,
.file-row:hover {
  background: #161b22 !important;
}

/* File icons */
.file-tree-icon,
.tree-icon,
.file-icon {
  width: 16px !important;
  height: 16px !important;
  margin-right: 8px !important;
  flex-shrink: 0 !important;
}

/* Folder icon color */
.file-tree-icon.folder,
.tree-icon.folder,
.octicon-file-directory-fill {
  color: #54aeff !important;
}

/* File name */
.file-tree-name,
.tree-name,
.file-name {
  flex: 1 !important;
  color: #e6edf3 !important;
}

.file-tree-name a,
.tree-name a,
.file-name a {
  color: #e6edf3 !important;
}

.file-tree-name a:hover,
.tree-name a:hover,
.file-name a:hover {
  color: #58a6ff !important;
  text-decoration: underline !important;
}

/* Commit message in tree */
.file-tree-message,
.tree-commit-message {
  flex: 2 !important;
  color: #9198a1 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  padding: 0 16px !important;
}

.file-tree-message a {
  color: #9198a1 !important;
}

.file-tree-message a:hover {
  color: #58a6ff !important;
}

/* Commit time */
.file-tree-time,
.tree-time,
.file-time {
  color: #9198a1 !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* ---------------------------------------------------------------------------
   v41 - ISSUE/PR LIST STYLING
   --------------------------------------------------------------------------- */

/* Issue list container */
.issue-list,
.pull-list,
.issue-list-container {
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  background: #0d1117 !important;
}

/* Issue list header */
.issue-list-header,
.list-header {
  background: #161b22 !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #30363d !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

/* Issue list item */
.issue-item,
.pull-item,
.list-item {
  display: flex !important;
  padding: 16px !important;
  border-top: 1px solid #21262d !important;
  gap: 12px !important;
  transition: background 0.15s ease !important;
}

.issue-item:first-child {
  border-top: none !important;
}

.issue-item:hover,
.pull-item:hover,
.list-item:hover {
  background: #161b22 !important;
}

/* Issue state icon */
.issue-item .state-icon,
.issue-state-icon {
  flex-shrink: 0 !important;
  width: 16px !important;
  height: 16px !important;
  margin-top: 2px !important;
}

/* Open issue icon */
.issue-item .state-icon.open,
.octicon-issue-opened {
  color: #3fb950 !important;
}

/* Closed issue icon */
.issue-item .state-icon.closed,
.octicon-issue-closed {
  color: #a371f7 !important;
}

/* PR icon states */
.octicon-git-pull-request {
  color: #3fb950 !important;
}

.octicon-git-pull-request-closed {
  color: #f85149 !important;
}

.octicon-git-merge {
  color: #a371f7 !important;
}

/* Issue content */
.issue-item .content,
.issue-content {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Issue title */
.issue-item .title,
.issue-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #e6edf3 !important;
  line-height: 1.4 !important;
}

.issue-item .title a,
.issue-title a {
  color: #e6edf3 !important;
}

.issue-item .title a:hover,
.issue-title a:hover {
  color: #58a6ff !important;
}

/* Issue meta */
.issue-item .meta,
.issue-meta {
  font-size: 12px !important;
  color: #9198a1 !important;
  margin-top: 4px !important;
}

/* ---------------------------------------------------------------------------
   v41 - COMMIT LIST STYLING
   --------------------------------------------------------------------------- */

/* Commit list container */
.commit-list,
.commits-list {
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* Commit item */
.commit-item,
.commit-row {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px !important;
  border-top: 1px solid #21262d !important;
  gap: 12px !important;
}

.commit-item:first-child {
  border-top: none !important;
}

/* Commit avatar */
.commit-item .avatar,
.commit-avatar {
  flex-shrink: 0 !important;
}

/* Commit content */
.commit-item .content,
.commit-content {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Commit message */
.commit-item .message,
.commit-message {
  font-weight: 600 !important;
  color: #e6edf3 !important;
  line-height: 1.4 !important;
}

.commit-item .message a,
.commit-message a {
  color: #e6edf3 !important;
}

.commit-item .message a:hover,
.commit-message a:hover {
  color: #58a6ff !important;
}

/* Commit info */
.commit-item .info,
.commit-info {
  font-size: 12px !important;
  color: #9198a1 !important;
  margin-top: 4px !important;
}

/* Commit actions (SHA, browse files, etc) */
.commit-item .actions,
.commit-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-shrink: 0 !important;
}

/* ---------------------------------------------------------------------------
   v41 - DIFF VIEW REFINEMENTS
   --------------------------------------------------------------------------- */

/* Diff file header */
.diff-file-header,
.file-header {
  background: #161b22 !important;
  padding: 8px 16px !important;
  border: 1px solid #30363d !important;
  border-bottom: none !important;
  border-radius: 6px 6px 0 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Diff file box */
.diff-file-box,
.diff-box {
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
  overflow: hidden !important;
}

/* Diff table */
.diff-file-body table,
.diff-table {
  width: 100% !important;
  border-collapse: collapse !important;
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 12px !important;
  line-height: 20px !important;
}

/* Diff line numbers */
.diff-line-num,
.line-num {
  width: 40px !important;
  min-width: 40px !important;
  padding: 0 8px !important;
  text-align: right !important;
  color: #848d97 !important;
  background: #0d1117 !important;
  user-select: none !important;
  vertical-align: top !important;
}

/* Diff line content */
.diff-line-code,
.line-code {
  padding: 0 16px !important;
  white-space: pre !important;
  color: #e6edf3 !important;
}

/* Addition lines */
.diff-line.add,
.diff-add,
.line-addition,
tr.addition {
  background: rgba(63, 185, 80, 0.15) !important;
}

.diff-line.add .diff-line-num,
tr.addition .line-num {
  background: rgba(63, 185, 80, 0.2) !important;
  color: #7ee787 !important;
}

/* Deletion lines */
.diff-line.del,
.diff-del,
.line-deletion,
tr.deletion {
  background: rgba(248, 81, 73, 0.15) !important;
}

.diff-line.del .diff-line-num,
tr.deletion .line-num {
  background: rgba(248, 81, 73, 0.2) !important;
  color: #f85149 !important;
}

/* Expansion/context line */
.diff-line.expand,
.line-expand,
.diff-expander {
  background: #161b22 !important;
  color: #9198a1 !important;
  text-align: center !important;
  cursor: pointer !important;
}

.diff-line.expand:hover,
.line-expand:hover,
.diff-expander:hover {
  background: rgba(56, 139, 253, 0.15) !important;
  color: #58a6ff !important;
}

/* ---------------------------------------------------------------------------
   v41 - README/MARKDOWN STYLING
   --------------------------------------------------------------------------- */

/* README container */
.readme-box,
.markdown-body,
.file-view.markdown {
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 24px !important;
}

/* README header */
.readme-header,
.file-header.readme {
  background: #161b22 !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid #30363d !important;
  border-radius: 6px 6px 0 0 !important;
  font-weight: 600 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Markdown headings */
.markdown-body h1,
.markdown-body h2 {
  padding-bottom: 8px !important;
  border-bottom: 1px solid #30363d !important;
  margin-bottom: 16px !important;
  margin-top: 24px !important;
}

.markdown-body h1 {
  font-size: 2em !important;
}

.markdown-body h2 {
  font-size: 1.5em !important;
}

.markdown-body h3 {
  font-size: 1.25em !important;
}

/* Markdown links */
.markdown-body a {
  color: #58a6ff !important;
}

.markdown-body a:hover {
  text-decoration: underline !important;
}

/* Markdown images */
.markdown-body img {
  max-width: 100% !important;
  border-radius: 6px !important;
}

/* Markdown lists */
.markdown-body ul,
.markdown-body ol {
  padding-left: 24px !important;
  margin: 16px 0 !important;
}

.markdown-body li {
  margin: 4px 0 !important;
}

/* Markdown blockquote */
.markdown-body blockquote {
  border-left: 4px solid #30363d !important;
  padding-left: 16px !important;
  margin: 16px 0 !important;
  color: #9198a1 !important;
}

/* Markdown horizontal rule */
.markdown-body hr {
  border: none !important;
  border-top: 1px solid #30363d !important;
  margin: 24px 0 !important;
}

/* Markdown task list */
.markdown-body .task-list-item {
  list-style-type: none !important;
}

.markdown-body .task-list-item input[type="checkbox"] {
  margin-right: 8px !important;
}

/* ===========================================================================
   v42 - PRECISION UI REFINEMENTS
   =========================================================================== */

/* ---------------------------------------------------------------------------
   v42 - NAVBAR EXACT GITHUB MATCH
   --------------------------------------------------------------------------- */

/* Header container - exact GitHub dimensions */
.ui.secondary.menu.navbar,
#navbar,
header.navbar,
.navbar {
  height: 48px !important;
  min-height: 48px !important;
  max-height: 48px !important;
  padding: 0 16px !important;
  background: #010409 !important;
  border-bottom: 1px solid #21262d !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Logo container */
#navbar .logo,
.navbar .logo,
header .logo {
  display: flex !important;
  align-items: center !important;
  margin-right: 8px !important;
}

#navbar .logo img,
.navbar .logo img {
  height: 32px !important;
  width: auto !important;
}

/* Search bar - exact GitHub styling */
#navbar .ui.search,
.navbar .search-container,
#navbar input[type="search"],
#navbar input[type="text"].search,
.navbar .global-search {
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  height: 32px !important;
  min-width: 280px !important;
  max-width: 540px !important;
  padding: 0 12px !important;
  color: #e6edf3 !important;
  font-size: 14px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

#navbar .ui.search:focus-within,
#navbar input[type="search"]:focus,
#navbar input[type="text"].search:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(56, 139, 253, 0.3) !important;
  outline: none !important;
}

/* Search placeholder */
#navbar input::placeholder {
  color: #848d97 !important;
}

/* Keyboard shortcut hint in search */
.search-key-hint,
.keyboard-hint,
kbd.search-hint {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  border-radius: 4px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
  font-family: ui-monospace, monospace !important;
  color: #9198a1 !important;
  margin-left: 8px !important;
}

/* Navbar links/buttons */
#navbar .item,
.navbar a.item,
header nav a {
  color: #e6edf3 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  transition: background 0.15s ease !important;
  text-decoration: none !important;
}

#navbar .item:hover,
.navbar a.item:hover,
header nav a:hover {
  background: #21262d !important;
  color: #e6edf3 !important;
  text-decoration: none !important;
}

#navbar .item.active,
.navbar a.item.active {
  background: transparent !important;
  font-weight: 600 !important;
}

/* Navbar buttons - Register/Sign In styling */
#navbar .ui.button,
.navbar .button,
header .btn {
  height: 32px !important;
  padding: 0 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  transition: all 0.15s ease !important;
}

/* Sign In button - subtle outline */
#navbar .ui.button.signin,
#navbar a[href*="login"],
.navbar .signin-btn {
  background: transparent !important;
  border: 1px solid #30363d !important;
  color: #e6edf3 !important;
}

#navbar .ui.button.signin:hover,
#navbar a[href*="login"]:hover,
.navbar .signin-btn:hover {
  background: #21262d !important;
  border-color: #9198a1 !important;
}

/* Register/Sign Up button - subtle */
#navbar .ui.button.register,
#navbar a[href*="sign_up"],
.navbar .signup-btn {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: #e6edf3 !important;
}

#navbar .ui.button.register:hover,
#navbar a[href*="sign_up"]:hover,
.navbar .signup-btn:hover {
  background: #21262d !important;
}

/* ---------------------------------------------------------------------------
   v42 - BUTTON STATE REFINEMENTS
   --------------------------------------------------------------------------- */

/* Primary button - all states */
.ui.primary.button,
.btn-primary,
button.primary {
  background: #238636 !important;
  border: 1px solid rgba(240, 246, 252, 0.1) !important;
  color: #ffffff !important;
  font-weight: 500 !important;
  transition: background 0.15s ease !important;
}

.ui.primary.button:hover,
.btn-primary:hover,
button.primary:hover {
  background: #2ea043 !important;
}

.ui.primary.button:active,
.btn-primary:active,
button.primary:active {
  background: #238636 !important;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.2) !important;
}

.ui.primary.button:focus,
.btn-primary:focus,
button.primary:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(46, 160, 67, 0.4) !important;
}

.ui.primary.button:disabled,
.btn-primary:disabled,
button.primary:disabled {
  background: #238636 !important;
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

/* Secondary/default button - all states */
.ui.button:not(.primary):not(.negative):not(.positive),
.btn-secondary,
button:not(.primary):not(.danger) {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  color: #c9d1d9 !important;
  font-weight: 500 !important;
  transition: all 0.15s ease !important;
}

.ui.button:not(.primary):not(.negative):not(.positive):hover,
.btn-secondary:hover {
  background: #30363d !important;
  border-color: #9198a1 !important;
}

.ui.button:not(.primary):not(.negative):not(.positive):active,
.btn-secondary:active {
  background: #282e33 !important;
}

.ui.button:not(.primary):not(.negative):not(.positive):focus,
.btn-secondary:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(56, 139, 253, 0.3) !important;
}

/* Danger/negative button - all states */
.ui.negative.button,
.ui.red.button,
.btn-danger,
button.danger {
  background: #21262d !important;
  border: 1px solid #f85149 !important;
  color: #f85149 !important;
  font-weight: 500 !important;
  transition: all 0.15s ease !important;
}

.ui.negative.button:hover,
.ui.red.button:hover,
.btn-danger:hover,
button.danger:hover {
  background: #da3633 !important;
  border-color: #da3633 !important;
  color: #ffffff !important;
}

.ui.negative.button:focus,
.btn-danger:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(248, 81, 73, 0.4) !important;
}

/* Icon buttons */
.ui.icon.button,
.btn-icon,
button.icon-only {
  padding: 6px !important;
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Button group */
.ui.buttons,
.btn-group {
  display: inline-flex !important;
  gap: 0 !important;
}

.ui.buttons .button:first-child,
.btn-group .btn:first-child {
  border-radius: 6px 0 0 6px !important;
}

.ui.buttons .button:last-child,
.btn-group .btn:last-child {
  border-radius: 0 6px 6px 0 !important;
}

.ui.buttons .button:not(:first-child):not(:last-child),
.btn-group .btn:not(:first-child):not(:last-child) {
  border-radius: 0 !important;
}

.ui.buttons .button + .button,
.btn-group .btn + .btn {
  border-left: 1px solid #21262d !important;
}

/* ---------------------------------------------------------------------------
   v42 - DROPDOWN MENU REFINEMENTS
   --------------------------------------------------------------------------- */

/* Dropdown container */
.ui.dropdown .menu,
.dropdown-menu,
[role="menu"] {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  padding: 4px 0 !important;
  min-width: 160px !important;
  max-height: 480px !important;
  overflow-y: auto !important;
}

/* Dropdown items */
.ui.dropdown .menu > .item,
.dropdown-menu .item,
.dropdown-menu a,
[role="menuitem"] {
  background: transparent !important;
  color: #e6edf3 !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  cursor: pointer !important;
  transition: background 0.1s ease !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.ui.dropdown .menu > .item:hover,
.dropdown-menu .item:hover,
.dropdown-menu a:hover,
[role="menuitem"]:hover {
  background: rgba(177, 186, 196, 0.12) !important;
  color: #e6edf3 !important;
  text-decoration: none !important;
}

.ui.dropdown .menu > .item.active,
.dropdown-menu .item.active,
[role="menuitem"][aria-selected="true"] {
  background: rgba(56, 139, 253, 0.15) !important;
  color: #e6edf3 !important;
}

/* Dropdown divider */
.ui.dropdown .menu .divider,
.dropdown-menu .divider,
[role="separator"] {
  height: 1px !important;
  background: #21262d !important;
  margin: 4px 0 !important;
  padding: 0 !important;
}

/* Dropdown header */
.ui.dropdown .menu .header,
.dropdown-menu .header,
.dropdown-header {
  color: #9198a1 !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 8px 16px 4px !important;
  text-transform: none !important;
}

/* Dropdown with icons */
.ui.dropdown .menu > .item .icon,
.dropdown-menu .item svg,
.dropdown-menu .item .octicon {
  width: 16px !important;
  height: 16px !important;
  color: #9198a1 !important;
  flex-shrink: 0 !important;
}

/* Dropdown trigger arrow */
.ui.dropdown > .dropdown.icon,
.dropdown-toggle::after {
  margin-left: 4px !important;
  opacity: 0.7 !important;
}

/* ---------------------------------------------------------------------------
   v42 - FORM FOCUS STATES
   --------------------------------------------------------------------------- */

/* Input focus */
.ui.form input:focus,
.ui.input input:focus,
input:focus,
textarea:focus,
select:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(56, 139, 253, 0.3) !important;
  outline: none !important;
}

/* Input error state */
.ui.form .field.error input,
.ui.input.error input,
input.error,
input:invalid:not(:placeholder-shown) {
  border-color: #f85149 !important;
  box-shadow: 0 0 0 3px rgba(248, 81, 73, 0.3) !important;
}

/* Input success state */
.ui.form .field.success input,
.ui.input.success input,
input.success {
  border-color: #3fb950 !important;
  box-shadow: 0 0 0 3px rgba(63, 185, 80, 0.3) !important;
}

/* Checkbox focus */
input[type="checkbox"]:focus,
input[type="radio"]:focus {
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(56, 139, 253, 0.3) !important;
}

/* Select focus */
.ui.dropdown:focus-within,
select:focus {
  border-color: #58a6ff !important;
  box-shadow: 0 0 0 3px rgba(56, 139, 253, 0.3) !important;
}

/* ---------------------------------------------------------------------------
   v42 - TYPOGRAPHY & SPACING
   --------------------------------------------------------------------------- */

/* Base font */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans", Helvetica, Arial, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: #e6edf3 !important;
}

/* Headings */
h1, .h1 {
  font-size: 32px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin-bottom: 16px !important;
}

h2, .h2 {
  font-size: 24px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin-bottom: 16px !important;
}

h3, .h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin-bottom: 16px !important;
}

h4, .h4 {
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  margin-bottom: 16px !important;
}

/* Paragraph spacing */
p {
  margin-bottom: 16px !important;
}

/* Small text */
small, .text-small {
  font-size: 12px !important;
  color: #9198a1 !important;
}

/* Muted text */
.text-muted,
.muted,
.secondary-text {
  color: #9198a1 !important;
}

/* Bold text */
strong, b, .text-bold {
  font-weight: 600 !important;
}

/* Container widths */
.ui.container,
.container {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 16px !important;
}

@media (min-width: 768px) {
  .ui.container,
  .container {
    padding: 0 24px !important;
  }
}

@media (min-width: 1012px) {
  .ui.container,
  .container {
    padding: 0 32px !important;
  }
}

/* Section spacing */
.ui.segment,
section,
.section {
  margin-bottom: 24px !important;
}

/* Card spacing */
.ui.card,
.card {
  margin-bottom: 16px !important;
}

/* List spacing */
.ui.list .item,
.list-item {
  padding: 8px 0 !important;
}

/* ---------------------------------------------------------------------------
   v42 - INTERACTIVE STATES
   --------------------------------------------------------------------------- */

/* Clickable items */
.clickable,
[role="button"],
.cursor-pointer {
  cursor: pointer !important;
}

/* Disabled state */
.disabled,
[disabled],
[aria-disabled="true"] {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* Loading state */
.loading,
[aria-busy="true"] {
  opacity: 0.7 !important;
  pointer-events: none !important;
}

/* Selection highlight */
::selection {
  background: rgba(56, 139, 253, 0.4) !important;
  color: #e6edf3 !important;
}

/* Focus visible (keyboard navigation) */
:focus-visible {
  outline: 2px solid #58a6ff !important;
  outline-offset: 2px !important;
}

/* Skip focus outline for mouse users */
:focus:not(:focus-visible) {
  outline: none !important;
}

/* Smooth transitions for interactive elements */
a,
button,
input,
textarea,
select,
.ui.button,
.ui.dropdown,
.item {
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
}

/* ---------------------------------------------------------------------------
   v42 - SCROLLBAR REFINEMENTS
   --------------------------------------------------------------------------- */

/* Webkit scrollbars - refined */
::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

::-webkit-scrollbar-track {
  background: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: #30363d !important;
  border-radius: 4px !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}

::-webkit-scrollbar-thumb:hover {
  background: #484f58 !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}

::-webkit-scrollbar-corner {
  background: transparent !important;
}

/* Firefox scrollbars */
* {
  scrollbar-width: thin !important;
  scrollbar-color: #30363d transparent !important;
}

/* ---------------------------------------------------------------------------
   v42 - ANIMATION & TRANSITIONS
   --------------------------------------------------------------------------- */

/* Fade in animation */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.fade-in {
  animation: fadeIn 0.15s ease-out !important;
}

/* Slide down animation */
@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.slide-down,
.ui.dropdown .menu.visible,
.dropdown-menu.show {
  animation: slideDown 0.15s ease-out !important;
}

/* Scale in animation */
@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.scale-in,
.ui.modal.visible {
  animation: scaleIn 0.2s ease-out !important;
}

/* Pulse animation for loading */
@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

.pulse,
.loading-pulse {
  animation: pulse 1.5s ease-in-out infinite !important;
}

/* Skeleton loading animation */
@keyframes skeleton {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.skeleton,
.placeholder-loading {
  background: linear-gradient(90deg, #21262d 25%, #30363d 50%, #21262d 75%) !important;
  background-size: 200% 100% !important;
  animation: skeleton 1.5s ease-in-out infinite !important;
}

/* ============================================
   v43 - GitHub-Style Precision Refinements
   Deep visual matching based on pixel analysis
   ============================================ */

/* ===========================================
   Segmented Button Groups (Watch/Fork/Star)
   =========================================== */

/* Button group container */
.ui.buttons,
.button-group,
.btn-group,
.repo-buttons {
  display: inline-flex !important;
  align-items: stretch !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* Segmented buttons with counts */
.ui.buttons .button,
.button-group .btn,
.btn-group .btn,
.basic.button.button-rss,
.watch-button,
.fork-button,
.star-button {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  color: #c9d1d9 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  border-radius: 0 !important;
  transition: background 0.1s ease, border-color 0.1s ease !important;
}

.ui.buttons .button:first-child,
.button-group .btn:first-child,
.btn-group .btn:first-child {
  border-radius: 6px 0 0 6px !important;
}

.ui.buttons .button:last-child,
.button-group .btn:last-child,
.btn-group .btn:last-child {
  border-radius: 0 6px 6px 0 !important;
}

.ui.buttons .button:only-child,
.button-group .btn:only-child,
.btn-group .btn:only-child {
  border-radius: 6px !important;
}

/* Button with separator for dropdown */
.ui.buttons .button + .button,
.button-group .btn + .btn,
.btn-group .btn + .btn {
  border-left: 1px solid #30363d !important;
  margin-left: -1px !important;
}

/* Hover states for segmented buttons */
.ui.buttons .button:hover,
.button-group .btn:hover,
.btn-group .btn:hover,
.basic.button:hover {
  background: #30363d !important;
  border-color: #9198a1 !important;
}

/* Count badges inside buttons */
.ui.buttons .button .ui.label,
.button-count,
.repo-count,
.counter {
  background: rgba(110, 118, 129, 0.4) !important;
  color: #c9d1d9 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  min-width: 18px !important;
  text-align: center !important;
  margin-left: 4px !important;
}

/* Star button when starred (filled) */
.star-button.starred,
.button.starred {
  background: #21262d !important;
  border-color: #30363d !important;
}

.star-button.starred .octicon-star,
.button.starred svg {
  color: #e3b341 !important;
  fill: #e3b341 !important;
}

/* ===========================================
   Tab Count Badges (Issues 4.8k, PRs 128)
   =========================================== */

/* Tab navigation with counts */
.ui.tabular.menu .item .ui.label,
.repo-tab .counter,
.tab-counter,
.UnderlineNav-item .Counter {
  background: rgba(110, 118, 129, 0.4) !important;
  color: #c9d1d9 !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  min-height: 18px !important;
  line-height: 18px !important;
  margin-left: 6px !important;
  display: inline-block !important;
}

/* Active tab counter - slightly different background */
.ui.tabular.menu .active.item .ui.label,
.repo-tab.active .counter {
  background: rgba(110, 118, 129, 0.6) !important;
}

/* ===========================================
   Repository Visibility Badges (Public/Private)
   =========================================== */

.repo-visibility,
.ui.label.basic,
.label.basic,
.privacy-badge,
.visibility-badge,
[class*="Label--secondary"] {
  background: transparent !important;
  border: 1px solid #30363d !important;
  color: #9198a1 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  padding: 0 7px !important;
  border-radius: 12px !important;
  line-height: 18px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin-left: 4px !important;
  text-transform: capitalize !important;
}

/* ===========================================
   Languages Bar (Repository Sidebar)
   =========================================== */

.language-bar,
.repository-lang-bar,
.lang-bar {
  display: flex !important;
  height: 8px !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  margin-bottom: 8px !important;
}

.language-bar span,
.lang-bar-segment {
  display: inline-block !important;
  height: 100% !important;
}

/* Language list below bar */
.language-list,
.repo-languages {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px 16px !important;
  font-size: 12px !important;
  color: #9198a1 !important;
}

.language-list .language-item,
.repo-language {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.language-list .language-color,
.lang-color {
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  display: inline-block !important;
}

.language-list .language-name {
  color: #c9d1d9 !important;
  font-weight: 500 !important;
}

.language-list .language-percent {
  color: #9198a1 !important;
}

/* ===========================================
   Contributors & Used By Sections
   =========================================== */

/* Contributors grid */
.contributors-grid,
.avatar-grid {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
}

.contributors-grid .avatar,
.avatar-grid img {
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 2px solid #0d1117 !important;
}

/* Used by - overlapping avatars */
.used-by-avatars,
.avatar-stack {
  display: flex !important;
}

.used-by-avatars .avatar,
.avatar-stack img {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  border: 2px solid #0d1117 !important;
  margin-left: -8px !important;
}

.used-by-avatars .avatar:first-child,
.avatar-stack img:first-child {
  margin-left: 0 !important;
}

/* "+" more link */
.more-contributors,
.avatar-more {
  color: #58a6ff !important;
  font-size: 12px !important;
  margin-left: 8px !important;
}

/* Section headers */
.sidebar-section h3,
.repo-sidebar-header {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
  margin-bottom: 8px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid #21262d !important;
}

/* ===========================================
   Activity Feed Card Refinements
   =========================================== */

/* Outer activity card */
.activity-card,
.feed-item,
.dashboard-card {
  background: #0d1117 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 16px !important;
  margin-bottom: 16px !important;
}

/* Inner repo card inside activity */
.activity-card .repo-card,
.feed-item .inner-card,
.nested-repo-card {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-top: 12px !important;
}

/* Activity header (avatar + text) */
.activity-card .activity-header,
.feed-item-header {
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  margin-bottom: 8px !important;
}

/* Avatar with badge overlay */
.activity-avatar {
  position: relative !important;
}

.activity-avatar .avatar-badge,
.avatar-overlay {
  position: absolute !important;
  bottom: -2px !important;
  right: -2px !important;
  width: 18px !important;
  height: 18px !important;
  background: #0d1117 !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 10px !important;
}

.activity-avatar .avatar-badge.star {
  color: #e3b341 !important;
}

.activity-avatar .avatar-badge.fork {
  color: #9198a1 !important;
}

.activity-avatar .avatar-badge.pr {
  color: #a371f7 !important;
}

/* Activity text styling */
.activity-text .username,
.feed-actor {
  color: #c9d1d9 !important;
  font-weight: 600 !important;
}

.activity-text .action,
.feed-action {
  color: #9198a1 !important;
}

.activity-text .timestamp,
.feed-time {
  color: #9198a1 !important;
  font-size: 12px !important;
}

/* Three-dot menu on activity cards */
.activity-card .dropdown-trigger,
.activity-menu,
.overflow-menu {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  color: #9198a1 !important;
  opacity: 0 !important;
  transition: opacity 0.15s ease !important;
}

.activity-card:hover .dropdown-trigger,
.activity-card:hover .activity-menu,
.feed-item:hover .overflow-menu {
  opacity: 1 !important;
}

/* ===========================================
   Notification Banner Refinements
   =========================================== */

.notification-banner,
.flash,
.alert-info {
  background: rgba(56, 139, 253, 0.15) !important;
  border: 1px solid rgba(56, 139, 253, 0.4) !important;
  border-radius: 6px !important;
  padding: 12px 16px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
}

.notification-banner .icon,
.flash .octicon {
  color: #58a6ff !important;
  margin-right: 12px !important;
}

.notification-banner .close-btn,
.flash .close {
  color: #9198a1 !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  padding: 4px !important;
}

.notification-banner .close-btn:hover,
.flash .close:hover {
  color: #c9d1d9 !important;
}

/* ===========================================
   Feed Header Refinements
   =========================================== */

.feed-header,
.section-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 16px !important;
}

.feed-header h2,
.section-header h2 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
  margin: 0 !important;
}

.feed-header .filter-btn,
.filter-button {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  color: #c9d1d9 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 5px 12px !important;
  border-radius: 6px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.feed-header .filter-btn:hover,
.filter-button:hover {
  background: #30363d !important;
  border-color: #9198a1 !important;
}

/* ===========================================
   Quick Action Buttons (Task, Create issue, etc.)
   =========================================== */

.quick-actions,
.action-bar {
  display: flex !important;
  gap: 8px !important;
  margin-bottom: 16px !important;
  flex-wrap: wrap !important;
}

.quick-action-btn,
.action-bar .btn {
  background: #21262d !important;
  border: 1px solid #30363d !important;
  color: #c9d1d9 !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 8px 16px !important;
  border-radius: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  white-space: nowrap !important;
}

.quick-action-btn:hover,
.action-bar .btn:hover {
  background: #30363d !important;
  border-color: #9198a1 !important;
}

.quick-action-btn svg,
.action-bar .btn svg {
  width: 16px !important;
  height: 16px !important;
  color: #9198a1 !important;
}

/* ===========================================
   About Sidebar Refinements
   =========================================== */

.repo-about,
.repository-content .about {
  margin-bottom: 24px !important;
}

.repo-about h2,
.about-header {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
  margin-bottom: 12px !important;
}

.repo-about .description,
.about-description {
  color: #c9d1d9 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
}

.repo-about .meta-item,
.about-link {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #9198a1 !important;
  font-size: 13px !important;
  padding: 4px 0 !important;
}

.repo-about .meta-item a,
.about-link a {
  color: #58a6ff !important;
}

.repo-about .meta-item svg,
.about-link svg {
  width: 16px !important;
  height: 16px !important;
  color: #9198a1 !important;
  flex-shrink: 0 !important;
}

/* Stats row (stars, watching, forks) */
.repo-stats,
.about-stats {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 12px !important;
  padding-top: 12px !important;
  border-top: 1px solid #21262d !important;
}

.repo-stats .stat-item {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #9198a1 !important;
  font-size: 12px !important;
}

.repo-stats .stat-item svg {
  width: 14px !important;
  height: 14px !important;
}

.repo-stats .stat-item strong,
.repo-stats .stat-value {
  color: #c9d1d9 !important;
  font-weight: 600 !important;
}

/* ===========================================
   PR/Issue Merged Badge
   =========================================== */

.merged-badge,
.ui.label.purple,
.state-merged {
  background: #8957e5 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.merged-badge svg,
.state-merged svg {
  width: 12px !important;
  height: 12px !important;
}

/* Open state */
.open-badge,
.ui.label.green,
.state-open {
  background: #238636 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
}

/* Closed state */
.closed-badge,
.ui.label.red,
.state-closed {
  background: #da3633 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
}

/* Draft state */
.draft-badge,
.ui.label.grey,
.state-draft {
  background: #9198a1 !important;
  color: #ffffff !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 12px !important;
}

/* ===========================================
   Comment Count Badge
   =========================================== */

.comment-count,
.comments-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: #9198a1 !important;
  font-size: 12px !important;
}

.comment-count svg {
  width: 14px !important;
  height: 14px !important;
}

/* ===========================================
   Repository Icon Colors
   =========================================== */

.repo-icon,
.octicon-repo {
  color: #9198a1 !important;
}

.repo-icon.private,
.octicon-lock {
  color: #e3b341 !important;
}

.repo-icon.fork,
.octicon-repo-forked {
  color: #9198a1 !important;
}

/* ===========================================
   Footer Refinements
   =========================================== */

footer,
.footer,
#footer {
  background: #0d1117 !important;
  border-top: 1px solid #21262d !important;
  padding: 24px 16px !important;
  margin-top: 40px !important;
}

footer .footer-links,
.footer-nav {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 16px !important;
  margin-bottom: 12px !important;
}

footer .footer-links a,
.footer-nav a {
  color: #9198a1 !important;
  font-size: 12px !important;
  text-decoration: none !important;
}

footer .footer-links a:hover,
.footer-nav a:hover {
  color: #58a6ff !important;
  text-decoration: underline !important;
}

footer .copyright {
  color: #9198a1 !important;
  font-size: 12px !important;
  text-align: center !important;
}

/* ===========================================
   Mobile Responsive Refinements
   =========================================== */

@media (max-width: 768px) {
  .quick-actions,
  .action-bar {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    padding-bottom: 8px !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .ui.buttons,
  .button-group {
    flex-wrap: nowrap !important;
  }

  .feed-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 12px !important;
  }

  .repo-stats {
    flex-direction: column !important;
    gap: 8px !important;
  }
}

/* ===========================================
   Hover card refinements
   =========================================== */

.hovercard,
.user-popup,
.repo-popup {
  background: #161b22 !important;
  border: 1px solid #30363d !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
  padding: 16px !important;
  min-width: 300px !important;
  max-width: 400px !important;
}

.hovercard .avatar,
.user-popup .avatar {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  margin-right: 12px !important;
}

.hovercard .username,
.user-popup .name {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #c9d1d9 !important;
}

.hovercard .handle,
.user-popup .login {
  font-size: 14px !important;
  color: #9198a1 !important;
}

.hovercard .bio,
.user-popup .bio {
  font-size: 13px !important;
  color: #9198a1 !important;
  margin-top: 8px !important;
  line-height: 1.4 !important;
}

/* ===========================================
   Breadcrumb refinements
   =========================================== */

.breadcrumb,
.repo-breadcrumb {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  font-size: 16px !important;
}

.breadcrumb a,
.repo-breadcrumb a {
  color: #58a6ff !important;
  font-weight: 600 !important;
}

.breadcrumb .separator,
.repo-breadcrumb .divider {
  color: #9198a1 !important;
  margin: 0 4px !important;
}

.breadcrumb .current,
.repo-breadcrumb .current {
  color: #c9d1d9 !important;
  font-weight: 600 !important;
}

/* ===========================================================================
   GLOBAL POLISH & TRANSITIONS (v40)
   Micro-interactions and smooth transitions for premium feel
   =========================================================================== */

/* Global transition defaults */
a,
button,
.ui.button,
.ui.dropdown,
.item,
.flex-item,
input,
textarea,
select {
  transition: background-color 0.15s ease,
              border-color 0.15s ease,
              color 0.15s ease,
              box-shadow 0.15s ease,
              transform 0.1s ease !important;
}

/* Smooth avatar transitions */
.avatar,
img.avatar,
.ui.avatar {
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

.avatar:hover,
img.avatar:hover,
.ui.avatar:hover {
  transform: scale(1.05) !important;
}

/* Card lift effect on hover */
.ui.card:hover,
.flex-item:hover,
.repository-card:hover,
.repo-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Button press effect */
.ui.button:active,
button:active {
  transform: scale(0.98) !important;
}

/* Focus states for accessibility - GitHub blue ring */
:focus-visible {
  outline: 2px solid var(--gh-accent-emphasis, #2f81f7) !important;
  outline-offset: 2px !important;
}

/* Remove default focus for mouse users */
:focus:not(:focus-visible) {
  outline: none !important;
}

/* Input focus glow */
input:focus,
textarea:focus,
select:focus,
.ui.input input:focus,
.ui.dropdown:focus {
  border-color: var(--gh-accent-emphasis, #2f81f7) !important;
  box-shadow: 0 0 0 3px rgba(47, 129, 247, 0.3) !important;
}

/* ===========================================================================
   EMPTY STATES - GitHub Style
   =========================================================================== */

.empty-placeholder,
.ui.placeholder.segment,
.no-results,
.empty-state {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 48px 24px !important;
  text-align: center !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  background: transparent !important;
  border: 1px dashed var(--gh-border-muted, #30363d) !important;
  border-radius: 6px !important;
}

.empty-placeholder svg,
.empty-state svg,
.no-results svg {
  width: 48px !important;
  height: 48px !important;
  color: var(--gh-fg-subtle, #848d97) !important;
  margin-bottom: 16px !important;
}

.empty-placeholder h3,
.empty-state h3,
.no-results h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin-bottom: 8px !important;
}

.empty-placeholder p,
.empty-state p,
.no-results p {
  font-size: 14px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  max-width: 400px !important;
  line-height: 1.5 !important;
}

/* ===========================================================================
   LOADING STATES - Skeleton Animation
   =========================================================================== */

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.loading-skeleton,
.skeleton {
  background: linear-gradient(
    90deg,
    var(--gh-canvas-subtle, #161b22) 25%,
    var(--gh-border-muted, #21262d) 50%,
    var(--gh-canvas-subtle, #161b22) 75%
  ) !important;
  background-size: 200% 100% !important;
  animation: shimmer 1.5s infinite !important;
  border-radius: 4px !important;
}

/* ===========================================================================
   SMOOTH SCROLL
   =========================================================================== */

html {
  scroll-behavior: smooth !important;
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  html {
    scroll-behavior: auto !important;
  }
}

/* ===========================================================================
   TOOLTIP IMPROVEMENTS
   =========================================================================== */

[data-tooltip],
.tooltip,
.ui.popup {
  font-size: 12px !important;
  padding: 6px 10px !important;
  background: var(--gh-canvas-overlay, #1c2128) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
}

/* ===========================================================================
   BADGE IMPROVEMENTS
   =========================================================================== */

.ui.label,
.badge,
.counter {
  font-weight: 500 !important;
  border-radius: 2em !important;
  padding: 0 6px !important;
  font-size: 12px !important;
  line-height: 18px !important;
}

/* Counter badge in tabs */
.counter,
.ui.label.counter {
  background: var(--gh-neutral-muted, rgba(110, 118, 129, 0.4)) !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  min-width: 20px !important;
  text-align: center !important;
}

/* ===========================================================================
   DROPDOWN IMPROVEMENTS
   =========================================================================== */

.ui.dropdown .menu {
  border-radius: 6px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3) !important;
}

.ui.dropdown .menu > .item {
  padding: 8px 16px !important;
  transition: background 0.1s ease !important;
}

.ui.dropdown .menu > .item:hover {
  background: var(--gh-actionListItem-default-hoverBg, rgba(177, 186, 196, 0.12)) !important;
}

.ui.dropdown .menu > .item.selected,
.ui.dropdown .menu > .item.active {
  background: var(--gh-accent-subtle, rgba(56, 139, 253, 0.15)) !important;
  color: var(--gh-accent-fg, #58a6ff) !important;
}

/* ===========================================================================
   SCROLLBAR STYLING (Webkit)
   =========================================================================== */

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: var(--gh-border-muted, #30363d);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--gh-border-default, #484f58);
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--gh-border-muted, #30363d) transparent;
}

/* ============================================
   v7 - Critical UI Fixes (GitHub Parity)
   ============================================ */

/* === EXPLORE PAGE REPOSITORY CARDS === */

/* Enhanced flex-list container - unified border approach */
.page-content.explore .flex-list,
.page-content.explore .repository.list {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin-top: 16px !important;
}

/* Flex item card styling */
.page-content.explore .flex-item {
  display: flex !important;
  flex-direction: column !important;
  padding: 16px !important;
  background: var(--gh-canvas-default) !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  transition: background-color 0.15s ease !important;
}

.page-content.explore .flex-item:last-child {
  border-bottom: none !important;
}

.page-content.explore .flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Flex item header - horizontal layout */
.page-content.explore .flex-item-header {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 16px !important;
  width: 100% !important;
}

/* Repository title and labels */
.page-content.explore .flex-item-title {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
}

.page-content.explore .flex-item-title a.name {
  color: var(--gh-accent-fg) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
}

.page-content.explore .flex-item-title a.name:hover {
  text-decoration: underline !important;
}

/* Repository badges/labels in title */
.page-content.explore .flex-item-title .label-list {
  display: inline-flex !important;
  gap: 4px !important;
  margin-left: 4px !important;
}

.page-content.explore .flex-item-title .ui.basic.label {
  background: transparent !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 2em !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  line-height: 18px !important;
}

/* Trailing section (stats) */
.page-content.explore .flex-item-trailing {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  flex-shrink: 0 !important;
  font-size: 12px !important;
}

.page-content.explore .flex-item-trailing .flex-text-inline,
.page-content.explore .flex-item-trailing a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

.page-content.explore .flex-item-trailing a:hover {
  color: var(--gh-accent-fg) !important;
}

/* Language color dot - exact GitHub style */
.page-content.explore .flex-item-trailing .color-icon,
.page-content.explore .color-icon {
  display: inline-block !important;
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  flex-shrink: 0 !important;
  margin-right: 4px !important;
}

/* Star and fork icons */
.page-content.explore .flex-item-trailing svg {
  width: 16px !important;
  height: 16px !important;
  fill: currentColor !important;
  flex-shrink: 0 !important;
}

/* Description body */
.page-content.explore .flex-item-body {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-top: 4px !important;
}

/* Topics/tags */
.page-content.explore .flex-item-main > .label-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  margin-top: 8px !important;
}

.page-content.explore .flex-item-main > .label-list .ui.label {
  background: rgba(56, 139, 253, 0.15) !important;
  border: none !important;
  border-radius: 2em !important;
  padding: 0 10px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: var(--gh-accent-fg) !important;
  line-height: 22px !important;
  cursor: pointer !important;
  transition: background 0.15s ease !important;
}

.page-content.explore .flex-item-main > .label-list .ui.label:hover {
  background: rgba(56, 139, 253, 0.25) !important;
}

/* Updated timestamp */
.page-content.explore .flex-item-body:last-child {
  color: var(--gh-fg-subtle) !important;
  font-size: 12px !important;
  margin-top: 8px !important;
}

/* === NAVIGATION SEARCH BAR IMPROVEMENTS === */

/* Expanded search bar */
#navbar .search-bar-container,
#navbar .ui.search,
#navbar form[action*="search"] {
  min-width: 272px !important;
  max-width: 544px !important;
  transition: width 0.2s ease, box-shadow 0.15s ease !important;
}

#navbar .search-bar-container:focus-within,
#navbar .ui.search:focus-within {
  min-width: 320px !important;
}

/* Search "/" shortcut badge - exact GitHub style */
#navbar .search-shortcut,
#navbar .shortcut-hint,
.search-shortcut-key {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--gh-canvas-subtle, #21262d) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 6px !important;
  min-width: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  flex-shrink: 0 !important;
  box-shadow: inset 0 -1px 0 var(--gh-border-muted, #21262d) !important;
}

/* === PRIMARY BUTTONS === */

/* Consistent green primary buttons with subtle shadow */
.ui.primary.button,
.ui.button.primary,
button.primary,
.btn-primary {
  background: var(--gh-success-emphasis, #238636) !important;
  border: 1px solid rgba(240, 246, 252, 0.1) !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-weight: 500 !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  line-height: 20px !important;
  box-shadow: 0 1px 0 rgba(27, 31, 35, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease !important;
}

.ui.primary.button:hover,
.ui.button.primary:hover,
button.primary:hover,
.btn-primary:hover {
  background: #2ea043 !important;
}

.ui.primary.button:active,
.ui.button.primary:active,
button.primary:active,
.btn-primary:active {
  background: #238636 !important;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.2) !important;
}

/* === AVATAR STYLING === */

/* Consistent avatar sizes */
.avatar,
.ui.avatar,
img.avatar {
  border-radius: 50% !important;
  background: var(--gh-canvas-subtle) !important;
  border: none !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.1) !important;
}

/* Avatar size variants */
.avatar[width="16"], .avatar.size-16 { width: 16px !important; height: 16px !important; }
.avatar[width="20"], .avatar.size-20 { width: 20px !important; height: 20px !important; }
.avatar[width="24"], .avatar.size-24 { width: 24px !important; height: 24px !important; }
.avatar[width="32"], .avatar.size-32 { width: 32px !important; height: 32px !important; }
.avatar[width="40"], .avatar.size-40 { width: 40px !important; height: 40px !important; }
.avatar[width="48"], .avatar.size-48 { width: 48px !important; height: 48px !important; }

/* Repository icon in explore (when avatar is hidden) */
.page-content.explore .flex-item-leading svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
  fill: var(--gh-fg-muted) !important;
}

/* === BADGE/LABEL STYLING === */

/* Pill-shaped badges */
.ui.label,
.label:not(.label-list) {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 2em !important;
  padding: 0 7px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 18px !important;
  color: var(--gh-fg-muted) !important;
}

/* Issue/PR state labels */
.ui.label.green,
.ui.green.label {
  background: rgba(35, 134, 54, 0.15) !important;
  color: #3fb950 !important;
  border-color: transparent !important;
}

.ui.label.purple,
.ui.purple.label {
  background: rgba(137, 87, 229, 0.15) !important;
  color: #a371f7 !important;
  border-color: transparent !important;
}

.ui.label.red,
.ui.red.label {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
  border-color: transparent !important;
}

/* === TAB NAVIGATION === */

/* UnderlineNav tabs - orange active indicator */
.ui.tabular.menu .item.active,
.ui.secondary.pointing.menu .item.active,
.repo-header .repo-buttons .item.active,
.tabular.menu .item.active {
  border-bottom: 2px solid var(--gh-underlinenav-borderColor-active, #f78166) !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.ui.tabular.menu .item,
.ui.secondary.pointing.menu .item,
.repo-header .repo-buttons .item,
.tabular.menu .item {
  padding: 8px 16px !important;
  border-radius: 6px 6px 0 0 !important;
  transition: background 0.15s ease !important;
}

.ui.tabular.menu .item:hover,
.ui.secondary.pointing.menu .item:hover,
.tabular.menu .item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* === EMPTY STATE IMPROVEMENTS === */

.page-content.explore .flex-list:empty::after,
.page-content.explore .flex-list > div:only-child:not(.flex-item) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 48px 16px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 16px !important;
  text-align: center !important;
}

/* === FOOTER POLISH === */

footer,
.footer {
  background: var(--gh-canvas-default) !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  padding: 40px 16px !important;
  font-size: 12px !important;
  color: var(--gh-fg-subtle) !important;
}

footer a,
.footer a {
  color: var(--gh-accent-fg) !important;
}

footer a:hover,
.footer a:hover {
  text-decoration: underline !important;
}

/* ============================================
   v8 - Additional Polish & Layout Fixes
   ============================================ */

/* === PAGE WIDTH CONSTRAINTS === */

/* Main content max-width */
.ui.container,
.page-content > .ui.container,
.page-content .ui.secondary.container {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

@media (min-width: 768px) {
  .ui.container,
  .page-content > .ui.container {
    padding-left: 32px !important;
    padding-right: 32px !important;
  }
}

/* Full-width containers for certain sections */
.repo-home .repo-description,
.dashboard-navbar {
  max-width: none !important;
}

/* === DROPDOWN IMPROVEMENTS === */

/* All dropdown menus - consistent GitHub style */
.ui.dropdown .menu,
.ui.dropdown > .menu,
.ui.selection.dropdown .menu,
.ui.floating.dropdown .menu {
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  padding: 4px 0 !important;
  min-width: 160px !important;
  overflow: hidden !important;
}

.ui.dropdown .menu > .item,
.ui.dropdown > .menu > .item,
.ui.dropdown.selection .menu > .item {
  padding: 8px 16px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  border: none !important;
  border-radius: 0 !important;
  transition: background 0.1s ease !important;
}

.ui.dropdown .menu > .item:hover,
.ui.dropdown > .menu > .item:hover {
  background: rgba(177, 186, 196, 0.12) !important;
  color: var(--gh-fg-default) !important;
}

.ui.dropdown .menu > .item.selected,
.ui.dropdown .menu > .item.active {
  background: rgba(56, 139, 253, 0.15) !important;
  color: var(--gh-fg-default) !important;
}

.ui.dropdown .menu .divider {
  border-color: var(--gh-border-muted) !important;
  margin: 4px 0 !important;
}

.ui.dropdown .menu > .header {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  text-transform: none !important;
}

/* === CARD SHADOWS AND BORDERS === */

/* Repository cards on dashboard */
.dashboard .repo-list .flex-item,
.dashboard .flex-item-main {
  border-radius: 6px !important;
  transition: background 0.15s ease !important;
}

.dashboard .repo-list .flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* === FORM ELEMENT IMPROVEMENTS === */

/* Text inputs */
.ui.input > input,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
textarea {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  line-height: 20px !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
}

.ui.input > input:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  border-color: var(--gh-accent-emphasis) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Select dropdowns */
select,
.ui.selection.dropdown {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  cursor: pointer !important;
}

select:hover,
.ui.selection.dropdown:hover {
  border-color: var(--gh-border-muted) !important;
}

/* === MODAL IMPROVEMENTS === */

.ui.modal,
.ui.modal > .content {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
}

.ui.modal > .header {
  background: transparent !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  color: var(--gh-fg-default) !important;
  padding: 16px 24px !important;
}

.ui.modal > .content {
  padding: 24px !important;
  border: none !important;
}

.ui.modal > .actions {
  background: var(--gh-canvas-default) !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  padding: 16px 24px !important;
}

/* === ALERT/MESSAGE BOXES === */

.ui.message {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 16px !important;
  color: var(--gh-fg-default) !important;
}

.ui.message.info,
.ui.message.blue {
  background: rgba(56, 139, 253, 0.1) !important;
  border-color: rgba(56, 139, 253, 0.4) !important;
}

.ui.message.success,
.ui.message.positive,
.ui.message.green {
  background: rgba(35, 134, 54, 0.1) !important;
  border-color: rgba(35, 134, 54, 0.4) !important;
}

.ui.message.warning,
.ui.message.yellow {
  background: rgba(187, 128, 9, 0.1) !important;
  border-color: rgba(187, 128, 9, 0.4) !important;
}

.ui.message.error,
.ui.message.negative,
.ui.message.red {
  background: rgba(248, 81, 73, 0.1) !important;
  border-color: rgba(248, 81, 73, 0.4) !important;
}

/* === LOADING STATES === */

.ui.loading.segment::before,
.ui.loading::before {
  background: var(--gh-canvas-default) !important;
}

.ui.loader,
.ui.loader::before {
  border-color: var(--gh-border-default) !important;
}

.ui.loader::after {
  border-color: var(--gh-accent-fg) transparent transparent !important;
}

/* === ICON IMPROVEMENTS === */

.svg.octicon {
  fill: currentColor !important;
}

/* Muted icons */
.text.grey svg,
.muted svg,
.meta svg {
  color: var(--gh-fg-muted) !important;
  fill: var(--gh-fg-muted) !important;
}

/* === REPOSITORY SIDEBAR IMPROVEMENTS === */

.repo-home-sidebar-top h4,
.repo-home-sidebar-bottom h4 {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

.repo-home-sidebar-top a,
.repo-home-sidebar-bottom a {
  color: var(--gh-accent-fg) !important;
}

/* === COMMIT LIST IMPROVEMENTS === */

#commits-table tbody tr {
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

#commits-table tbody tr:hover {
  background: var(--gh-canvas-subtle) !important;
}

#commits-table .commit-summary {
  color: var(--gh-fg-default) !important;
}

#commits-table .commit-summary a {
  color: var(--gh-fg-default) !important;
}

#commits-table .commit-summary a:hover {
  color: var(--gh-accent-fg) !important;
}

/* === DIFF VIEW IMPROVEMENTS === */

.diff-file-header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 10px 16px !important;
}

.diff-file-header .file-path {
  color: var(--gh-fg-default) !important;
  font-weight: 600 !important;
}

/* Diff line colors */
.diff-line-add {
  background: rgba(46, 160, 67, 0.15) !important;
}

.diff-line-del {
  background: rgba(248, 81, 73, 0.15) !important;
}

/* ============================================
   v9 - Final Polish & Pagination
   ============================================ */

/* === PAGINATION === */

.ui.pagination.menu,
.pagination {
  display: inline-flex !important;
  gap: 4px !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

.ui.pagination.menu .item,
.pagination a,
.pagination span {
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  padding: 5px 10px !important;
  min-width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.ui.pagination.menu .item:hover,
.pagination a:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-border-default) !important;
  text-decoration: none !important;
}

.ui.pagination.menu .item.active,
.pagination .current,
.pagination .active {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  font-weight: 600 !important;
}

.ui.pagination.menu .disabled.item,
.pagination .disabled {
  color: var(--gh-fg-subtle) !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* === BREADCRUMBS === */

.breadcrumb,
.repo-path,
.ui.breadcrumb {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 4px !important;
  font-size: 16px !important;
}

.breadcrumb a,
.repo-path a,
.ui.breadcrumb a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.breadcrumb a:hover,
.repo-path a:hover,
.ui.breadcrumb a:hover {
  text-decoration: underline !important;
}

.breadcrumb .divider,
.repo-path .divider,
.ui.breadcrumb .divider {
  color: var(--gh-fg-muted) !important;
  margin: 0 4px !important;
}

/* === TOOLTIPS === */

[data-tooltip-content]::after,
.tooltip,
.tippy-box {
  background: var(--gh-tooltip-bg, #484f58) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 6px 12px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.5) !important;
}

/* === PROGRESS BARS === */

.ui.progress,
.progress-bar {
  background: var(--gh-canvas-subtle) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  height: 8px !important;
}

.ui.progress .bar,
.progress-bar .bar,
.progress-bar-fill {
  background: var(--gh-success-emphasis) !important;
  border-radius: 6px !important;
  transition: width 0.3s ease !important;
}

/* === CODE COPY BUTTON === */

.code-copy-btn,
.clipboard-btn,
[data-clipboard-target] {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 4px 8px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

.code-copy-btn:hover,
.clipboard-btn:hover,
[data-clipboard-target]:hover {
  background: var(--gh-btn-hover-bg) !important;
  color: var(--gh-fg-default) !important;
}

/* === SEGMENT/SECTION STYLING === */

.ui.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  padding: 16px !important;
}

.ui.segment.attached {
  border-radius: 0 !important;
  margin: 0 !important;
}

.ui.segment.attached:first-child,
.ui.top.attached.segment {
  border-radius: 6px 6px 0 0 !important;
}

.ui.segment.attached:last-child,
.ui.bottom.attached.segment {
  border-radius: 0 0 6px 6px !important;
}

/* === CHECKBOX IMPROVEMENTS === */

.ui.checkbox input[type="checkbox"],
input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  border-radius: 3px !important;
  border: 1px solid var(--gh-border-default) !important;
  background: var(--gh-canvas-default) !important;
  cursor: pointer !important;
}

.ui.checkbox input[type="checkbox"]:checked,
input[type="checkbox"]:checked {
  background: var(--gh-accent-emphasis) !important;
  border-color: var(--gh-accent-emphasis) !important;
}

/* === RADIO BUTTONS === */

.ui.radio.checkbox input[type="radio"],
input[type="radio"] {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  border: 1px solid var(--gh-border-default) !important;
  background: var(--gh-canvas-default) !important;
  cursor: pointer !important;
}

.ui.radio.checkbox input[type="radio"]:checked,
input[type="radio"]:checked {
  border-color: var(--gh-accent-emphasis) !important;
  background: var(--gh-canvas-default) !important;
}

/* === TOGGLE SWITCHES === */

.toggle-checkbox,
.ui.toggle.checkbox input {
  width: 50px !important;
  height: 24px !important;
  border-radius: 12px !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
}

.ui.toggle.checkbox input:checked {
  background: var(--gh-success-emphasis) !important;
}

/* === TIMELINE/ACTIVITY FEED === */

.timeline-item {
  position: relative !important;
  padding-left: 32px !important;
}

.timeline-item::before {
  content: '' !important;
  position: absolute !important;
  left: 11px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 2px !important;
  background: var(--gh-border-muted) !important;
}

.timeline-item .icon-circle,
.timeline-item .timeline-marker {
  position: absolute !important;
  left: 0 !important;
  width: 24px !important;
  height: 24px !important;
  background: var(--gh-canvas-default) !important;
  border: 2px solid var(--gh-border-default) !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 1 !important;
}

/* === FILE SIZE BADGES === */

.file-size,
.size-info {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace !important;
}

/* === KEYBOARD SHORTCUTS === */

kbd,
.shortcut,
.keyboard-key {
  display: inline-block !important;
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 2px 6px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted) !important;
  box-shadow: inset 0 -1px 0 var(--gh-border-muted) !important;
}

/* === COUNTERS/BADGES IN TABS === */

.ui.label.counter,
.item .ui.label {
  background: rgba(110, 118, 129, 0.4) !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 0 6px !important;
  border-radius: 10px !important;
  line-height: 18px !important;
  min-width: 20px !important;
  text-align: center !important;
}

/* === SECONDARY/MUTED BUTTONS === */

.ui.secondary.button,
.btn-secondary {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  color: var(--gh-fg-default) !important;
  border-radius: 6px !important;
  padding: 5px 16px !important;
  font-weight: 500 !important;
  transition: background 0.15s ease !important;
}

.ui.secondary.button:hover,
.btn-secondary:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* === DANGER BUTTONS === */

.ui.red.button,
.ui.button.red,
.btn-danger {
  background: rgba(248, 81, 73, 0.1) !important;
  border: 1px solid rgba(248, 81, 73, 0.4) !important;
  color: var(--gh-danger-fg, #f85149) !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
}

.ui.red.button:hover,
.ui.button.red:hover,
.btn-danger:hover {
  background: var(--gh-danger-fg) !important;
  color: #ffffff !important;
}

/* === FINAL POLISH === */

/* Smooth transitions for interactive elements */
button, a, input, select, textarea, .item, .flex-item {
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease !important;
}

/* Remove default focus outlines, use custom */
*:focus {
  outline: none !important;
}

*:focus-visible {
  outline: 2px solid var(--gh-accent-emphasis) !important;
  outline-offset: 2px !important;
}

/* ============================================
   v10 - Repository Actions & Clone Panel Polish
   ============================================ */

/* === CODE BUTTON (Green like GitHub) === */

.clone-button,
.code-button,
.repo-clone-button,
.ui.button.clone-button,
#clone-panel-button,
button[data-panel="#clone-panel"] {
  background: var(--gh-success-emphasis, #238636) !important;
  border: 1px solid rgba(240, 246, 252, 0.1) !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  padding: 5px 16px !important;
  font-size: 14px !important;
  line-height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  cursor: pointer !important;
  transition: background-color 0.15s ease !important;
}

.clone-button:hover,
.code-button:hover,
.repo-clone-button:hover,
.ui.button.clone-button:hover,
#clone-panel-button:hover,
button[data-panel="#clone-panel"]:hover {
  background: #2ea043 !important;
}

.clone-button svg,
.code-button svg,
.repo-clone-button svg {
  fill: currentColor !important;
}

/* === CLONE PANEL POPUP === */

#clone-panel,
.clone-panel-popup,
.clone-panel {
  background: var(--gh-canvas-overlay, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  padding: 0 !important;
  min-width: 360px !important;
  overflow: hidden !important;
}

/* Clone panel tabs */
#clone-panel .ui.secondary.menu,
.clone-panel .ui.tabular.menu,
.clone-panel-tabs {
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-default) !important;
  padding: 0 !important;
  margin: 0 !important;
  display: flex !important;
  gap: 0 !important;
}

#clone-panel .ui.secondary.menu .item,
.clone-panel .ui.tabular.menu .item,
.clone-panel-tabs .item {
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  padding: 12px 16px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

#clone-panel .ui.secondary.menu .item.active,
.clone-panel .ui.tabular.menu .item.active,
.clone-panel-tabs .item.active {
  color: var(--gh-fg-default) !important;
  border-bottom-color: var(--gh-underlinenav-borderColor-active, #f78166) !important;
  background: transparent !important;
}

/* Clone URL input */
#clone-panel .clone-url,
.clone-panel .clone-url,
.clone-url-input {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  font-size: 14px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace !important;
  color: var(--gh-fg-default) !important;
  width: 100% !important;
}

/* Clone panel content area */
#clone-panel .segment,
.clone-panel .content,
.clone-panel-content {
  padding: 16px !important;
  background: transparent !important;
  border: none !important;
}

/* Copy button in clone panel */
#clone-panel .copy-button,
.clone-panel .copy.button,
.clone-url-copy {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 8px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
}

#clone-panel .copy-button:hover,
.clone-panel .copy.button:hover,
.clone-url-copy:hover {
  background: var(--gh-btn-hover-bg) !important;
  color: var(--gh-fg-default) !important;
}

/* === REPOSITORY ACTION BUTTONS ROW === */

.repo-button-row,
.repo-buttons,
.repo-header-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Watch/Star/Fork buttons */
.repo-button-row .ui.button,
.watch-button,
.star-button,
.fork-button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 3px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 28px !important;
}

.repo-button-row .ui.button:hover,
.watch-button:hover,
.star-button:hover,
.fork-button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Starred state */
.star-button.starred,
.ui.button.starred {
  background: var(--gh-btn-bg) !important;
  border-color: var(--gh-border-default) !important;
}

.star-button.starred svg,
.ui.button.starred svg {
  color: #e3b341 !important;
  fill: #e3b341 !important;
}

/* Count badges on buttons */
.repo-button-row .ui.label,
.watch-button .count,
.star-button .count,
.fork-button .count {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-left: none !important;
  border-radius: 0 6px 6px 0 !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 3px 12px !important;
  margin-left: -1px !important;
  height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
}

/* Button with count - left part */
.repo-button-row .ui.button.labeled,
.ui.button.with-count {
  border-radius: 6px 0 0 6px !important;
}

/* === REPOSITORY HOME LAYOUT === */

.repo-home-main {
  display: flex !important;
  gap: 24px !important;
}

.repo-home-main .repo-main-content {
  flex: 1 !important;
  min-width: 0 !important;
}

.repo-home-main .repo-sidebar {
  width: 296px !important;
  flex-shrink: 0 !important;
}

/* === ABOUT SECTION POLISH === */

.repo-sidebar .about-section,
.repo-description-container {
  margin-bottom: 16px !important;
}

.repo-sidebar .about-section h4,
.repo-sidebar .sidebar-section-title {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  margin-bottom: 8px !important;
}

.repo-sidebar .repo-description {
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 12px !important;
}

.repo-sidebar .repo-website a {
  color: var(--gh-accent-fg) !important;
  font-size: 14px !important;
}

/* Resources section */
.repo-sidebar .resources-section .item,
.repo-sidebar .sidebar-item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 4px 0 !important;
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

.repo-sidebar .resources-section .item svg,
.repo-sidebar .sidebar-item svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
}

/* Stats row (stars, forks, watchers) */
.repo-sidebar .stats-row,
.repo-stats {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 16px !important;
  margin-top: 16px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

.repo-sidebar .stats-row a,
.repo-stats a {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

.repo-sidebar .stats-row a:hover,
.repo-stats a:hover {
  color: var(--gh-accent-fg) !important;
}

.repo-sidebar .stats-row svg,
.repo-stats svg {
  width: 16px !important;
  height: 16px !important;
}

/* === LANGUAGES BAR === */

.language-stats,
.repo-language-bar {
  margin-top: 16px !important;
  margin-bottom: 8px !important;
}

.language-stats-bar,
.repo-language-bar .progress {
  display: flex !important;
  height: 8px !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  background: var(--gh-canvas-subtle) !important;
}

.language-stats-bar span,
.repo-language-bar .progress .bar {
  height: 100% !important;
}

.language-stats-list,
.repo-language-list {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  margin-top: 8px !important;
  font-size: 12px !important;
}

.language-stats-list a,
.repo-language-list a {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  color: var(--gh-fg-muted) !important;
}

.language-stats-list a:hover,
.repo-language-list a:hover {
  color: var(--gh-accent-fg) !important;
}

/* ============================================
   v12 - Additional GitHub UI Polish
   ============================================ */

/* === TABLE ROW HOVER STATES === */

/* File browser table rows */
#repo-files-table tbody tr:hover,
.file-list-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Commit table rows */
#commits-table tbody tr:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Issue/PR list items */
.issue-list .flex-item:hover,
.pull-list .flex-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* === SPLIT BUTTON GROUPS (GitHub Style) === */

/* Button group container */
.ui.buttons:not(.basic):not(.icon) {
  display: inline-flex !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

/* Left button in group */
.ui.buttons > .ui.button:first-child {
  border-radius: 6px 0 0 6px !important;
  border-right: 1px solid rgba(27, 31, 35, 0.15) !important;
}

/* Right button/dropdown in group */
.ui.buttons > .ui.button:last-child,
.ui.buttons > .ui.dropdown {
  border-radius: 0 6px 6px 0 !important;
}

/* Split button count labels */
.ui.labeled.button > .ui.label {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-left: none !important;
  border-radius: 0 6px 6px 0 !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 5px 10px !important;
  margin-left: 0 !important;
}

.ui.labeled.button > .ui.button {
  border-radius: 6px 0 0 6px !important;
}

/* === ACTION DROPDOWN IMPROVEMENTS === */

/* Dropdown trigger button */
.ui.dropdown > .dropdown.icon {
  margin-left: 4px !important;
  opacity: 0.7 !important;
  transition: opacity 0.15s ease !important;
}

.ui.dropdown:hover > .dropdown.icon {
  opacity: 1 !important;
}

/* Dropdown menu items */
.ui.dropdown .menu > .item {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  transition: background 0.1s ease !important;
}

.ui.dropdown .menu > .item svg {
  width: 16px !important;
  height: 16px !important;
  color: var(--gh-fg-muted) !important;
  flex-shrink: 0 !important;
}

.ui.dropdown .menu > .item:hover svg {
  color: var(--gh-fg-default) !important;
}

/* Dropdown dividers */
.ui.dropdown .menu > .divider {
  margin: 4px 0 !important;
  border-top: 1px solid var(--gh-border-muted) !important;
}

/* Dropdown header items */
.ui.dropdown .menu > .header {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 8px 16px 4px !important;
  text-transform: none !important;
}

/* === CARD HOVER ANIMATIONS === */

/* Generic card hover effect */
.ui.card:hover,
.repository-card:hover,
.issue-card:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

/* Smooth transitions for all interactive elements */
.ui.button,
.ui.label,
.ui.card,
a {
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease !important;
}

/* === LOADING SKELETON STYLES === */

/* Skeleton loading animation */
@keyframes skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

.skeleton,
.loading-placeholder {
  background: linear-gradient(
    90deg,
    var(--gh-canvas-subtle) 25%,
    var(--gh-border-muted) 50%,
    var(--gh-canvas-subtle) 75%
  ) !important;
  background-size: 200% 100% !important;
  animation: skeleton-loading 1.5s infinite !important;
  border-radius: 4px !important;
}

/* === IMPROVED MOBILE RESPONSIVENESS === */

@media (max-width: 768px) {
  /* Stack repo header actions on mobile */
  .repo-button-row,
  .repo-buttons,
  .repo-header-actions {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* Smaller buttons on mobile */
  .repo-button-row .ui.button,
  .watch-button,
  .star-button,
  .fork-button {
    padding: 4px 8px !important;
    font-size: 11px !important;
  }

  /* Full width search on mobile */
  #navbar .search-bar-container,
  #navbar .ui.search {
    min-width: 100% !important;
    max-width: 100% !important;
  }

  /* Compact file browser on mobile */
  #repo-files-table td {
    padding: 8px !important;
  }

  /* Hide some columns on mobile */
  #repo-files-table .message-column {
    display: none !important;
  }
}

@media (max-width: 480px) {
  /* Even more compact on very small screens */
  .page-content {
    padding: 8px !important;
  }

  /* Stack flex items vertically */
  .flex-item-header {
    flex-direction: column !important;
    gap: 8px !important;
  }

  .flex-item-trailing {
    width: 100% !important;
    justify-content: flex-start !important;
  }
}

/* === FOCUS RING IMPROVEMENTS === */

/* Consistent focus rings for all interactive elements */
*:focus-visible {
  outline: 2px solid var(--gh-accent-fg) !important;
  outline-offset: 2px !important;
}

/* Remove default focus for mouse users */
*:focus:not(:focus-visible) {
  outline: none !important;
}

/* === FILE ICON COLORS === */

/* Common file type icon colors */
.file-icon.js-icon { color: #f1e05a !important; }
.file-icon.ts-icon { color: #3178c6 !important; }
.file-icon.py-icon { color: #3572a5 !important; }
.file-icon.go-icon { color: #00add8 !important; }
.file-icon.rs-icon { color: #dea584 !important; }
.file-icon.md-icon { color: #083fa1 !important; }
.file-icon.json-icon { color: #292929 !important; }
.file-icon.css-icon { color: #563d7c !important; }
.file-icon.html-icon { color: #e34c26 !important; }

/* === LINK HOVER UNDERLINE ANIMATION === */

/* Animated underline for links */
.repo-title a,
.issue-title a,
.commit-title a {
  position: relative !important;
  text-decoration: none !important;
}

.repo-title a::after,
.issue-title a::after,
.commit-title a::after {
  content: '' !important;
  position: absolute !important;
  bottom: -1px !important;
  left: 0 !important;
  width: 0 !important;
  height: 1px !important;
  background: currentColor !important;
  transition: width 0.2s ease !important;
}

.repo-title a:hover::after,
.issue-title a:hover::after,
.commit-title a:hover::after {
  width: 100% !important;
}

/* === SMOOTH PAGE TRANSITIONS === */

/* Fade in content on page load */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}

.page-content > .ui.container,
.page-content > .repository {
  animation: fadeIn 0.2s ease-out !important;
}

/* === IMPROVED SCROLLBARS (Webkit) === */

::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}

::-webkit-scrollbar-track {
  background: transparent !important;
}

::-webkit-scrollbar-thumb {
  background: var(--gh-border-muted, #30363d) !important;
  border-radius: 4px !important;
}

::-webkit-scrollbar-thumb:hover {
  background: var(--gh-border-default, #484f58) !important;
}

/* === CODE BLOCK ENHANCEMENTS === */

/* Line highlight on hover */
.code-view tr:hover td {
  background: rgba(56, 139, 253, 0.1) !important;
}

/* Better line numbers */
.code-view .line-num {
  user-select: none !important;
  cursor: pointer !important;
}

.code-view .line-num:hover {
  color: var(--gh-accent-fg) !important;
}

/* ============================================
   v12.1 - Wiki Page Styling
   ============================================ */

/* Wiki page container */
.page-content.repository.wiki {
  background: var(--gh-canvas-default) !important;
}

/* Wiki sidebar */
.wiki-sidebar {
  width: 280px !important;
  flex-shrink: 0 !important;
  padding-right: 24px !important;
  border-right: 1px solid var(--gh-border-muted) !important;
}

.wiki-sidebar .wiki-pages {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.wiki-sidebar .wiki-pages li {
  margin: 0 !important;
}

.wiki-sidebar .wiki-pages a {
  display: block !important;
  padding: 6px 12px !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.wiki-sidebar .wiki-pages a:hover {
  background: var(--gh-canvas-subtle) !important;
}

.wiki-sidebar .wiki-pages a.active {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}

/* Wiki content area */
.wiki-content {
  flex: 1 !important;
  min-width: 0 !important;
  padding-left: 24px !important;
}

.wiki-content .wiki-title {
  font-size: 32px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

/* Wiki markdown content */
.wiki-content .markdown-body {
  font-size: 16px !important;
  line-height: 1.6 !important;
  color: var(--gh-fg-default) !important;
}

.wiki-content .markdown-body h1,
.wiki-content .markdown-body h2,
.wiki-content .markdown-body h3 {
  margin-top: 24px !important;
  margin-bottom: 16px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  font-weight: 600 !important;
}

.wiki-content .markdown-body h1 {
  font-size: 28px !important;
}

.wiki-content .markdown-body h2 {
  font-size: 24px !important;
}

.wiki-content .markdown-body h3 {
  font-size: 20px !important;
  border-bottom: none !important;
}

/* Wiki edit button */
.wiki-content .edit-button,
.wiki-actions .ui.button {
  background: var(--gh-btn-bg) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  padding: 5px 12px !important;
}

.wiki-content .edit-button:hover,
.wiki-actions .ui.button:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Wiki footer/meta */
.wiki-footer {
  margin-top: 24px !important;
  padding-top: 16px !important;
  border-top: 1px solid var(--gh-border-muted) !important;
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
}

/* ============================================
   v12.2 - Actions/CI Page Styling
   ============================================ */

/* Actions list */
.page-content.repository.actions {
  background: var(--gh-canvas-default) !important;
}

/* Workflow runs list */
.workflow-runs-list {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.workflow-runs-list .workflow-run-item {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  background: var(--gh-canvas-default) !important;
  transition: background 0.15s ease !important;
}

.workflow-runs-list .workflow-run-item:last-child {
  border-bottom: none !important;
}

.workflow-runs-list .workflow-run-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Workflow status icons */
.workflow-status-icon {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
}

.workflow-status-icon.success {
  color: var(--gh-success-emphasis, #238636) !important;
}

.workflow-status-icon.failure {
  color: var(--gh-danger-fg, #f85149) !important;
}

.workflow-status-icon.pending {
  color: var(--gh-attention-emphasis, #d29922) !important;
}

.workflow-status-icon.running {
  color: var(--gh-accent-emphasis, #1f6feb) !important;
  animation: spin 1s linear infinite !important;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

/* Workflow run details */
.workflow-run-item .workflow-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.workflow-run-item .workflow-meta {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* Workflow sidebar */
.workflow-sidebar {
  width: 240px !important;
  flex-shrink: 0 !important;
  border-right: 1px solid var(--gh-border-muted) !important;
  padding-right: 16px !important;
}

.workflow-sidebar .workflow-list {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.workflow-sidebar .workflow-list a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  text-decoration: none !important;
  transition: background 0.15s ease !important;
}

.workflow-sidebar .workflow-list a:hover {
  background: var(--gh-canvas-subtle) !important;
}

.workflow-sidebar .workflow-list a.active {
  background: var(--gh-actionListItem-default-activeBg, rgba(177, 186, 196, 0.2)) !important;
  font-weight: 600 !important;
}

/* ============================================
   v13 - Compare Page & Additional Polish
   ============================================ */

/* === COMPARE PAGE === */

.page-content.repository.compare {
  background: var(--gh-canvas-default) !important;
}

/* Compare header */
.page-content.repository.compare .ui.top.attached.header,
.compare-header {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px 6px 0 0 !important;
  padding: 16px !important;
  margin-bottom: 0 !important;
}

/* Branch selectors */
.page-content.repository.compare .choose.branch,
.compare-selector {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

.page-content.repository.compare .choose.branch .ui.dropdown,
.compare-selector .ui.dropdown {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
}

.page-content.repository.compare .choose.branch .ui.dropdown:hover {
  background: var(--gh-btn-hover-bg) !important;
  border-color: var(--gh-btn-hover-border) !important;
}

/* Arrow between base and compare */
.page-content.repository.compare .arrow,
.compare-arrow {
  color: var(--gh-fg-muted) !important;
  font-size: 20px !important;
  margin: 0 8px !important;
}

/* Compare content area */
.page-content.repository.compare .ui.attached.segment {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-top: none !important;
  border-radius: 0 0 6px 6px !important;
  padding: 16px !important;
}

/* Compare summary stats */
.compare-stats,
.page-content.repository.compare .diff-stats {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 12px 16px !important;
  background: var(--gh-canvas-subtle) !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
}

.compare-stats strong {
  color: var(--gh-fg-default) !important;
}

/* Create PR button */
.page-content.repository.compare .ui.primary.button,
.compare-create-pr-btn {
  background: var(--gh-success-emphasis, #238636) !important;
  border: 1px solid rgba(240, 246, 252, 0.1) !important;
  border-radius: 6px !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
}

.page-content.repository.compare .ui.primary.button:hover {
  background: #2ea043 !important;
}

/* No changes message */
.page-content.repository.compare .ui.info.message,
.compare-no-changes {
  background: rgba(56, 139, 253, 0.1) !important;
  border: 1px solid rgba(56, 139, 253, 0.4) !important;
  border-radius: 6px !important;
  color: var(--gh-accent-fg) !important;
  padding: 16px !important;
  text-align: center !important;
}

/* === MILESTONES PAGE === */

.page-content.repository.milestones,
.page-content.user.milestones {
  background: var(--gh-canvas-default) !important;
}

/* Milestone list */
.milestone-list {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.milestone-list .milestone-item {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  background: var(--gh-canvas-default) !important;
  transition: background 0.15s ease !important;
}

.milestone-list .milestone-item:last-child {
  border-bottom: none !important;
}

.milestone-list .milestone-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Milestone title */
.milestone-item .milestone-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.milestone-item .milestone-title a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.milestone-item .milestone-title a:hover {
  text-decoration: underline !important;
}

/* Milestone progress bar */
.milestone-item .progress-bar,
.milestone-progress-bar {
  width: 100% !important;
  height: 8px !important;
  background: var(--gh-canvas-subtle) !important;
  border-radius: 4px !important;
  overflow: hidden !important;
  margin: 8px 0 !important;
}

.milestone-item .progress-bar .progress,
.milestone-progress-bar .progress {
  height: 100% !important;
  background: var(--gh-success-emphasis, #238636) !important;
  border-radius: 4px !important;
  transition: width 0.3s ease !important;
}

/* Milestone meta */
.milestone-item .milestone-meta {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  margin-top: 4px !important;
}

/* === LABELS PAGE === */

.page-content.repository.labels {
  background: var(--gh-canvas-default) !important;
}

/* Labels list */
.label-list-container {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.label-list-container .label-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  background: var(--gh-canvas-default) !important;
}

.label-list-container .label-item:last-child {
  border-bottom: none !important;
}

.label-list-container .label-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Label badge */
.label-item .label-badge {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 10px !important;
  border-radius: 2em !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 22px !important;
}

/* Label description */
.label-item .label-description {
  color: var(--gh-fg-muted) !important;
  font-size: 12px !important;
  margin-left: 16px !important;
  flex: 1 !important;
}

/* Label actions */
.label-item .label-actions {
  display: flex !important;
  gap: 8px !important;
}

/* === PROJECTS PAGE === */

.page-content.repository.projects,
.page-content.user.projects,
.page-content.org.projects {
  background: var(--gh-canvas-default) !important;
}

/* Project board */
.project-board {
  display: flex !important;
  gap: 16px !important;
  overflow-x: auto !important;
  padding: 16px 0 !important;
}

/* Project column */
.project-column {
  min-width: 300px !important;
  max-width: 350px !important;
  background: var(--gh-canvas-subtle) !important;
  border-radius: 6px !important;
  padding: 12px !important;
}

.project-column .column-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-bottom: 12px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  margin-bottom: 12px !important;
}

.project-column .column-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
}

.project-column .column-count {
  background: var(--gh-canvas-default) !important;
  border-radius: 2em !important;
  padding: 0 8px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* Project card */
.project-card {
  background: var(--gh-canvas-default) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 12px !important;
  margin-bottom: 8px !important;
  cursor: grab !important;
  transition: box-shadow 0.15s ease, transform 0.15s ease !important;
}

.project-card:hover {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-1px) !important;
}

.project-card:active {
  cursor: grabbing !important;
}

.project-card .card-title {
  font-size: 14px !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.project-card .card-title a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.project-card .card-title a:hover {
  text-decoration: underline !important;
}

.project-card .card-meta {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

/* === SEARCH RESULTS PAGE IMPROVEMENTS === */

.page-content.explore .search-results,
.search-results-container {
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin-top: 16px !important;
}

.search-results .result-item {
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
  background: var(--gh-canvas-default) !important;
  transition: background 0.15s ease !important;
}

.search-results .result-item:last-child {
  border-bottom: none !important;
}

.search-results .result-item:hover {
  background: var(--gh-canvas-subtle) !important;
}

/* Search result title */
.result-item .result-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  margin-bottom: 4px !important;
}

.result-item .result-title a {
  color: var(--gh-accent-fg) !important;
  text-decoration: none !important;
}

.result-item .result-title a:hover {
  text-decoration: underline !important;
}

/* Search result description */
.result-item .result-description {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  margin-bottom: 8px !important;
}

/* Search result meta */
.result-item .result-meta {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
}

.result-item .result-meta .language-indicator {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.result-item .result-meta .language-color {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
}

/* Search filter sidebar */
.search-filter-sidebar {
  width: 256px !important;
  flex-shrink: 0 !important;
  padding-right: 24px !important;
}

.search-filter-sidebar .filter-section {
  margin-bottom: 16px !important;
}

.search-filter-sidebar .filter-title {
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
  text-transform: uppercase !important;
}

.search-filter-sidebar .filter-options {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.search-filter-sidebar .filter-options li {
  margin-bottom: 4px !important;
}

.search-filter-sidebar .filter-options a {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default) !important;
  font-size: 14px !important;
  text-decoration: none !important;
}

.search-filter-sidebar .filter-options a:hover {
  background: var(--gh-canvas-subtle) !important;
}

.search-filter-sidebar .filter-options a.active {
  background: var(--gh-accent-emphasis) !important;
  color: #ffffff !important;
}

.search-filter-sidebar .filter-options .count {
  font-size: 12px !important;
  color: var(--gh-fg-muted) !important;
  background: var(--gh-canvas-subtle) !important;
  padding: 0 6px !important;
  border-radius: 2em !important;
}

/* === ERROR PAGES (404, 500) === */

.page-content.error-page,
.error-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 60vh !important;
  text-align: center !important;
  padding: 48px !important;
}

.error-container .error-code {
  font-size: 128px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-muted) !important;
  line-height: 1 !important;
  margin-bottom: 16px !important;
}

.error-container .error-message {
  font-size: 24px !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.error-container .error-description {
  font-size: 16px !important;
  color: var(--gh-fg-muted) !important;
  max-width: 400px !important;
  margin-bottom: 24px !important;
}

.error-container .error-actions {
  display: flex !important;
  gap: 12px !important;
}

/* === KEYBOARD SHORTCUTS MODAL === */

.keyboard-shortcuts-modal,
.shortcuts-modal {
  background: var(--gh-canvas-overlay) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  max-width: 640px !important;
  padding: 24px !important;
}

.shortcuts-modal .modal-header {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 16px !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

.shortcuts-modal .shortcut-group {
  margin-bottom: 16px !important;
}

.shortcuts-modal .shortcut-group-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

.shortcuts-modal .shortcut-item {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 4px 0 !important;
}

.shortcuts-modal .shortcut-description {
  color: var(--gh-fg-muted) !important;
  font-size: 14px !important;
}

.shortcuts-modal .shortcut-keys {
  display: flex !important;
  gap: 4px !important;
}

.shortcuts-modal kbd {
  background: var(--gh-canvas-subtle) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  padding: 2px 8px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace !important;
  font-size: 12px !important;
  color: var(--gh-fg-default) !important;
  box-shadow: inset 0 -1px 0 var(--gh-border-muted) !important;
}

/* ============================================
   v14 - Expert-Level UI Polish
   Top 1% UX Refinements
   ============================================ */

/* === TYPOGRAPHY REFINEMENTS === */

/* Headings - Tighter letter-spacing for large text */
h1, .h1 {
  letter-spacing: -0.025em !important;
}

h2, .h2 {
  letter-spacing: -0.02em !important;
}

h3, .h3 {
  letter-spacing: -0.015em !important;
}

/* Body text - Optimal reading line-height */
.markdown-body,
.comment-body,
.issue-content,
.pr-content {
  font-size: 14px !important;
  line-height: 1.6 !important;
  letter-spacing: -0.003em !important;
}

/* Monospace - Consistent code styling */
code, pre, .mono,
.ui.form input[type="text"].mono {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace !important;
  font-size: 0.875em !important;
  letter-spacing: 0 !important;
}

/* === ENHANCED FOCUS STATES === */

/* Focus ring with proper offset */
.ui.button:focus-visible,
.ui.dropdown:focus-visible,
.ui.input input:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible {
  outline: 2px solid var(--gh-accent-fg) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

/* Inner glow for inputs */
.ui.input input:focus,
.ui.form input:focus,
.ui.form textarea:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus {
  border-color: var(--gh-accent-emphasis) !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.15) !important;
  outline: none !important;
}

/* === FORM VALIDATION STATES === */

/* Error state */
.ui.form .field.error input,
.ui.form .field.error textarea,
.ui.form .field.error .ui.dropdown,
input.error,
input:invalid:not(:placeholder-shown) {
  border-color: var(--gh-danger-fg, #f85149) !important;
  background: rgba(248, 81, 73, 0.05) !important;
}

.ui.form .field.error input:focus,
input.error:focus {
  box-shadow: 0 0 0 3px rgba(248, 81, 73, 0.15) !important;
}

/* Error message */
.ui.form .field.error .ui.pointing.label,
.field-error-message,
.error-message {
  background: transparent !important;
  border: none !important;
  color: var(--gh-danger-fg, #f85149) !important;
  font-size: 12px !important;
  padding: 4px 0 !important;
  margin-top: 4px !important;
}

.ui.form .field.error .ui.pointing.label::before {
  display: none !important;
}

/* Success state */
.ui.form .field.success input,
input.success,
input:valid:not(:placeholder-shown):not([type="search"]):not([type="text"]) {
  border-color: var(--gh-success-emphasis, #238636) !important;
}

.ui.form .field.success input:focus {
  box-shadow: 0 0 0 3px rgba(35, 134, 54, 0.15) !important;
}

/* Warning state */
.ui.form .field.warning input {
  border-color: var(--gh-attention-emphasis, #d29922) !important;
}

.ui.form .field.warning input:focus {
  box-shadow: 0 0 0 3px rgba(210, 153, 34, 0.15) !important;
}

/* === TOAST NOTIFICATIONS === */

/* Toast container */
.toast-container,
.notifications-container {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  z-index: 9999 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  max-width: 400px !important;
}

/* Toast item */
.toast,
.toast-notification {
  background: var(--gh-canvas-overlay, #161b22) !important;
  border: 1px solid var(--gh-border-default) !important;
  border-radius: 6px !important;
  box-shadow: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
  padding: 16px !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: 12px !important;
  animation: slideInRight 0.3s ease-out !important;
}

@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.toast.hiding {
  animation: slideOutRight 0.3s ease-in forwards !important;
}

@keyframes slideOutRight {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(100%);
  }
}

/* Toast icon */
.toast .toast-icon {
  width: 20px !important;
  height: 20px !important;
  flex-shrink: 0 !important;
}

.toast.success .toast-icon {
  color: var(--gh-success-emphasis, #238636) !important;
}

.toast.error .toast-icon {
  color: var(--gh-danger-fg, #f85149) !important;
}

.toast.warning .toast-icon {
  color: var(--gh-attention-emphasis, #d29922) !important;
}

.toast.info .toast-icon {
  color: var(--gh-accent-fg, #58a6ff) !important;
}

/* Toast content */
.toast .toast-content {
  flex: 1 !important;
}

.toast .toast-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 4px !important;
}

.toast .toast-message {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  line-height: 1.4 !important;
}

/* Toast close button */
.toast .toast-close {
  background: transparent !important;
  border: none !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  padding: 4px !important;
  border-radius: 4px !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

.toast .toast-close:hover {
  background: var(--gh-canvas-subtle) !important;
  color: var(--gh-fg-default) !important;
}

/* === MARKDOWN TOOLBAR IMPROVEMENTS === */

/* Toolbar container */
.combo-markdown-editor .toolbar,
.markdown-toolbar,
.editor-toolbar {
  display: flex !important;
  align-items: center !important;
  gap: 2px !important;
  padding: 8px !important;
  background: var(--gh-canvas-subtle) !important;
  border-bottom: 1px solid var(--gh-border-muted) !important;
}

/* Toolbar buttons */
.combo-markdown-editor .toolbar button,
.markdown-toolbar button,
.editor-toolbar button {
  background: transparent !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 6px 8px !important;
  color: var(--gh-fg-muted) !important;
  cursor: pointer !important;
  transition: background 0.15s ease, color 0.15s ease !important;
}

.combo-markdown-editor .toolbar button:hover,
.markdown-toolbar button:hover,
.editor-toolbar button:hover {
  background: var(--gh-canvas-default) !important;
  color: var(--gh-fg-default) !important;
}

.combo-markdown-editor .toolbar button.active,
.markdown-toolbar button.active {
  background: var(--gh-canvas-default) !important;
  color: var(--gh-accent-fg) !important;
}

/* Toolbar separator */
.combo-markdown-editor .toolbar .divider,
.markdown-toolbar .separator {
  width: 1px !important;
  height: 16px !important;
  background: var(--gh-border-muted) !important;
  margin: 0 4px !important;
}

/* Toolbar icons */
.combo-markdown-editor .toolbar svg,
.markdown-toolbar svg {
  width: 16px !important;
  height: 16px !important;
}

/* === ENHANCED BUTTON STATES === */

/* Button loading state */
.ui.button.loading,
button.loading {
  position: relative !important;
  color: transparent !important;
  pointer-events: none !important;
}

.ui.button.loading::after,
button.loading::after {
  content: '' !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: 16px !important;
  height: 16px !important;
  margin: -8px 0 0 -8px !important;
  border: 2px solid currentColor !important;
  border-right-color: transparent !important;
  border-radius: 50% !important;
  animation: spin 0.6s linear infinite !important;
}

/* Button disabled state */
.ui.button.disabled,
.ui.button:disabled,
button:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* Button pressed state */
.ui.button:active:not(:disabled),
button:active:not(:disabled) {
  transform: scale(0.98) !important;
}

/* === REFINED HOVER MICRO-INTERACTIONS === */

/* Smooth scale on interactive cards */
.repository-card,
.issue-item,
.pr-item,
.commit-item,
.user-card {
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease !important;
}

.repository-card:hover,
.issue-item:hover,
.pr-item:hover {
  transform: translateY(-1px) !important;
}

/* Icon color transitions */
.ui.button svg,
a svg,
.icon {
  transition: color 0.15s ease, fill 0.15s ease !important;
}

/* Link underline animation */
.content-link,
.repo-link,
.user-link {
  position: relative !important;
  text-decoration: none !important;
}

.content-link::after,
.repo-link::after,
.user-link::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 0 !important;
  height: 1px !important;
  background: currentColor !important;
  transition: width 0.2s ease !important;
}

.content-link:hover::after,
.repo-link:hover::after,
.user-link:hover::after {
  width: 100% !important;
}

/* === EMPTY STATE IMPROVEMENTS === */

/* Empty state container */
.empty-state,
.blankslate {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 64px 32px !important;
  text-align: center !important;
}

/* Empty state icon */
.empty-state .octicon,
.blankslate .octicon,
.empty-state svg {
  width: 48px !important;
  height: 48px !important;
  color: var(--gh-fg-muted) !important;
  margin-bottom: 16px !important;
  opacity: 0.5 !important;
}

/* Empty state heading */
.empty-state h3,
.blankslate h3 {
  font-size: 20px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default) !important;
  margin-bottom: 8px !important;
}

/* Empty state description */
.empty-state p,
.blankslate p {
  font-size: 14px !important;
  color: var(--gh-fg-muted) !important;
  max-width: 400px !important;
  margin-bottom: 24px !important;
  line-height: 1.5 !important;
}

/* Empty state action */
.empty-state .ui.button,
.blankslate .ui.button {
  margin-top: 8px !important;
}

/* === AVATAR IMPROVEMENTS === */

/* Avatar ring on hover */
.avatar,
.ui.avatar,
img.avatar {
  transition: box-shadow 0.15s ease, transform 0.15s ease !important;
}

.avatar:hover,
.ui.avatar:hover,
img.avatar:hover {
  box-shadow: 0 0 0 2px var(--gh-accent-fg) !important;
}

/* Avatar stack */
.avatar-stack {
  display: flex !important;
}

.avatar-stack .avatar {
  margin-left: -8px !important;
  border: 2px solid var(--gh-canvas-default) !important;
}

.avatar-stack .avatar:first-child {
  margin-left: 0 !important;
}

.avatar-stack:hover .avatar {
  margin-left: 4px !important;
}

.avatar-stack:hover .avatar:first-child {
  margin-left: 0 !important;
}

/* === IMPROVED SELECTION STYLING === */

::selection {
  background: rgba(56, 139, 253, 0.4) !important;
  color: var(--gh-fg-default) !important;
}

::-moz-selection {
  background: rgba(56, 139, 253, 0.4) !important;
  color: var(--gh-fg-default) !important;
}

/* Code selection */
code::selection,
pre::selection,
.hljs::selection {
  background: rgba(56, 139, 253, 0.3) !important;
}

/* === PRINT STYLES === */

@media print {
  /* Hide non-essential elements */
  #navbar,
  .page-footer,
  .ui.dropdown,
  .ui.button:not(.primary),
  .sidebar {
    display: none !important;
  }

  /* Optimize colors for print */
  body {
    background: white !important;
    color: black !important;
  }

  a {
    color: black !important;
    text-decoration: underline !important;
  }

  /* Show URLs after links */
  a[href]::after {
    content: " (" attr(href) ")" !important;
    font-size: 0.8em !important;
    color: #666 !important;
  }

  /* Prevent page breaks inside elements */
  .comment-box,
  .issue-item,
  pre,
  code {
    page-break-inside: avoid !important;
  }
}

/* === REDUCED MOTION === */

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* === HIGH CONTRAST MODE === */

@media (prefers-contrast: high) {
  :root {
    --gh-border-default: #ffffff !important;
    --gh-border-muted: #cccccc !important;
  }

  .ui.button {
    border-width: 2px !important;
  }

  a {
    text-decoration: underline !important;
  }
}

/* === DARK MODE FINE-TUNING === */

[data-theme="gitea-dark"],
[data-theme="gitmorph"] {
  /* Softer shadows in dark mode */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3) !important;
  --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.4) !important;
  --shadow-lg: 0 8px 24px rgba(1, 4, 9, 0.75) !important;
}

/* === PERFORMANCE OPTIMIZATIONS === */

/* GPU acceleration for animated elements */
.ui.button,
.ui.card,
.avatar,
.toast,
[class*="animate"] {
  will-change: transform !important;
  transform: translateZ(0) !important;
}

/* Optimize repaints */
.markdown-body img,
.avatar,
.emoji {
  content-visibility: auto !important;
}

/* ============================================
   v15 - Final UI Refinements
   GitHub Parity Final Pass
   ============================================ */

/* === REFINED DROPDOWN ANIMATIONS === */

.ui.dropdown .menu,
.ui.popup,
.tippy-box,
.dropdown-menu {
  animation: dropdownSlideIn 0.15s cubic-bezier(0.16, 1, 0.3, 1) !important;
  transform-origin: top center !important;
}

@keyframes dropdownSlideIn {
  from {
    opacity: 0;
    transform: translateY(-8px) scale(0.96);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

/* Dropdown items with stagger effect */
.ui.dropdown .menu > .item,
.dropdown-menu .dropdown-item {
  animation: dropdownItemSlide 0.1s cubic-bezier(0.16, 1, 0.3, 1) both !important;
}

@keyframes dropdownItemSlide {
  from {
    opacity: 0;
    transform: translateX(-4px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* Better dropdown hover */
.ui.dropdown .menu > .item:hover,
.dropdown-menu .dropdown-item:hover {
  background: var(--gh-color-neutral-subtle, rgba(177, 186, 196, 0.12)) !important;
  transition: background 0.1s ease !important;
}

/* Dropdown dividers */
.ui.dropdown .divider,
.dropdown-divider {
  height: 1px !important;
  margin: 8px 0 !important;
  background: var(--gh-border-muted, #21262d) !important;
  border: none !important;
}

/* === NOTIFICATION/FLASH MESSAGE POLISH === */

.ui.message,
.flash,
.flash-message,
.alert {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px !important;
  border-radius: 6px !important;
  border-width: 1px !important;
  border-style: solid !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  animation: flashSlideIn 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes flashSlideIn {
  from {
    opacity: 0;
    transform: translateY(-12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Flash message icon */
.ui.message .icon:first-child,
.flash .octicon:first-child {
  flex-shrink: 0 !important;
  margin-right: 12px !important;
  margin-top: 2px !important;
}

/* Success flash */
.ui.message.positive,
.ui.message.success,
.flash.flash-success,
.alert-success {
  background: rgba(46, 160, 67, 0.1) !important;
  border-color: rgba(46, 160, 67, 0.4) !important;
  color: #3fb950 !important;
}

/* Error flash */
.ui.message.negative,
.ui.message.error,
.flash.flash-error,
.flash.flash-danger,
.alert-danger {
  background: rgba(248, 81, 73, 0.1) !important;
  border-color: rgba(248, 81, 73, 0.4) !important;
  color: #f85149 !important;
}

/* Warning flash */
.ui.message.warning,
.flash.flash-warning,
.flash.flash-warn,
.alert-warning {
  background: rgba(210, 153, 34, 0.1) !important;
  border-color: rgba(210, 153, 34, 0.4) !important;
  color: #d29922 !important;
}

/* Info flash */
.ui.message.info,
.flash.flash-info,
.alert-info {
  background: rgba(56, 139, 253, 0.1) !important;
  border-color: rgba(56, 139, 253, 0.4) !important;
  color: #58a6ff !important;
}

/* Flash close button */
.ui.message .close,
.flash .close-button,
.flash-close {
  position: absolute !important;
  top: 12px !important;
  right: 12px !important;
  padding: 4px !important;
  color: inherit !important;
  opacity: 0.7 !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  border-radius: 4px !important;
  transition: opacity 0.15s ease, background 0.15s ease !important;
}

.ui.message .close:hover,
.flash .close-button:hover,
.flash-close:hover {
  opacity: 1 !important;
  background: rgba(255, 255, 255, 0.1) !important;
}

/* === MOBILE NAVIGATION IMPROVEMENTS === */

@media (max-width: 768px) {
  /* Mobile header height */
  #navbar {
    height: 48px !important;
    min-height: 48px !important;
  }

  /* Mobile hamburger menu */
  .mobile-menu-toggle,
  #navbar .hamburger,
  .ui.dropdown.mobile-only {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    padding: 8px !important;
    color: var(--gh-fg-default, #e6edf3) !important;
    background: transparent !important;
    border: none !important;
    border-radius: 6px !important;
    cursor: pointer !important;
    transition: background 0.15s ease !important;
  }

  .mobile-menu-toggle:hover,
  #navbar .hamburger:hover {
    background: rgba(255, 255, 255, 0.1) !important;
  }

  /* Mobile slide-out menu */
  .mobile-menu,
  .mobile-nav,
  #navbar .menu.mobile {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 280px !important;
    height: 100vh !important;
    background: var(--gh-canvas-subtle, #161b22) !important;
    border-right: 1px solid var(--gh-border-default, #30363d) !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    z-index: 9999 !important;
    overflow-y: auto !important;
    padding: 16px !important;
  }

  .mobile-menu.open,
  .mobile-nav.open,
  .mobile-menu.visible {
    transform: translateX(0) !important;
  }

  /* Mobile menu overlay */
  .mobile-menu-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background: rgba(1, 4, 9, 0.8) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    z-index: 9998 !important;
  }

  .mobile-menu-overlay.open,
  .mobile-menu-overlay.visible {
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Mobile menu items */
  .mobile-menu .item,
  .mobile-nav a {
    display: flex !important;
    align-items: center !important;
    padding: 12px 16px !important;
    color: var(--gh-fg-default, #e6edf3) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    border-radius: 6px !important;
    transition: background 0.15s ease !important;
  }

  .mobile-menu .item:hover,
  .mobile-nav a:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    text-decoration: none !important;
  }

  .mobile-menu .item .icon,
  .mobile-nav a .icon {
    margin-right: 12px !important;
    opacity: 0.7 !important;
  }

  /* Hide desktop search on mobile */
  #navbar .search-bar-container {
    display: none !important;
  }

  /* Mobile search (full width) */
  .mobile-search {
    padding: 12px 16px !important;
    border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
    margin-bottom: 8px !important;
  }

  .mobile-search input {
    width: 100% !important;
    padding: 10px 16px !important;
    font-size: 16px !important;
    background: var(--gh-canvas-inset, #010409) !important;
    border: 1px solid var(--gh-border-default, #30363d) !important;
    border-radius: 6px !important;
    color: var(--gh-fg-default, #e6edf3) !important;
  }

  /* Adjust page content for mobile */
  .page-content {
    padding: 16px !important;
  }

  /* Mobile repo tabs - horizontal scroll */
  .repo-header .repo-buttons,
  .repo-tabs {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    white-space: nowrap !important;
  }

  .repo-header .repo-buttons::-webkit-scrollbar,
  .repo-tabs::-webkit-scrollbar {
    display: none !important;
  }
}

/* === SKELETON LOADING STATES === */

.skeleton,
.loading-skeleton,
[data-loading="true"] {
  position: relative !important;
  overflow: hidden !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border-radius: 4px !important;
}

.skeleton::after,
.loading-skeleton::after,
[data-loading="true"]::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, 0.04) 50%,
    transparent 100%
  ) !important;
  animation: skeletonShimmer 1.5s infinite !important;
}

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

/* Skeleton text lines */
.skeleton-text {
  height: 14px !important;
  margin-bottom: 8px !important;
  border-radius: 4px !important;
}

.skeleton-text:last-child {
  width: 60% !important;
}

/* Skeleton avatar */
.skeleton-avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
}

/* Skeleton button */
.skeleton-button {
  width: 80px !important;
  height: 32px !important;
  border-radius: 6px !important;
}

/* Skeleton card */
.skeleton-card {
  padding: 16px !important;
  border: 1px solid var(--gh-border-muted, #21262d) !important;
  border-radius: 6px !important;
}

/* === DIFF INLINE COMMENTS === */

.diff-comment-form,
.inline-comment-form {
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  margin: 8px 0 !important;
  animation: commentFormSlideIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

@keyframes commentFormSlideIn {
  from {
    opacity: 0;
    transform: translateY(-8px);
    max-height: 0;
  }
  to {
    opacity: 1;
    transform: translateY(0);
    max-height: 500px;
  }
}

.diff-comment-form .comment-form-textarea,
.inline-comment-form textarea {
  min-height: 100px !important;
  padding: 12px !important;
  background: var(--gh-canvas-inset, #010409) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  resize: vertical !important;
  transition: border-color 0.15s ease !important;
}

.diff-comment-form .comment-form-textarea:focus,
.inline-comment-form textarea:focus {
  border-color: var(--gh-accent-emphasis, #1f6feb) !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(31, 111, 235, 0.3) !important;
}

/* Comment thread line */
.diff-comment-thread,
.inline-comment-thread {
  position: relative !important;
  padding-left: 16px !important;
}

.diff-comment-thread::before,
.inline-comment-thread::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 2px !important;
  background: var(--gh-border-default, #30363d) !important;
  border-radius: 1px !important;
}

/* Comment actions */
.diff-comment .comment-actions,
.inline-comment .actions {
  display: flex !important;
  gap: 8px !important;
  padding: 8px 12px !important;
  border-top: 1px solid var(--gh-border-muted, #21262d) !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
}

/* Add comment button (appears on hover) */
.diff-line .add-comment-btn,
.add-line-comment {
  position: absolute !important;
  left: 4px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 22px !important;
  height: 22px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--gh-accent-emphasis, #1f6feb) !important;
  color: white !important;
  border-radius: 4px !important;
  font-size: 14px !important;
  font-weight: bold !important;
  cursor: pointer !important;
  opacity: 0 !important;
  transition: opacity 0.15s ease !important;
  border: none !important;
}

.diff-line:hover .add-comment-btn,
tr:hover .add-line-comment {
  opacity: 1 !important;
}

/* === REPOSITORY FILE ICONS ENHANCEMENT === */

.file-icon,
.icon.file,
.octicon-file {
  color: var(--gh-fg-subtle, #848d97) !important;
}

/* Folder icon */
.folder-icon,
.icon.folder,
.octicon-file-directory {
  color: #54aeff !important;
}

/* Specific file type colors */
.file-icon[data-ext="js"],
.file-icon[data-ext="jsx"],
.file-icon[data-ext="ts"],
.file-icon[data-ext="tsx"] {
  color: #f1e05a !important;
}

.file-icon[data-ext="py"] {
  color: #3572a5 !important;
}

.file-icon[data-ext="rb"] {
  color: #701516 !important;
}

.file-icon[data-ext="go"] {
  color: #00add8 !important;
}

.file-icon[data-ext="rs"] {
  color: #dea584 !important;
}

.file-icon[data-ext="md"] {
  color: #083fa1 !important;
}

.file-icon[data-ext="json"] {
  color: #a3a3a3 !important;
}

.file-icon[data-ext="css"],
.file-icon[data-ext="scss"],
.file-icon[data-ext="less"] {
  color: #563d7c !important;
}

.file-icon[data-ext="html"] {
  color: #e34c26 !important;
}

/* === BRANCH/TAG SELECTOR IMPROVEMENTS === */

.branch-selector,
.ref-selector,
.choose-branch {
  position: relative !important;
}

.branch-selector .ui.button,
.ref-selector-button {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 5px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background: var(--gh-canvas-subtle, #21262d) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  cursor: pointer !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

.branch-selector .ui.button:hover,
.ref-selector-button:hover {
  background: var(--gh-canvas-subtle, #30363d) !important;
  border-color: var(--gh-fg-subtle, #484f58) !important;
}

/* Branch/tag icon */
.branch-selector .octicon,
.ref-selector-button .icon {
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Branch selector dropdown */
.branch-selector .menu,
.ref-selector-dropdown {
  min-width: 300px !important;
  max-height: 400px !important;
  overflow-y: auto !important;
}

/* Branch search input */
.branch-selector .search input,
.ref-selector-search {
  width: 100% !important;
  padding: 8px 12px !important;
  margin: 8px !important;
  font-size: 14px !important;
  background: var(--gh-canvas-inset, #010409) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

/* Branch tabs (Branches/Tags) */
.branch-selector .branch-tag-tabs,
.ref-selector-tabs {
  display: flex !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  margin-bottom: 8px !important;
}

.branch-selector .branch-tag-tabs .item,
.ref-selector-tabs button {
  flex: 1 !important;
  padding: 8px 16px !important;
  text-align: center !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  cursor: pointer !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.branch-selector .branch-tag-tabs .item:hover,
.ref-selector-tabs button:hover {
  color: var(--gh-fg-default, #e6edf3) !important;
}

.branch-selector .branch-tag-tabs .item.active,
.ref-selector-tabs button.active {
  color: var(--gh-fg-default, #e6edf3) !important;
  border-bottom-color: var(--gh-underlinenav-borderColor-active, #f78166) !important;
}

/* === COMMIT SIGNATURE BADGE === */

.commit-signature,
.gpg-badge,
.signature-badge {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 2em !important;
}

/* Verified signature */
.commit-signature.verified,
.gpg-badge.verified {
  background: rgba(46, 160, 67, 0.15) !important;
  border: 1px solid rgba(46, 160, 67, 0.4) !important;
  color: #3fb950 !important;
}

/* Unverified signature */
.commit-signature.unverified,
.gpg-badge.unverified {
  background: rgba(210, 153, 34, 0.15) !important;
  border: 1px solid rgba(210, 153, 34, 0.4) !important;
  color: #d29922 !important;
}

/* === COMMIT LIST IMPROVEMENTS === */

.commit-list .commit-item,
#commits-table .commit {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.commit-list .commit-item:hover,
#commits-table .commit:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

/* Commit avatar */
.commit-list .commit-avatar,
#commits-table .commit .avatar {
  flex-shrink: 0 !important;
  width: 24px !important;
  height: 24px !important;
  margin-right: 12px !important;
  border-radius: 50% !important;
}

/* Commit message */
.commit-list .commit-message,
#commits-table .commit .message {
  flex: 1 !important;
  min-width: 0 !important;
}

.commit-list .commit-title,
#commits-table .commit .message a {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  text-decoration: none !important;
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.commit-list .commit-title:hover,
#commits-table .commit .message a:hover {
  color: var(--gh-accent-fg, #58a6ff) !important;
  text-decoration: underline !important;
}

/* Commit meta */
.commit-list .commit-meta,
#commits-table .commit .meta {
  margin-top: 4px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Commit SHA */
.commit-list .commit-sha,
#commits-table .commit .sha {
  flex-shrink: 0 !important;
  margin-left: 16px !important;
  padding: 4px 8px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  color: var(--gh-accent-fg, #58a6ff) !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

.commit-list .commit-sha:hover,
#commits-table .commit .sha:hover {
  background: var(--gh-canvas-subtle, #21262d) !important;
  border-color: var(--gh-fg-subtle, #484f58) !important;
}

/* === ACTIVITY FEED IMPROVEMENTS === */

.activity-feed,
.dashboard-activity,
.news-feed {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.activity-feed .activity-item,
.dashboard-activity .event,
.news-item {
  display: flex !important;
  align-items: flex-start !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.activity-feed .activity-item:last-child,
.dashboard-activity .event:last-child,
.news-item:last-child {
  border-bottom: none !important;
}

.activity-feed .activity-item:hover,
.dashboard-activity .event:hover,
.news-item:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

/* Activity icon */
.activity-feed .activity-icon,
.dashboard-activity .event-icon {
  flex-shrink: 0 !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 12px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border-radius: 50% !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Push event icon */
.activity-feed .activity-icon.push,
.dashboard-activity .event-icon.push {
  background: rgba(46, 160, 67, 0.15) !important;
  color: #3fb950 !important;
}

/* Star event icon */
.activity-feed .activity-icon.star,
.dashboard-activity .event-icon.star {
  background: rgba(210, 153, 34, 0.15) !important;
  color: #d29922 !important;
}

/* Fork event icon */
.activity-feed .activity-icon.fork,
.dashboard-activity .event-icon.fork {
  background: rgba(136, 113, 191, 0.15) !important;
  color: #8957e5 !important;
}

/* Activity content */
.activity-feed .activity-content,
.dashboard-activity .event-content {
  flex: 1 !important;
  min-width: 0 !important;
}

/* Activity title */
.activity-feed .activity-title,
.dashboard-activity .event-title {
  font-size: 14px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin-bottom: 4px !important;
}

/* Activity time */
.activity-feed .activity-time,
.dashboard-activity .event-time {
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* === FINAL POLISH === */

/* Smoother scrolling */
html {
  scroll-behavior: smooth !important;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto !important;
  }
}

/* Better text rendering */
body {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* Link focus visible */
a:focus-visible {
  outline: 2px solid var(--gh-accent-emphasis, #1f6feb) !important;
  outline-offset: 2px !important;
  border-radius: 2px !important;
}

/* Better placeholder text */
::placeholder {
  color: var(--gh-fg-subtle, #484f58) !important;
  opacity: 1 !important;
}

/* Selection color */
::selection {
  background: rgba(56, 139, 253, 0.4) !important;
  color: #ffffff !important;
}

::-moz-selection {
  background: rgba(56, 139, 253, 0.4) !important;
  color: #ffffff !important;
}

/* Disabled state */
[disabled],
.disabled,
:disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* Hidden but accessible */
.sr-only,
.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Focus trap for modals */
.modal[aria-modal="true"],
.ui.modal.active {
  isolation: isolate !important;
}

/* ============================================
   v16 - Code Review & Settings Polish
   GitHub Parity - Deep Refinements
   ============================================ */

/* === CODE REVIEW UI (Pull Request Review) === */

/* Review container */
.pull-request-review,
.review-box,
.comment-code-cloud {
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  margin: 16px 0 !important;
}

/* Review header */
.review-box-header,
.review-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  border-radius: 6px 6px 0 0 !important;
}

/* Review status badges */
.review-status,
.review-type {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  border-radius: 2em !important;
}

/* Approved review */
.review-status.approved,
.review-type.approve {
  background: rgba(46, 160, 67, 0.15) !important;
  color: #3fb950 !important;
}

/* Changes requested */
.review-status.changes-requested,
.review-type.reject {
  background: rgba(248, 81, 73, 0.15) !important;
  color: #f85149 !important;
}

/* Comment only review */
.review-status.commented,
.review-type.comment {
  background: rgba(136, 113, 191, 0.15) !important;
  color: #8957e5 !important;
}

/* Pending review */
.review-status.pending {
  background: rgba(210, 153, 34, 0.15) !important;
  color: #d29922 !important;
}

/* Review body */
.review-box-body,
.review-content {
  padding: 16px !important;
}

/* Review actions */
.review-box-footer,
.review-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 12px 16px !important;
  background: var(--gh-canvas-default, #0d1117) !important;
  border-top: 1px solid var(--gh-border-muted, #21262d) !important;
  border-radius: 0 0 6px 6px !important;
}

/* File review header */
.file-header,
.diff-file-header {
  display: flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px 6px 0 0 !important;
  font-size: 14px !important;
}

.file-header .file-path,
.diff-file-header .file-info {
  flex: 1 !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

/* File status icons */
.file-header .file-status,
.diff-stat {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: 8px !important;
  font-size: 12px !important;
}

.diff-stat .add {
  color: #3fb950 !important;
}

.diff-stat .del {
  color: #f85149 !important;
}

/* Viewed checkbox */
.file-header .viewed-checkbox,
.file-viewed {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  margin-left: auto !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Conversation resolution */
.conversation-resolution,
.outdated-comment {
  padding: 8px 16px !important;
  background: var(--gh-canvas-inset, #010409) !important;
  border: 1px solid var(--gh-border-muted, #21262d) !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.conversation-resolution.resolved {
  border-left: 3px solid #3fb950 !important;
}

.conversation-resolution.outdated {
  border-left: 3px solid #d29922 !important;
}

/* === SETTINGS PAGES === */

/* Settings container */
.repository-content.settings,
.user-setting-content,
.admin-setting-content {
  max-width: 1012px !important;
  margin: 0 auto !important;
  padding: 24px 16px !important;
}

/* Settings sidebar */
.settings-sidebar,
.user-setting-sidebar,
.setting-menu {
  width: 220px !important;
  flex-shrink: 0 !important;
  padding-right: 24px !important;
  border-right: 1px solid var(--gh-border-muted, #21262d) !important;
}

/* Settings nav items */
.settings-sidebar .item,
.setting-menu .item {
  display: flex !important;
  align-items: center !important;
  padding: 8px 12px !important;
  margin-bottom: 2px !important;
  font-size: 14px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  border-radius: 6px !important;
  transition: background 0.15s ease !important;
}

.settings-sidebar .item:hover,
.setting-menu .item:hover {
  background: rgba(177, 186, 196, 0.12) !important;
  text-decoration: none !important;
}

.settings-sidebar .item.active,
.setting-menu .item.active {
  background: rgba(177, 186, 196, 0.08) !important;
  font-weight: 600 !important;
}

.settings-sidebar .item.active::before,
.setting-menu .item.active::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 3px !important;
  height: 24px !important;
  background: var(--gh-underlinenav-borderColor-active, #f78166) !important;
  border-radius: 0 3px 3px 0 !important;
}

/* Settings nav icon */
.settings-sidebar .item .icon,
.setting-menu .item .octicon {
  margin-right: 10px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Settings content area */
.settings-content,
.setting-content {
  flex: 1 !important;
  padding-left: 24px !important;
  min-width: 0 !important;
}

/* Settings section */
.settings-section,
.ui.segment.attached {
  padding: 24px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  margin-bottom: 24px !important;
}

/* Settings section header */
.settings-section-header,
.box-header {
  padding-bottom: 16px !important;
  margin-bottom: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
}

.settings-section-header h3,
.settings-section-header h4,
.box-header h3 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin: 0 !important;
}

.settings-section-header p,
.box-header p {
  margin-top: 4px !important;
  font-size: 14px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Settings form groups */
.settings-form-group,
.field {
  margin-bottom: 16px !important;
}

.settings-form-group label,
.field > label {
  display: block !important;
  margin-bottom: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

.settings-form-group .hint,
.field .help {
  margin-top: 4px !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Danger zone */
.danger-zone,
.ui.segment.danger {
  border-color: rgba(248, 81, 73, 0.4) !important;
  background: rgba(248, 81, 73, 0.05) !important;
}

.danger-zone-header,
.danger-zone h4 {
  color: #f85149 !important;
}

/* === ORGANIZATION PAGES === */

/* Org header */
.org-header,
.organization-header {
  display: flex !important;
  align-items: center !important;
  padding: 24px 0 !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  margin-bottom: 24px !important;
}

.org-header .org-avatar {
  width: 96px !important;
  height: 96px !important;
  border-radius: 6px !important;
  margin-right: 24px !important;
}

.org-header .org-info h1 {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin: 0 0 4px !important;
}

.org-header .org-info .org-description {
  font-size: 16px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* Org nav */
.org-nav,
.org-tabs {
  display: flex !important;
  gap: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  margin-bottom: 24px !important;
}

.org-nav .item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  border-bottom: 2px solid transparent !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.org-nav .item:hover {
  color: var(--gh-fg-default, #e6edf3) !important;
  text-decoration: none !important;
}

.org-nav .item.active {
  color: var(--gh-fg-default, #e6edf3) !important;
  border-bottom-color: var(--gh-underlinenav-borderColor-active, #f78166) !important;
}

/* Team list */
.team-list,
.org-teams {
  display: grid !important;
  gap: 16px !important;
}

.team-card {
  display: flex !important;
  align-items: center !important;
  padding: 16px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  transition: border-color 0.15s ease !important;
}

.team-card:hover {
  border-color: var(--gh-fg-subtle, #484f58) !important;
}

.team-card .team-avatar {
  width: 48px !important;
  height: 48px !important;
  border-radius: 6px !important;
  margin-right: 16px !important;
  background: var(--gh-canvas-inset, #010409) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.team-card .team-info h4 {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin: 0 !important;
}

.team-card .team-info p {
  font-size: 14px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  margin: 4px 0 0 !important;
}

/* Member list */
.member-list,
.org-members {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 16px !important;
}

.member-card {
  display: flex !important;
  align-items: center !important;
  padding: 12px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  transition: border-color 0.15s ease !important;
}

.member-card:hover {
  border-color: var(--gh-fg-subtle, #484f58) !important;
}

.member-card .member-avatar {
  width: 40px !important;
  height: 40px !important;
  border-radius: 50% !important;
  margin-right: 12px !important;
}

.member-card .member-info .member-name {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

.member-card .member-info .member-role {
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* === REPOSITORY SETTINGS === */

/* Repository settings layout */
.repo-settings-layout {
  display: flex !important;
  gap: 24px !important;
}

/* Branch protection rules */
.branch-protection-rules,
.protected-branches {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.branch-protection-rule {
  display: flex !important;
  align-items: center !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.branch-protection-rule:last-child {
  border-bottom: none !important;
}

.branch-protection-rule:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

.branch-protection-rule .branch-name {
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

.branch-protection-rule .protection-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: 8px !important;
  padding: 2px 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border-radius: 2em !important;
}

.branch-protection-rule .protection-status.active {
  background: rgba(46, 160, 67, 0.15) !important;
  color: #3fb950 !important;
}

/* Webhooks list */
.webhooks-list,
.hook-list {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.webhook-item {
  display: flex !important;
  align-items: center !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.webhook-item:last-child {
  border-bottom: none !important;
}

.webhook-item:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

.webhook-item .webhook-url {
  flex: 1 !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.webhook-item .webhook-status {
  width: 8px !important;
  height: 8px !important;
  border-radius: 50% !important;
  margin-right: 12px !important;
}

.webhook-item .webhook-status.active {
  background: #3fb950 !important;
}

.webhook-item .webhook-status.inactive {
  background: #f85149 !important;
}

/* Deploy keys */
.deploy-keys-list {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.deploy-key-item {
  display: flex !important;
  align-items: center !important;
  padding: 12px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
}

.deploy-key-item:last-child {
  border-bottom: none !important;
}

.deploy-key-item .key-icon {
  margin-right: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.deploy-key-item .key-title {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

.deploy-key-item .key-fingerprint {
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

/* === IMPROVED RESPONSIVE BREAKPOINTS === */

/* Small tablets */
@media (max-width: 768px) {
  /* Settings layout stack */
  .repo-settings-layout,
  .settings-layout {
    flex-direction: column !important;
  }

  .settings-sidebar,
  .user-setting-sidebar,
  .setting-menu {
    width: 100% !important;
    padding-right: 0 !important;
    padding-bottom: 16px !important;
    margin-bottom: 16px !important;
    border-right: none !important;
    border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  }

  .settings-content,
  .setting-content {
    padding-left: 0 !important;
  }

  /* Org header stack */
  .org-header,
  .organization-header {
    flex-direction: column !important;
    text-align: center !important;
  }

  .org-header .org-avatar {
    margin-right: 0 !important;
    margin-bottom: 16px !important;
  }

  /* Member grid single column */
  .member-list,
  .org-members {
    grid-template-columns: 1fr !important;
  }
}

/* Large phones */
@media (max-width: 544px) {
  /* Reduce padding */
  .page-content,
  .repository-content {
    padding: 12px !important;
  }

  /* Settings section */
  .settings-section,
  .ui.segment.attached {
    padding: 16px !important;
  }

  /* Review actions stack */
  .review-box-footer,
  .review-actions {
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .review-actions .ui.button {
    width: 100% !important;
    justify-content: center !important;
  }

  /* File header wrap */
  .file-header,
  .diff-file-header {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* Team card stack */
  .team-card {
    flex-direction: column !important;
    text-align: center !important;
  }

  .team-card .team-avatar {
    margin-right: 0 !important;
    margin-bottom: 12px !important;
  }
}

/* Large screens */
@media (min-width: 1280px) {
  .page-content,
  .repository-content {
    max-width: 1280px !important;
    padding: 24px 32px !important;
  }

  /* Wider settings sidebar */
  .settings-sidebar,
  .setting-menu {
    width: 256px !important;
  }
}

/* Extra large screens */
@media (min-width: 1440px) {
  .page-content,
  .repository-content {
    max-width: 1400px !important;
  }
}

/* === DISCUSSIONS PAGE (if enabled) === */

.discussions-list {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.discussion-item {
  display: flex !important;
  padding: 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.discussion-item:last-child {
  border-bottom: none !important;
}

.discussion-item:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

.discussion-item .discussion-icon {
  flex-shrink: 0 !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-right: 12px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border-radius: 50% !important;
  color: #3fb950 !important;
}

.discussion-item .discussion-content {
  flex: 1 !important;
  min-width: 0 !important;
}

.discussion-item .discussion-title {
  font-size: 16px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin-bottom: 4px !important;
}

.discussion-item .discussion-title:hover {
  color: var(--gh-accent-fg, #58a6ff) !important;
}

.discussion-item .discussion-meta {
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.discussion-item .discussion-category {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 2px 8px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 2em !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin-right: 8px !important;
}

/* Discussion stats */
.discussion-item .discussion-stats {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  margin-left: auto !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  font-size: 12px !important;
}

.discussion-item .discussion-stats .stat {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

/* === KEYBOARD SHORTCUTS STYLING === */

.keyboard-shortcuts-modal,
.keyboard-shortcut-help {
  max-width: 640px !important;
}

.shortcut-group {
  margin-bottom: 24px !important;
}

.shortcut-group h3 {
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  margin-bottom: 12px !important;
  padding-bottom: 8px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
}

.shortcut-row {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 8px 0 !important;
}

.shortcut-row .shortcut-description {
  font-size: 14px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.shortcut-row .shortcut-keys {
  display: flex !important;
  gap: 4px !important;
}

.shortcut-key,
kbd {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 8px !important;
  font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  box-shadow: inset 0 -1px 0 var(--gh-border-muted, #21262d) !important;
}

/* === RELEASE PAGES === */

.release-list {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.release-item {
  padding: 24px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
}

.release-item:last-child {
  border-bottom: none !important;
}

.release-item .release-header {
  display: flex !important;
  align-items: flex-start !important;
  margin-bottom: 16px !important;
}

.release-item .release-version {
  font-size: 24px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
}

.release-item .release-tag {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: 12px !important;
  padding: 4px 12px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 2em !important;
  color: var(--gh-accent-fg, #58a6ff) !important;
}

.release-item .release-badge.latest {
  margin-left: 8px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: rgba(46, 160, 67, 0.15) !important;
  border: 1px solid rgba(46, 160, 67, 0.4) !important;
  border-radius: 2em !important;
  color: #3fb950 !important;
}

.release-item .release-badge.prerelease {
  margin-left: 8px !important;
  padding: 4px 12px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  background: rgba(210, 153, 34, 0.15) !important;
  border: 1px solid rgba(210, 153, 34, 0.4) !important;
  border-radius: 2em !important;
  color: #d29922 !important;
}

.release-item .release-meta {
  font-size: 14px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  margin-bottom: 16px !important;
}

.release-item .release-body {
  padding: 16px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border: 1px solid var(--gh-border-muted, #21262d) !important;
  border-radius: 6px !important;
  margin-bottom: 16px !important;
}

/* Release assets */
.release-assets {
  border: 1px solid var(--gh-border-default, #30363d) !important;
  border-radius: 6px !important;
  overflow: hidden !important;
}

.release-assets-header {
  display: flex !important;
  align-items: center !important;
  padding: 12px 16px !important;
  background: var(--gh-canvas-subtle, #161b22) !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--gh-fg-default, #e6edf3) !important;
  cursor: pointer !important;
}

.release-asset-item {
  display: flex !important;
  align-items: center !important;
  padding: 8px 16px !important;
  border-bottom: 1px solid var(--gh-border-muted, #21262d) !important;
  transition: background 0.15s ease !important;
}

.release-asset-item:last-child {
  border-bottom: none !important;
}

.release-asset-item:hover {
  background: rgba(177, 186, 196, 0.04) !important;
}

.release-asset-item .asset-icon {
  margin-right: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
}

.release-asset-item .asset-name {
  flex: 1 !important;
  font-size: 14px !important;
  color: var(--gh-accent-fg, #58a6ff) !important;
}

.release-asset-item .asset-size {
  font-size: 12px !important;
  color: var(--gh-fg-muted, #9198a1) !important;
  margin-left: 16px !important;
}