/* Shared presentation for the portal and its four registered applications. */
.ic-suite {
  --ic-blue: #3267d8;
  --ic-blue-hover: #2857bf;
  --ic-focus: #78a6ff;
  --ic-navy: #15243c;
  --ic-light: #eff5ff;
  --ic-stroke: #d5dfed;
  --ic-radius: 12px;
  font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
}

.ic-suite :is(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--ic-focus);
  outline-offset: 3px;
}

.ic-suite :is(.topbar, .site-header).ic-chrome {
  background: var(--ic-navy);
  color: #f3f7ff;
  border-color: #314362;
  gap: 12px;
}

.ic-suite .ic-chrome :is(.brand, .brand-mini, .ic-home, .who, .nm, .title) {
  color: #f3f7ff;
}

.ic-suite .ic-chrome :is(.rl, .userbox) { color: #c5d1e6; }

.ic-suite .ic-chrome .nav > a { color: #dae5f7; }
.ic-suite .ic-chrome .nav > a:is(:hover, .on) {
  color: #fff;
  background: #294874;
}

.ic-suite .ic-chrome :is(.btn-ghost, .btn.ghost) {
  color: #eaf2ff;
  border-color: #577098;
  background: transparent;
}

.ic-suite .ic-home, .ic-suite .ic-brand {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-weight: 650;
  text-decoration: none;
}

.ic-suite .ic-brand small {
  display: block;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .05em;
  opacity: .82;
}

.ic-suite .ic-mark {
  display: inline-grid;
  place-items: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--ic-blue);
  color: white;
  font-size: 15px;
  font-weight: 750;
}

.ic-suite :is(.btn, .button, button.primary, input:not([type=checkbox]):not([type=radio]), textarea, select) {
  font-family: inherit;
  border-radius: 8px;
}

.ic-suite :is(.btn-primary, .button.primary, button.primary, .ic-portal .btn:not(.btn-ghost):not(.btn-danger), .ic-review .btn:not(.ghost):not(.green):not(.red):not(.amber)) {
  background: var(--ic-blue);
  color: #fff;
  box-shadow: none;
}

.ic-suite :is(.btn-primary, .button.primary, button.primary, .ic-portal .btn:not(.btn-ghost):not(.btn-danger), .ic-review .btn:not(.ghost):not(.green):not(.red):not(.amber)):hover {
  background: var(--ic-blue-hover);
  box-shadow: none;
  transform: none;
}

.ic-suite :is(.card, .panel, .sys-card, .stat, .login-card) { border-radius: var(--ic-radius); }
.ic-suite .ic-pill {
  display: inline-block;
  padding: 3px 9px;
  border-radius: 999px;
  background: #29344a;
  color: #e0e9f9;
  font-size: 12px;
}

.ic-suite .ic-card-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.ic-suite .ic-card-arrow {
  display: block;
  margin-top: 16px;
  color: #a7c6ff;
  font-size: 13px;
  font-weight: 650;
}

.ic-suite .ic-scroll-table { overflow-x: auto; }
.ic-suite .ic-empty { padding: 24px 18px; text-align: center; }

.ic-portal { --bg: #0d1625; --accent: var(--ic-blue); --accent-grad: linear-gradient(135deg, #315dc5, #487bdc); }
.ic-portal .stat-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ic-review { --bg: #0d1625; --primary: #6699ff; --primary2: var(--ic-blue); }
.ic-photo { --bg: #0d1625; --brand: #78a6ff; --accent: #8bb6ff; --glow: 0 0 16px #5284e344; --grad: linear-gradient(120deg, #86b2ff, #c1d4ff); }
.ic-wms { --brand: var(--ic-blue); --brand2: var(--ic-light); --side: var(--ic-navy); --side2: #203452; }
.ic-wms .ic-chrome .user .who { color: #e2ebfa; }
.ic-wms .sidebar .ic-home { margin: 14px 20px; color: #e2ebfa; }
.ic-activity:not(.screen-body) { --dark: var(--ic-blue); --line: var(--ic-stroke); }
.ic-activity:not(.screen-body) .side-bottom .ic-home { color: #254d94; }
.ic-activity .wordmark.ic-brand { display: flex; flex-wrap: wrap; margin-inline: 0; gap: 7px; font-size: 22px; letter-spacing: -.04em; }
.ic-activity .wordmark .ic-mark { display: inline-grid; color: white; margin: 0; }
.ic-activity .wordmark span:not(.ic-mark) { flex-basis: 100%; }

@media (max-width: 700px) {
  .ic-suite .ic-chrome { flex-wrap: wrap; }
  .ic-suite .ic-chrome :is(.nav, .user-chip, .user) { flex-wrap: wrap; gap: 8px; }
  .ic-portal .ic-chrome .user-chip { margin-inline-start: auto; }
  .ic-portal .stat-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media print {
  .ic-suite .ic-chrome, .ic-suite .ic-home { display: none !important; }
}