/* Logo Design System */

.logo-container {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.logo-content-col {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
}

.logo-brand-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.logo-text {
  font-family: var(--font-heading);
  font-weight: 800;
  letter-spacing: 0.1em;
  line-height: 1;
  margin: 0;
  display: flex;
  align-items: center;
}

.logo-gradient {
  background: linear-gradient(to right, #34d399, #22d3ee);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.variant-admin .logo-gradient {
  background: linear-gradient(to right, #818cf8, #c084fc);
}

.logo-reveal {
  margin-left: 2px;
}

.logo-sub-brand {
  font-size: 0.35em;
  color: rgba(
    255,
    255,
    255,
    0.8
  ) !important; /* High contrast white for dark themes */
  -webkit-text-fill-color: rgba(255, 255, 255, 0.8) !important;
  font-weight: 950;
  letter-spacing: 0.12em;
  align-self: flex-start;
  position: relative;
  top: -0.3em;
  text-transform: uppercase;
}

.logo-tagline {
  font-size: 10px;
  color: #94a3b8; /* Slate 400 */
  margin: 0;
  font-family: var(--font-heading);
  letter-spacing: 0.05em;
  white-space: nowrap;
  font-weight: 500;
}