.button_group_horizontal { display: flex; flex-direction: row; column-gap: 12px; }

.button_group_horizontal .button { margin: 0; }

.button_group_vertical { display: flex; flex-direction: column; row-gap: 12px; }

.button_group_vertical .button { margin: 0; }

.button { display: inline-flex; flex-direction: row; align-items: center; justify-content: center; column-gap: 8px; height: 36px; padding: 8px 16px; margin-bottom: 24px; margin-top: 24px; user-select: none; border-radius: 6px; border: 1px solid #e4e4e7; background: #18181b; color: white; font-size: 14px; font-weight: 500; line-height: 20px; cursor: pointer; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: .15s; }

.button.disabled { opacity: 0.5; cursor: default; }

.button.hidden { display: none; }

.button.no_margin { margin: 0; }

.button.no_col_gap { column-gap: 0; }

.button.tiny { height: auto !important; width: auto !important; padding: 4px; line-height: 14px; margin: 0; }

.button.auto_width { width: auto !important; }

.button.button_medium { width: 200px; }

.button.button_medium_plus { width: 220px; }

.button.button_wide { width: 334px !important; }

.button.button_extra_wide { width: 400px !important; }

.button:not(.button_narrow, .button_medium, .button_medium_plus) { width: 300px; }

.button:hover:not(.disabled) { background-color: rgba(24, 24, 27, 0.9); }

.button span { color: white; }

.button.wide { width: 334px; }

.button.button_right { margin-left: auto !important; align-self: flex-end !important; }

.button.button_left { margin-right: auto !important; align-self: flex-start !important; }

.button.white { color: #18181b; border: 1px solid #e4e4e7; background: white; }

.button.white:hover:not(.disabled) { background: #f4f4f5; }

.button.white span { color: #18181b; }

.button.red { color: #18181b; border: 1px solid #e4e4e7; background: #f44531; }

.button.red:hover:not(.disabled) { background: rgba(244, 69, 49, 0.9); }

.button svg { width: 16px; height: 16px; }

button.btn_general { background: #18181b; border-radius: 6px; border: 1px solid #e4e4e7; font-size: 14px; padding: 8px 16px; line-height: 20px; height: 36px; display: block; color: white; width: 300px; margin-bottom: 24px; margin-top: 24px; cursor: pointer; font-family: "Geist", sans-serif; font-weight: 500; display: flex; flex-direction: row; align-items: center; justify-content: center; column-gap: 8px; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke; transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-duration: .15s; }

button.btn_general span { color: white; }

button.btn_general svg { width: 16px; height: 16px; }

button.btn_general:hover { background-color: rgba(24, 24, 27, 0.9); }

button.btn_general.white { color: #18181b; border: 1px solid #e4e4e7; background: white; }

button.btn_general.white:hover { background: #f4f4f5; }

button.btn_general .text { color: #09090b; font-size: 14px; font-weight: 500; display: inline-block; }

button.btn_general.completed { background-color: #17a34a; pointer-events: none; }

.inrow_label { border: 1px solid #e5e5e5; color: #0a0a0a; font-size: 12px !important; font-weight: 500; padding: 2px 8px; border-radius: 8px; line-height: 16px; width: auto; }

.badge { padding: 2px 8px; border-radius: 4px; display: inline; font-size: 12px; font-weight: 500; }

.badge.grey, .inrow_label.grey, .button.grey { background: #e4e4e7; color: #09090b; }

.badge.black, .inrow_label.black, .button.black { background: #09090b; color: white; }

.badge.green, .inrow_label.green, .button.green { background: #17a34a; color: white; }

.badge.green_light, .inrow_label.green_light, .button.green_light { background: rgba(23, 163, 74, 0.1); }

.badge.red, .inrow_label.red, .button.red { background: #FF3B3F; color: white; }

.badge.red_light, .inrow_label.red_light, .button.red_light { background: rgba(220, 38, 37, 0.1); }

.badge.orange, .inrow_label.orange, .button.orange { background: #ff8000; color: white; }

.badge.yellow, .inrow_label.yellow, .button.yellow { color: #09090b; background: #FFF200; }

.badge.yellow_light, .inrow_label.yellow_light, .button.yellow_light { background: rgba(250, 204, 22, 0.1); }

.badge.blue, .inrow_label.blue, .button.blue { background: #47C7FC; color: #09090b; }

.badge.blue_light, .inrow_label.blue_light, .button.blue_light { background: rgba(21, 93, 252, 0.1); }

.badge.button:hover.blue, .inrow_label.button:hover.blue, .button.button:hover.blue { background: rgba(21, 93, 252, 0.8); }

.badge.button:hover.green, .inrow_label.button:hover.green, .button.button:hover.green { background: rgba(23, 163, 74, 0.8); }

.badge.button:hover.orange, .inrow_label.button:hover.orange, .button.button:hover.orange { background: rgba(255, 128, 0, 0.8); color: white; }

.button.green, .button.red, .button.orange, .button.yellow, .button.blue, .button.green_light, .button.blue_light, .button.yellow_light, .button.red_light { border: none; }

.button.yellow:hover { background: rgba(255, 242, 0, 0.99); }