/* Hidden application views must override component display declarations. */
[hidden] {
  display: none !important;
}

.tx-logo {
  display: block;
  width: 54px;
  height: 54px;
  flex: 0 0 auto;
  border-radius: 8px;
  object-fit: cover;
}

.language-toggle {
  border: 1px solid rgba(255, 255, 255, .35);
  background: rgba(255, 255, 255, .12);
  color: #fff;
  min-width: 76px;
  padding: 9px 12px;
  border-radius: 10px;
  font-weight: 800;
  cursor: pointer;
}

.language-toggle:hover {
  background: rgba(255, 255, 255, .22);
}

.staff-identity .language-toggle {
  border: 1px solid rgba(255, 255, 255, .35);
  background: rgba(255, 255, 255, .12);
  padding: 8px 11px;
}

.login-card {
  position: relative;
}

.login-language-toggle {
  position: absolute;
  top: 22px;
  right: 22px;
  border-color: #b8d5ee;
  background: #edf6ff;
  color: #075baf;
}

.support-numbers {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
}

.support-contact-group {
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 16px;
  background: rgba(255, 255, 255, .07);
}

.support-contact-stack {
  display: grid;
  gap: 10px;
}

.support-numbers > .support-contact-group {
  display: grid;
  grid-template-rows: auto 1fr 1fr;
}

.support-numbers > .support-contact-group a {
  display: grid;
  align-content: center;
}

.support-contact-group h3 {
  margin: 0;
  padding: 14px 17px;
  color: #fff;
  font-size: 16px;
  text-align: center;
  background: rgba(255, 255, 255, .08);
}

.support-numbers .support-contact-group a {
  border: 0;
  border-top: 1px solid rgba(255, 255, 255, .12);
  border-radius: 0;
  background: transparent;
}

.support-contact-group a strong {
  display: block;
  font-size: 17px;
}

.support-contact-group a small {
  margin-top: 5px;
  margin-bottom: 0;
}

.status-badge.opened { background: #e9f3ff; color: #1764aa; }
.status-badge.stuffing { background: #e8f1ff; color: #3a5ca8; }
.status-badge.sea_transit { background: #dff1ff; color: #056aa8; }
.status-badge.arrived { background: #e7edff; color: #3e51a3; }
.status-badge.customs { background: #fff0cf; color: #ab6500; }
.status-badge.delivery { background: #f1e8ff; color: #7544a7; }
.status-badge.delivered { background: #dff8eb; color: #087f49; }

@media (max-width: 800px) {
  .tx-logo {
    width: 41px;
    height: 41px;
    border-radius: 6px;
  }

  .support-numbers {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .portal-header nav a[href="/staff"] {
    display: none;
  }

  .language-toggle {
    min-width: 64px;
    padding: 8px;
    font-size: 12px;
  }
}