/* 1.2.26: customer catalog only. Admin and the legacy interface keep their UI. */
body#coop-modern:not(.coop-modern-admin) .modern-filter-summary {
  display: flex; align-items: center; gap: 12px 20px;
  margin: 12px 24px 0; padding: 12px 14px;
  border: 1px solid var(--line); border-radius: 6px; background: var(--paper);
}
body#coop-modern:not(.coop-modern-admin) .modern-filter-summary p {
  flex: 1; min-width: 0; margin: 0; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere;
}
body#coop-modern:not(.coop-modern-admin) .modern-filter-reset {
  flex: 0 0 auto; min-height: 44px; padding: 8px 0; border: 0;
  background: transparent; color: var(--accent); font-size: 13px; cursor: pointer;
}
body#coop-modern:not(.coop-modern-admin) .modern-filter-reset:hover {
  text-decoration: underline; text-underline-offset: 4px;
}
body#coop-modern:not(.coop-modern-admin) #main-screen #filter-clear-btn { display: none !important; }
body#coop-modern:not(.coop-modern-admin) .modern-filter-summary[hidden],
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-strip[hidden] { display: none !important; }

/* Restore the previous cover photos, frame dimensions and hover effect.
   Only unavailable photos receive the tint; readable controls stay outside. */
body#coop-modern:not(.coop-modern-admin) .modern-product-card .product-image > img,
body#coop-modern:not(.coop-modern-admin) .modern-repeat-product .modern-repeat-photo > img { filter: none; }
@media (max-width: 390px) {
  body#coop-modern:not(.coop-modern-admin) .modern-header-inner .modern-brand { font-size: 24px; }
  body#coop-modern:not(.coop-modern-admin) .modern-header-inner .modern-brand span { font-size: 22px; }
}
body#coop-modern:not(.coop-modern-admin) .modern-product-card[data-modern-unavailable="true"] .product-image > img,
body#coop-modern:not(.coop-modern-admin) .modern-repeat-product[data-unavailable="true"] .modern-repeat-photo > img {
  filter: saturate(.65);
}
body#coop-modern:not(.coop-modern-admin) .modern-product-card[data-modern-unavailable="true"] .product-image::after,
body#coop-modern:not(.coop-modern-admin) .modern-repeat-product[data-unavailable="true"] .modern-repeat-photo::after {
  content: ''; position: absolute; inset: 0; background: #fff; opacity: .12; pointer-events: none;
}

/* The same compact group navigation stays below the measured site header
   on desktop and mobile; the large category heading scrolls out naturally. */
body#coop-modern:not(.coop-modern-admin) #category-screen #subcategory-toggle-btn { display: none !important; }
body#coop-modern:not(.coop-modern-admin) #category-screen > .modern-subcategory-strip {
  display: flex; position: sticky; top: var(--modern-subcategory-header, 76px);
  z-index: 40; align-items: center; gap: 4px; flex: 0 0 auto;
  width: 100%; min-width: 0; max-width: 100%; padding: 4px 24px;
  border-bottom: 1px solid var(--line); background: #fff;
}
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-scroll {
  display: flex; position: relative; gap: 6px; flex: 1; min-width: 0;
  overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none;
}
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-scroll::-webkit-scrollbar { display: none; }
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-button,
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-back {
  flex: 0 0 auto; min-height: 44px; border: 0; border-bottom: 2px solid transparent;
  background: #fff; color: var(--muted); font: inherit; font-size: 13px;
  line-height: 1.4; padding: 10px 12px; white-space: nowrap; cursor: pointer;
  transition: color .2s ease, background-color .2s ease;
}
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-back { min-width: 40px; padding: 8px; font-size: 20px; }
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-button[aria-pressed="true"] { color: var(--accent); }
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-button:hover,
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-back:hover { color: var(--accent); background: var(--soft-accent); }
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-indicator {
  position: absolute; left: 0; bottom: 0; height: 2px; background: var(--accent);
  pointer-events: none; transition: transform .24s ease, width .24s ease;
}
body#coop-modern:not(.coop-modern-admin) .modern-subcategory-indicator[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) {
  body#coop-modern:not(.coop-modern-admin) .modern-subcategory-indicator,
  body#coop-modern:not(.coop-modern-admin) .modern-subcategory-button,
  body#coop-modern:not(.coop-modern-admin) .modern-subcategory-back { transition: none; }
}

