/* CARDDEX web materials. Glass belongs to navigation and controls, not product data. */
@media screen {
  :root {
    --glass-surface: rgba(255, 255, 255, .9);
    --glass-panel: rgba(255, 255, 255, .98);
    --glass-edge: rgba(255, 255, 255, .98);
    --glass-shadow: 0 14px 44px rgba(43, 48, 52, .10), 0 2px 8px rgba(43, 48, 52, .04);
    --glass-blur: blur(22px) saturate(125%);
    --control-ease: cubic-bezier(.2, .7, .2, 1);
    color-scheme: light;
  }

  .site-header {
    background: #fff;
    border-bottom-color: #e4e6e6;
    box-shadow: 0 8px 24px rgba(43, 48, 52, .035), inset 0 -1px 0 #fff;
  }
  .corporate-top { background: #f4f5f5; }
  .site-header .header-search {
    border: 1px solid #e2e5e6;
    border-radius: 17px;
    background: rgba(239, 241, 242, .85);
    box-shadow: inset 0 1px 2px rgba(43, 48, 52, .035), 0 1px 0 #fff;
  }
  .header-search button { border-radius: 12px; min-height: 44px; }
  .site-header .head-actions > a, .site-header .menu-toggle {
    min-height: 44px; min-width: 44px; border-radius: 14px;
  }
  .site-header .head-actions > a { padding-inline: 9px; }
  .site-header .head-actions > a:hover, .site-header .menu-toggle:hover {
    background: #f0f2f3;
  }
  #catalog-tree-toggle {
    min-height: 44px; padding: 10px 14px; border-radius: 14px;
    background: #f1f3f3; color: var(--ink);
    box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(43, 48, 52, .03);
  }
  #catalog-tree-toggle:hover, #catalog-tree-toggle[aria-expanded="true"] {
    color: var(--red); background: #f3eae8;
  }
  #primary-nav a { border-radius: 12px; }
  #primary-nav a[aria-current="page"] { color: var(--red); background: #f6eeec; }
  .catalog-tree.catalog-list-panel {
    margin-top: 8px; border: 1px solid #dce0e1; border-radius: 22px;
    box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-edge);
    background: #fff;
  }
  .catalog-list-panel .tree-heading { padding: 12px 18px; }
  .catalog-list-panel .tree-heading button,
  .quick-cart-heading > button, .dialog-close {
    min-width: 44px; min-height: 44px; border-radius: 50%;
    background: #f0f2f3;
  }
  .catalog-list-group summary { min-height: 52px; }
  .catalog-list-links a { min-height: 44px; }
  .catalog-list-links a:hover { background: #f0f2f3; }
  .quick-cart {
    border-radius: 26px; border-color: #dce0e1;
    background: #fff;
    box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-edge);
  }
  .quick-cart-quantity > div { border-radius: 15px; background: #edf0f1; }
  .quick-cart-quantity button { border-radius: 15px; }
  .quick-cart-footer a, .quick-cart-footer button { min-height: 44px; }
  .privacy-controls {
    border-radius: 24px; background: #fff; border-color: #dce0e1;
    box-shadow: var(--glass-shadow), inset 0 1px 0 var(--glass-edge);
  }
  .hero-caption {
    border-radius: 18px; background: #fff;
    box-shadow: 0 4px 16px rgba(43, 48, 52, .04), inset 0 1px 0 #fff;
  }
  .button {
    min-height: 48px; border-radius: 15px;
    transition: background .2s var(--control-ease), color .2s var(--control-ease),
      box-shadow .2s var(--control-ease), transform .16s var(--control-ease);
  }
  .button.primary {
    background: linear-gradient(180deg, #bb4034, #a93025);
    border-color: #a52e25;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 2px 4px rgba(114, 40, 32, .10);
    color: #fff;
  }
  .button.primary:hover { background: #982b22; }
  .button.outline {
    background: linear-gradient(180deg, #fff, #f7f8f8);
    border-color: #b9bfc2;
    box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(43, 48, 52, .035);
  }
  .button.outline:hover { background: #edf0f1; border-color: #899297; }
  .button:active, .icon-button:active, #catalog-tree-toggle:active { transform: scale(.98); }
  .compare-button { width: 44px; height: 44px; border-radius: 50%; }
  .add-button { min-height: 44px; min-width: 44px; border-radius: 13px; }
  .copy-sku { min-height: 44px; border-radius: 12px; }
  .view-switch { border-radius: 14px; background: #edf0f1; padding: 3px; gap: 3px; }
  .view-switch button { border-radius: 10px; }
  .view-switch button[aria-pressed="true"] { background: #fff; box-shadow: 0 1px 4px #2b303414; }
  .filters .check-label { min-height: 44px; align-items: center; margin-top: 10px; }
  .filters .check-label input { margin-top: 0; }
  .price-range input, input, select, textarea { border-radius: 12px; }
  input:focus-visible, select:focus-visible, textarea:focus-visible,
  button:focus-visible, a:focus-visible, summary:focus-visible {
    outline: 3px solid #8a281f; outline-offset: 3px;
  }
  .skip:focus { border-radius: 0 0 14px 0; }
  h1, h2, h3 { text-wrap: balance; }
  .card-bottom, .purchase-panel, .quick-cart-total, #estimate-total {
    font-variant-numeric: tabular-nums;
  }
  .product-card, .purchase-panel, .product-section, .doc-card { backdrop-filter: none; }
  .product-card { border-radius: 16px; }
  .image-unavailable { color: #566168; }
  .hero-visual, .product-visual, .product-image { border-radius: 22px; }
  .corporate-footer { background: #f4f5f5; }
  .footer-legal > a, .footer-legal > button { min-height: 44px; display: inline-flex; align-items: center; }
  [data-appearance-open][hidden] { display: none; }

  .appearance-dialog {
    width: min(460px, calc(100% - 32px)); max-height: calc(100dvh - 32px);
    overflow: auto; overscroll-behavior: contain; padding: 28px;
    border: 1px solid #dce0e1; border-radius: 28px; background: #fff;
    color: var(--ink); box-shadow: var(--glass-shadow);
  }
  .appearance-dialog::backdrop { background: rgba(37, 40, 42, .28); }
  .appearance-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  .appearance-heading h2 { font-size: 26px; }
  .appearance-heading button { flex: none; }
  .appearance-dialog > p { font-size: 14px; color: #596167; margin-block: 16px 20px; }
  .appearance-option {
    display: flex; align-items: flex-start; gap: 12px; padding-block: 16px;
    min-height: 56px; font-size: 15px; font-weight: 500;
  }
  .appearance-option input { width: 22px; height: 22px; min-height: 22px; flex: none; margin: 1px 0 0; accent-color: var(--red); }
  .appearance-option small { display: block; font-size: 13px; font-weight: 400; color: #596167; margin-top: 4px; }
  .appearance-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 20px; }
  .appearance-status { display: block; min-height: 20px; margin-top: 14px; font-size: 13px; color: #596167; }
  body:has(.appearance-dialog[open]) { overflow: hidden; }

  /* Solid paint is the default fallback; blur is a progressive enhancement. */
  @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .site-header {
      background: var(--glass-surface);
      -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
    }
    .catalog-tree.catalog-list-panel, .quick-cart, .privacy-controls, .appearance-dialog {
      background: var(--glass-panel);
      -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
    }
    .hero-caption {
      background: rgba(255, 255, 255, .91);
      -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
    }
  }

  /* Device preferences always take priority over decorative effects. */
  :root[data-transparency="reduced"] :is(.site-header, .catalog-tree.catalog-list-panel, .quick-cart, .privacy-controls, .appearance-dialog, .hero-caption, .product-dock, .compare-tray) {
    background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none;
  }
  :root[data-motion="reduced"] { scroll-behavior: auto; }
  :root[data-motion="reduced"] *, :root[data-motion="reduced"] *::before, :root[data-motion="reduced"] *::after {
    animation: none !important; transition: none !important; scroll-behavior: auto !important;
  }
  :root[data-motion="reduced"] :is(.button, .icon-button, #catalog-tree-toggle):active { transform: none; }
  @media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
    :is(.site-header, .catalog-tree.catalog-list-panel, .quick-cart, .privacy-controls, .appearance-dialog, .hero-caption, .product-dock, .compare-tray) {
      background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none;
    }
  }
  @media (prefers-contrast: more) {
    :root { --muted: #434a4e; --line: #899297; }
    .button.outline, input, select, textarea, .catalog-tree.catalog-list-panel, .quick-cart { border-color: #69747a; }
    .button.primary { background: #92271f; }
    .product-card { border-color: #899297; }
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
    :is(.button, .icon-button, #catalog-tree-toggle):active { transform: none; }
  }
  @media (forced-colors: active) {
    .site-header, .catalog-tree.catalog-list-panel, .quick-cart, .appearance-dialog { background: Canvas; border: 1px solid CanvasText; box-shadow: none; }
    .button.primary { background: ButtonFace; color: ButtonText; border-color: ButtonText; }
  }

  @media (max-width: 850px) {
    .catalog-tree.catalog-list-panel { left: 12px; right: 12px; width: auto; border-radius: 22px; max-height: calc(100dvh - var(--header-offset) - 20px); }
    #primary-nav.open { border-radius: 20px; box-shadow: var(--glass-shadow); padding: 12px; background: #fff; }
    #primary-nav.open a { padding: 12px; min-height: 48px; }
    .product-dock, .compare-tray { border-radius: 22px; border: 1px solid #dce0e1; background: #fff; box-shadow: var(--glass-shadow); }
    @supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
      .product-dock, .compare-tray { background: var(--glass-panel); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
    }
    .product-dock { left: 10px; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); padding: 10px 12px; }
    .has-product-dock { padding-bottom: calc(115px + env(safe-area-inset-bottom)); }
    .has-product-dock #toast { bottom: calc(102px + env(safe-area-inset-bottom)); }
    /* These must follow the mobile enhancement to keep user preferences authoritative. */
    :root[data-transparency="reduced"] :is(.product-dock, .compare-tray) { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
    @media (prefers-reduced-transparency: reduce), (prefers-contrast: more) {
      .product-dock, .compare-tray { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
    }
  }
  @media (max-width: 600px) {
    .site-header .head { grid-template-columns: minmax(0, 1fr) 44px 44px; gap: 10px 4px; }
    .site-header .head-actions > a { min-height: 44px; padding-inline: 0; }
    .site-header .head-actions > .menu-toggle { top: 7px; padding: 10px; }
    .site-header .brand-group { padding-right: 50px; }
    .header-search button { min-width: 44px; font-size: 11px; padding-inline: 6px; }
    .header-search input { font-size: 16px; }
    .header-search > svg { width: 16px; }
    .catalog-navigation { min-height: 56px; }
    .quick-cart { border-radius: 24px; bottom: max(12px, env(safe-area-inset-bottom)); }
    .privacy-controls { bottom: max(12px, env(safe-area-inset-bottom)); max-height: calc(100dvh - 24px); overflow: auto; }
    .privacy-controls p { font-size: 13px; }
    input, select, textarea, label input, label select, label textarea { font-size: 16px; }
    .appearance-dialog { padding: 22px; }
    .appearance-actions .button { flex: 1; }
  }
  @media (max-width: 380px) {
    .site-header .owner-brand, .site-header .owner-brand img { width: 120px; }
    .site-header .manufacturer-brand img { width: 80px; }
    .site-header .brand-group { gap: 12px; }
    .header-search > svg { display: none; }
    .header-search input { width: 100%; padding-inline: 0; }
    .site-header .header-search { padding-left: 8px; gap: 4px; }
    .appearance-actions { flex-direction: column; }
  }
}
@media print {
  .appearance-dialog, [data-appearance-open] { display: none !important; }
}