/* ===== Grundlayout ===== */

html, body {
  min-height: 100%;
}

body {
  background-color: #070a10;

  background-image: url("img/body-bg.png");
  background-repeat: repeat;
  background-size: 1800x auto;
  background-position: center;

  color: #e6d8a3;
  font-family: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;

  background: linear-gradient(
    to bottom,
    rgba(0,0,0,0.35),
    rgba(0,0,0,0.55)
  );

  z-index: 0;
}

body > * {
  position: relative;
  z-index: 1;
}

/* ===== Navbar ===== */

/* ===== Navbar (Banner Style) ===== */
.navbar {
  position: relative;
  z-index: 2000;
  background-image: url("img/navbar-leather.jpg");
  background-repeat: repeat;
  background-size: 512px auto; /* Größe der Textur-Kachel */
  background-position: center;

  border-bottom: 2px solid #c89b3c;
  min-height: 92px;
  padding-top: 10px;
  padding-bottom: 10px;
}


.navbar::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 10, 0.35);
  pointer-events: none;
}

.navbar .container {
  position: relative; /* damit Inhalte über Overlay liegen */
  z-index: 1;
}

.navbar-logo {
  height: 58px;
  width: auto;
  filter: drop-shadow(0 0 10px rgba(0,0,0,0.7));
}

.navbar-title {
  font-family: "IM Fell English", serif;
  font-weight: 400;
  font-size: 40px;
  letter-spacing: 1px;
  color: #f0c75e;
  text-transform: none;
}


.navbar-brand {
    font-family: "Cinzel", serif;
    font-weight: bold;
    color: #f0c75e !important;
    letter-spacing: 1px;
}

.nav-link, .navbar-text {
    color: #e6d8a3 !important;
}

.navbar-text {
  line-height: 1.5;
  font-family: 'Cinzel', serif;
}

.navbar-user-role {
  font-weight: 500;
  color: #cfcfcf;
  font-size: 0.9rem;
}

/* ==============================
   Navbar: Klick-Cursor erzwingen
   ============================== */

.navbar .nav-link,
.navbar .dropdown-toggle,
.navbar .dropdown-item {
  cursor: pointer;
}

/* ==============================
   Navbar Icons
   ============================== */

/* ==============================
   Navbar Icons – korrekt links neben Text
   ============================== */

.navbar .nav-icon {
  position: relative;
  padding-left: 36px;              /* echter Platz für Icon */
  display: inline-flex;
  align-items: center;
}

/* Icon selbst */
.navbar .nav-icon::before {
  content: "";
  position: absolute;
  left: -13px;                      /* Abstand zum linken Rand */
  top: 50%;
  transform: translateY(-50%);     /* vertikal zentriert */

  width: 18px;
  height: 18px;

  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;

  pointer-events: none;            /* Klick geht auf Link */
  filter: drop-shadow(0 0 4px rgba(0,0,0,0.7));
}

.rules-text {
  white-space: pre-wrap;
  font-family: "Inter", serif;
  font-size: 1rem;
  line-height: 1.6;
  color: #e6e0c8;
}

.ui-icon {
  width: 1.1rem;
  height: 1.1rem;
  vertical-align: middle;
  object-fit: contain;
}

.ui-icon-title {
  width: 2.5rem;
  height: 2.5rem;
  object-fit: contain;
}

.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
}
/* ⚔️ Raidübersicht */
.navbar .raid-icon::before {
  background-image: url("/static/img/nav/raid.png");
}

.navbar .rules-icon::before {
  background-image: url("/static/img/nav/regeln.png");
}

.navbar .news-icon::before {
  background-image: url("/static/img/nav/news.png");
}

.navbar .stats-icon::before {
  background-image: url("/static/img/nav/stats.png");
}

/* 🛠️ Admin */
.navbar .admin-icon::before {
  background-image: url("/static/img/nav/admin.png");
}

/* 👤 User */
.navbar .user-icon::before {
  background-image: url("/static/img/nav/user.png");
}

