@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&display=swap";.card--focus{background-color:var(--soft-red);background-image:url(../../images/logo.svg);background-repeat:no-repeat;background-position:center right 1.875rem}.header{color:#af0404}.wrapper{min-width:clamp(18.75rem,100%,34.375rem);padding-inline:.9375rem;margin-bottom:1.875rem}.card{background-color:#fff;padding:1.5625rem;border-radius:1rem;width:100%}.card--focus{background-color:var(--soft-red);background-image:url(/fem-expenses-chart-component/assets/logo-dd640623.svg);background-repeat:no-repeat;background-position:center right 1.875rem}.card__title{color:var(--dark-brown)}.card__title--big{font-size:2.8125rem;line-height:1}.card__title--focus{color:var(--pale-orange)}.card__subtitle{color:var(--medium-brown)}.card__subtitle--focus{color:var(--pale-orange)}.card__footer{padding-top:1.5625rem;padding-bottom:.5rem;border-top:.0625rem solid var(--cream);display:flex;flex-direction:row;justify-content:space-between;align-items:end}.card__chart{padding-block:1.875rem}.card__bold-text{font-weight:700;text-align:right}/*!
Mobile: 375px
Desktop: 1440px
*/:root{--soft-red: hsl(10, 79%, 65%);--cyan: hsl(186, 34%, 60%);--dark-brown: hsl(25, 47%, 15%);--medium-brown: hsl(28, 10%, 53%);--cream: hsl(27, 66%, 92%);--pale-orange: hsl(29, 63%, 92%)}html{font-size:100%;box-sizing:border-box}*,*:after,*:before{box-sizing:inherit;padding:0;margin:0}img{max-width:100%}body{background-color:var(--pale-orange)}.container{display:flex;align-items:center;justify-content:center;margin:50px auto;flex-direction:column}:root{font-family:DM Sans,sans-serif;--chart-font-family: "DM Sans", sans-serif}h1,h2,h3{margin-top:0;line-height:1.5}h1{font-size:2rem;font-weight:700}h2{font-size:1rem;font-weight:400}.chart{width:100%;height:14.375rem;margin-inline:auto;position:relative}.chart__bar:hover,.chart__bar--other-day:hover,.chart__bar--today:hover{opacity:.8;cursor:pointer}.chart__bar--today{fill:var(--cyan)}.chart__bar--other-day{fill:var(--soft-red)}.chart__tick-text{fill:var(--medium-brown);font-family:var(--chart-font-family);font-size:max(14px,.875rem);font-weight:400;user-select:none}.chart__tooltip{position:absolute;padding:.25rem;background-color:var(--dark-brown);color:var(--pale-orange);border-radius:.25rem;font-size:max(12px,.875rem);user-select:none}
