/* Location Check-in navigation, v1.0.16.
 * Scoped to the location screen; deliberately loads after the shared button reset.
 * aria-selected and the .is-active class are maintained by att-public.js.
 */
body.att-portal .att-portal-content .att-wrap.att-location .att-loc-tabs,
.att-wrap.att-location .att-loc-tabs {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 8px;
  margin: 0 0 18px;
  border: 1px solid #d4dfd7 !important;
  border-radius: 14px;
  background: #eff4f0 !important;
  box-shadow: none !important;
}
body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab,
.att-wrap.att-location button.att-loc-tab {
  position: relative;
  display: grid !important;
  grid-template-columns: 33px minmax(0, 1fr) 22px;
  justify-content: center;
  align-items: center;
  column-gap: 11px;
  min-width: 0;
  min-height: 60px !important;
  padding: 13px 18px !important;
  border: 1px solid #d5e1d8 !important;
  border-radius: 10px !important;
  background: #fff !important;
  background-image: none !important;
  color: #445d4e !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  box-shadow: 0 1px 2px rgba(26,57,34,.04) !important;
  text-align: center;
  cursor: pointer;
  opacity: 1 !important;
  box-sizing: border-box !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease;
}
.att-wrap.att-location .att-loc-tab-label {
  min-width: 0;
  overflow-wrap: anywhere;
  color: inherit !important;
  font: inherit !important;
  display: block;
  text-align: center;
}
.att-wrap.att-location .att-loc-tab-icon {
  width: 33px;
  height: 33px;
  flex: 0 0 33px;
  border-radius: 9px;
  background: #eaf3e9;
  color: #2f6b1f;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.att-wrap.att-location .att-loc-tab-icon svg { width: 20px; height: 20px; }
.att-wrap.att-location .att-loc-tab-selected {
  display: inline-flex;
  width: 22px;
  height: 22px;
  flex: 0 0 22px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  align-items: center;
  justify-content: center;
  visibility: hidden;
  opacity: 0;
}
body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab:hover:not(.is-active):not([aria-selected="true"]),
.att-wrap.att-location button.att-loc-tab:hover:not(.is-active):not([aria-selected="true"]) {
  border-color: #a5c6ab !important;
  background: #f8fcf8 !important;
  color: #1d4f28 !important;
  box-shadow: 0 2px 6px rgba(27,72,35,.06) !important;
}
/* Strongest state: active is unmistakably green, even with global !important button rules. */
body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab.is-active,
body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab[aria-selected="true"],
.att-wrap.att-location button.att-loc-tab.is-active,
.att-wrap.att-location button.att-loc-tab[aria-selected="true"],
body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab.is-active:hover,
.att-wrap.att-location button.att-loc-tab.is-active:hover {
  background: #2f6b1f !important;
  background-image: none !important;
  border-color: #24571c !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(37,93,35,.2) !important;
  font-weight: 600 !important;
}
.att-wrap.att-location .att-loc-tab.is-active .att-loc-tab-icon,
.att-wrap.att-location .att-loc-tab[aria-selected="true"] .att-loc-tab-icon {
  color: #fff !important;
  background: rgba(255,255,255,.17) !important;
}
.att-wrap.att-location .att-loc-tab.is-active .att-loc-tab-selected,
.att-wrap.att-location .att-loc-tab[aria-selected="true"] .att-loc-tab-selected {
  visibility: visible;
  opacity: 1;
}
.att-wrap.att-location button.att-loc-tab:focus-visible {
  outline: 3px solid #8ec79b !important;
  outline-offset: 3px !important;
}
/* Dark mode retains clear contrast between selected and unselected tabs. */
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location .att-loc-tabs {
  background: #172637 !important;
  border-color: #3b5165 !important;
}
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab:not(.is-active):not([aria-selected="true"]) {
  background: #26384a !important;
  border-color: #41566a !important;
  color: #d2e0ea !important;
  box-shadow: none !important;
}
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab:not(.is-active):not([aria-selected="true"]):hover {
  background: #30485a !important;
  border-color: #6a8a79 !important;
  color: #fff !important;
}
html.att-dark-mode body.att-portal .att-wrap.att-location .att-loc-tab:not(.is-active):not([aria-selected="true"]) .att-loc-tab-icon {
  background: #335341 !important;
  color: #c7edc7 !important;
}
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab.is-active,
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab[aria-selected="true"] {
  background: #2b7046 !important;
  border-color: #7cb78e !important;
  color: #fff !important;
  box-shadow: 0 3px 12px rgba(0,0,0,.25) !important;
}
@media (max-width: 640px) {
  body.att-portal .att-portal-content .att-wrap.att-location .att-loc-tabs,
  .att-wrap.att-location .att-loc-tabs { gap: 5px; padding: 5px; }
  body.att-portal .att-portal-content .att-wrap.att-location button.att-loc-tab,
  .att-wrap.att-location button.att-loc-tab {
    grid-template-columns: 30px minmax(0, 1fr) 20px;
    column-gap: 7px;
    min-height: 72px !important;
    padding: 12px 10px !important;
    font-size: 14px !important;
  }
  .att-wrap.att-location .att-loc-tab-selected { position: static; width: 20px; height: 20px; }
  .att-wrap.att-location .att-loc-tab-icon { width: 30px; height: 30px; flex-basis: 30px; }
}
@media (prefers-reduced-motion: reduce) {
  .att-wrap.att-location button.att-loc-tab { transition: none !important; }
}
/* Higher-specificity final guard against legacy shared button resets. */
body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="true"],
.att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="true"] {
  background: #2f6b1f !important;
  border-color: #24571c !important;
  color: #ffffff !important;
}
body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"],
.att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"] {
  background: #ffffff !important;
  border-color: #d5e1d8 !important;
  color: #435464 !important;
}
body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"]:hover,
.att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"]:hover {
  background: #f6fbf6 !important;
  border-color: #9abea3 !important;
  color: #225b2a !important;
}
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"] {
  background: #26384a !important;
  border-color: #41566a !important;
  color: #d2e0ea !important;
}
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"]:hover {
  background: #30485a !important;
  border-color: #789482 !important;
  color: #ffffff !important;
}