.navbar .nav-link:hover::before {
  filter:
    drop-shadow(0 0 6px rgba(240,199,94,0.8))
    brightness(1.1);
}
/* ==============================
   Navbar Dropdown Trigger (Admin / User)
   ============================== */

.navbar .nav-link.dropdown-toggle {
  color: #e6d8a3 !important;   /* gleich wie Raidübersicht */
  font-weight: 600;
}

.navbar .nav-link.dropdown-toggle:hover,
.navbar .nav-item.show > .nav-link.dropdown-toggle {
  color: #f0c75e !important;   /* aktives WoW-Gold */
}

/* ==============================
   Dropdown Menü – WoW Dark Style
   ============================== */

.dropdown-menu {
  background-color: #1c1c1c;   /* dunkles Anthrazit */
  border: 1px solid #3a3a3a;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.6);
  z-index: 1050;
}

.dropdown-item {
  color: #e0c070; /* WoW-Gold, wie Navbar-Texte */
  font-weight: 500;
}

.dropdown-item:hover,
.dropdown-item:focus {
  background-color: #2a2a2a;
  color: #ffd966;
}

.dropdown-item.active {
  background-color: #3a2f14;
  color: #ffd966;
}

.dropdown-header {
  color: #a0a0a0;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.dropdown-divider {
  border-top: 1px solid #3a3a3a;
}

.char-name {
  font-weight: 600;
  letter-spacing: 0.2px;
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.4);
}

.char-icons {
  display: flex;
  align-items: center;
  gap: 6px;
}

.spec-icon {
  width: 20px;
  height: 20px;
  border-radius: 3px;
  box-shadow: 0 0 4px rgba(0, 0, 0, 0.6);
}
/* ===== Cards ===== */

.card {
  background: linear-gradient(
    180deg,
    rgba(20, 25, 32, 1),
    rgba(15, 18, 24, 1)
  );
  border: 1px solid #caa34d;
  box-shadow: 0 0 20px rgba(0,0,0,0.8);
}

.card-title {
    color: #f0c75e;
}

/* ==============================
   Admin Box – leichte Abhebung
   ============================== */

.admin-box {
  border-color: #caa44a;
}

.admin-box .btn {
  letter-spacing: 0.3px;
}
/* ===== Buttons ===== */

