/* TechShield Auto v4.0.4 — global authenticated header
   Every screen keeps its own eyebrow/title. Only layout is standardized. */

.topbar{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) max-content !important;
  grid-template-areas:
    "heading profile"
    "controls controls" !important;
  align-items:center !important;
  column-gap:28px !important;
  row-gap:16px !important;
  width:100%;
  min-height:0 !important;
  margin:0 0 24px !important;
}

.topbar>.page-heading{
  grid-area:heading;
  min-width:0;
  margin:0 !important;
  align-self:end;
}

.topbar>.page-heading .eyebrow{
  margin:0 0 5px !important;
  color:var(--amber);
  font-size:.72rem;
  line-height:1.15;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
  white-space:normal;
  overflow-wrap:anywhere;
}

.topbar>.page-heading h1{
  margin:0 !important;
  color:var(--navy);
  font-size:clamp(2rem,3vw,2.75rem) !important;
  line-height:1.02;
  letter-spacing:-.05em;
  text-wrap:balance;
}

.topbar>.profile{
  grid-area:profile;
  justify-self:end;
  align-self:center;
  display:flex;
  align-items:center;
  gap:12px;
  min-width:max-content;
  margin:0 !important;
}

.topbar>.profile>div:last-child{min-width:0}
.topbar>.profile strong{
  display:block;
  max-width:200px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  line-height:1.15;
}
.topbar>.profile span{
  display:block;
  margin-top:3px;
  line-height:1.15;
}

.topbar>.mobile-menu{display:none}

/* One code-level row for all workspace selectors. */
.app-header-controls{
  grid-area:controls;
  display:grid;
  grid-template-columns:150px minmax(205px,245px) minmax(280px,1fr) minmax(175px,200px) auto;
  align-items:stretch;
  gap:12px;
  width:100%;
  min-width:0;
}

.app-header-controls>.language-switch,
.app-header-controls>.workshop-switcher,
.app-header-controls>.v40-global-search,
.app-header-controls>.v40-location-switcher,
.app-header-controls>.v40-install-button{
  box-sizing:border-box;
  width:100%;
  min-width:0 !important;
  min-height:60px !important;
  height:60px;
  margin:0 !important;
}

/* Shared card surface. */
.app-header-controls>.language-switch,
.app-header-controls>.v40-global-search,
.app-header-controls>.v40-location-switcher,
.app-header-controls>.workshop-switcher .workshop-switcher-button{
  border:1px solid #d8e0e9 !important;
  border-radius:13px !important;
  background:#fff !important;
  box-shadow:0 3px 14px rgba(20,33,61,.035) !important;
}

