/* Omnitas Gitea Theme - Omniverse Design Language */
/* Fonts: Sora (headings) + Inter (body) */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700&family=Inter:wght@400;500;600&display=swap');

:root {
  /* Omniverse color palette */
  --omni-bg-base: #0a0e1a;
  --omni-bg-raised: #111827;
  --omni-bg-elevated: #162a45;
  --omni-brand-blue: #1e4366;
  --omni-brand-gold: #daad82;
  --omni-blue-400: #5a8ec3;
  --omni-blue-500: #3a77ba;
  --omni-blue-600: #2f6099;
  --omni-blue-700: #244a78;
  --omni-blue-800: #1a3557;
  --omni-blue-900: #102038;
  --omni-gold-300: #e8d1b0;
  --omni-gold-400: #debb8d;
  --omni-gold-500: #daad82;
  --omni-gold-600: #c49a6e;
  --omni-purple-400: #6366f1;
  --omni-purple-500: #4338ca;
  --omni-text-primary: #e2e8f0;
  --omni-text-secondary: #cbd5e1;
  --omni-text-muted: #94a3b8;
  --omni-glass-bg: rgba(255, 255, 255, 0.03);
  --omni-glass-border: rgba(255, 255, 255, 0.08);
  --omni-glass-blur: 40px;

  /* Golden backlit hexagonal cube grid - light bleeds through cracks between dark plates */
  --omni-hex-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='69.28' height='120' viewBox='0 0 69.28 120'%3E%3Cdefs%3E%3Cpattern id='hx' x='0' y='0' width='69.28' height='120' patternUnits='userSpaceOnUse'%3E%3Cg fill='none'%3E%3Cpolygon points='34.64,0 69.28,20 69.28,60 34.64,80 0,60 0,20' stroke='rgba(218,173,130,0.18)' stroke-width='1'/%3E%3Cpolygon points='69.28,60 103.92,80 103.92,120 69.28,140 34.64,120 34.64,80' stroke='rgba(218,173,130,0.18)' stroke-width='1'/%3E%3Cpolygon points='0,60 34.64,80 34.64,120 0,140 -34.64,120 -34.64,80' stroke='rgba(218,173,130,0.18)' stroke-width='1'/%3E%3Cline x1='34.64' y1='40' x2='34.64' y2='0' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='34.64' y1='40' x2='0' y2='60' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='34.64' y1='40' x2='69.28' y2='60' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='69.28' y1='100' x2='69.28' y2='60' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='69.28' y1='100' x2='34.64' y2='120' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='69.28' y1='100' x2='103.92' y2='120' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='0' y1='100' x2='0' y2='60' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='0' y1='100' x2='-34.64' y2='120' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3Cline x1='0' y1='100' x2='34.64' y2='120' stroke='rgba(218,173,130,0.14)' stroke-width='0.8'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect width='69.28' height='120' fill='url(%23hx)'/%3E%3C/svg%3E");
}

/* Base: dark background with hexagon pattern */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;
  background: var(--omni-bg-base) !important;
  color: var(--omni-text-primary) !important;
}

/* Static golden hex grid */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background: var(--omni-hex-pattern);
  pointer-events: none;
  z-index: 0;
}

/* Drifting golden light - large soft glow that moves behind the grid */
body::after {
  content: '';
  position: fixed;
  top: -30%;
  left: -30%;
  width: 160%;
  height: 160%;
  background:
    radial-gradient(ellipse 40% 35% at 30% 35%, rgba(218, 173, 130, 0.10) 0%, transparent 70%),
    radial-gradient(ellipse 35% 40% at 70% 65%, rgba(196, 154, 110, 0.08) 0%, transparent 65%);
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: 0;
  animation: glow-drift 25s ease-in-out infinite alternate;
}

@keyframes glow-drift {
  0% { transform: translate(0, 0); }
  25% { transform: translate(8%, -6%); }
  50% { transform: translate(-5%, 8%); }
  75% { transform: translate(6%, 4%); }
  100% { transform: translate(-8%, -3%); }
}

@media (prefers-reduced-motion: reduce) {
  body::after {
    animation: none !important;
  }
}

/* Replace Gitea logo with Omnitas logo - override forced 30x30 square */
#navbar img[src*="logo"],
.gitea-navbar img[src*="logo"],
a.logo img {
  content: url('/assets/img/logo.png') !important;
  height: 24px !important;
  width: 70px !important;
  min-width: 70px !important;
  max-height: 24px !important;
  object-fit: contain !important;
}

/* Sign-in page large logo */
img.logo[width="220"] {
  content: url('/assets/img/logo.png') !important;
  height: 75px !important;
  width: 220px !important;
  object-fit: contain !important;
}

/* Ensure content sits above background layers */
.full-height,
.page-content,
#app-container,
.ui.container,
body > div {
  position: relative;
  z-index: 1;
}

