@mantine/core/styles/NumberInput.layer.css

React components library focused on usability, accessibility and developer experience

@layer mantine {.m-e2f5cd4e{--ni-right-section-width-xs:calc(1.0625rem*var(--mantine-scale));--ni-right-section-width-sm:calc(1.5rem*var(--mantine-scale));--ni-right-section-width-md:calc(1.6875rem*var(--mantine-scale));--ni-right-section-width-lg:calc(1.9375rem*var(--mantine-scale));--ni-right-section-width-xl:calc(2.125rem*var(--mantine-scale))}.m-95e17d22{--ni-chevron-size-xs:calc(0.625rem*var(--mantine-scale));--ni-chevron-size-sm:calc(0.875rem*var(--mantine-scale));--ni-chevron-size-md:calc(1rem*var(--mantine-scale));--ni-chevron-size-lg:calc(1.125rem*var(--mantine-scale));--ni-chevron-size-xl:calc(1.25rem*var(--mantine-scale));--ni-chevron-size:var(--ni-chevron-size-sm);display:flex;flex-direction:column;height:calc(var(--_input-height) - .125rem*var(--mantine-scale));margin-left:auto;margin-right:0;max-width:calc(var(--ni-chevron-size)*1.7);width:100%}:where([dir=rtl]) .m-95e17d22{margin-left:0;margin-right:auto}.m-80b4b171{--control-border:calc(0.0625rem*var(--mantine-scale)) solid var(--_input-bd);--control-radius:calc(var(--_input-radius) - 0.0625rem*var(--mantine-scale));align-items:center;background-color:transparent;border-left:var(--control-border);color:var(--mantine-color-text);cursor:pointer;display:flex;flex:0 0 50%;height:calc(var(--_input-height)/2 - .0625rem*var(--mantine-scale));justify-content:center;padding:0;width:100%}.m-80b4b171:where(:disabled){background-color:transparent;cursor:not-allowed;opacity:.6}:where([data-mantine-color-scheme=light]) .m-80b4b171:where(:disabled){color:var(--mantine-color-gray-4)}:where([data-mantine-color-scheme=dark]) .m-80b4b171:where(:disabled){color:var(--mantine-color-dark-3)}.m-e2f5cd4e[data-error] :where(.m-80b4b171){color:var(--mantine-color-error)}:where([dir=rtl]) .m-80b4b171{border-left:none;border-right:var(--control-border)}@media (hover:hover){:where([data-mantine-color-scheme=light]) .m-80b4b171:hover{background-color:var(--mantine-color-gray-0)}:where([data-mantine-color-scheme=dark]) .m-80b4b171:hover{background-color:var(--mantine-color-dark-4)}}@media (hover:none){:where([data-mantine-color-scheme=light]) .m-80b4b171:active{background-color:var(--mantine-color-gray-0)}:where([data-mantine-color-scheme=dark]) .m-80b4b171:active{background-color:var(--mantine-color-dark-4)}}.m-80b4b171:where(:first-of-type){border-bottom:calc(.03125rem*var(--mantine-scale)) solid var(--_input-bd);border-radius:0 var(--control-radius) 0 0}:where([dir=rtl]) .m-80b4b171:where(:first-of-type){border-radius:var(--control-radius) 0 0 0}.m-80b4b171:last-of-type{border-radius:0 0 var(--control-radius) 0;border-top:calc(.03125rem*var(--mantine-scale)) solid var(--_input-bd)}[dir=rtl] .m-80b4b171:last-of-type{border-radius:0 0 0 var(--control-radius)}}