.list.countries,.list.origin-countries{.image{img{width:auto;height:100%}}}.list .item{.card{.name{height:var(--card-height);align-content:center;font-size:1.6rem;border-radius:var(--border-radius)}}}coffee-taste-note-wheel{position:relative;display:block;.random-coffee-container{transform:rotateY(.25turn)}}.wheel{display:flex;flex-direction:column;align-items:center;gap:var(--gap);position:relative;overflow:hidden;box-sizing:border-box;svg{width:100%;height:100%}.arrow{position:absolute;top:8px}.segment{cursor:pointer;transition:opacity .2s ease;shape-rendering:crispEdges}.segment:hover{opacity:.8}.segment-label{pointer-events:none;font-size:.7rem;font-family:monospace;text-transform:capitalize;letter-spacing:2px}.button-container{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;button{border-radius:50%;background-color:transparent;color:var(--color-text--primary);width:70px;height:70px;display:flex;align-items:center;justify-content:center}}}.random-coffee-container{position:absolute;inset:0;button{position:absolute;top:var(--gap);right:var(--gap);width:auto;&:active{top:var(--gap)}}.coffee{overflow:hidden;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:2rem;border-radius:var(--border-radius);a{display:flex}img{width:100%}}}.arrow{--border-width: 14px;border:var(--border-width) solid transparent;width:0;height:0;&.down{border-top-color:var(--color-text)}&.bordered{&:after{content:"";position:absolute;top:calc(var(--border-width) * -1 + 2px);left:calc(var(--border-width) * -1 + 4px);border:calc(var(--border-width) - 4px) solid transparent;width:0;height:0}&.down{&:after{border-top-color:var(--color-background)}&.primary{&:after{border-top-color:var(--color-primary)}}}}}
