/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.bbb-room-selection {
	display: inline-block;
	min-width: 10em;
	margin-bottom: 2em;
	background: #fff;
}

.bbb-error {
	color: #f00;
}

.bbb-table-container,
.bbb-table-container > div {
	box-sizing: border-box;
}

.bbb-flex-table {
	display: flex;
	width: 100%;
	margin: auto 0;
	border-left: solid 1px #d9d9d9;
	transition: 0.5s;
}

.flex-row {
	padding: 0.5em 0.5em;
	border-right: solid 1px #d9d9d9;
	border-bottom: solid 1px #d9d9d9;
	text-align: center;
}

.bbb-flex-table:nth-child(even) .flex-row {
	background: #f4f2f1;
}

.bbb-flex-table:first-of-type .flex-row,
.bbb-flex-table:first-of-type a .flex-row {
	border-color: #1565c0;
	color: #fff;
	background: #1976d2;
	text-decoration: none;
}

.bbb-flex-table-3 {
	grid-template-columns: repeat(auto-fill, 33%);
}

.bbb-flex-table-4 {
	grid-template-columns: repeat(auto-fill, 25%);
}

.flex-row-5 {
	width: calc(100% / 5);
}

.flex-row-6 {
	width: calc(100% / 6);
}

@media all and (max-width: 1200px) {

	.bbb-flex-table {
		flex-flow: row wrap;
	}

	.flex-row {
		width: 100%;
	}

	.flex-row:first {
		width: 100%;
		border-bottom: solid 1px #d9d9d9;
	}

	.bbb-flex-table > .flex-row {
		border-bottom: solid 1px #d9d9d9;
	}

	.bbb-header > .flex-row {
		border-bottom: solid 1px;
	}
}

.bbb-recording-table-input {
	width: 100%;
}

.bbb-icon {
	color: #1976d2;
	cursor: pointer;
}

.bbb-header-icon {
	color: #fff;
	cursor: pointer;
}

.dashicon-disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.bbb-inline-block {
	display: inline-block;
}

.bbb-recording-link {
	max-width: 7em;
	margin: 0.2em 0.1em;
	padding: 0.2em 0.3em;
	color: #fff;
	background-color: #007acc;
}

.bbb-button {
	color: #fff !important;
	background-color: #007acc !important;
	padding: 0.8em 1.5em;
}

.bbb-recording-link:hover,
.bbb-recording-link:focus,
.bbb-recording-link:active,
.bbb-button:hover,
.bbb-button:focus,
.bbb-button:active {
	border-color: #006799 !important;
	background-color: #0a9ed4 !important;
}

.bbb-recording-link > a {
	color: #fff;
	box-shadow: none !important;
	text-decoration: none !important;
}

.bbb-recording-link > a:hover,
.bbb-recording-link > a:focus,
.bbb-recording-link > a:active,
.bbb-recording-link > a:visited {
	color: #fff;
}

.bbb-column-header-highlight {
	background: #52a8fd !important;
}

.bbb-hidden {
	visibility: hidden;
}

.single-bbb-room .bbb-room .entry-content {
	float: none !important;
	width: auto !important;
}

.bbb-expandable-header {
	display: inline-block;
	margin-top: auto;
	margin-bottom: auto;
	font-size: 1.2em;
	font-weight: 400;
}

.bbb-recordings-display {
	cursor: pointer;
}

.bbb-recording-display-block {
	margin: 0.5em 0;
	border-top: groove;
	border-bottom: groove;
}

.bbb-join-room-label {
	display: inline-block;
	min-width: 20%;
}

.bbb-join-room-input {
	display: inline-block;
	min-width: 70%;
}

.bbb-join-form-block {
	margin-bottom: 0.2em;
}