/* ═══════════════════════════════════════════════════════════
   RAPPORT Theme für Gitea
   Farben & Typografie identisch mit der Rapport App
═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300&family=Playfair+Display:wght@400;700&display=swap');

/* ─── CSS-Variablen ─────────────────────────────────────── */
:root {
  /* Primärfarbe: Gold/Amber — nur für Akzente, Links, aktive States */
  --color-primary:          #b07848;
  --color-primary-dark-1:   #9a6638;
  --color-primary-dark-2:   #85552a;
  --color-primary-dark-3:   #70451e;
  --color-primary-dark-4:   #5c3714;
  --color-primary-dark-5:   #4a2b0c;
  --color-primary-light-1:  #bf8a5e;
  --color-primary-light-2:  #cc9d76;
  --color-primary-light-3:  #d8b090;
  --color-primary-light-4:  #e4c4ac;
  --color-primary-light-5:  #f5ede4;
  --color-primary-alpha-30: rgba(176,120,72,0.30);
  --color-primary-alpha-40: rgba(176,120,72,0.40);
  --color-primary-alpha-60: rgba(176,120,72,0.60);
  --color-primary-alpha-80: rgba(176,120,72,0.80);

  /* Hintergründe — warmes Off-White wie Rapport */
  --color-body:             #f7f5f2;
  --color-box-body:         #ffffff;
  --color-nav-bg:           #1a1a18;
  --color-sidebar-bg:       #f0ede8;
  --color-card:             #ffffff;

  /* Text */
  --color-text:             #1a1a18;
  --color-text-dark:        #0e0e0c;
  --color-text-light-1:     #3a3a34;
  --color-text-light-2:     #888880;
  --color-text-light-3:     #aaaaaa;

  /* Rahmen — warm, subtil */
  --color-secondary:        #e8e3dc;
  --color-secondary-dark-1: #d8d2ca;
  --color-secondary-dark-2: #c8c1b8;
  --color-secondary-dark-3: #b8b0a5;
  --color-secondary-dark-4: #a8a098;
  --color-secondary-dark-5: #98908a;
  --color-secondary-light-1: #eeebe6;
  --color-secondary-light-2: #f2efec;
  --color-secondary-light-3: #f5f3f0;
  --color-secondary-light-4: #f8f6f4;
  --color-secondary-light-5: #faf9f7;
  --color-secondary-alpha-30: rgba(232,227,220,0.30);
  --color-secondary-alpha-60: rgba(232,227,220,0.60);

  /* Formular */
  --color-input-background: #ffffff;
  --color-input-border:     #d8d2ca;

  /* Status-Farben */
  --color-green:            #2d6a4f;
  --color-green-dark-1:     #245840;
  --color-green-light-1:    #3d8a65;
  --color-green-light-2:    #e8f5ee;
  --color-red:              #8a1a1a;
  --color-red-dark-1:       #721414;
  --color-red-light-1:      #a02020;
  --color-red-light-2:      #fdf0f0;
  --color-orange:           #b07848;
  --color-orange-light-1:   #cc9d76;
  --color-orange-light-2:   #fff3e8;
  --color-yellow:           #9a7a00;
  --color-yellow-light-2:   #fffbe6;
  --color-blue:             #1a4e8a;
  --color-blue-light-1:     #2a6ab0;
  --color-blue-light-2:     #e8f0f8;

  /* Schatten */
  --shadow-1: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
  --shadow-2: 0 2px 8px rgba(0,0,0,0.08), 0 1px 3px rgba(0,0,0,0.05);
  --shadow-3: 0 4px 16px rgba(0,0,0,0.10), 0 2px 6px rgba(0,0,0,0.06);

  --border-radius:    6px;
  --border-radius-sm: 4px;
  --border-radius-lg: 10px;
}

/* ─── Typografie ────────────────────────────────────────── */
body,
.ui,
input, select, textarea, button {
  font-family: 'DM Mono', 'Courier New', monospace !important;
  font-size: 13px;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5 {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-weight: 400;
  letter-spacing: -0.01em;
}

/* Beschriftungen / Labels uppercase wie in Rapport */
.ui.label,
.ui.header .sub.header,
th, .th,
.text.meta {
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  font-family: 'DM Mono', monospace !important;
}

/* ─── Navbar ────────────────────────────────────────────── */
.navbar,
#navbar,
.ui.attached.header {
  background: #1a1a18 !important;
  border-bottom: 1px solid #2d2d28 !important;
  box-shadow: 0 2px 12px rgba(0,0,0,0.22) !important;
}

.navbar *,
#navbar * {
  font-family: 'DM Mono', monospace !important;
}

