/* Profile / company IA overlay. Visual only. Existing MicroMind colors. */
.mm-tab-hidden {
  display: none !important;
}

.customer-shell,
.company-shell {
  font-family: "Segoe UI", system-ui, -apple-system, sans-serif;
}
.mmq-crumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--mmq-space-8);
  margin: 0 0 var(--mmq-space-16);
  font-size: 0.8125rem;
  color: var(--mmq-muted);
}
.mmq-crumb a {
  color: var(--mmq-sky);
  font-weight: 650;
  text-decoration: none;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
}
.mmq-crumb a:hover { text-decoration: underline; }
.mmq-crumb a:focus-visible,
.mm-profile-nav a:focus-visible,
.mm-profile-nav button:focus-visible {
  outline: 3px solid var(--mmq-focus);
  outline-offset: 2px;
}
.mmq-crumb [aria-current="page"] {
  color: var(--mmq-ink);
  font-weight: 750;
}

.profile-wrap,
.company-wrap {
  width: min(1120px, calc(100% - 32px));
  margin: 0 auto;
  padding: var(--mmq-space-24) 0 var(--mmq-space-64);
}

.mm-profile-identity,
.company-hero {
  margin-bottom: var(--mmq-space-20);
}

.mm-profile-identity {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: var(--mmq-space-16);
  align-items: center;
  padding: var(--mmq-space-24);
  border: 1px solid var(--mmq-line);
  border-radius: var(--mmq-radius);
  background: var(--mmq-paper);
  box-shadow: var(--mmq-shadow);
}
.mm-profile-identity .profile-avatar {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e8f2ff;
  color: var(--mmq-sky);
  font-size: 1.5rem;
  font-weight: 800;
}
.mm-profile-identity h1 {
  margin: var(--mmq-space-4) 0;
}
.mm-profile-identity p {
  margin: 0;
  color: var(--mmq-muted);
}
.mm-profile-primary {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mmq-space-8);
  justify-content: flex-end;
}

.mm-profile-nav {
  display: flex;
  gap: var(--mmq-space-8);
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 var(--mmq-space-20);
  padding: var(--mmq-space-4) 0;
  border-bottom: 1px solid var(--mmq-line);
}
.mm-profile-nav a,
.mm-profile-nav button {
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  min-height: 44px;
  padding: var(--mmq-space-8) var(--mmq-space-16);
  border-radius: 999px;
  color: #12324a;
  font: inherit;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.mm-profile-nav a,
.mm-profile-nav button {
  transform-origin: center center;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease,
    color 0.3s ease,
    box-shadow 0.3s ease,
    border-color 0.3s ease,
    filter 0.3s ease;
}
@media (hover: hover) and (pointer: fine) {
  .mm-profile-nav a:hover,
  .mm-profile-nav button:hover {
    transform: translateY(-2px) scale(1.3);
    filter: brightness(1.06);
    z-index: 3;
    position: relative;
    background: var(--mmq-soft);
  }
}
@media (prefers-reduced-motion: reduce) {
  .mm-profile-nav a:hover,
  .mm-profile-nav button:hover {
    transform: none;
    filter: none;
  }
}
.mm-profile-nav a[aria-current="page"],
.mm-profile-nav a.is-active {
  color: #072033;
  background: #e8f2ff;
  border-color: #b7d4f5;
  box-shadow: inset 0 -3px 0 var(--mmq-sky);
  font-weight: 800;
}

.customer-shell .mm-profile-nav a[aria-current="page"] {
  box-shadow: inset 0 -3px 0 var(--mmq-sky);
}
.company-shell .mm-profile-nav a[aria-current="page"],
.company-shell .mm-profile-nav a.is-active {
  background: #e7f6ee;
  border-color: #b7dcc8;
  box-shadow: inset 0 -3px 0 var(--mmq-green);
  color: #0b2f22;
}

.mm-profile-panel,
.mm-profile-actions-grid {
  display: grid;
  gap: var(--mmq-space-16);
}
.mm-profile-panel {
  padding: var(--mmq-space-24);
  margin-bottom: var(--mmq-space-24);
  border: 1px solid var(--mmq-line);
  border-radius: var(--mmq-radius);
  background: var(--mmq-paper);
  box-shadow: var(--mmq-shadow);
}
.mm-profile-panel h2 {
  margin: 0 0 var(--mmq-space-8);
}
.mm-profile-panel > p {
  margin: 0 0 var(--mmq-space-16);
  color: var(--mmq-muted);
}

.mm-profile-actions-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.mm-profile-action {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--mmq-space-8);
  min-height: 120px;
  padding: var(--mmq-space-20);
  border: 1px solid var(--mmq-line);
  border-radius: var(--mmq-radius-sm);
  background: var(--mmq-soft);
  text-decoration: none;
  color: inherit;
}
.mm-profile-action strong {
  font-size: 1.05rem;
}
.mm-profile-action span {
  color: var(--mmq-muted);
  font-size: 0.875rem;
}
.mm-profile-action:hover {
  border-color: #b7d4f5;
  background: #fff;
}
.mm-profile-action:focus-visible {
  outline: 3px solid var(--mmq-focus);
  outline-offset: 2px;
}