/* Navbar dropdowns must sit above everything */
#navbar,
.gitea-navbar {
  position: relative;
  z-index: 1000 !important;
}

.ui.dropdown .menu,
.tippy-box,
.tippy-content,
.ui.popup,
.ui.dropdown.active > .menu {
  z-index: 1001 !important;
}

/* Headings use Sora */
h1, h2, h3, h4, h5, h6,
.header,
.dashboard-navbar,
.repo-header {
  font-family: 'Sora', sans-serif !important;
}

/* Navbar: dark Omnitas blue */
.ui.secondary.pointing.menu,
nav,
.ui.top.secondary.menu,
#navbar,
.gitea-navbar {
  background: linear-gradient(135deg, #102038 0%, #0d1a2e 100%) !important;
  backdrop-filter: blur(var(--omni-glass-blur)) saturate(1.5) !important;
  -webkit-backdrop-filter: blur(var(--omni-glass-blur)) saturate(1.5) !important;
  border-bottom: 1px solid rgba(218, 173, 130, 0.1) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.4) !important;
}

#navbar .item,
.gitea-navbar a {
  color: var(--omni-gold-300) !important;
  transition: color 0.2s ease, text-shadow 0.2s ease !important;
}

#navbar .item:hover,
.gitea-navbar a:hover {
  color: var(--omni-brand-gold) !important;
  text-shadow: 0 0 20px rgba(218, 173, 130, 0.3) !important;
}

#navbar .item.active {
  color: var(--omni-brand-gold) !important;
  border-color: var(--omni-brand-gold) !important;
}

/* Repo header */
.repo-header,
.header-wrapper {
  background: linear-gradient(180deg, rgba(12, 18, 35, 0.5) 0%, rgba(10, 14, 26, 0.3) 100%) !important;
  backdrop-filter: blur(30px) !important;
  border-bottom: 1px solid var(--omni-glass-border) !important;
}

/* Segments and cards: glass cards */
.ui.segment,
.ui.segments .segment,
.ui.attached.segment,
.repository .repo-description,
.ui.card,
.timeline-item .timeline-item-body {
  background: linear-gradient(135deg, rgba(12, 18, 35, 0.45) 0%, rgba(10, 14, 28, 0.3) 50%, rgba(14, 20, 36, 0.38) 100%) !important;
  backdrop-filter: blur(var(--omni-glass-blur)) saturate(1.3) !important;
  -webkit-backdrop-filter: blur(var(--omni-glass-blur)) saturate(1.3) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
  color: var(--omni-text-primary) !important;
}

/* Tables */
.ui.table {
  background: rgba(12, 18, 35, 0.3) !important;
  border: 1px solid var(--omni-glass-border) !important;
  color: var(--omni-text-primary) !important;
}

.ui.table thead th {
  background: rgba(30, 67, 102, 0.2) !important;
  color: var(--omni-text-secondary) !important;
  border-bottom: 1px solid var(--omni-glass-border) !important;
  font-family: 'Sora', sans-serif !important;
  font-weight: 600 !important;
}

.ui.table tbody tr {
  transition: background 0.15s ease !important;
}

.ui.table tbody tr:hover {
  background: rgba(30, 67, 102, 0.12) !important;
}

.ui.table td {
  border-top: 1px solid rgba(255, 255, 255, 0.04) !important;
  color: var(--omni-text-primary) !important;
}

/* Buttons: primary = gold gradient, secondary = glass */
.ui.primary.button,
.ui.primary.buttons .button {
  background: linear-gradient(135deg, var(--omni-brand-gold), var(--omni-gold-600)) !important;
  color: #0a0e1a !important;
  font-family: 'Sora', sans-serif !important;
  font-weight: 600 !important;
  border: none !important;
  border-radius: 8px !important;
  text-shadow: none !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 2px 12px rgba(218, 173, 130, 0.25) !important;
}

.ui.primary.button:hover {
  background: linear-gradient(135deg, var(--omni-gold-400), var(--omni-brand-gold)) !important;
  box-shadow: 0 4px 20px rgba(218, 173, 130, 0.4) !important;
  transform: translateY(-1px) !important;
}

.ui.button,
.ui.basic.button {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--omni-text-secondary) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 8px !important;
  backdrop-filter: blur(10px) !important;
  transition: all 0.2s ease !important;
}

.ui.button:hover,
.ui.basic.button:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: var(--omni-text-primary) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

