:root {
  --accent: #c1121f !important;
  --accent-hover: #9d0b16 !important;
  --accent-soft: rgba(193, 18, 31, .12) !important;
  --dark-800: #43070d !important;
  --dark-700: #7f101a !important;
  --bg-page: #f7f5f5 !important;
  --surface-soft: #fdf0f1 !important;
  --border: #eadbdd !important;
  --shadow-sm: 0 4px 14px rgba(67, 7, 13, .06) !important;
  --shadow-md: 0 12px 34px rgba(67, 7, 13, .12) !important;
}

body {
  min-height: 100vh;
  background:
    radial-gradient(circle at 100% 0, rgba(193, 18, 31, .08), transparent 28rem),
    var(--bg-page);
}

.navbar.navbar-dark {
  background: linear-gradient(120deg, #43070d 0%, #8d101c 55%, #c1121f 100%) !important;
}

.navbar-brand {
  letter-spacing: .02em;
}

.navbar .nav-link {
  border-radius: .65rem;
  padding-inline: .75rem !important;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus-visible {
  background: rgba(255, 255, 255, .1);
}

#legend,
.zona,
.card,
section > .container,
section > .container-fluid {
  border-color: var(--border);
  box-shadow: var(--shadow-sm);
}

#legend h1,
#legend h2,
#legend legend {
  color: #43070d;
  font-weight: 700;
}

.btn-primary,
.btn-ssm {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-ssm:hover,
.btn-ssm:focus {
  background-color: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 .2rem var(--accent-soft);
}

.table-responsive {
  border: 1px solid var(--border);
  border-radius: .9rem;
}

.table thead th,
.table-ssm thead th {
  background: #730d17 !important;
  color: #fff !important;
  white-space: nowrap;
}

a {
  text-underline-offset: .15em;
}

:focus-visible {
  outline: 3px solid rgba(193, 18, 31, .35);
  outline-offset: 2px;
}

@media (max-width: 767.98px) {
  body > * + * {
    margin-top: 14px;
  }

  .container,
  .container-fluid {
    padding-inline: 14px;
  }

  section {
    padding-block: 18px;
  }

  section > .container,
  section > .container-fluid {
    border-radius: 12px;
    padding: 16px;
  }

  .btn,
  .form-control,
  .form-select,
  .navbar-toggler {
    min-height: 44px;
  }

  .table-responsive {
    -webkit-overflow-scrolling: touch;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
    animation-duration: .01ms !important;
  }
}