.btn-primary {
    background: linear-gradient(to bottom, #c89b3c, #8b6a2b);
    border: 1px solid #f0c75e;
    color: #1b1b1b;
    font-weight: bold;
}

.btn-primary:hover {
    background: linear-gradient(to bottom, #e6c36a, #a07b2f);
    color: #000;
}

.btn-success {
    background: linear-gradient(to bottom, #3fa34d, #246b30);
    border: 1px solid #8aff8a;
}

.btn-outline-primary {
    border-color: #c89b3c;
    color: #f0c75e;
}

/* ===== Forms ===== */

.form-control {
    background-color: #0f1219;
    border: 1px solid #c89b3c;
    color: #e6d8a3;
}

.form-control:focus {
    background-color: #121622;
    border-color: #f0c75e;
    box-shadow: 0 0 5px rgba(240,199,94,0.8);
    color: #fff;
}

/* ===== Lists ===== */

.list-group-item {
    background-color: #0f1219;
    border: 1px solid #c89b3c;
    color: #e6d8a3;
}

/* ===== TEXT KONTRAST FIX ===== */

h1, h2, h3, h4, h5 {
    color: #f5e6b3; /* helles WoW-Gold */
}

p, label, li {
    color: #e6e1c3;
}

.card-body {
    color: #e6e1c3;
}

/* Formular Labels explizit heller */
.form-label {
    color: #f0e6c8;
    font-weight: 600;
}

/* Placeholder Text */
.form-control::placeholder {
    color: #9f9f9f;
}

/* Alerts besser lesbar */
.alert {
    color: #1b1b1b;
    background-color: #e6c36a;
    border: 1px solid #c89b3c;
}

.text-gold {
  color: #f5c97a;
  text-shadow: 0 0 6px rgba(245, 201, 122, 0.4);
}

.text-muted-light {
  color: #cfcfcf;
  opacity: 0.85;
}

.prio-empty {
  color: #e0e0e0;
  font-style: italic;
  background-color: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 215, 0, 0.3);
}

/* Allgemeines Styling für Prio-Header */
.prio-header {
  font-family: 'Cinzel', serif;
  font-size: 1.1rem;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  background: transparent;
  border-bottom: 1px solid rgba(255, 215, 100, 0.3);
}

/* Prio 1 – Gold */
.prio-1 {
  color: #f5c97a;
  text-shadow: 0 0 6px rgba(245, 201, 122, 0.6);
}

/* Prio 2 – Blau */
.prio-2 {
  color: #9fd3ff;
  text-shadow: 0 0 6px rgba(159, 211, 255, 0.5);
}

/* Prio 3 – Silber */
.prio-3 {
  color: #d0d0d0;
  text-shadow: 0 0 4px rgba(208, 208, 208, 0.4);
}

/* Container der Items */
.item-container {
  display: flex;
  flex-direction: column;
  align-items: stretch; /* volle Spaltenbreite */
  gap: 8px;
}

/* Einzelnes Item */
.prio-item {
  width: 100%;                 /* GANZE Spaltenbreite */
  text-align: center;          /* Text zentriert */
  padding: 10px 12px;

  border: 1px solid #caa14a;
  border-radius: 6px;

  background: linear-gradient(
    to bottom,
    rgba(25, 28, 35, 0.95),
    rgba(15, 18, 24, 0.95)
  );

  color: #f5c97a;
  font-family: 'Cinzel', serif;
  font-size: 0.95rem;
  letter-spacing: 0.4px;

  box-shadow:
    inset 0 0 10px rgba(0,0,0,0.6),
    0 0 6px rgba(202,161,74,0.25);

  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

/* Hover-Effekt */
.prio-item:hover {
  background: rgba(35, 40, 50, 0.95);
  box-shadow:
    inset 0 0 12px rgba(0,0,0,0.7),
    0 0 10px rgba(245,201,122,0.45);
  transform: translateY(-1px);
}

/* Aktives (ausgewähltes) Item */
.prio-item.active {
  border-color: #2ecc71; /* Grün */
  box-shadow: 0 0 10px rgba(46, 204, 113, 0.8);
  background: rgba(46, 204, 113, 0.08);
}

.alert-success {
  background: rgba(40, 70, 40, 0.9);
  border-color: #4caf50;
  color: #e6ffe6;
}

.alert-danger {
  background: rgba(80, 30, 30, 0.9);
  border-color: #e74c3c;
  color: #ffe6e6;
}

.alert-warning {
  background: rgba(80, 65, 30, 0.9);
  border-color: #f1c40f;
  color: #fff9e0;
}

.class-btn,
.spec-btn {
  display: flex;
  align-items: center;
  gap: 6px;
}

.class-btn.active,
.spec-btn.active {
  border-color: #ffd36a;
  box-shadow: 0 0 10px rgba(255,211,106,0.6);
}

/* Einheitlicher Button für Klasse & Spec */
.wow-choice-btn {
  background: rgba(30, 35, 40, 0.9);
  border: 1px solid rgba(255, 215, 0, 0.25);
  color: #f5e6b3;
  padding: 12px 16px;
  border-radius: 10px;
  text-align: left;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.1rem;
  width: 100%;
  transition: all 0.2s ease-in-out;
}

.wow-choice-btn img {
  width: 28px;
  height: 28px;
}

.wow-choice-btn:hover {
  background: rgba(50, 60, 70, 0.95);
  border-color: rgba(255, 215, 0, 0.6);
}

.wow-choice-btn.active {
  background: linear-gradient(180deg, #3fa34d, #2e7d32);
  border-color: #7dff9a;
  color: #ffffff;
}

.wow-readonly {
  background: linear-gradient(180deg, #1b2330, #111827);
  color: #f1e6b2;
  border: 1px solid #bfa34a;
  font-family: 'Cinzel', serif;
  letter-spacing: 0.5px;
}

.char-class {
  color: #e6c97a;
  font-weight: 600;
}

.char-spec {
  color: #9fd3ff;
  font-style: italic;
}

.char-meta {
  display: flex;
  align-items: center;
  gap: 6px;
}

.char-icon {
  width: 20px;
  height: 20px;
  border-radius: 3px;
}

.navbar .nav-link {
  font-weight: 500;
}


.app-menu {
  min-width: 260px;
  background: #1f2326;
  border: 1px solid #111;
  box-shadow: 0 8px 30px rgba(0,0,0,.6);
}

.app-menu .dropdown-header {
  color: #caa45a;
  font-size: 0.8rem;
  text-transform: uppercase;
}

.app-menu .dropdown-item {
  color: #ddd;
  border-radius: 6px;
}

.app-menu .dropdown-item:hover {
  background: #2b2f33;
  color: #fff;
}

.raid-live {
  background: linear-gradient(135deg, #1f6b2a, #2e8b57);
  color: #fff !important;
  border-radius: 8px;
  font-weight: bold;
}

.raid-live:hover {
  background: linear-gradient(135deg, #2e8b57, #3cb371);
  color: #fff !important;
}

/* === GLOBAL HEADLINE FONT (WoW-Style) === */
.navbar-brand,
.section-header,
.raid-title,
h1, h2, h3, h4, h5 {
  font-family: "Cinzel", serif !important;
  letter-spacing: 0.8px;
}


.raid-subtitle {
  color: #c9c9c9;
  font-size: 0.95rem;
}

.navbar-user {
    font-weight: 600;
    color: #f0c75e;
}

.navbar-user-role {
    font-weight: 500;
    color: #cfcfcf;
    font-size: 0.9rem;
}


.card {
  background: linear-gradient(
    180deg,
    rgba(20, 25, 32, 0.95),
    rgba(15, 18, 24, 0.95)
  );
  border: 1px solid #caa34d;
}

.card-header {
  background: rgba(0, 0, 0, 0.25);
  color: #f5d88c;
  font-weight: 700;
}

.card-body {
  color: #e6e6e6;
}

/* Spieler-Einträge */
.player-entry {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(202, 163, 77, 0.5);
  color: #f1f1f1;
}

.player-entry:hover {
  background: rgba(202, 163, 77, 0.15);
  cursor: pointer;
}

.text-gold {
  color: #e6c97a;
}

.wow-card {
  background: radial-gradient(circle at top, #1e2430, #0f131a);
  border: 1px solid #caa24a;
}

.wow-card-header {
  background: linear-gradient(to right, #2a2f3a, #1b1f27);
  color: #e6c97a;
  font-weight: 600;
}

.roster-entry,
.signup-entry {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 10px;
  margin-bottom: 6px;
  border-radius: 6px;
  border: 1px solid #3a3f4b;
  background: #151a22;
  color: #f1f1f1;
  cursor: pointer;
}

.roster-entry:hover,
.signup-entry:hover {
  background: #1f2530;
}

.spec-icon {
  width: 26px;
  height: 26px;
}

.roster-name,
.signup-name {
  font-weight: 500;
}

.signup-status {
  font-size: 0.75rem;
  opacity: 0.85;
}

.signup-status.confirmed { color: #4caf50; }
.signup-status.tentative { color: #ffca28; }
.signup-status.bench     { color: #9e9e9e; }
.signup-status.absent    { color: #ef5350; }

.selectable.selected {
  outline: 2px solid #caa24a;
}

.spec-icon {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.spec-icon.placeholder {
  width: 28px;
  height: 28px;
  background: rgba(255,255,255,0.15);
  border-radius: 4px;
}

.signup-card {
  width: 100%;
  display: flex;
  align-items: center;
}

.empty-slot {
  opacity: 0.4;
  text-align: center;
  font-style: italic;
  min-height: 41px;
}

.role-icon {
  width: 20px;
  height: 20px;
  object-fit: contain;
  filter: drop-shadow(0 0 2px rgba(0,0,0,.6));
}

.signup-countdown {
  display: inline-flex;
  align-items: center;
  line-height: 1;
  color: #f5d76e;               /* warmes Gold */
  font-weight: 600;
  letter-spacing: 0.03em;
  text-shadow: 0 0 6px rgba(245, 215, 110, 0.35);
  white-space: nowrap;
}

/* Wenn Deadline fast erreicht */
.signup-countdown.warning {
  color: #ff9f43;               /* Orange */
  text-shadow: 0 0 6px rgba(255, 159, 67, 0.5);
}

/* Wenn Deadline abgelaufen */
.signup-countdown.expired {
  color: #ff6b6b;               /* Rot */
  text-shadow: 0 0 6px rgba(255, 107, 107, 0.6);
}

.prio-item.active {
  cursor: not-allowed;
}

.wow-item-link {
  text-decoration: none;
  font-weight: 500;
}

.wow-item-link:hover {
  text-decoration: underline;
}

.wow-item-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}

.wow-item-link:hover {
  text-decoration: underline;
}

.wow-item-icon {
  width: 24px;
  height: 24px;
  border-radius: 4px;
  border: 1px solid #444;
}

/* WoWHead Auto-Icons – Größe erzwingen */
.iconmedium {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px;
  min-height: 32px;

  background-size: contain !important;
  background-repeat: no-repeat;
  background-position: center;
}

/* Abstand zum Text */
.iconmedium + a {
  margin-left: 8px;
}


.wow-item-link {
  text-decoration: none;
  font-weight: 500;
}

.wow-item-link:hover {
  text-decoration: underline;
}

/* === WoWHead Auto-Icons (echtes Element!) === */
.wow-item-link .wh-icon {
  width: 32px !important;
  height: 32px !important;

  min-width: 32px;
  min-height: 32px;

  background-size: contain !important;
  background-repeat: no-repeat;
  background-position: center;

  display: inline-block;
  vertical-align: middle;
}

/* Abstand zwischen Icon und Text */
.wow-item-link .wh-icon + span,
.wow-item-link .wh-icon + a,
.wow-item-link .wh-icon {
  margin-right: 8px;
}
.wh-icon {
  transform: scale(1.4);
  transform-origin: left center;
}

/* WoWHead Rarity-Farben NICHT überschreiben */
.wow-item-link .q1,
.wow-item-link .q2,
.wow-item-link .q3,
.wow-item-link .q4,
.wow-item-link .q5,
.wow-item-link .q6 {
  color: inherit;
}

/* Loot-Typ Anzeige (Import Preview & später global) */
.loot-type {
    color: #d8cfa3;              /* warmes WoW-Gold, gut lesbar */
    font-size: 0.9rem;           /* etwas kleiner als Name */
    font-weight: 500;
    letter-spacing: 0.03em;
    text-shadow: 0 0 4px rgba(0,0,0,0.6);
    white-space: nowrap;
}

.loot-table td,
.loot-table th {
  vertical-align: middle;
}

.loot-type {
  white-space: nowrap;
  color: #e6d9a3; /* besser lesbar als muted */
}

.loot-table .btn,
.loot-table .form-check-input {
  margin: 0 auto;
  display: block;
}

.patch-inactive {
  color: #b9b9b9;        /* hell, aber klar lesbar */
  font-style: italic;
  letter-spacing: 0.03em;
}

.prio-item {
  display: flex;
  flex-direction: column;
  justify-content: center;

  min-height: 64px;              /* 👈 Einheitliche Höhe */
  padding: 10px 12px;
  margin-bottom: 8px;

  border: 1px solid rgba(212, 175, 55, 0.6);
  border-radius: 6px;

  background: linear-gradient(
    180deg,
    rgba(20, 25, 30, 0.9),
    rgba(10, 12, 15, 0.9)
  );

  cursor: pointer;
  transition: all 0.15s ease-in-out;
}

.prio-item:hover {
  border-color: #f0c75e;
  background: rgba(30, 40, 50, 0.9);
}

.prio-item.active {
  border-color: #4cff9a;
  box-shadow: 0 0 10px rgba(76, 255, 154, 0.4);
}

.prio-item-name {
  font-size: 0.95rem;
  line-height: 1.2;
}

.prio-item-type {
  margin-top: 4px;

  font-size: 0.75rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;

  color: rgba(220, 220, 220, 0.7);   /* 👈 deutlich besser lesbar */
}

.prio-wow-link {
  cursor: help; /* Tooltip-Hinweis */
  text-decoration: none;
}

.prio-wow-link:active {
  pointer-events: none;
}

.prio-summary-empty {
  color: #c9b26a;           /* warmes Gold, gut lesbar */
  opacity: 0.8;
  font-style: italic;
}

.raid-panel-items .item-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.raid-panel-items .prio-item {
  padding: 10px 12px;
  border-radius: 8px;
  cursor: pointer;
  border: 1px solid rgba(180,140,50,0.4);
  background: linear-gradient(
    180deg,
    rgba(20,20,20,0.85),
    rgba(10,10,10,0.85)
  );
}

.raid-panel-items .prio-item:hover {
  background: rgba(180,140,50,0.15);
}

.raid-panel-items .prio-item.active {
  background: rgba(180,140,50,0.25);
  outline: 1px solid #b48c32;
}

.raid-panel-items .prio-item-name a {
  font-weight: 600;
  text-decoration: none;
}

.raid-panel-items .prio-item-type {
  font-size: 0.85rem;
  opacity: 0.75;
  margin-top: 4px;
}

.loot-character-select {
  width: 280px;
  max-width: 100%;
}
.loot-assign-row {
  justify-content: flex-start;
}

.wow-card .char-icons img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.navbar .dropdown-menu {
  position: absolute;
  z-index: 2000 !important;
}

.btn-wow {
  background: linear-gradient(135deg, #1f232a, #2a2f38);
  border: 1px solid #c9aa71;
  color: #f5e6c8;
  font-weight: 500;
  padding: 0.5rem 1.25rem;
  transition: all 0.15s ease-in-out;
}

.btn-wow:hover {
  background: linear-gradient(135deg, #2a2f38, #343a45);
  color: #ffffff;
  border-color: #e0c78a;
}

.btn-wow:focus {
  box-shadow: 0 0 0 0.2rem rgba(201, 170, 113, 0.25);
}

#news-preview {
  border: 1px solid #c9aa71;
  background: radial-gradient(
    ellipse at top,
    rgba(255, 255, 255, 0.03),
    rgba(0, 0, 0, 0.6)
  );
}

.news-meta {
  font-size: 0.9rem;
  letter-spacing: 0.02em;
  color: #c9c9c9;
  opacity: 0.95;
}

.news-date {
  color: #bfbfbf;
}

.news-author {
  color: #e6c77d; /* leicht golden → WoW-Style */
  font-weight: 500;
}

.news-separator {
  margin: 0 0.4rem;
  color: #888;
}

/* ===== WoW Tabs ===== */

.nav-tabs {
  border-bottom: 1px solid rgba(255,215,0,0.3);
}

.nav-tabs .nav-link {
  background: rgba(0,0,0,0.55);
  color: #d8c27a;
  border: 1px solid rgba(255,215,0,0.25);
  border-bottom: none;
}

.nav-tabs .nav-link:hover {
  background: rgba(0,0,0,0.75);
  color: #ffd700;
}

.nav-tabs .nav-link.active {
  background: rgba(20,20,20,0.9);
  color: #ffd700;
  border-color: rgba(255,215,0,0.35);
}