.area-calculator{display:grid;gap:calc(2.5 * var(--space-unit))}.area-calculator[hidden]{display:none}.area-calculator__header{display:flex;flex-wrap:wrap;gap:calc(1 * var(--space-unit)) calc(3 * var(--space-unit));align-items:baseline;justify-content:space-between}.area-calculator__title{color:rgb(var(--heading-color));font-weight:700}.area-calculator__coverage{color:rgba(var(--text-color) / .7);font-size:1.4rem}.area-calculator__field{display:flex;align-items:stretch;overflow:hidden;border:1px solid rgba(var(--text-color) / .2);border-radius:var(--input-border-radius, 8px);background-color:rgb(var(--input-bg-color, 255 255 255))}.area-calculator__field:focus-within{border-color:rgb(var(--text-color))}.area-calculator__input.input{flex:1 1 auto;min-width:0;border:0;border-radius:0;background:transparent;box-shadow:none}.area-calculator__input.input:focus,.area-calculator__input.input:focus-visible{outline:none;box-shadow:none}.area-calculator__unit{display:grid;place-items:center;min-width:5.2rem;padding-inline:calc(3 * var(--space-unit));border-left:1px solid rgba(var(--text-color) / .2);background-color:rgba(var(--text-color) / .04);color:rgba(var(--text-color) / .7);font-size:1.4rem}.area-calculator__waste{display:inline-flex;gap:calc(2 * var(--space-unit));align-items:center;width:fit-content;color:rgb(var(--heading-color));font-size:1.4rem;font-weight:700;cursor:pointer}.area-calculator__waste input{width:18px;height:18px;margin:0;accent-color:rgb(var(--btn-secondary-bg-color, var(--link-color)))}.area-calculator__info{display:inline-flex;color:rgba(var(--text-color) / .6);cursor:help}.area-calculator__info svg{width:16px;height:16px}.area-calculator__result{margin:0;padding:calc(3 * var(--space-unit)) calc(3.5 * var(--space-unit));border-left:3px solid rgb(var(--link-color));border-radius:6px;background-color:rgba(var(--text-color) / .04)}.area-calculator__result[hidden]{display:none}.area-calculator__result strong{display:block;color:rgb(var(--heading-color));font-size:1.6rem}.area-calculator__result small{color:rgba(var(--text-color) / .7);font-size:1.3rem}
/*# sourceMappingURL=/cdn/shop/t/12/assets/area-calculator.css.map */