html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

body.admin-route {
  background: #0f0f10;
  color: #f3f3f3;
}

body.admin-route .container {
  max-width: 1300px;
}

body.admin-route .navbar,
body.admin-route .footer {
  background: #111 !important;
  border-color: #2d2d2d !important;
}

body.admin-route .footer {
  position: static;
  line-height: 1.6;
  padding: 0.8rem 0;
  margin-top: 1.25rem;
}

body.admin-route,
body.admin-route .text-muted,
body.admin-route .text-dark,
body.admin-route .nav-link,
body.admin-route .navbar-brand,
body.admin-route a {
  color: #f3f3f3 !important;
}

body.admin-route table {
  width: 100%;
  border-collapse: collapse;
  margin: 1rem 0;
  font-size: 0.92rem;
}

body.admin-route th,
body.admin-route td {
  border: 1px solid #2f2f2f;
  padding: 0.5rem 0.55rem;
  vertical-align: top;
}

body.admin-route thead th {
  background: #1a1a1a;
  font-weight: 600;
}

body.admin-route code {
  color: #8de7ff;
  white-space: normal;
}

body.admin-route dt {
  font-weight: 600;
  margin-top: 0.35rem;
}

body.admin-route dd {
  margin-left: 0;
  margin-bottom: 0.35rem;
}

body.admin-route input,
body.admin-route select,
body.admin-route textarea {
  background: #171717;
  color: #f3f3f3;
  border: 1px solid #3b3b3b;
  border-radius: 4px;
  padding: 0.45rem 0.55rem;
  width: 100%;
  max-width: 560px;
}

body.admin-route button {
  background: #222;
  color: #f3f3f3;
  border: 1px solid #444;
  border-radius: 4px;
  padding: 0.45rem 0.8rem;
}

body.admin-route form > div {
  margin-bottom: 0.75rem;
}

body.admin-route label {
  margin-bottom: 0.25rem;
}

.admin-filter-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1rem 0 0.6rem;
  align-items: flex-end;
}

.admin-filter-form > div {
  min-width: 180px;
  margin-bottom: 0;
}

.admin-filter-form button {
  height: 38px;
}

.inline-form {
  display: inline-block;
  margin: 0;
}

.admin-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 0.75rem;
  margin: 1rem 0;
}

.admin-card {
  background: #171717;
  border: 1px solid #343434;
  border-radius: 6px;
  padding: 0.7rem 0.8rem;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.admin-card span {
  font-size: 1.2rem;
  font-weight: 700;
}

.admin-quick-links {
  display: flex;
  gap: 0.8rem;
  flex-wrap: wrap;
}

.admin-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

@media (max-width: 1080px) {
  .admin-two-col {
    grid-template-columns: 1fr;
  }
}

.admin-warning {
  background: #2b2a14;
  border: 1px solid #5f5a1d;
  border-radius: 6px;
  padding: 0.75rem;
  margin: 0.8rem 0;
}

.admin-success {
  background: #17361f;
  border: 1px solid #2d6a3d;
  border-radius: 6px;
  padding: 0.55rem 0.7rem;
  margin: 0.7rem 0;
}

.admin-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0.8rem 0;
}

.admin-pager {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  align-items: center;
  margin: 0.75rem 0 1rem;
}

.status-badge {
  display: inline-block;
  border-radius: 999px;
  padding: 0.15rem 0.5rem;
  font-size: 0.8rem;
  border: 1px solid transparent;
  text-transform: lowercase;
}

.status-active {
  background: #17361f;
  border-color: #2d6a3d;
}

.status-suspended,
.status-inactive {
  background: #3f2f13;
  border-color: #8b6c2a;
}

.status-revoked,
.status-expired,
.status-deactivated {
  background: #431717;
  border-color: #8e3131;
}

.status-trial,
.status-grace {
  background: #143141;
  border-color: #2d657f;
}

body.admin-route {
  background-color: #000;
  color: #fff;
  margin-bottom: 0;
  min-height: 100vh;
}

body.admin-route header .navbar {
  background-color: #000 !important;
  border-bottom: 1px solid #333 !important;
}

body.admin-route .navbar-brand,
body.admin-route .nav-link,
body.admin-route .text-dark,
body.admin-route .text-muted,
body.admin-route footer a,
body.admin-route a {
  color: #fff !important;
}

body.admin-route footer {
  border-top: 1px solid #333 !important;
  color: #fff !important;
}

body.admin-route main {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

body.admin-route p,
body.admin-route h1,
body.admin-route h2,
body.admin-route h3,
body.admin-route h4,
body.admin-route h5,
body.admin-route h6 {
  text-align: center;
}

body.admin-route form {
  width: min(560px, 95vw);
  margin: 1rem auto;
}

body.admin-route form > div {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.9rem;
}

body.admin-route input:not([type="hidden"]),
body.admin-route select,
body.admin-route textarea {
  width: min(420px, 90vw);
  background-color: #111;
  color: #fff;
  border: 1px solid #555;
  padding: 0.45rem 0.6rem;
}

body.admin-route button {
  background-color: #111;
  color: #fff;
  border: 1px solid #777;
  padding: 0.45rem 0.85rem;
}

body.admin-route table {
  margin: 1rem auto;
  color: #fff;
  border-collapse: collapse;
}

body.admin-route th,
body.admin-route td {
  border: 1px solid #444;
  padding: 0.45rem 0.6rem;
  text-align: center;
}