/* LANGUAGE — same geometry and baseline as the other controls. */
.app-header-controls>.language-switch{
  display:grid !important;
  grid-template-rows:14px 1fr;
  align-content:center;
  align-items:center !important;
  gap:2px !important;
  padding:8px 13px 7px !important;
  color:#152744 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}

.app-header-controls>.language-switch>span,
.app-header-controls>.workshop-switcher .workshop-switcher-button small,
.app-header-controls>.v40-location-switcher label>small{
  display:block;
  margin:0 !important;
  color:#7a8799 !important;
  font-size:9px !important;
  line-height:12px !important;
  font-weight:900 !important;
  letter-spacing:.13em !important;
  text-transform:uppercase !important;
}

.app-header-controls>.language-switch select{
  align-self:center;
  width:100%;
  min-width:0;
  min-height:28px !important;
  height:28px !important;
  margin:0 !important;
  padding:0 22px 0 0 !important;
  border:0 !important;
  border-radius:0 !important;
  outline:0;
  background-color:transparent !important;
  box-shadow:none !important;
  color:#152744 !important;
  font-size:14px !important;
  line-height:28px !important;
  font-weight:800 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}

/* WORKSHOP */
.app-header-controls>.workshop-switcher{
  position:relative;
  max-width:none !important;
}
.app-header-controls>.workshop-switcher .workshop-switcher-button{
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  height:60px !important;
  min-height:60px !important;
  padding:8px 12px 7px 14px !important;
}
.app-header-controls>.workshop-switcher .workshop-switcher-button>span{
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-width:0;
  height:100%;
}
.app-header-controls>.workshop-switcher .workshop-switcher-button strong{
  margin-top:1px !important;
  font-size:14px !important;
  line-height:20px !important;
}

/* GLOBAL SEARCH */
.app-header-controls>.v40-global-search{
  position:relative;
  display:flex !important;
  align-items:center;
  gap:8px;
  padding:0 13px !important;
  max-width:none !important;
}
.app-header-controls>.v40-global-search>input{
  width:100%;
  min-width:0;
  min-height:58px !important;
  height:58px !important;
  padding:0 !important;
  border:0 !important;
  outline:0;
  background:transparent !important;
  font-size:14px;
  line-height:58px;
}
.app-header-controls>.v40-global-search>kbd{flex:none}

/* LOCATION */
.app-header-controls>.v40-location-switcher{
  display:grid !important;
  grid-template-columns:18px minmax(0,1fr);
  align-items:center;
  gap:9px;
  max-width:none !important;
  padding:8px 11px 7px !important;
  color:var(--navy);
}
.app-header-controls>.v40-location-switcher>span{
  align-self:center;
  color:#7d8ba0;
  font-size:16px;
}
.app-header-controls>.v40-location-switcher>label{
  display:grid;
  grid-template-rows:14px 1fr;
  align-items:center;
  gap:2px;
  min-width:0;
  height:100%;
}
.app-header-controls>.v40-location-switcher select{
  width:100%;
  min-width:0;
  min-height:28px !important;
  height:28px !important;
  margin:0 !important;
  padding:0 20px 0 0 !important;
  border:0 !important;
  outline:0;
  background-color:transparent !important;
  box-shadow:none !important;
  color:#152744;
  font-size:14px;
  line-height:28px !important;
  font-weight:800;
}

.app-header-controls>.v40-install-button{
  align-self:stretch;
  padding:0 14px !important;
  border-radius:13px !important;
  white-space:nowrap;
}

/* Dropdown/search overlays stay attached to their own control. */
.app-header-controls .workshop-switcher-menu,
.app-header-controls .v40-search-results{z-index:120}

/* On narrower desktops the search receives its own full-width row first. */
@media (max-width:1180px){
  .app-header-controls{
    grid-template-columns:minmax(140px,1fr) minmax(190px,1.35fr) minmax(170px,1.15fr);
  }
  .app-header-controls>.v40-global-search{
    grid-column:1/-1;
    grid-row:2;
  }
  .app-header-controls>.v40-install-button{grid-column:auto}
}

@media (max-width:820px){
  .topbar{
    grid-template-columns:auto minmax(0,1fr) auto !important;
    grid-template-areas:
      "menu heading profile"
      "controls controls controls" !important;
    column-gap:10px !important;
    row-gap:13px !important;
  }
  .topbar>.mobile-menu{
    grid-area:menu;
    display:block;
    align-self:center;
  }
  .topbar>.page-heading .eyebrow{font-size:.65rem}
  .topbar>.page-heading h1{font-size:clamp(1.7rem,7vw,2.2rem) !important}
  .topbar>.profile>div:last-child{display:none}
  .app-header-controls{
    grid-template-columns:1fr 1fr;
    gap:10px;
  }
  .app-header-controls>.v40-global-search{grid-column:1/-1;grid-row:auto}
  .app-header-controls>.v40-location-switcher{grid-column:auto}
  .app-header-controls>.v40-install-button{grid-column:1/-1;height:48px;min-height:48px !important}
}

@media (max-width:520px){
  .app-header-controls{grid-template-columns:1fr}
  .app-header-controls>.v40-global-search,
  .app-header-controls>.v40-install-button{grid-column:auto}
  .topbar>.profile{min-width:0}
}