/* NSR – SimGrid-inspireret design
   Kasser med rød→røg→hvid metallic kanter, carbon baggrund
   Mobil-optimeret: touch targets, responsiv container */

/* Scroll-padding så anchor-links ikke skjules under fixed header */
html { scroll-padding-top: 4rem; }
@media (max-width: 1023px) {
  html { scroll-padding-top: 2.75rem; }
}

/* Mobil: fuld bredde med padding. Desktop: 90% */
.nsr-container {
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
  box-sizing: border-box;
}
@media (min-width: 640px) {
  .nsr-container {
    width: 90%;
    max-width: 90vw;
  }
}

/* Logo helt til venstre, login/bruger helt til højre i top menu – fuld bredde */
header nav.nsr-container {
  width: 100%;
  max-width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

:root {
  --nsr-bg: #0d0d0d;
  --nsr-bg-card: #161616;
  --nsr-bg-card-hover: #1a1a1a;
  --nsr-border: rgba(255, 255, 255, 0.08);
  --nsr-text: #ffffff;
  --nsr-text-muted: rgba(255, 255, 255, 0.7);
  --nsr-text-dim: rgba(255, 255, 255, 0.5);
  --nsr-accent: #c41e3a;
  --nsr-accent-hover: #b91c1c;
  --nsr-border-gradient: linear-gradient(135deg, #c41e3a 0%, #a01830 25%, rgba(140, 140, 160, 0.7) 50%, rgba(200, 200, 220, 0.9) 75%, rgba(255, 255, 255, 0.95) 100%);
}

/* Baggrund – sort med carbon tekstur */
.bg-carbon,
.bg-nsr {
  background-color: #0d0d0d;
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, 0.5) 2px,
      rgba(0, 0, 0, 0.5) 4px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 2px,
      rgba(0, 0, 0, 0.4) 2px,
      rgba(0, 0, 0, 0.4) 4px
    ),
    linear-gradient(180deg, #0f0f0f 0%, #0a0a0a 100%);
}

/* Kort – carbon baggrund + rød kant med hvid skygge */
.bg-carbon-card,
.nsr-box,
.nsr-panel,
.nsr-card {
  background-color: #161616;
  background-image:
    repeating-linear-gradient(
      -45deg,
      transparent,
      transparent 3px,
      rgba(0, 0, 0, 0.35) 3px,
      rgba(0, 0, 0, 0.35) 6px
    ),
    linear-gradient(180deg, #1a1a1a 0%, #141414 100%);
  border: 2px solid #c41e3a;
  border-radius: 10px;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4), 0 0 16px rgba(255, 255, 255, 0.25);
  transition: box-shadow 0.2s, background-color 0.2s;
}
.bg-carbon-card:hover,
.nsr-box:hover,
.nsr-panel:hover,
.nsr-card:hover {
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5), 0 0 20px rgba(255, 255, 255, 0.3);
}

