
/* ------------------------------------ KEYBOARD ------------------------------------ */

.buttons_keyboard {
		font-size: 18px;
		font-weight: bold;
		width: 95px;
		height: 95px;
		padding: 0px;
	}
.buttons_kb_save {
		background-color: red;
		font-size: 18px;
		font-weight: bold;
		width: 194px;
		height: 95px;
	}
.buttons_kb_space {
		
		font-size: 18px;
		font-weight: bold;
		width: 986px;
		height: 95px;
		passing: 0px;
	}
.keyboard {
		/* border: 3.5px solid grey; 
		border-collapse: collapse;
		width: 1049px;
		/* height: 300px; */
		display: none;
	}
.keyboard_label {
		/* width: 1049px; */
		font-size: 24px;
		font-weight: bold;
		text-align: center;
	}
.keyboard_keys {
		border: 1;
		width: 1049;
		display: inline-block;
	}
	
/* ------------------------------------ SPLITS --------------------------------------- */

.splits {
		display: none;
		/* width: 1000px; */
}
.span_splits {
		/*width: 700px; */
		font-size: 26px;
		font-weight: bold;
}
.splits_close {
		background-color: darkgrey;
		font-size: 40px;
		font-weight: bold;
		width: 100%;
		height: 60px;
		/*
		writing-mode: tb-rl;
    transform: rotate(-360deg);
		display: inline-block;
		*/
	}
.td_splits {
		width: 300px;
		
}
	
	
/* ------------------------------------ OPENER TIPS ------------------------------------ */
	
.opener_tips {
		/* border: 3.5px solid grey; 
		border-collapse: collapse;
		width: 1049px;
		/* height: 300px; */
		display: none;
	}
.buttons_opener_tips {
		font-size: 60px;
		font-weight: bold;
		width: 130px;
		height: 130px;
		padding: 0px;
	}
.buttons_opener_tips_focus {
		font-size: 50px;
		font-weight: bold;
		width: 300px;
		height: 130px;
		padding: 0px;
	}
.buttons_opener_tips_next {
		background-color: darkgrey;
		font-size: 60px;
		font-weight: bold;
		width: 400px;
		height: 130px;
	}
.buttons_opener_tips_close {
		background-color: darkgrey;
		font-size: 40px;
		font-weight: bold;
		width: 990px;
		height: 60px;
	}

/*
.buttons_opener_tips_close {
		font-size: 40px;
		font-weight: bold;
		width: 80px;
		height: 600px;
		writing-mode: tb-rl;
    transform: rotate(-360deg);
		display: inline-block;
	}
*/
.opener_tips_keys {
		border: 1;
		width: 1049;
	}
.span_opener_tips {
		font-size: 50px;
		font-weight: bold;
		width: 1000px;
		text-align: center;
	}
.opener_tips_output {
		/* background-color: red; */
		border: 5px black;
		height: 100%;
		width: 500px;
	
	}
	
	
	
/* ------------------------------------ CLOSE OUT ------------------------------------ */
	
.close_out {
		/* border: 3.5px solid grey; 
		border-collapse: collapse;
		width: 1049px;
		/* height: 300px; */
		display: none;
	}
.buttons_close_out {
		font-size: 60px;
		font-weight: bold;
		width: 130px;
		height: 130px;
		padding: 0px;
	}
.buttons_close_out_close {
		background-color: darkgrey;
		font-size: 40px;
		font-weight: bold;
		width: 990px;
		height: 60px;
	}
/*
.buttons_close_out_close {
		font-size: 40px;
		font-weight: bold;
		width: 80px;
		height: 600px;
		writing-mode: tb-rl;
    transform: rotate(-360deg);
		display: inline-block;
	}
*/
.close_out_keys {
		border: 1;
		width: 1049;
	}
.span_close_out {
		font-size: 150px;
		font-weight: bold;
		width: 1000px;
		text-align: center;
	}
.close_out_output {
		/* background-color: red; */
		border: 5px black;
		height: 100%;
		width: 500px;
	
	}

/* ------------------------------------ TABLE BUTTONS ------------------------------------ */

	
.buttons_timer {
		font-size: 18px;
		font-weight: bold;
		width: 69px;
		height: 69px;
	}
.buttons_players {
		font-size: 18px;
		font-weight: bold;
		width: 69px;
		height: 69px;
	}