.ui.negative.button,
.ui.red.button {
  background: linear-gradient(135deg, #f43f5e, #e11d48) !important;
  color: white !important;
  border: none !important;
}

.ui.green.button {
  background: linear-gradient(135deg, #10b981, #059669) !important;
  color: white !important;
  border: none !important;
}

/* Links: gold accent */
a {
  color: var(--omni-blue-400) !important;
  transition: color 0.15s ease !important;
}

a:hover {
  color: var(--omni-brand-gold) !important;
}

/* Repository list items */
.repo-owner-name-list .item,
.flex-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
  padding: 16px 0 !important;
  transition: background 0.15s ease !important;
}

.repo-owner-name-list .item:hover,
.flex-item:hover {
  background: rgba(30, 67, 102, 0.08) !important;
}

/* Labels and tags */
.ui.label {
  background: rgba(30, 67, 102, 0.3) !important;
  color: var(--omni-text-secondary) !important;
  border: 1px solid rgba(90, 142, 195, 0.2) !important;
  border-radius: 6px !important;
}

/* Input fields: glass style */
.ui.input input,
.ui.form input,
.ui.form textarea,
.ui.form select,
input[type="text"],
input[type="password"],
input[type="email"],
textarea,
select,
.CodeMirror {
  background: rgba(10, 14, 26, 0.6) !important;
  color: var(--omni-text-primary) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 8px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.ui.input input:focus,
.ui.form input:focus,
.ui.form textarea:focus,
input:focus,
textarea:focus {
  border-color: var(--omni-blue-500) !important;
  box-shadow: 0 0 0 3px rgba(58, 119, 186, 0.15), 0 0 20px rgba(30, 67, 102, 0.1) !important;
  outline: none !important;
}

/* Dropdown menus */
.ui.dropdown .menu,
.ui.selection.dropdown .menu,
.tippy-box,
.menu {
  background: linear-gradient(135deg, rgba(12, 18, 35, 0.92) 0%, rgba(16, 24, 42, 0.88) 100%) !important;
  backdrop-filter: blur(var(--omni-glass-blur)) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 10px !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4) !important;
}

.ui.dropdown .menu .item,
.menu .item {
  color: var(--omni-text-secondary) !important;
  transition: all 0.15s ease !important;
}

.ui.dropdown .menu .item:hover,
.menu .item:hover,
.menu a.item:hover {
  background: rgba(30, 67, 102, 0.2) !important;
  color: var(--omni-text-primary) !important;
}

/* Footer */
.page-footer,
footer {
  background: transparent !important;
  border-top: 1px solid var(--omni-glass-border) !important;
  color: var(--omni-text-muted) !important;
}

/* Code blocks */
pre, code,
.highlight,
.code-view {
  background: rgba(8, 12, 24, 0.7) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 8px !important;
  color: var(--omni-text-primary) !important;
}

/* Diff view */
.diff-file-box {
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

.diff-file-header {
  background: rgba(30, 67, 102, 0.15) !important;
  border-bottom: 1px solid var(--omni-glass-border) !important;
}

/* Sidebar */
.repo-sidebar,
.four.wide.column {
  color: var(--omni-text-secondary) !important;
}

/* Flash messages */
.ui.message {
  background: linear-gradient(135deg, rgba(12, 18, 35, 0.6) 0%, rgba(16, 24, 42, 0.4) 100%) !important;
  backdrop-filter: blur(20px) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 10px !important;
  color: var(--omni-text-primary) !important;
}

.ui.positive.message,
.ui.success.message {
  border-left: 3px solid #10b981 !important;
}

.ui.negative.message,
.ui.error.message {
  border-left: 3px solid #f43f5e !important;
}

.ui.warning.message {
  border-left: 3px solid #f59e0b !important;
}

.ui.info.message {
  border-left: 3px solid var(--omni-blue-400) !important;
}

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

.ui.pagination.menu .item {
  background: rgba(255, 255, 255, 0.05) !important;
  color: var(--omni-text-secondary) !important;
  border: 1px solid var(--omni-glass-border) !important;
  border-radius: 8px !important;
  margin: 0 2px !important;
}

.ui.pagination.menu .active.item {
  background: linear-gradient(135deg, var(--omni-brand-blue), var(--omni-blue-600)) !important;
  color: white !important;
  border-color: var(--omni-blue-500) !important;
}

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

::-webkit-scrollbar-track {
  background: rgba(10, 14, 26, 0.3);
}

::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.1);
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.18);
}

/* Selection color */
::selection {
  background: rgba(218, 173, 130, 0.3);
  color: white;
}

/* Sign-in page special treatment */
.page-content.user.signin .ui.segment,
.page-content.user.signup .ui.segment {
  max-width: 420px;
  margin: 60px auto !important;
  padding: 40px !important;
  box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35), 0 0 80px rgba(30, 67, 102, 0.08) !important;
}

/* Dashboard: subtle gold shimmer on repo cards */
@keyframes glass-shimmer {
  0% { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

.repo-owner-name-list .item::before,
.flex-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(218, 173, 130, 0.15), rgba(90, 142, 195, 0.1), transparent);
  background-size: 200% 100%;
  animation: glass-shimmer 5s ease-in-out infinite;
}

/* Reduce motion for accessibility */
@media (prefers-reduced-motion: reduce) {
  body::after,
  .repo-owner-name-list .item::before,
  .flex-item::before {
    animation: none !important;
  }
}