{"version":3,"file":"blocks/AjaxSearch/style-index.css","mappings":";;;AAAA;;;;;;;;EAAA;AAkBA;EACC;EACA;AARD;;AAYA;EACC;AATD;;AAYA;EACC;AATD;;AAYA;EACC;AATD;;AAcC;EACC;AAXF;AAcC;;EAEC;AAZF;;AAiBA;EACC;EACA;EACA;AAdD;;AAkBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAfD;;AAmBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAhBD;AAkBC;EACC;EACA;AAhBF;AAcC;EACC;EACA;AAhBF;AAoBC;EAEC;EACA;AAnBF;;AAwBA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AArBD;AAuBC;EACC;EACA;AArBF;AAwBC;EACC;AAtBF;AAyBC;EACC;EACA;EACA;EACA;AAvBF;;AA4BA;EACC;EACA;EACA;EACA;EACA;EACA,mBA1HiB;EA2HjB,0CA5HiB;EA6HjB;EACA;EACA;AAzBD;AA2BC;EACC;AAzBF;AA8BE;EACC;AA5BH;AA+BE;EACC;AA7BH;AAgCE;EACC;AA9BH;;AAoCA;EACC;EACA;AAjCD;;AAqCA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;AAlCD;AAoCC;EACC;AAlCF;AAqCC;EACC;AAnCF;;AAwCA;EACC,WA9KmB;EA+KnB,YA/KmB;EAgLnB,eAhLmB;EAiLnB;EACA;KAAA;EACA;AArCD;AAuCC;EACC;AArCF;;AA0CA;EACC;EACA;EACA;EACA;EACA;AAvCD;;AA0CA;EACC;EACA;EACA;EACA;EACA;EACA;AAvCD;;AA0CA;EACC;EACA;EACA;EACA;EACA;EACA;AAvCD;;AA0CA;EACC;EACA;EACA;AAvCD;;AA2CA;EACC;EACA;AAxCD;;AA2CA;EACC;EACA;EACA;EACA;AAxCD;;AA2CA;EACC,WAzOmB;EA0OnB,YA1OmB;EA2OnB,eA3OmB;EA4OnB;EACA;EACA;AAxCD;;AA2CA;EACC;EACA;EACA;EACA;AAxCD;;AA2CA;EACC;EACA;EACA;EACA;EACA;EACA;AAxCD;;AA2CA;EACC;EACA;EACA;EACA;EACA;EACA;AAxCD;;AA4CA;EACC;EACA;AAzCD;AA2CC;EACC;AAzCF;AA4CC;EACC;EACA;EACA;AA1CF;;AA+CA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA5CD;AA8CC;EACC;AA5CF;AA+CC;EACC;AA7CF;;AAkDA;EACC;EACA;EACA;EACA;AA/CD;;AAkDA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AA/CD;AAiDC;EACC;AA/CF;AAkDC;EACC;EACA;AAhDF;;AAqDA;EACC;IACC;IACA;EAlDA;EAoDD;IACC;IACA;EAlDA;AACF;AAqDA;EACC;IACC;EAnDA;EAqDD;IACC;EAnDA;EAqDD;IACC;EAnDA;AACF;AAuDA;EACC;IACC;EArDA;AACF,C","sources":["webpack://brandy-blocks/./src/blocks/AjaxSearch/style.scss"],"sourcesContent":["/**\n * Ajax Search Block Styles\n *\n * Pill-shaped search input with live results dropdown.\n * BEM naming: .brandy-ajax-search__{element}--{modifier}\n * All visual values driven by CSS custom properties set via block attributes.\n *\n * @package BrandyBlocks\n */\n\n// Layout variables (non-configurable).\n$dropdown-shadow: 0 8px 32px rgba(0, 0, 0, 0.12);\n$dropdown-radius: 16px;\n$result-image-size: 48px;\n$transition-fast: 0.2s ease;\n$transition-medium: 0.3s ease;\n\n// Wrapper — width controlled by attribute class.\n.brandy-ajax-search-wrapper {\n\tposition: relative;\n\twidth: 100%;\n}\n\n// Width attribute classes.\n.brandy-ajax-search__width-25 {\n\tmax-width: 25%;\n}\n\n.brandy-ajax-search__width-50 {\n\tmax-width: 50%;\n}\n\n.brandy-ajax-search__width-75 {\n\tmax-width: 75%;\n}\n\n// Editor wrapper.\n.brandy-ajax-search-editor {\n\t.brandy-ajax-search {\n\t\tpointer-events: none;\n\t}\n\n\t.brandy-ajax-search__input,\n\t.brandy-ajax-search__button {\n\t\tcursor: default;\n\t}\n}\n\n// Form.\n.brandy-ajax-search {\n\tposition: relative;\n\twidth: 100%;\n\tcolor: var(--brandy-ajax-search-input-color, inherit);\n}\n\n// Pill-shaped input wrapper.\n.brandy-ajax-search__input-wrapper {\n\tdisplay: flex;\n\talign-items: center;\n\tbackground: var(--brandy-ajax-search-wrapper-bg, #ffffff);\n\tborder-radius: var(--brandy-ajax-search-wrapper-radius, 50px);\n\theight: var(--brandy-ajax-search-wrapper-height, 56px);\n\tgap: var(--brandy-ajax-search-btn-gap, 6px);\n\tpadding: 6px;\n\tborder-width: var(--brandy-ajax-search-wrapper-border-width, 0);\n\tborder-style: var(--brandy-ajax-search-wrapper-border-style, none);\n\tborder-color: var(--brandy-ajax-search-wrapper-border-color, transparent);\n}\n\n// Text input.\n.brandy-ajax-search__input {\n\tflex: 1;\n\tborder: none;\n\tbackground: transparent;\n\tfont-size: var(--brandy-ajax-search-input-font-size, 15px);\n\tline-height: 1.4;\n\tcolor: inherit;\n\toutline: none;\n\tpadding: 0 12px 0 0;\n\theight: 100%;\n\tmin-width: 0;\n\n\t&::placeholder {\n\t\tcolor: var(--brandy-ajax-search-input-placeholder, inherit);\n\t\topacity: var(--brandy-ajax-search-placeholder-opacity, 0.5);\n\t}\n\n\t// Remove default search input styling.\n\t&::-webkit-search-cancel-button,\n\t&::-webkit-search-decoration {\n\t\t-webkit-appearance: none;\n\t\tappearance: none;\n\t}\n}\n\n// Circular search button.\n.brandy-ajax-search__button {\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\twidth: var(--brandy-ajax-search-btn-size, 40px);\n\theight: var(--brandy-ajax-search-btn-size, 40px);\n\tmin-width: var(--brandy-ajax-search-btn-size, 40px);\n\tborder-radius: var(--brandy-ajax-search-btn-radius, 50px);\n\tbackground: var(--brandy-ajax-search-btn-bg, #111111);\n\tborder: none;\n\tcursor: pointer;\n\tpadding: 0;\n\ttransition: background $transition-fast, transform $transition-fast;\n\n\t&:hover {\n\t\topacity: 0.85;\n\t\ttransform: scale(1.05);\n\t}\n\n\t&:active {\n\t\ttransform: scale(0.95);\n\t}\n\n\tsvg {\n\t\tdisplay: block;\n\t\twidth: 60%;\n\t\theight: 60%;\n\t\tfill: var(--brandy-ajax-search-btn-icon, #FFFFFF);\n\t}\n}\n\n// Results dropdown.\n.brandy-ajax-search__results {\n\tposition: absolute;\n\ttop: calc(100% + 8px);\n\tleft: 0;\n\tright: 0;\n\tbackground: #fff;\n\tborder-radius: $dropdown-radius;\n\tbox-shadow: $dropdown-shadow;\n\tz-index: 100;\n\toverflow: hidden;\n\tanimation: brandyAjaxSearchFadeIn $transition-medium;\n\n\t&[hidden] {\n\t\tdisplay: none;\n\t}\n\n\t// Loading modifier: show skeleton, hide results list.\n\t&--loading {\n\t\t.brandy-ajax-search__results-list {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t.brandy-ajax-search__no-results {\n\t\t\tdisplay: none;\n\t\t}\n\n\t\t.brandy-ajax-search__skeleton {\n\t\t\tdisplay: block;\n\t\t}\n\t}\n}\n\n// Results list.\n.brandy-ajax-search__results-list {\n\tmax-height: 400px;\n\toverflow-y: auto;\n}\n\n// Single result item.\n.brandy-ajax-search__result-item {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tpadding: 12px 16px;\n\ttext-decoration: none;\n\tcolor: inherit;\n\ttransition: background $transition-fast;\n\n\t&:hover {\n\t\tbackground: rgba(0, 0, 0, 0.03);\n\t}\n\n\t&:not(:last-child) {\n\t\tborder-bottom: 1px solid rgba(0, 0, 0, 0.06);\n\t}\n}\n\n// Result image.\n.brandy-ajax-search__result-image {\n\twidth: $result-image-size;\n\theight: $result-image-size;\n\tmin-width: $result-image-size;\n\tborder-radius: 8px;\n\tobject-fit: cover;\n\tbackground: rgba(0, 0, 0, 0.05);\n\n\t&--placeholder {\n\t\tbackground: rgba(0, 0, 0, 0.08);\n\t}\n}\n\n// Result text content.\n.brandy-ajax-search__result-content {\n\tflex: 1;\n\tmin-width: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 2px;\n}\n\n.brandy-ajax-search__result-title {\n\tfont-size: 14px;\n\tfont-weight: 600;\n\tcolor: inherit;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n}\n\n.brandy-ajax-search__result-excerpt {\n\tfont-size: 12px;\n\tcolor: inherit;\n\topacity: 0.6;\n\twhite-space: nowrap;\n\toverflow: hidden;\n\ttext-overflow: ellipsis;\n}\n\n.brandy-ajax-search__result-price {\n\tfont-size: 13px;\n\tfont-weight: 600;\n\tmargin-top: 2px;\n}\n\n// Skeleton loading.\n.brandy-ajax-search__skeleton {\n\tdisplay: none;\n\tpadding: 4px 0;\n}\n\n.brandy-ajax-search__skeleton-item {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 12px;\n\tpadding: 12px 16px;\n}\n\n.brandy-ajax-search__skeleton-image {\n\twidth: $result-image-size;\n\theight: $result-image-size;\n\tmin-width: $result-image-size;\n\tborder-radius: 8px;\n\tbackground: rgba(0, 0, 0, 0.08);\n\tanimation: brandyAjaxSearchShimmer 1.5s ease-in-out infinite;\n}\n\n.brandy-ajax-search__skeleton-content {\n\tflex: 1;\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 8px;\n}\n\n.brandy-ajax-search__skeleton-title {\n\theight: 14px;\n\twidth: 70%;\n\tborder-radius: 4px;\n\tbackground: rgba(0, 0, 0, 0.08);\n\tanimation: brandyAjaxSearchShimmer 1.5s ease-in-out infinite;\n\tanimation-delay: 0.1s;\n}\n\n.brandy-ajax-search__skeleton-excerpt {\n\theight: 10px;\n\twidth: 50%;\n\tborder-radius: 4px;\n\tbackground: rgba(0, 0, 0, 0.08);\n\tanimation: brandyAjaxSearchShimmer 1.5s ease-in-out infinite;\n\tanimation-delay: 0.2s;\n}\n\n// No results.\n.brandy-ajax-search__no-results {\n\tpadding: 24px 16px;\n\ttext-align: center;\n\n\t&[hidden] {\n\t\tdisplay: none;\n\t}\n\n\tp {\n\t\tmargin: 0;\n\t\tfont-size: 14px;\n\t\topacity: 0.5;\n\t}\n}\n\n// View all results link.\n.brandy-ajax-search__view-all {\n\tdisplay: block;\n\tpadding: 12px 16px;\n\ttext-align: center;\n\tfont-size: 13px;\n\tfont-weight: 600;\n\tcolor: inherit;\n\ttext-decoration: none;\n\tborder-top: 1px solid rgba(0, 0, 0, 0.06);\n\ttransition: background $transition-fast;\n\n\t&:hover {\n\t\tbackground: rgba(0, 0, 0, 0.03);\n\t}\n\n\t&[hidden] {\n\t\tdisplay: none;\n\t}\n}\n\n// Suggestion chips.\n.brandy-ajax-search__suggestions {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: var(--brandy-ajax-search-chip-gap, 8px);\n\tmargin-top: var(--brandy-ajax-search-suggestions-mt, 12px);\n}\n\n.brandy-ajax-search__suggestion-chip {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tpadding: 6px 14px;\n\tbackground: var(--brandy-ajax-search-chip-bg, rgba(0, 0, 0, 0.06));\n\tborder: none;\n\tborder-radius: var(--brandy-ajax-search-chip-radius, 12px);\n\tfont-size: var(--brandy-ajax-search-chip-font-size, 13px);\n\tcolor: var(--brandy-ajax-search-chip-color, inherit);\n\tcursor: pointer;\n\ttransition: background $transition-fast, color $transition-fast;\n\n\t&:hover {\n\t\tbackground: rgba(0, 0, 0, 0.1);\n\t}\n\n\t&:focus-visible {\n\t\toutline: 2px solid currentColor;\n\t\toutline-offset: 2px;\n\t}\n}\n\n// Animations.\n@keyframes brandyAjaxSearchFadeIn {\n\tfrom {\n\t\topacity: 0;\n\t\ttransform: translateY(-4px);\n\t}\n\tto {\n\t\topacity: 1;\n\t\ttransform: translateY(0);\n\t}\n}\n\n@keyframes brandyAjaxSearchShimmer {\n\t0% {\n\t\topacity: 0.6;\n\t}\n\t50% {\n\t\topacity: 1;\n\t}\n\t100% {\n\t\topacity: 0.6;\n\t}\n}\n\n// Responsive.\n@media (max-width: 480px) {\n\t.brandy-ajax-search-wrapper {\n\t\tmax-width: 100% !important;\n\t}\n}\n"],"names":[],"sourceRoot":""}