/* Approved: compact labelled actions, short divider and vertical menu dots. */
.header-selected .contacts { gap: 2px; }
/* Keep the original 6px visible space between contact circles. */
.header-selected .icon-link { width: 38px; height: 44px; flex: 0 0 38px; }
.header-selected .icon-link img { width: 34px; height: 34px; }
.header-selected .header-account { gap: 6px; position: relative; border-left: 0; }
.header-selected .header-account::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 1px;
  height: 24px;
  background: #65778b70;
  transform: translateY(-50%);
  pointer-events: none;
}
.header-selected .header-action { width: 64px; min-height: 66px; }
.header-selected .header-action-label { display: block; }
.header-selected .header-action > svg { width: 25px; height: 25px; }
.header-selected .menu summary .menu-dots {
  display: block;
  width: 28px;
  height: 28px;
  transition: transform 160ms cubic-bezier(.2,.8,.2,1);
}
.header-selected .menu summary:focus-visible .menu-dots { transform: scale(1.1); }
@media (hover:hover) and (pointer:fine) {
  .header-selected .menu summary:hover .menu-dots { transform: scale(1.1); }
}
.header-selected .menu summary:active .menu-dots { transform: scale(.95); transition-duration: 80ms; }
/* Once the desktop row becomes tight, the logo owns a centred first row. */
@media (max-width:1050px) {
  .site-header.header-selected {
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "brand brand" "contacts tools";
    column-gap: 16px;
    row-gap: 18px;
    min-height: 0;
    padding: 22px 24px 18px;
  }
  .header-selected .brand { width: min(100%,383px); max-width: 383px; justify-self: center; margin: 0; }
  .header-selected .contacts { grid-area: contacts; justify-self: start; }
  .header-selected .header-tools { grid-area: tools; display: flex; justify-self: end; align-items: center; gap: 14px; }
  .header-selected .header-account { display: flex; grid-area: auto; padding: 0; border: 0; }
  .header-selected .header-action { min-height: 62px; }
  .header-selected .header-account::before { content: none; display: none; }
  .header-selected .menu { grid-area: auto; position: static; }
  .header-selected .menu-panel { top: calc(100% + 8px); right: 0; width: min(280px,100%); }
}
@media (max-width:760px) {
  .site-header.header-selected { column-gap: 12px; row-gap: 14px; padding: 20px 16px 16px; }
  .header-selected .brand { width: min(100%,300px); }
  .header-selected .icon-link { width: 33px; flex-basis: 33px; }
  .header-selected .icon-link img { width: 28.9px; height: 28.9px; }
  .header-selected .header-tools { gap: 8px; }
  .header-selected .header-account { gap: 4px; }
  .header-selected .header-action { width: 56px; min-height: 60px; padding: 6px; gap: 6px; }
  .header-selected .header-action > svg { width: 21.25px; height: 21.25px; }
  .header-selected .menu summary .menu-dots { width: 23.8px; height: 23.8px; }
  .header-selected .menu-panel { width: 100%; }
}
/* Eight compact buttons fit in one row at 360px, with 44px tap height. */
@media (max-width:520px) {
  .site-header.header-selected { column-gap: 8px; row-gap: 12px; padding-inline: 10px; }
  .header-selected .header-tools { gap: 4px; }
  .header-selected .header-account { gap: 2px; }
  .header-selected .header-action { width: 34px; min-height: 44px; border-radius: 10px; }
  .header-selected .header-action-label { display: none; }
  .header-selected .menu summary { width: 32px; height: 44px; }
  .header-selected .header-cart-count { top: 0; right: -2px; min-width: 15px; height: 15px; line-height: 15px; font-size: 9px; }
}
/* Only the narrowest screens split the two groups into separate rows. */
@media (max-width:349px) {
  .site-header.header-selected { grid-template-columns: minmax(0,1fr); grid-template-areas: "brand" "contacts" "tools"; row-gap: 8px; }
  .header-selected .brand { margin-bottom: 6px; }
  .header-selected .contacts, .header-selected .header-tools { justify-self: center; }
}
@media (prefers-reduced-motion:reduce) {
  .header-selected .menu summary .menu-dots { transition: none; transform: none !important; }
}