.navbar .item,
#navbar .item {
  color: #888880 !important;
  font-size: 11px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  transition: color 0.15s !important;
}

.navbar .item:hover,
#navbar .item:hover {
  color: #f0ede8 !important;
  background: rgba(255,255,255,0.06) !important;
}

.navbar .item.active,
#navbar .item.active {
  color: #f0ede8 !important;
}

/* ─── Logo / Sitename — identisch mit RAPPORT ───────────── */
.navbar .brand,
#navbar .brand,
.home .hero h1,
.site-name,
a.item.brand {
  font-family: 'Archivo Black', 'Krungthep', sans-serif !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  letter-spacing: -0.02em !important;
  color: #f0ede8 !important;
  text-transform: uppercase !important;
  line-height: 1 !important;
}

/* Gitea-Oktokater-Logo neben dem Namen ausblenden, nur Text */
.navbar .brand svg,
#navbar .brand svg,
.navbar .brand img,
#navbar .brand img {
  display: none !important;
}

/* ─── Seitenleiste ──────────────────────────────────────── */
.repository .sidebar,
.ui.attached.segment.sidebar {
  background: #f0ede8 !important;
  border-right: 1px solid #e8e3dc !important;
}

/* ─── Allgemeiner Hintergrund ───────────────────────────── */
body {
  background: #f7f5f2 !important;
}

/* ─── Cards / Segmente ──────────────────────────────────── */
.ui.segment,
.ui.segments > .segment,
.ui.card,
.ui.cards > .card,
.ui.attached.segment {
  border: 1px solid #e8e3dc !important;
  border-radius: var(--border-radius-lg) !important;
  box-shadow: var(--shadow-1) !important;
  background: #ffffff !important;
}

/* ─── Buttons — Rapport-Philosophie ────────────────────── */
/* Basis */
.ui.button,
.ui.buttons .button {
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.05em !important;
  font-weight: 600 !important;
  border-radius: 20px !important;
  transition: all 0.15s !important;
  text-transform: uppercase !important;
}

/* Primary = DUNKEL (wie btn-primary in Rapport) */
.ui.primary.button,
.ui.primary.buttons .button,
.ui.button.primary {
  background: #1a1a18 !important;
  color: #f0ede8 !important;
  border: none !important;
  box-shadow: none !important;
}

.ui.primary.button:hover,
.ui.primary.buttons .button:hover {
  background: #2d2d28 !important;
  color: #ffffff !important;
}

/* Ghost / Basic = umrandet, transparent — Gold nur beim Hover */
.ui.basic.button,
.ui.basic.buttons .button,
.ui.button.basic {
  background: transparent !important;
  border: 1.5px solid #d8d2ca !important;
  color: #555550 !important;
  box-shadow: none !important;
}

.ui.basic.button:hover,
.ui.basic.buttons .button:hover {
  border-color: #b07848 !important;
  color: #b07848 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Sekundär */
.ui.secondary.button,
.ui.secondary.buttons .button {
  background: transparent !important;
  color: #888880 !important;
  border: 1.5px solid #e8e3dc !important;
  box-shadow: none !important;
}

.ui.secondary.button:hover {
  border-color: #b07848 !important;
  color: #b07848 !important;
  background: transparent !important;
}

/* Danger / Red */
.ui.red.button,
.ui.negative.button {
  background: #8a1a1a !important;
  color: #fff !important;
  border: none !important;
}

.ui.red.button:hover,
.ui.negative.button:hover {
  background: #721414 !important;
}

/* Green */
.ui.green.button,
.ui.positive.button {
  background: #2d6a4f !important;
  color: #fff !important;
  border: none !important;
}

/* Aktiver Zustand: Gold-Umrandung */
.ui.button.active,
.ui.buttons .button.active {
  border: 1.5px solid #b07848 !important;
  color: #b07848 !important;
  background: transparent !important;
}

/* ─── Inputs ────────────────────────────────────────────── */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
textarea,
select,
.ui.input > input,
.ui.form input,
.ui.form textarea,
.ui.form select {
  font-family: 'DM Mono', monospace !important;
  font-size: 13px !important;
  border-radius: var(--border-radius) !important;
  border: 1.5px solid #d8d2ca !important;
  background: #ffffff !important;
  color: #1a1a18 !important;
  transition: border-color 0.15s !important;
  box-shadow: none !important;
}

input:focus,
textarea:focus,
select:focus,
.ui.input > input:focus {
  border-color: #b07848 !important;
  box-shadow: 0 0 0 2px rgba(176,120,72,0.12) !important;
  outline: none !important;
}

/* ─── Links ─────────────────────────────────────────────── */
a {
  color: #b07848 !important;
  transition: color 0.12s !important;
}

a:hover {
  color: #9a6638 !important;
}

/* Navbar-Links nicht gold */
.navbar a,
#navbar a {
  color: #888880 !important;
}

