:root{--border-color:#313131;--primary-color:#e2e2e2;--disabled-text-color:#999}.tabs{display:grid;grid-template-columns:1fr}.tabs .tab-list{border-bottom:1px solid var(--border-color);display:flex;list-style:none;padding-left:0}.tabs .tab-list.center{justify-content:center}.tabs .tab-list.end{justify-content:flex-end}.tabs .tab-list__item{bottom:-1px;cursor:pointer;font-size:.85rem;letter-spacing:.05rem;padding:8px 10px;position:relative;text-transform:uppercase;transition:border .3s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none}.tabs .tab-list__item:not(:first-child){margin-left:10px}.tabs .tab-list__item[aria-selected=true]{border-bottom:2px solid var(--primary-color);color:var(--primary-color);font-weight:700}.tabs .tab-list__item[aria-selected=false]{color:var(--border-color);font-weight:700}.tabs .tab-list__item[aria-selected=false]:hover{color:var(--primary-color);font-weight:700}.tabs .tab-list__item[aria-disabled=true]{color:var(--disabled-text-color);cursor:not-allowed}.tabs.horizontal.reverse .tab-list{border:none;border-top:1px solid var(--border-color);grid-row:2}.tabs.vertical{gap:1rem;grid-template-columns:auto 1fr}.tabs.vertical .tab-list{border-bottom:none;border-right:1px solid var(--border-color);flex-direction:column}.tabs.vertical .tab-list__item{border-radius:0;margin-left:0}.tabs.vertical .tab-list__item[aria-selected=true]{border:none;border-left:2px solid var(--primary-color)}.tabs.vertical.reverse{grid-template-columns:1fr auto}.tabs.vertical.reverse .tab-list{border:none;border-left:1px solid var(--border-color);grid-column:2}.tabs.vertical.reverse .tab{grid-column:1;grid-row:1}