/* Section 3 v0.4.3 blocking corrections */

/* Use the approved mark/wordmark treatment consistently, including sidebar. */
.approved-brand-lockup .brand-mark {
  object-fit: contain;
}
.approved-brand-lockup .brand-central {
  text-transform: none;
  letter-spacing: -0.02em;
  opacity: 1;
  margin-top: 2px;
  font-weight: 760;
}

/* Search must remain a single contained line at every desktop/tablet width. */
.search-button {
  min-width: 0;
  overflow: hidden;
}
.search-button > svg,
.search-button kbd {
  flex: 0 0 auto;
}
.search-copy {
  display: block;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Section 3 navigation is intentionally fully discoverable rather than clipped.
   Visual order is handled in CSS so no runtime code has to move live DOM nodes. */
.master-tabs {
  flex-wrap: wrap;
  overflow: visible;
  align-items: center;
}
.master-tab {
  flex: 0 0 auto;
}
.master-tab[data-master-tab="overview"] { order: 1; }
.master-tab[data-master-tab="sites"] { order: 2; }
.master-tab[data-master-tab="entities"] { order: 3; }
.master-tab[data-master-tab="materials"] { order: 4; }
.master-tab[data-master-tab="packing"] { order: 5; }
.master-tab[data-master-tab="parties"] { order: 6; }
.master-tab[data-master-tab="audit"] { order: 7; }

/* Desktop already has a permanently docked sidebar. The hamburger and mobile
   scrim are mobile-only controls and must never appear over the desktop shell. */
@media (min-width: 941px) {
  .app-shell > .topbar .mobile-menu-btn {
    display: none !important;
  }
  .app-shell > .scrim[data-action="close-mobile"] {
    display: none !important;
    pointer-events: none !important;
  }
}

/* The mobile drawer must sit above its scrim and remain interactive. */
@media (max-width: 940px) {
  .sidebar {
    z-index: 95;
    visibility: visible;
  }
  .scrim {
    z-index: 80;
  }
  .app-shell.mobile-sidebar-open .sidebar {
    display: block !important;
    transform: translate3d(0, 0, 0) !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }
  .app-shell.mobile-sidebar-open {
    overflow: hidden;
  }
  .master-tabs {
    gap: 6px;
  }
}

/* Leave management uses a dense data table, but each cell must still read as a
   clear primary fact followed by secondary context. Keep these rules scoped so
   other GreenCore tables retain the shared UX foundation contract. */
[data-leave-management] .gc-table {
  min-width: 1040px;
}

[data-leave-management] .gc-table :where(th, td) {
  padding: 14px 16px;
  vertical-align: top;
}

[data-leave-management] .gc-table td {
  line-height: 1.45;
}

[data-leave-management] .gc-table td > small {
  display: block;
  margin-top: 5px;
  color: var(--gc-muted);
  font-size: 0.68rem;
  line-height: 1.45;
}

[data-leave-management] .gc-table td:nth-child(1) { min-width: 210px; }
[data-leave-management] .gc-table td:nth-child(2) { min-width: 160px; }
[data-leave-management] .gc-table td:nth-child(3) { min-width: 92px; }
[data-leave-management] .gc-table td:nth-child(4) { min-width: 112px; }
[data-leave-management] .gc-table td:nth-child(5) { min-width: 245px; }
[data-leave-management] .gc-table td:nth-child(6) { min-width: 185px; }
[data-leave-management] .gc-table td:nth-child(7) { min-width: 124px; }

[data-leave-management] .gc-table td:nth-child(2) > strong,
[data-leave-management] .gc-table td:nth-child(5) > strong,
[data-leave-management] .gc-table td:nth-child(6) > strong,
[data-leave-management] .gc-table td:nth-child(7) > strong {
  display: block;
  color: var(--gc-text-strong);
  line-height: 1.3;
}

[data-leave-management] .gc-table td:nth-child(5) > strong {
  font-size: 0.84rem;
}

[data-leave-management] .gc-table td:nth-child(5) > small + small {
  margin-top: 8px;
  padding-top: 7px;
  border-top: 1px solid var(--gc-border);
  color: var(--gc-text);
}

[data-leave-management] .gc-table td:nth-child(5) > small + small > strong {
  color: var(--gc-text-strong);
  font-size: 0.76rem;
}

[data-leave-management] .gc-table td:nth-child(6) > .action-button {
  margin-bottom: 1px;
}

[data-leave-management] .gc-table .gc-status,
[data-leave-management] .gc-table .badge {
  margin-top: 1px;
}

@media (max-width: 760px) {
  [data-leave-management] .gc-table :where(th, td) {
    padding: 12px 13px;
  }
}