.navbar a:hover,
#navbar a:hover {
  color: #f0ede8 !important;
}

/* ─── Tabs / Navigation ─────────────────────────────────── */
.ui.tabular.menu .item {
  font-family: 'DM Mono', monospace !important;
  font-size: 11px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: #888880 !important;
  border-radius: 0 !important;
}

.ui.tabular.menu .active.item {
  color: #1a1a18 !important;
  border-bottom: 2px solid #b07848 !important;
  font-weight: 600 !important;
  background: transparent !important;
}

.ui.tabular.menu .item:hover {
  color: #1a1a18 !important;
  background: #f0ede8 !important;
}

/* ─── Tabellen ──────────────────────────────────────────── */
.ui.table {
  font-family: 'DM Mono', monospace !important;
  border: 1px solid #e8e3dc !important;
  border-radius: var(--border-radius-lg) !important;
  overflow: hidden !important;
  box-shadow: var(--shadow-1) !important;
}

.ui.table thead th {
  background: #f7f5f2 !important;
  color: #aaaaaa !important;
  font-size: 10px !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  border-bottom: 1px solid #e8e3dc !important;
  padding: 10px 16px !important;
}

.ui.table tbody tr:hover td {
  background: #faf8f5 !important;
}

.ui.table td {
  border-bottom: 1px solid #f0ede8 !important;
  padding: 10px 16px !important;
  font-size: 13px !important;
}

/* ─── Labels / Badges ───────────────────────────────────── */
.ui.label {
  border-radius: 20px !important;
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  font-weight: 600 !important;
  padding: 3px 10px !important;
  font-family: 'DM Mono', monospace !important;
}

.ui.primary.label {
  background: #b07848 !important;
  color: #fff !important;
  border-color: #b07848 !important;
}

.ui.green.label { background: #e8f5ee !important; color: #2d6a4f !important; border-color: #a8d8b8 !important; }
.ui.red.label   { background: #fdf0f0 !important; color: #8a1a1a !important; border-color: #e0b0b0 !important; }
.ui.yellow.label,
.ui.orange.label { background: #fff3e8 !important; color: #b07848 !important; border-color: #e8c898 !important; }

/* ─── Meldungen ─────────────────────────────────────────── */
.ui.positive.message,
.ui.success.message {
  background: #e8f5ee !important;
  border-color: #a8d8b8 !important;
  color: #2d6a4f !important;
  border-radius: var(--border-radius) !important;
}

.ui.negative.message,
.ui.error.message {
  background: #fdf0f0 !important;
  border-color: #e0b0b0 !important;
  color: #8a1a1a !important;
  border-radius: var(--border-radius) !important;
}

.ui.info.message,
.ui.warning.message {
  background: #fff3e8 !important;
  border-color: #e8c898 !important;
  color: #7a5028 !important;
  border-radius: var(--border-radius) !important;
}

/* ─── Code ──────────────────────────────────────────────── */
code, pre, .code-view {
  font-family: 'DM Mono', 'Courier New', monospace !important;
  font-size: 12px !important;
  background: #f0ede8 !important;
  border: 1px solid #e8e3dc !important;
  border-radius: var(--border-radius-sm) !important;
}

/* ─── Diff ──────────────────────────────────────────────── */
.diff-file-header {
  background: #f0ede8 !important;
  border: 1px solid #e8e3dc !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 12px !important;
}

/* ─── Footer ────────────────────────────────────────────── */
#footer {
  background: #1a1a18 !important;
  border-top: 1px solid #2d2d28 !important;
  color: #3a3a34 !important;
  font-family: 'DM Mono', monospace !important;
  font-size: 10px !important;
  letter-spacing: 0.06em !important;
}

#footer a {
  color: #555550 !important;
}

#footer a:hover {
  color: #888880 !important;
}