@mantine/core/styles/Combobox.css

React components library focused on usability, accessibility and developer experience

.m-88b62a41{--_combobox-padding:var(--combobox-padding,calc(0.25rem*var(--mantine-scale)));padding:var(--_combobox-padding)}.m-88b62a41[data-hidden]{display:none}.m-88b62a41,.m-b2821a6e{--combobox-option-padding-xs:calc(0.25rem*var(--mantine-scale)) calc(0.5rem*var(--mantine-scale));--combobox-option-padding-sm:calc(0.375rem*var(--mantine-scale)) calc(0.625rem*var(--mantine-scale));--combobox-option-padding-md:calc(0.5rem*var(--mantine-scale)) calc(0.75rem*var(--mantine-scale));--combobox-option-padding-lg:calc(0.625rem*var(--mantine-scale)) calc(1rem*var(--mantine-scale));--combobox-option-padding-xl:calc(0.875rem*var(--mantine-scale)) calc(1.25rem*var(--mantine-scale));--_combobox-option-padding:var(--combobox-option-padding,var(--combobox-option-padding-sm))}.m-92253aa5{background-color:var(--_option-bg,transparent);border-radius:var(--mantine-radius-default);color:var(--_option-color,inherit);cursor:var(--_option-cursor,pointer);font-size:var(--combobox-option-fz,var(--mantine-font-size-sm));opacity:var(--_option-opacity,1);padding:var(--_combobox-option-padding);word-break:break-word}.m-92253aa5[data-combobox-selected]{--_option-bg:var(--mantine-primary-color-filled);--_option-color:var(--mantine-color-white)}.m-92253aa5[data-combobox-disabled]{--_option-cursor:not-allowed;--_option-opacity:0.35}@media (hover:hover){[data-mantine-color-scheme=light] .m-92253aa5:hover:not([data-combobox-selected],[data-combobox-disabled]){--_option-bg:var(--mantine-color-gray-0)}[data-mantine-color-scheme=dark] .m-92253aa5:hover:not([data-combobox-selected],[data-combobox-disabled]){--_option-bg:var(--mantine-color-dark-7)}}@media (hover:none){[data-mantine-color-scheme=light] .m-92253aa5:active:not([data-combobox-selected],[data-combobox-disabled]){--_option-bg:var(--mantine-color-gray-0)}[data-mantine-color-scheme=dark] .m-92253aa5:active:not([data-combobox-selected],[data-combobox-disabled]){--_option-bg:var(--mantine-color-dark-7)}}.m-985517d8{background-color:var(--_search_background);border-bottom-left-radius:0;border-bottom-right-radius:0;border-left-width:0;border-right-width:0;border-top-width:0;margin:calc(var(--_combobox-padding)*-1) calc(var(--_combobox-padding)*-1) var(--_combobox-padding);position:relative;width:calc(100% + var(--_combobox-padding)*2)}.m-985517d8,.m-985517d8:focus{border-color:var(--_search-border-color)}[data-mantine-color-scheme=light] .m-985517d8{--_search-border-color:var(--mantine-color-gray-2);--_search_background:var(--mantine-color-white)}[data-mantine-color-scheme=dark] .m-985517d8{--_search-border-color:var(--mantine-color-dark-4);--_search_background:var(--mantine-color-dark-7)}.m-2530cd1d{color:var(--mantine-color-dimmed);text-align:center}.m-2530cd1d,.m-82b967cb,.m-858f94bd{font-size:var(--combobox-option-fz,var(--mantine-font-size-sm));padding:var(--_combobox-option-padding)}.m-82b967cb,.m-858f94bd{border:0 solid var(--_footer-border-color);margin-left:calc(var(--_combobox-padding)*-1);margin-right:calc(var(--_combobox-padding)*-1)}[data-mantine-color-scheme=light] .m-82b967cb,[data-mantine-color-scheme=light] .m-858f94bd{--_footer-border-color:var(--mantine-color-gray-2)}[data-mantine-color-scheme=dark] .m-82b967cb,[data-mantine-color-scheme=dark] .m-858f94bd{--_footer-border-color:var(--mantine-color-dark-4)}.m-82b967cb{border-top-width:calc(.0625rem*var(--mantine-scale));margin-bottom:calc(var(--_combobox-padding)*-1);margin-top:var(--_combobox-padding)}.m-858f94bd{border-bottom-width:calc(.0625rem*var(--mantine-scale));margin-bottom:var(--_combobox-padding);margin-top:calc(var(--_combobox-padding)*-1)}.m-254f3e4f:has(.m-2bb2e9e5:only-child){display:none}.m-2bb2e9e5{align-items:center;color:var(--mantine-color-dimmed);display:flex;font-size:calc(var(--combobox-option-fz, var(--mantine-font-size-sm))*.85);font-weight:500;padding:var(--_combobox-option-padding);position:relative}.m-2bb2e9e5:after{background-color:var(--_divider-bg);content:"";flex:1;height:calc(.0625rem*var(--mantine-scale));left:0;margin-left:var(--mantine-spacing-xs);right:0}[data-mantine-color-scheme=light] .m-2bb2e9e5:after{--_divider-bg:var(--mantine-color-gray-2)}[data-mantine-color-scheme=dark] .m-2bb2e9e5:after{--_divider-bg:var(--mantine-color-dark-4)}[dir=rtl] .m-2bb2e9e5:after{margin-left:unset;margin-right:var(--mantine-spacing-xs)}.m-2bb2e9e5:only-child{display:none}.m-2943220b{--combobox-chevron-size-xs:calc(0.875rem*var(--mantine-scale));--combobox-chevron-size-sm:calc(1.125rem*var(--mantine-scale));--combobox-chevron-size-md:calc(1.25rem*var(--mantine-scale));--combobox-chevron-size-lg:calc(1.5rem*var(--mantine-scale));--combobox-chevron-size-xl:calc(1.75rem*var(--mantine-scale));--combobox-chevron-size:var(--combobox-chevron-size-sm);color:var(--_color);height:var(--combobox-chevron-size);width:var(--combobox-chevron-size)}[data-mantine-color-scheme=light] .m-2943220b{--_color:var(--mantine-color-gray-6)}[data-mantine-color-scheme=dark] .m-2943220b{--_color:var(--mantine-color-dark-3)}.m-2943220b[data-error]{--_color:var(--mantine-color-error)}.m-71d052f9{margin-right:calc(var(--_combobox-padding)*-1)}[dir=rtl] .m-71d052f9{margin-left:calc(var(--_combobox-padding)*-1);margin-right:0}.m-390b5f4{align-items:center;display:flex;flex-direction:var(--_flex-direction,row);gap:calc(.5rem*var(--mantine-scale))}.m-390b5f4[data-reverse]{justify-content:space-between}.m-8ee53fc2{height:.8em;min-width:.8em;opacity:.4;width:.8em}[data-combobox-selected] .m-8ee53fc2{opacity:1}