sim16/simmadome/src/CreateLeague.css

.cl_table_header > .cl_subleague_bg {
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	padding-top: 1rem;
}

.cl_league_structure_table .cl_table_row:last-child .cl_subleague_bg {
	border-bottom-left-radius: 0.5rem;
	border-bottom-right-radius: 0.5rem;
	padding-bottom: 1rem;
}

.cl_league_structure_table .cl_table_row:last-child .cl_division_delete {
	margin-bottom: 0.5rem;
}

input {
	border: none;
	border-radius: 1rem;
	height: 2rem;
	padding-left: 1rem;
	background: var(--background-secondary);
	font-size: 14pt;
}

input:focus {
	outline: none;
}

input[type="number"] {
  -webkit-appearance: textfield;
     -moz-appearance: textfield;
          appearance: textfield;
}
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none;
}

.cl_league_main {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	margin-top: 3rem;
}

.cl_league_name {
	margin-top: 1rem;
}

.cl_league_options, .cl_league_structure, .cl_confirm_box {
	display: flex;
	background: var(--background-tertiary);
	flex-direction: column;
	max-width: 100%;
	border-radius: 1rem;
	padding-top: 1.5rem;
}

.cl_confirm_box {
	min-width: 55rem;
	padding: 2.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 20pt;
}

.cl_league_options {
	align-items: center;
}

.cl_league_structure, .cl_subleague_add_align {
	display: flex;
	align-items: center;
	justify-content: center;
	width: min-content;
}

.cl_league_structure {
	margin-top: 1rem;
}

.cl_league_structure_table {
	display: table;
	margin-right: 1rem;
}

.cl_headers, .cl_table_row {
	display: table-row;
	height: min-content;
}

.cl_table_header, .cl_delete_filler, .cl_delete_box, .cl_division_cell {
	display: table-cell;
	height:100%;
}

.cl_delete_box {
    vertical-align: middle;
}

.cl_league_structure_scrollbox {
	max-width: 100%;
	overflow-y: scroll;
}

 /* Hide scrollbar for Chrome, Safari and Opera */
.cl_league_structure_scrollbox::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.cl_league_structure_scrollbox {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.cl_subleague_add_align{
	margin-left: 1.5rem;
	padding-right: 1.5rem;
}

.cl_subleague_header {
	display: flex;
	width:100%;
	align-items: center;
	justify-content: space-between;
} 

.cl_subleague_bg {
	background: var(--background-main);
	padding: 0.5rem 1rem;
	margin: 0rem 0.5rem;
	min-width: 22rem;
	height: 100%;
	box-sizing: border-box;
}

.cl_subleague_name {
	flex-grow: 1;
	margin-right: 0.5rem;
}

.cl_division_name_box {
	width: 100%;
}

.cl_division_name {
	margin-bottom: 0.5rem;
	width: 95%;
}

.cl_newteam_name {
	width: 95%;
}

.cl_division {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	border-radius: 0.5rem;
	background: var(--background-accent);
}

.cl_team, .cl_team_add {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	margin: 0.4rem 0rem;
}

.cl_team_name {
	font-size: 14pt;
	padding: 0 0.5rem;
	overflow: hidden;
	text-overflow: ellipsis;
}

.cl_team_add {
	display: flex;
	flex-direction: column;
	margin-bottom: 0rem;
}

.cl_search_list {
	width: 95%;
	margin-top: 0.6rem;
	padding: 0.5rem;
	background: var(--background-tertiary);
	border-radius: 0.5rem;
}

.cl_search_result {
	padding: 0.2rem 0.4rem;
	border-radius: 0.5rem;
}

.cl_search_result:hover {
	background: var(--background-main);
}

.cl_league_options {
	padding: 1rem;
	margin-top: 1.5rem;
	width: 55rem;
	box-sizing: border-box;
}

.cl_option_main {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	width: 100%;
}

.cl_option_submit_box {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.cl_option_box {
	margin: 1rem;
	width: max-content;
}

.cl_option_label, .cl_option_err, .cl_structure_err {
	margin: 0.25rem;
}

.cl_option_err, .cl_structure_err {
	color: var(--accent-red);
}

.cl_option_err {
	min-height: 1.5rem;
	margin-bottom: -0.5rem;
	margin-top: 0.25rem;
}

.cl_structure_err {
	margin-bottom: -0.5rem;
}

.cl_structure_err_div {
	margin-top: -0.25rem;
	margin-bottom: 0;
}

.cl_structure_err_team {
	margin-top: -0.5rem;
	margin-bottom: 0;
	width: 95%;
	padding-left: 0.5rem;
}

.cl_team_name_err {
	color: var(--accent-red);
}

.cl_structure_err_teams {
	width: 98%;
}

.cl_subleague_add_filler, .cl_division_add_filler {
	width: 2rem;
	height: 2rem;
}

/* button styles */

button > .emoji {
	margin: 0;
	width: 1rem;
	height: 1rem;
}

.cl_subleague_delete, .cl_team_delete, .cl_division_delete, .cl_subleague_add, .cl_division_add {
	padding: 0;
	width: 2rem;
	height: 2rem;
	border: none;
	border-radius: 1rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.cl_subleague_delete, .cl_team_delete, .cl_division_delete {
	background: var(--accent-red);
}

.cl_subleague_add, .cl_division_add {
	background: var(--accent-green);
}

.cl_subleague_add, .cl_subleague_add_filler {
	position: relative;
	top: 1.5rem;
}

.cl_division_add, .cl_division_add_filler {
	margin-top: 1.25rem;
	margin-bottom: 1.25rem;
}

.cl_delete_filler {
	min-width: 3rem;
}

.cl_option_submit {
	padding: 1rem 2rem;
	height: 2rem;
	border: none;
	border-radius: 0.75rem;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--accent-green);
	font-size: 14pt;
}