/* v1.0.18: one shared box model for BOTH tab states.
 * An old 44px inactive minimum was beating the 60px selected minimum.
 * Do not set different dimensions on aria-selected or .is-active.
 * Allow height to grow for longer translations; CSS grid stretches both cells equally.
 */
body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs,
.att-wrap.att-location #attLocTabs {
  align-items: stretch !important;
  grid-auto-rows: minmax(60px, auto);
}
body.wp-admin.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"],
body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"],
.att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"] {
  width: 100% !important;
  height: auto !important;
  min-height: 60px !important;
  max-height: none !important;
  align-self: stretch !important;
  padding: 12px 16px !important;
  box-sizing: border-box !important;
}
@media (max-width: 640px) {
  body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs,
  .att-wrap.att-location #attLocTabs {
    grid-auto-rows: minmax(80px, auto);
  }
  body.wp-admin.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"],
  body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"],
  .att-wrap.att-location #attLocTabs > button.att-loc-tab[role="tab"] {
    min-height: 80px !important;
    padding: 10px 8px !important;
  }
}

/* Dark-mode state colors must outrank the light theme's aria-selected selectors. */
html.att-dark-mode body.wp-admin.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"],
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="false"] {
  background: #26384a !important;
  border-color: #41566a !important;
  color: #d2e0ea !important;
}
html.att-dark-mode body.wp-admin.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="true"],
html.att-dark-mode body.att-portal .att-portal-content .att-wrap.att-location #attLocTabs > button.att-loc-tab[aria-selected="true"] {
  background: #2b7046 !important;
  border-color: #7cb78e !important;
  color: #fff !important;
}