.buttons_save {
		background-color: red;
		font-size: 18px;
		font-weight: bold;
		width: 69px;
		height: 69px;
	}	
.buttons_move_to {
		background-color: red;
		font-size: 18px;
		font-weight: bold;
		width: 69px;
		height: 69px;
	}
.buttons_cancel_move {
		background-color: yellow;
		font-size: 18px;
		font-weight: bold;
		width: 69px;
		height: 69px;
	}
	

/* ------------------------------------ LINE RULE / BASIC SPAN ------------------------------------ */


hr {
		margin-top: 2;
		margin-bottom: 2;         /* Removes all external spacing around the HR */
		padding: 0;
	}
	
	
span {
		font-size: 18px;
		font-weight: bold;
	}
	
	
/* ------------------------------------ SIDEBAR ------------------------------------ */	
	
.span_sidebar {
		font-size: 18px;
		font-weight: bold;
		width: 20px;
		height: 120px;
		writing-mode: tb-rl;
        transform: rotate(-360deg);
		display: inline-block;
	}
.span_sidebar_clock {
		/* background-color: red; */
		font-size: 24px;
		font-weight: bold;
		width: 20px;
		height: 150px;
		writing-mode: tb-rl;
        transform: rotate(-360deg);
		display: inline-block;
		padding-left: 10px;
	}
.span_split_log {
		/* border: 1px solid black;*/
		font-size: 14px;
		font-weight: bold;
		display: inline-block;
		overflow-y: auto;
		width: 190px;
		/* overflow: scroll !important; */
		display: inline-block;
		height: 141px;
		max-height: 141px;
		vertical-align: top;
	}
	
	
/* ------------------------------------ COST LOG ------------------------------------ */
	
	
.span_cost_log {
		/* border: 1px solid black;*/
		font-size: 14px;
		font-weight: bold;
		display: inline-block;
		overflow-y: auto;
		width: 190px;
		/* overflow: scroll !important; */
		display: inline-block;
		height: 114px;
		max-height: 114px;
		vertical-align: top;
	}
.span_total_cost {
		/*border: 1px solid black;
		display: inline-block;*/
		width: 190px;
		height: 20px;
	}

	
/* ------------------------------------ TABLE NAME ------------------------------------ */


.span_table_name {
		font-size: 20px;
		font-weight: bold;
		width: 100%;
		text-align: center;
	}
.span_change_name {
		font-size: 20px;
		font-weight: bold;
		width: 100%;
		text-align: center;
	}

	
/* ------------------------------------ TABLE ------------------------------------ */
	
	
table th, table td {
		padding: 0!important;
	}
.table_free {
		border: 5px solid green; 
		border-collapse: collapse;
		width: 200px;
	}
.table_taken {
		border: 5px solid red; 
		border-collapse: collapse;
		width: 200px;
	}
.table_tools {
		border: 3px solid blue; 
		border-collapse: collapse;
		width: 200px;
	}
	
	
.
	

	
/*
.keyboard_ready {
		border: 3.5px solid grey; 
		border-collapse: collapse;
		width: 1049px;
		display: none;
	}
.keyboard_write {
		border: 3.5px solid blue; 
		border-collapse: collapse;
		width: 1049px;		
		height: 400px;
	}
*/	

.span_table_label {
		width: 100%;
	}

.table_label {
		width: 100%;
		text-align: center;
	}
.table_buttons {
		border: 1;
		width: 100%;
		display: inline-block;
		/*max-height: 159px;*/
	}
.table_stats {
		border: 1;
		width: 200px;
		display: inline-block;
		height: 149px;
		max-height: 149px;
	}
	
/*
.table_timer {
		border: 1;
		width: 200px;
		display: inline-block;
		max-height: 116px;
	}
.table_players {
		border: 1;
		width: 100%;
		display: inline-block;
		max-height: 116px;
	}
*/


/* ------------------------------------ CONFIRMATION BOX ------------------------------------ */


.confirmation_box {
		/* display: none; */
		position: fixed;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		background-color: #f0f0f0;
		padding: 20px;
		border: 1px solid #ccc;
		box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		z-index: 1000;
		width: 150px;
		text-align: center;
		font-size: 18px;
		font-weight: bold;
}

.confirmation_box button {
		padding: 10px 20px;
		margin: 5px;
		cursor: pointer;
		
}

/* Optional: Add a dimmed background */
.confirmation_overlay {
		/* display: none; */
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, 0.5);
		z-index: 999;
}