@media (max-width: 900px) {
  body#coop-modern:not(.coop-modern-admin) .modern-header-inner { height: 56px; gap: 8px; }
  body#coop-modern:not(.coop-modern-admin) .modern-service-bar { margin-top: 0; padding: 6px 16px; }
  body#coop-modern:not(.coop-modern-admin) .modern-search-trigger { display: none; }
  body#coop-modern:not(.coop-modern-admin).search-fullscreen .search-panel { top: 56px; }
  body#coop-modern:not(.coop-modern-admin) .modern-point-trigger { min-height: 40px; gap: 8px; }
  body#coop-modern:not(.coop-modern-admin) .modern-point-trigger small { display: none; }
  body#coop-modern:not(.coop-modern-admin) .modern-point-trigger strong { font-size: 12px; }
  body#coop-modern:not(.coop-modern-admin) .modern-point-trigger > svg { width: 18px; height: 18px; flex-basis: 18px; }
  body#coop-modern:not(.coop-modern-admin) .modern-point-trigger .modern-change { font-size: 11px; margin-left: 8px; }
  body#coop-modern:not(.coop-modern-admin) #main-screen .app-header,
  body#coop-modern:not(.coop-modern-admin) #category-screen .app-header { padding-top: 10px; }
  body#coop-modern:not(.coop-modern-admin) #main-screen .header-row,
  body#coop-modern:not(.coop-modern-admin) #category-screen .header-row { min-height: 36px; }
  body#coop-modern:not(.coop-modern-admin) #main-header-title,
  body#coop-modern:not(.coop-modern-admin) #category-screen .header-title {
    font-size: 24px; line-height: 1.2; letter-spacing: -.6px;
  }
  body#coop-modern:not(.coop-modern-admin) #main-screen .top-tabs {
    margin-top: 8px; gap: 4px !important; overscroll-behavior-x: contain;
  }
  body#coop-modern:not(.coop-modern-admin) #main-screen .top-tabs .tab-btn {
    flex: 0 0 auto; min-height: 44px; padding: 10px 12px;
    font-size: 12px; line-height: 1.4; white-space: nowrap; text-overflow: clip;
  }
  body#coop-modern:not(.coop-modern-admin) .modern-filter-summary { margin: 12px 16px 0; }
  body#coop-modern:not(.coop-modern-admin) #category-screen > .modern-subcategory-strip {
    top: var(--modern-subcategory-header, 56px); padding: 4px 12px;
  }
  body#coop-modern:not(.coop-modern-admin) .modern-subcategory-button { font-size: 12px; }
}

body#coop-modern:not(.coop-modern-admin) #main-screen .modern-eyebrow,
body#coop-modern:not(.coop-modern-admin) #main-screen .modern-catalog-note { display: none; }
body#coop-modern:not(.coop-modern-admin).modern-repeat-active .modern-breadcrumbs { display: none; }

/* 1.2.41: one category back control, with the original header as a fallback
   when no subcategory strip exists. Native/legacy templates stay unchanged. */
body#coop-modern:not(.coop-modern-admin) #category-screen > .app-header[data-modern-category-navigation="groups"] {
  display: none;
}

/* Native green focus shadow and modern red focus outline previously stacked.
   One green border stays visible for touch, mouse and keyboard focus. */
body#coop-modern:not(.coop-modern-admin) #search-input {
  border-width: 2px;
}
body#coop-modern:not(.coop-modern-admin) #search-input:focus,
body#coop-modern:not(.coop-modern-admin) #search-input:focus-visible {
  outline: none;
  box-shadow: none;
  border-color: var(--order-green, #208858);
}