/* Ramme-varianter (samme som team-kører kort: 2px + carbon + glow). Bevar accent-farve. */
.bg-carbon-card.nsr-frame-accent-green {
  border-color: rgba(34, 197, 94, 0.85) !important;
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.35), 0 0 16px rgba(34, 197, 94, 0.18) !important;
}
.bg-carbon-card.nsr-frame-accent-green:hover {
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.45), 0 0 20px rgba(34, 197, 94, 0.22) !important;
}
/* Aktiv dagsorden (møde startet) – samme grøn som “Du deltager”-knap */
.bg-carbon-card.nsr-frame-dagsorden-aktiv {
  border: 2px solid #16a34a !important;
  box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.5), 0 0 18px rgba(22, 163, 74, 0.28) !important;
  background-image:
    repeating-linear-gradient(-45deg, transparent, transparent 3px, rgba(0, 0, 0, 0.35) 3px, rgba(0, 0, 0, 0.35) 6px),
    linear-gradient(180deg, rgba(20, 45, 28, 0.4) 0%, #141414 100%);
}
.bg-carbon-card.nsr-frame-dagsorden-aktiv:hover {
  box-shadow: 0 0 0 1px rgba(22, 163, 74, 0.55), 0 0 22px rgba(22, 163, 74, 0.32) !important;
}
.bg-carbon-card.nsr-frame-week-current {
  border-color: rgba(34, 197, 94, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(34, 197, 94, 0.4), 0 0 16px rgba(34, 197, 94, 0.2) !important;
  background-image:
    repeating-linear-gradient(-45deg, transparent, transparent 3px, rgba(0, 0, 0, 0.35) 3px, rgba(0, 0, 0, 0.35) 6px),
    linear-gradient(180deg, rgba(22, 40, 28, 0.35) 0%, #141414 100%);
}
.bg-carbon-card.nsr-frame-accent-gray {
  border-color: rgba(107, 114, 128, 0.75) !important;
  box-shadow: 0 0 0 1px rgba(156, 163, 175, 0.25), 0 0 14px rgba(100, 116, 139, 0.12) !important;
}
/* I gang – kalender (startet, ikke afsluttet) */
.bg-carbon-card.nsr-frame-accent-yellow {
  border-color: rgba(234, 179, 8, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(234, 179, 8, 0.35), 0 0 16px rgba(234, 179, 8, 0.2) !important;
}
.bg-carbon-card.nsr-frame-accent-yellow:hover {
  box-shadow: 0 0 0 1px rgba(250, 204, 21, 0.45), 0 0 20px rgba(234, 179, 8, 0.25) !important;
}
/* Arkiverede møder (dagsorden) – mørkegrå ramme */
.bg-carbon-card.nsr-frame-arkiv-moede {
  border: 2px solid #3f3f46 !important;
  box-shadow: 0 0 0 1px rgba(63, 63, 70, 0.55), 0 0 14px rgba(0, 0, 0, 0.4) !important;
}
.bg-carbon-card.nsr-frame-arkiv-moede:hover {
  box-shadow: 0 0 0 1px rgba(82, 82, 91, 0.45), 0 0 18px rgba(0, 0, 0, 0.45) !important;
}
.bg-carbon-card.nsr-frame-accent-red-soft {
  border-color: rgba(239, 68, 68, 0.55) !important;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, 0.28), 0 0 16px rgba(239, 68, 68, 0.12) !important;
}
.bg-carbon-card.nsr-frame-border-dark {
  border-color: #0a0a0a !important;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.06), 0 0 12px rgba(0, 0, 0, 0.5) !important;
}

/* Indhold inde i carbon-kort (som små felter på team-kører kort) */
.nsr-card-inset {
  border-radius: 0.5rem;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 0.75rem;
}

/* Kalender-sider: indre røde rammer inde i sektion – ingen hvid kant-glow (kun ydre kort beholder glow) */
.nsr-page-kalender .nsr-card-inset .bg-carbon-card,
.nsr-page-kalender .nsr-card-inset a.bg-carbon-card,
.nsr-page-kalender a.block.bg-carbon-card.rounded-lg {
  box-shadow: none !important;
}
.nsr-page-kalender .nsr-card-inset .bg-carbon-card:hover,
.nsr-page-kalender .nsr-card-inset a.bg-carbon-card:hover,
.nsr-page-kalender a.block.bg-carbon-card.rounded-lg:hover {
  box-shadow: none !important;
}

/* Primær knap – rød metallic */
.bg-nsr-red-metallic,
.btn-primary {
  background: linear-gradient(135deg, #e63946 0%, #c41e3a 40%, #b91c1c 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,150,150,0.25), 0 2px 8px rgba(196,30,58,0.3) !important;
}
.bg-nsr-red-metallic:hover,
.btn-primary:hover {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 40%, #b91c1c 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255,180,180,0.3), 0 4px 12px rgba(196,30,58,0.4) !important;
}

.border-nsr-red-metallic {
  border-color: var(--nsr-accent);
}
.text-nsr-red-metallic {
  color: #e63946;
  text-shadow: 0 0 8px rgba(196, 30, 58, 0.4);
}

/* Overskrifter – clean white */
.text-white-metallic {
  color: var(--nsr-text) !important;
  background: none !important;
  -webkit-text-fill-color: unset !important;
  filter: none !important;
}

/* Form inputs – carbon baggrund, subtil kant (undgå tung metallic på små felter) */
form input.bg-carbon-card,
form textarea.bg-carbon-card,
form select.bg-carbon-card {
  box-shadow: inset 0 0 0 1px rgba(196, 30, 58, 0.25);
}

/* Focus state */
.nsr-focus:focus {
  border-color: var(--nsr-accent) !important;
  outline: none !important;
  box-shadow: 0 0 0 1px var(--nsr-accent) !important;
}

/* Legacy support */
.bg-nsr-red-muted { background-color: rgba(196, 30, 58, 0.2); }
.border-nsr-red-muted { border-color: rgba(196, 30, 58, 0.3); }
.text-nsr-neon-red { color: var(--nsr-accent); text-shadow: none; }

/* Card hover – rød metallic skygge */
.card-hover-metallic:hover {
  box-shadow: 0 4px 20px rgba(196, 30, 58, 0.25);
}

/* Header/footer – metallic kant (rød → røg → hvid) */
.nsr-header-border {
  box-shadow: inset 0 -1px 0 rgba(196,30,58,0.3), inset 0 -2px 0 rgba(140,140,160,0.15), inset 0 -3px 0 rgba(255,255,255,0.08);
}
.nsr-footer-border {
  box-shadow: inset 0 1px 0 rgba(196,30,58,0.3), inset 0 2px 0 rgba(140,140,160,0.15), inset 0 3px 0 rgba(255,255,255,0.08);
}

/* Mobil: kompakt topmenu, hamburger + klik-åbn undermenuer */
@media (max-width: 1023px) {
  .nav-hamburger {
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
  }
  .nav-links { display: none !important; }
  .nav-links.open {
    display: flex !important;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: #0d0d0d;
    padding: 0.375rem 0.5rem 0.5rem;
    gap: 0.125rem;
    border-bottom: 1px solid var(--nsr-border);
    max-height: min(70vh, calc(100dvh - 2.75rem));
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .nav-links.open > a {
    font-size: 0.8125rem;
    min-height: 2.25rem;
    padding: 0.375rem 0.5rem;
    display: flex;
    align-items: center;
    -webkit-tap-highlight-color: transparent;
  }
  .nav-links.open .nav-dropdown {
    display: flex;
    flex-direction: column;
    align-items: stretch;
  }
  .nav-links.open .nav-dropdown-toggle {
    min-height: 2.25rem;
    padding: 0.375rem 0.5rem;
    font-size: 0.8125rem;
    display: flex;
    align-items: center;
    -webkit-tap-highlight-color: transparent;
  }
  .nav-links.open .nav-dropdown-panel {
    display: none !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    margin-top: 0.125rem;
    margin-bottom: 0.125rem;
    margin-left: 0.25rem;
    padding: 0.125rem 0;
    padding-left: 0.5rem;
    border-left: 2px solid rgba(196, 30, 58, 0.35);
    box-shadow: none !important;
    background: rgba(0, 0, 0, 0.25) !important;
    border-radius: 0.375rem;
    min-width: auto !important;
  }
  .nav-links.open .nav-dropdown.nav-dropdown-open .nav-dropdown-panel {
    display: block !important;
  }
  .nav-links.open .nav-dropdown-panel a {
    padding: 0.3125rem 0.5rem;
    min-height: 0;
    font-size: 0.75rem;
    display: flex;
    align-items: center;
  }
  .nav-links.open .nav-dropdown-open .nav-dropdown-chevron {
    transform: rotate(180deg);
  }
}
@media (min-width: 1024px) {
  .nav-hamburger { display: none !important; }
}

article img, .card-hover img { max-width: 100%; height: auto; }

/* Mobil: tabeller kan scrolles horisontalt */
@media (max-width: 639px) {
  .stat-scroll, .overflow-x-auto { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  table { min-width: 400px; }
}

/* Vælg filer knap – highlight ved hover */
.rr-file-input::file-selector-button {
  transition: background-color 0.2s, filter 0.2s;
}
.rr-file-input:hover::file-selector-button {
  background-color: #e0254a !important;
  filter: brightness(1.15);
}

/* Race report beskrivelse – ingen indrykning på første linje */
#reportContent {
  text-indent: 0 !important;
  padding-left: 0 !important;
  padding-inline-start: 0 !important;
  margin-left: 0 !important;
}
#reportContent::first-line {
  text-indent: 0 !important;
}

/* Blink animation – Åben for tilmelding (bruges i header på alle sider) */
@keyframes blink {
  0%, 50% { opacity: 1; }
  51%, 100% { opacity: 0.3; }
}
.animate-blink { animation: blink 1.5s ease-in-out infinite; }

/* iRacing Safety Rating license farver (matcher iRacing.com) */
.sr-rookie { color: #e63946; }   /* Rookie: rød */
.sr-d { color: #f77f00; }       /* D: orange */
.sr-c { color: #fcbf49; }       /* C: gul */
.sr-b { color: #2a9d8f; }       /* B: grøn */
.sr-a { color: #457b9d; }       /* A: blå */
.sr-p { color: #9b59b6; }       /* Pro: lilla */
.sr-lic-other { color: #94a3b8; } /* øvrige bogstaver fra iRacing */
.sr-sr-only { color: #cbd5e1; }   /* kun SR-tal – mangler licensbogstav fra API endnu */

/* Bekræftelses-modal – skjul uden Tailwind (hvis cdn.tailwindcss.com blokeres, virker ikke utility .hidden → overlay dækkede hele siden, fx admin-login) */
.nsr-confirm-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 10001;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.6);
}
.nsr-confirm-overlay.nsr-confirm-open {
  display: flex;
}