.profile-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--mmq-space-16);
}
.profile-field {
  padding: var(--mmq-space-16);
  border: 1px solid var(--mmq-line);
  border-radius: var(--mmq-radius-sm);
  background: var(--mmq-soft);
}
.profile-field span {
  display: block;
  margin-bottom: var(--mmq-space-8);
  color: var(--mmq-muted);
  font-size: 0.8125rem;
  font-weight: 650;
}
.profile-field strong {
  font-size: 1.05rem;
}
.profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mmq-space-8);
  margin-top: var(--mmq-space-20);
}
.profile-message {
  margin: var(--mmq-space-16) 0 0;
  min-height: 1.4em;
}

.company-shell .company-hero {
  position: relative;
}
.company-profile-edit {
  margin-top: var(--mmq-space-16);
}
.company-category-chip {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  margin-top: var(--mmq-space-12);
  padding: 0 var(--mmq-space-12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  font-weight: 700;
}

.account-profile-overlay {
  z-index: 80;
}
.account-profile-form {
  display: grid;
  gap: var(--mmq-space-16);
}
.account-profile-grid {
  display: grid;
  gap: var(--mmq-space-16);
}
.account-profile-field span {
  display: block;
  margin-bottom: var(--mmq-space-8);
  font-weight: 650;
}
.account-profile-field input,
.account-profile-field select {
  width: 100%;
  min-height: 44px;
}
.account-profile-scope {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 8px;
}
.account-profile-scope .scope-option {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  min-height: 40px;
  padding: 8px 10px;
  border: 1px solid rgba(32, 93, 69, 0.2);
  border-radius: 12px;
  background: #fff;
  font-weight: 650;
}
.account-profile-scope .scope-option:has(input:checked) {
  border-color: #1b9667;
  background: #eaf8ef;
}
.account-profile-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--mmq-space-8);
  justify-content: flex-end;
}

.mm-category-note {
  margin: 0 0 var(--mmq-space-16);
  color: var(--mmq-muted);
  font-size: 0.9375rem;
}

/* Homepage category tabs: readable inactive + clear active */
.category-row a {
  position: relative;
  z-index: 1;
  color: #12324a !important;
  background: #ffffff !important;
  border: 1px solid #3d6a94 !important;
  font-weight: 700;
}
.category-row a:before {
  display: none !important;
}
.category-row a:hover {
  color: #072033 !important;
  background: #e8f2ff !important;
}
.category-row a.is-active,
.category-row a[aria-selected="true"] {
  color: #072033 !important;
  background: #e8f2ff !important;
  border: 2px solid #1769d1 !important;
  box-shadow: inset 0 -3px 0 #1769d1 !important;
  font-weight: 800;
}

.app-sidebar nav {
  overflow-x: auto;
}
.mm-abo-banner {
  margin: 0 0 1rem;
  padding: 1rem 1.1rem;
  border-radius: 16px;
  border: 1px solid rgba(25, 104, 73, .16);
  background: #eaf8ef;
}
.mm-abo-banner.is-locked {
  border-color: #efc8c8;
  background: #fff6f4;
}
.mm-abo-form { display: grid; gap: .75rem; }
.mm-abo-error { color: #9b2c2c; }
.mm-verification-request { color: #9b2c2c; font-weight: 650; }

@media (max-width: 900px) {
  .mm-profile-identity {
    grid-template-columns: auto 1fr;
  }
  .mm-profile-primary {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .profile-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 430px) {
  .profile-wrap,
  .company-wrap {
    width: calc(100% - 24px);
    padding-top: var(--mmq-space-16);
  }
  .mm-profile-identity,
  .mm-profile-panel {
    padding: var(--mmq-space-16);
  }
  .mm-profile-identity .profile-avatar {
    width: 52px;
    height: 52px;
    font-size: 1.25rem;
  }
}
