:root {
  --control-primary: #215a85;
  --control-secondary: #173d5b;
  --control-accent: #f4b942;
  --control-ink: #17212b;
  --control-bg: #f4f7fa;
  --control-radius: 1.25rem;
}
* {
  box-sizing: border-box;
}
body {
  background: var(--control-bg);
  color: var(--control-ink);
  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    "Segoe UI",
    sans-serif;
}
.control-header {
  background: #fff;
  border-bottom: 1px solid #dde5eb;
}
.navbar-brand {
  color: var(--control-secondary);
}
.navbar-brand small {
  display: block;
  color: #6c7780;
  font-size: 0.72rem;
  font-weight: 500;
}
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border-radius: 0.8rem;
  background: linear-gradient(
    135deg,
    var(--control-primary),
    var(--control-secondary)
  );
  color: #fff;
  font-weight: 800;
}
.brand-mark-large {
  width: 4.5rem;
  height: 4.5rem;
  border-radius: 1.25rem;
  font-size: 1.7rem;
}
.brand-logo {
  width: 2.8rem;
  height: 2.8rem;
  object-fit: contain;
}
.login-logo {
  max-width: 10rem;
  max-height: 5rem;
}
.language-switch {
  display: flex;
  gap: 0.4rem;
  margin-left: 1rem;
  font-size: 0.8rem;
  font-weight: 700;
}
.language-switch a,
.client-language a {
  color: var(--control-primary);
  text-decoration: none;
}
.page-heading h1 {
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 800;
  letter-spacing: -0.04em;
}
.page-heading p {
  color: #64727d;
  font-size: 1.1rem;
  max-width: 48rem;
}
.eyebrow {
  display: block;
  margin-bottom: 0.55rem;
  color: var(--control-primary);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.panel {
  background: #fff;
  border: 1px solid #dde5eb;
  border-radius: var(--control-radius);
  padding: clamp(1.4rem, 4vw, 2.5rem);
  box-shadow: 0 16px 42px rgba(23, 61, 91, 0.06);
}
.section-title {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 1.25rem;
}
.requirements-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
}
.requirements-grid span {
  padding: 0.55rem 0.8rem;
  background: #f2f6f8;
  border-radius: 0.65rem;
  font-size: 0.84rem;
}
.requirements-grid strong {
  color: var(--control-primary);
  margin-left: 0.25rem;
}
.status-pill {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  font-weight: 900;
}
.status-pill.is-ok {
  background: #dff5e7;
  color: #176a38;
}
.status-pill.is-error {
  background: #fde1e1;
  color: #a52b2b;
}
.choice-card {
  display: flex;
  gap: 1rem;
  border: 2px solid #dbe4e9;
  border-radius: 1rem;
  padding: 1.2rem;
  cursor: pointer;
  transition: 0.2s;
}
.choice-card:has(input:checked) {
  border-color: var(--control-primary);
  background: color-mix(in srgb, var(--control-primary) 7%, #fff);
}
.choice-card input {
  margin-top: 0.25rem;
  accent-color: var(--control-primary);
}
.choice-card strong,
.choice-card small,
.feature-item strong,
.feature-item small,
.feature-toggle strong,
.feature-toggle small,
.access-card strong,
.access-card small {
  display: block;
}
.choice-card small,
.feature-item small,
.feature-toggle small,
.access-card small {
  color: #6b7780;
  margin-top: 0.25rem;
}
.form-control:focus,
.form-select:focus {
  border-color: var(--control-primary);
  box-shadow: 0 0 0 0.2rem
    color-mix(in srgb, var(--control-primary) 20%, transparent);
}
.color-control {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.55rem;
  border: 1px solid #d7e0e6;
  border-radius: 0.75rem;
}
.color-control input {
  width: 3rem;
  height: 2.2rem;
  border: 0;
  background: none;
}
.color-control code {
  color: #53616b;
}
.btn-control {
  background: var(--control-primary);
  border-color: var(--control-primary);
  color: #fff;
}
.btn-control:hover {
  background: var(--control-secondary);
  border-color: var(--control-secondary);
  color: #fff;
}
.btn-outline-control {
  border-color: var(--control-primary);
  color: var(--control-primary);
}
.btn-outline-control:hover {
  background: var(--control-primary);
  color: #fff;
}
.auth-wrap {
  min-height: 65vh;
  display: grid;
  place-items: center;
}
.auth-panel {
  width: min(100%, 30rem);
}
.metric-card {
  height: 100%;
  background: var(--control-secondary);
  color: #fff;
  border-radius: var(--control-radius);
  padding: 1.5rem;
}
.metric-card span {
  display: block;
  opacity: 0.72;
  font-size: 0.84rem;
}
.metric-card strong {
  display: block;
  font-size: 2rem;
  margin-top: 0.4rem;
}
.metric-card .status-text {
  color: #91e6af;
  font-size: 1.3rem;
}
.feature-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  gap: 1rem;
}
.feature-item,
.feature-toggle {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  padding: 1rem;
  border: 1px solid #e0e7eb;
  border-radius: 0.9rem;
}
.feature-icon {
  display: grid;
  place-items: center;
  flex: 0 0 2rem;
  height: 2rem;
  border-radius: 0.6rem;
  background: color-mix(in srgb, var(--control-primary) 12%, #fff);
  color: var(--control-primary);
  font-weight: 900;
}
.feature-toggle {
  cursor: pointer;
}
.feature-toggle input {
  margin-top: 0.25rem;
  accent-color: var(--control-primary);
}
.client-body {
  min-height: 100vh;
  background: radial-gradient(
    circle at top left,
    color-mix(in srgb, var(--control-primary) 70%, #fff),
    var(--control-secondary)
  );
  display: grid;
  place-items: center;
  padding: 2rem;
}
.client-language {
  position: fixed;
  right: 1.5rem;
  top: 1.5rem;
  display: flex;
  gap: 0.5rem;
  color: #fff;
}
.client-language a {
  color: #fff;
  font-weight: 800;
}
.client-shell {
  max-width: 70rem;
}
.client-card {
  background: rgba(255, 255, 255, 0.96);
  border-radius: 2rem;
  padding: clamp(2rem, 6vw, 5rem);
  box-shadow: 0 2rem 6rem rgba(0, 0, 0, 0.22);
}
.client-brand h1 {
  font-size: clamp(2.2rem, 5vw, 4.5rem);
  font-weight: 850;
  letter-spacing: -0.05em;
  margin-top: 1rem;
}
.client-brand p {
  color: #65737d;
  font-size: 1.15rem;
}
.client-logo {
  max-width: 14rem;
  max-height: 7rem;
}
.access-card {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 13rem;
  border: 2px solid #dce5e9;
  border-radius: 1.3rem;
  background: #fff;
  padding: 1.5rem;
  transition: 0.2s;
  color: inherit;
  text-decoration: none;
}
.access-card:hover,
.access-card:focus {
  border-color: var(--control-primary);
  transform: translateY(-3px);
  box-shadow: 0 1rem 2.5rem rgba(23, 61, 91, 0.12);
  color: inherit;
}

.activation-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 2rem;
}
.activation-heading h1 { font-size: clamp(2.2rem, 5vw, 4.25rem); font-weight: 850; letter-spacing: -0.05em; }
.activation-heading p { max-width: 48rem; color: #64727d; font-size: 1.1rem; }
.server-day { min-width: 13rem; padding: 1rem 1.25rem; border-radius: 1rem; background: var(--control-secondary); color: #fff; text-align: right; }
.server-day span, .server-day small { display: block; opacity: .7; font-size: .75rem; }
.server-day strong { display: block; font-size: 1.3rem; }
.activation-desk { border-top: .45rem solid var(--control-primary); }
.activation-label { display: block; margin-bottom: .75rem; font-weight: 800; }
.activation-entry { display: grid; grid-template-columns: minmax(16rem, 1fr) 8rem auto; gap: .75rem; align-items: end; }
.activation-input { height: 4.5rem; border-width: 2px; font-size: clamp(1.3rem, 3vw, 2rem); font-weight: 750; letter-spacing: .03em; }
.minutes-control label { display: block; margin-bottom: .25rem; color: #6c7881; font-size: .75rem; font-weight: 800; text-transform: uppercase; }
.minutes-control .form-control, .activation-submit { height: 4.5rem; font-size: 1.1rem; font-weight: 800; }
.activation-help { margin: .75rem 0 0; color: #73808a; }
.activation-result { display: flex; align-items: center; gap: 1.25rem; margin-top: 2rem; padding: 1.25rem; border-radius: 1rem; background: #eef3f6; }
.activation-result.is-granted { background: #dff5e7; color: #155f33; }
.activation-result.is-already_granted { background: #fff2cc; color: #765800; }
.activation-result.is-inactive, .activation-result.is-not_found { background: #fde1e1; color: #8b2424; }
.activation-result-icon { display: grid; place-items: center; flex: 0 0 3.5rem; height: 3.5rem; border-radius: 50%; background: rgba(255,255,255,.7); font-size: 1.8rem; font-weight: 900; }
.activation-result h2 { margin: .15rem 0 0; font-size: 1.5rem; }
.activation-result p, .activation-result small { margin: 0; }
.recent-heading { display: flex; justify-content: space-between; align-items: center; padding: 1.5rem; }
.recent-heading h2 { margin: 0; font-size: 1.35rem; }
.space-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr)); gap: 1rem; }
.space-card { display: grid; gap: 1rem; padding: 1rem; border: 1px solid #dce5ea; border-radius: 1rem; background: #f8fafb; }
.space-card strong, .space-card small { display: block; }
.space-card small { color: #6c7881; }
.management-list { display: grid; gap: .65rem; }
.management-list > a { display: flex; align-items: center; gap: 1rem; padding: .9rem 1rem; border: 1px solid #e0e7eb; border-radius: .8rem; color: inherit; text-decoration: none; }
.management-list > a:hover { border-color: var(--control-primary); }
.management-list > a > span:not(.app-list-icon) { flex: 1; min-width: 0; }
.management-list strong, .management-list small { display: block; }
.management-list small { overflow: hidden; color: #71808a; text-overflow: ellipsis; white-space: nowrap; }
.management-list b { font-size: 1.7rem; }
.app-list-icon { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: .65rem; background: #eef3f6; font-size: 1.25rem; }
.app-choice-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); gap: .75rem; }
.app-choice { display: flex; align-items: center; gap: .8rem; padding: .9rem; border: 2px solid #e0e7eb; border-radius: .9rem; cursor: pointer; }
.app-choice:has(input:checked) { border-color: var(--control-primary); background: color-mix(in srgb, var(--control-primary) 6%, #fff); }
.app-choice-icon { font-size: 1.5rem; }.app-choice strong,.app-choice small { display:block }.app-choice small { color:#71808a }
.client-session-card { width: min(100%, 72rem); }
.client-desktop { margin-top: 2.5rem; padding-top: 2rem; border-top: 1px solid #e0e7eb; text-align: left; }
.desktop-title { text-align: center; }.desktop-title h2 { font-weight: 800; }
.client-app-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: 1rem; margin-top: 1.5rem; }
.client-app { display: flex; flex-direction: column; align-items: center; min-height: 10rem; padding: 1.2rem .8rem; border: 2px solid #dfe7eb; border-radius: 1rem; color: inherit; text-align: center; text-decoration: none; }
.client-app:hover,.client-app:focus { border-color:var(--control-primary); color:inherit; transform:translateY(-2px) }.client-app > span { font-size:2.5rem }.client-app strong { margin-top:.5rem }.client-app small { color:#71808a }
.pagination-wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.25rem; }
.pagination-wrap .page-link { color: var(--control-primary); }
.pagination-wrap .active > .page-link { border-color: var(--control-primary); background: var(--control-primary); color: #fff; }
.pagination-wrap small { color: #71808a; }

.navbar .nav-link {
  font-size: 0.86rem;
  white-space: nowrap;
}

.filter-bar {
  padding: 1.25rem 1.5rem;
}

.table-panel {
  padding: 0;
  overflow: hidden;
}

.control-table {
  margin: 0;
}

.control-table th {
  padding: 1rem 1.25rem;
  background: #f6f8fa;
  color: #65737d;
  border-bottom-color: #dce4e9;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

.control-table td {
  padding: 1rem 1.25rem;
  border-bottom-color: #e5ebef;
}

.control-table tbody tr:last-child td {
  border-bottom: 0;
}

.table-actions {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
}

.table-note {
  display: block;
  margin-top: 0.25rem;
  color: #77838b;
  font-size: 0.75rem;
}

.state-badge,
.type-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.35rem 0.65rem;
  background: #eef2f4;
  color: #53616b;
  font-size: 0.75rem;
  font-weight: 750;
  white-space: nowrap;
}

.state-badge.is-active {
  background: #dff5e7;
  color: #176a38;
}

.state-badge.is-inactive {
  background: #f1f2f3;
  color: #727c83;
}

.empty-state {
  display: grid;
  place-items: center;
  min-height: 15rem;
  padding: 3rem;
  text-align: center;
}

.empty-state strong {
  font-size: 1.2rem;
}

.empty-state span {
  color: #73808a;
}

.form-panel {
  max-width: 64rem;
}

.csv-example {
  display: block;
  overflow-x: auto;
  padding: 1rem;
  border-radius: 0.75rem;
  background: #17212b;
  color: #dff5e7;
  font-size: 0.75rem;
  white-space: nowrap;
}

.client-alert {
  width: min(100%, 48rem);
  margin: 0 auto 1rem;
}

.client-login-card {
  width: min(100%, 38rem);
  margin: 0 auto;
  text-align: left;
}

.client-login-card .client-brand h1 {
  font-size: clamp(2rem, 5vw, 3rem);
}

.client-back {
  display: inline-block;
  margin-bottom: 1.5rem;
  color: var(--control-primary);
  font-weight: 700;
  text-decoration: none;
}

.session-check {
  display: grid;
  place-items: center;
  width: 5rem;
  height: 5rem;
  margin: 0 auto 1.5rem;
  border-radius: 50%;
  background: #dff5e7;
  color: #176a38;
  font-size: 2rem;
  font-weight: 900;
}

.client-session-card h1 {
  font-size: clamp(2.2rem, 6vw, 4rem);
  font-weight: 850;
  letter-spacing: -0.04em;
}

.session-course {
  color: var(--control-primary);
  font-size: 1.25rem;
  font-weight: 750;
}

.session-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 2rem;
}

.session-meta span {
  padding: 0.7rem 1rem;
  border-radius: 0.75rem;
  background: #f0f4f6;
  color: #65727c;
}
.access-card strong {
  font-size: 1.2rem;
}
.access-icon {
  display: grid;
  place-items: center;
  width: 3.2rem;
  height: 3.2rem;
  margin: 0 auto 1rem;
  border-radius: 1rem;
  background: var(--control-primary);
  color: #fff;
  font-size: 1.5rem;
}
.client-card footer {
  margin-top: 2.5rem;
  color: #79858d;
  font-size: 0.88rem;
}
@media (max-width: 767px) {
  .panel {
    border-radius: 1rem;
  }
  .client-body {
    padding: 3.75rem 1rem 1rem;
  }
  .client-card {
    border-radius: 1.25rem;
  }
  .language-switch {
    margin: 0.8rem 0 0;
  }
  .navbar-nav {
    align-items: flex-start !important;
  }

  .page-heading h1 {
    font-size: 2.15rem;
  }

  .page-heading .btn-lg {
    padding: 0.65rem 0.9rem;
    font-size: 0.95rem;
  }

  .filter-bar {
    padding: 1rem;
  }

  .table-panel {
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .table-responsive {
    overflow: visible;
  }

  .control-table,
  .control-table tbody,
  .control-table tr,
  .control-table td {
    display: block;
    width: 100%;
  }

  .control-table thead {
    display: none;
  }

  .control-table tbody {
    display: grid;
    gap: 1rem;
  }

  .control-table tbody tr {
    overflow: hidden;
    border: 1px solid #dce4e9;
    border-radius: 1rem;
    background: #fff;
    box-shadow: 0 0.75rem 2rem rgba(23, 61, 91, 0.06);
  }

  .control-table td {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #edf1f3;
    text-align: right !important;
  }

  .control-table td::before {
    content: attr(data-label);
    flex: 0 0 7rem;
    color: #71808a;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    text-align: left;
    text-transform: uppercase;
  }

  .control-table td:last-child {
    border-bottom: 0;
  }

  .table-actions {
    flex-wrap: wrap;
  }

  .client-language {
    top: 1rem;
    right: 1rem;
  }

  .client-card {
    padding: 2rem 1.25rem;
  }

  .session-meta {
    display: grid;
  }
  .activation-heading { display: block; }
  .server-day { margin-top: 1rem; text-align: left; }
  .activation-entry { grid-template-columns: 1fr 7rem; }
  .activation-submit { grid-column: 1 / -1; }
  .activation-result { align-items: flex-start; }
}

@media (max-width: 1399.98px) {
  .navbar-collapse {
    padding-top: 1rem;
  }

  .navbar-nav {
    align-items: flex-start !important;
  }

  .navbar-nav form {
    margin: 0.35rem 0;
  }

  .language-switch {
    margin: 0.5rem 0 0;
  }
}
/* Device inventory */
.pairing-code-panel{display:grid;grid-template-columns:1fr auto;gap:.5rem 1.5rem;align-items:center;padding:1.25rem 1.5rem}.pairing-code-panel small{grid-column:1/-1}.pairing-code{font-size:clamp(1.7rem,4vw,2.6rem);font-weight:800;letter-spacing:.18em;color:var(--control-secondary)}
.device-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.device-card{border:1px solid #dde5eb;border-radius:1rem;padding:1.1rem;background:#fff;display:grid;gap:1rem}.device-card strong,.device-card small{display:block}.status-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:50%;margin-right:.5rem}.status-online{background:#198754;box-shadow:0 0 0 .2rem rgba(25,135,84,.14)}.status-offline{background:#6c757d}.status-revoked{background:#dc3545}.device-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin:0}.device-meta div{min-width:0}.device-meta dt{font-size:.72rem;text-transform:uppercase;color:#687782}.device-meta dd{margin:0;overflow-wrap:anywhere}
@media (max-width:767.98px){.device-grid{grid-template-columns:1fr}.pairing-code-panel{grid-template-columns:1fr}.pairing-code-panel small{grid-column:auto}.pairing-code{font-size:1.65rem}.device-meta{grid-template-columns:1fr 1fr}}
.terms-check{display:flex;gap:.75rem;align-items:flex-start;text-align:left;padding:1rem;border:1px solid #d7e0e8;border-radius:1rem;background:#f8fafc}.terms-check input{flex:0 0 auto;margin-top:.25rem}.session-warning{margin:1rem auto;max-width:34rem;padding:.85rem 1rem;border-radius:1rem;background:#fff3cd;color:#664d03;font-weight:700}.quick-create-card{margin-top:1rem;padding:1rem;border:1px solid #d7e0e8;border-radius:1rem;background:#fff}.quick-create-card>div:first-child{display:flex;flex-direction:column;margin-bottom:.75rem}.device-command-form{display:grid;grid-template-columns:minmax(9rem,1fr) auto auto;gap:.5rem;width:100%}.device-settings{margin-top:1rem;border-top:1px solid #e5e7eb;padding-top:.75rem}.device-settings summary{cursor:pointer;font-weight:700;color:var(--control-primary)}
@media (max-width:575.98px){.device-command-form{grid-template-columns:1fr}.device-command-form .btn{width:100%}}
.report-breakdown{display:grid;gap:.65rem}.report-breakdown>div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem .8rem;border-radius:.75rem;background:#f7f9fb}.report-breakdown span{white-space:nowrap;color:#5d6b75}
.kiosk-policy{padding:1rem;border:1px solid #d8e2ea;border-radius:1rem;background:#f7fafc}.kiosk-policy p{margin:.25rem 0 .75rem}.kiosk-policy small{display:block;margin-top:.75rem;color:#5d6b75}
.native-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:.65rem;margin:1rem auto 0;max-width:62rem}.native-controls[hidden]{display:none}
.activation-user-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.45rem 1rem;margin:.8rem 0 0}.activation-user-details div{min-width:0}.activation-user-details dt{font-size:.72rem;text-transform:uppercase;color:var(--control-muted)}.activation-user-details dd{margin:0;overflow-wrap:anywhere}.reset-grant-card{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 1.25rem;margin-top:1rem;border:1px solid #f2c66d;border-radius:1rem;background:#fff9e9}@media(max-width:575px){.activation-user-details{grid-template-columns:1fr}.reset-grant-card{align-items:stretch;flex-direction:column}}
.management-row{display:flex;align-items:center;gap:.5rem}.management-row>a{flex:1;min-width:0}.management-row form{margin-right:.5rem;flex:0 0 auto}
.control-footer{margin-top:2rem;border-top:1px solid #dde5eb;background:#fff;color:#687782}.control-footer .container{display:flex;justify-content:space-between;gap:1rem;padding-top:1.25rem;padding-bottom:1.25rem}.control-footer a{font-weight:700;color:var(--control-primary)}
.support-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,17rem),1fr));gap:1rem}.support-card{display:flex;flex-direction:column;align-items:flex-start}.support-card h2{font-size:1.25rem}.support-card p{color:#5d6b75}.support-card-featured{border-color:var(--control-accent);background:linear-gradient(145deg,#fffdf7,#fff)}.support-icon{display:grid;place-items:center;width:2.75rem;height:2.75rem;margin-bottom:1rem;border-radius:.85rem;background:var(--control-primary);color:#fff;font-weight:800}.support-actions{display:grid;gap:.65rem;margin-top:auto}.support-actions a{font-weight:700;overflow-wrap:anywhere}
@media(max-width:575.98px){.control-footer .container{flex-direction:column}.support-card .btn{width:100%}}
.sinlios-link{border-radius:.6rem;background:rgba(244,185,66,.16);color:var(--control-secondary)!important;font-weight:800}
.permission-panel{padding:1.25rem;border:1px solid #d8e2ea;border-radius:1rem;background:#f8fafc}.permission-panel legend{float:none;width:auto;margin:0;font-size:1rem;font-weight:800}.permission-panel p{color:#5d6b75}.permission-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:.75rem}
.commercial-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.commercial-summary article{padding:1rem 1.25rem;border:1px solid #d8e2ea;border-radius:1rem;background:#fff}.commercial-summary span,.commercial-summary strong{display:block}.commercial-summary span{color:#687782;font-size:.75rem;font-weight:800;text-transform:uppercase}.commercial-summary strong{margin-top:.25rem;font-size:1.35rem;color:var(--control-secondary)}
.capacity-card{display:grid;grid-template-columns:minmax(12rem,18rem) minmax(12rem,1fr);align-items:center;gap:.8rem 1.5rem;padding:1rem 1.25rem;border:1px solid #d8e2ea;border-radius:1rem;background:#fff}.capacity-card>div:first-child span,.capacity-card>div:first-child strong,.capacity-card>div:first-child small{display:block}.capacity-card>div:first-child span{color:#687782;font-size:.75rem;font-weight:800;text-transform:uppercase}.capacity-card>div:first-child strong{font-size:1.4rem;color:var(--control-secondary)}.capacity-card>div:first-child small{color:#5d6b75}.capacity-meter{height:.75rem;overflow:hidden;border-radius:999px;background:#e9eef2}.capacity-meter span{display:block;height:100%;border-radius:inherit;background:var(--control-primary)}.capacity-card.is-full{border-color:#dc3545;background:#fff8f8}.capacity-card.is-full .capacity-meter span{background:#dc3545}.capacity-card>p{grid-column:1/-1;margin:0;color:#842029;font-weight:700}
@media(max-width:767.98px){.commercial-summary{grid-template-columns:1fr}.capacity-card{grid-template-columns:1fr}}
.status-pill{display:inline-flex;align-items:center;justify-content:center;min-height:2rem;padding:.35rem .8rem;border-radius:999px;font-size:.8rem;font-weight:800;white-space:nowrap}.status-ok{background:#dff5e8;color:#17643a}.status-warning{background:#fff1cc;color:#795600}
.diagnostic-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}.diagnostic-item{display:flex;flex-direction:column;gap:.25rem;min-width:0;padding:1rem;border:1px solid #dfe6ec;border-left:4px solid #8b98a5;border-radius:.9rem;background:#fbfcfd}.diagnostic-item span{font-size:.78rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#647281}.diagnostic-item strong{overflow-wrap:anywhere;font-size:.94rem}.diagnostic-ok{border-left-color:#2f9e62}.diagnostic-warning{border-left-color:#e0a000}.diagnostic-error{border-left-color:#ce3f4f;background:#fff8f8}
@media(max-width:991.98px){.diagnostic-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:575.98px){.diagnostic-grid{grid-template-columns:1fr}.diagnostic-item{padding:.85rem}}