/* Functional components, separate from optional animation. */
.catalog-search-wrap { position:relative;min-width:0;z-index:5; }
.catalog-suggestions { position:absolute;inset:calc(100% + 7px) 0 auto;max-height:390px;overflow:auto;overscroll-behavior:contain;background:#fff;border:1px solid #b8cfc2;border-radius:10px;box-shadow:0 16px 40px #102e3520; }
.catalog-suggestions [role=option] { display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:12px 18px;border-bottom:1px solid var(--line); }
.catalog-suggestions [role=option]:last-child { border-bottom:0; }
.catalog-suggestions [role=option][aria-selected=true],.catalog-suggestions [role=option]:hover { background:var(--mint); }
.suggestion-name { font-size:14px;font-weight:500;display:block; }
.suggestion-spec { font-size:11px;display:block;color:var(--muted); }
.suggestion-price { font-size:12px;white-space:nowrap; }
.catalog-suggestions .no-suggestion { padding:18px;font-size:13px;color:var(--muted); }
.quantity-stepper { display:flex;align-items:stretch;border:1px solid #bfcec6;border-radius:5px;overflow:hidden; }
.quantity-stepper button { width:36px;min-height:44px;background:#f0f5f1;font-size:20px;padding:4px;flex-shrink:0; }
.quantity-stepper button:hover { background:var(--mint); }
.quantity-stepper input { width:62px;max-width:62px;min-height:44px;border:0!important;border-radius:0;text-align:center;padding:5px!important;appearance:textfield;-moz-appearance:textfield; }
.quantity-stepper input::-webkit-inner-spin-button,.quantity-stepper input::-webkit-outer-spin-button { -webkit-appearance:none;margin:0; }
.quantity-stepper button:focus-visible,.quantity-stepper input:focus-visible { outline-offset:-3px; }
.quick-toolbar { display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:50px;padding:0 48px 12px 0;border-bottom:1px solid var(--line);margin-bottom:20px; }
[dir=rtl] .quick-toolbar { padding:0 0 12px 48px; }
.quick-toolbar button { min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:4px;font-size:12px;padding:8px 12px; }
.quick-toolbar button:disabled { opacity:.4; }
.quick-position { font-size:11px;color:var(--muted);min-width:0;flex:1;text-align:center;overflow-wrap:anywhere;line-height:1.5; }
.quick-dialog { max-height:calc(100dvh - 40px);overflow:auto;overscroll-behavior:contain; }
.quick-dialog .quick-image { align-self:start; }
.quick-options { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;margin:16px 0; }
.quick-variant-label,.quick-qty-label { font-size:11px;display:flex;flex-direction:column;gap:6px;min-width:0; }
.quick-options select { min-width:0;width:100%;font-size:12px;min-height:44px;padding-inline:10px; }
.quick-qty-label input { min-height:44px;width:74px; }
#quick-title { scroll-margin-top:16px; }
.quote-item .quantity-stepper { width:max-content; }
.quote-item .quantity-stepper button { width:30px;min-height:36px;padding:0;font-size:18px; }
.quote-item .quantity-stepper input { width:47px;min-height:36px; }
.quote-item-actions label { display:flex;align-items:center;gap:8px; }
.toast { display:flex;align-items:center;gap:18px;max-width:calc(100vw - 32px); }
.toast button { color:inherit;text-decoration:underline;text-underline-offset:4px;padding:8px;min-height:40px;white-space:nowrap; }
.product-dock { display:none; }
@media (max-width:767px) {
  .product-dock { display:block;position:fixed;inset:auto 0 0;z-index:42;background:#fffffff7;border-top:1px solid #b9cec0;box-shadow:0 -8px 30px #102e350d;padding:10px 16px max(10px,env(safe-area-inset-bottom)); }
  .product-dock-inner { display:flex;gap:10px;align-items:center;max-width:var(--container);margin:auto; }
  .dock-summary { flex:1;min-width:0; }
  .dock-summary .eyebrow { font-size:8px;letter-spacing:.03em;line-height:1.4; }
  .dock-summary strong { display:block;font-size:16px;line-height:1.5; }
  [data-detail-count] { font-size:10px;color:var(--muted);display:block; }
  .product-dock .button { max-width:46%;min-height:44px;padding:10px 12px;font-size:11px;gap:7px; }
  .product-dock .icon-button { min-width:40px;min-height:44px; }
  body:has(.product-dock) { padding-bottom:calc(105px + env(safe-area-inset-bottom)); }
  body:has(.product-dock) .contact-float { bottom:115px; }
  body:has(.product-dock) .preview-indicator { bottom:99px; }
  body:has(.product-dock) .toast { bottom:110px; }
  body:has(dialog[open]) .product-dock { visibility:hidden; }
  .quick-toolbar { padding-inline-end:30px;gap:6px; }
  [dir=rtl] .quick-toolbar { padding-inline:0 30px; }
  .quick-toolbar button { font-size:10px;max-width:38%; }
  .quick-dialog { width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:16px; }
  .quick-layout { grid-template-columns:1fr;gap:18px; }
  .quick-image img { max-height:190px; }
  .quick-info { padding:0; }
  .quick-options { gap:8px; }
  .catalog-suggestions { max-height:320px; }
  .catalog-suggestions [role=option] { padding:12px;gap:8px; }
  .quantity-stepper button { width:32px; }
  .quantity-stepper input { width:50px; }
  .product-card { padding:9px;border-radius:12px; }
  .product-media { border-radius:8px; }
  .detail-purchase { gap:12px; }
}
@media print { .product-dock,.catalog-suggestions,.quick-toolbar { display:none!important; }body:has(.product-dock) { padding-bottom:0; } }

/* Notifications with actions belong to the dialog top layer, not its inert background. */
dialog .toast,body:has(.product-dock) dialog .toast { position:sticky;bottom:0;inset-inline:auto;transform:none;align-self:stretch;width:auto;max-width:100%;margin:8px 16px;z-index:2; }

.quote-item .quantity-stepper button { text-decoration:none; }
