/**
 * CodeStepByStep desktop-only stylesheet (loaded with media="only screen", min-width: 1024px).
 *
 * Merged from two files, concatenated unchanged:
 *   1. csbs-desktop.css     - CodeStepByStep-era desktop overrides
 *   2. react-app-desktop.css - React frontend desktop overrides
 */

/* ============================================================ */
/* == csbs-desktop.css (formerly) ================================ */
/* ============================================================ */

@media only screen and (min-width: 1024px) {
	.categorynamelink:hover {
		cursor: pointer;
	}
	
	#problemarea {
		display: flex;
		flex-direction: row;
		width: 100%;
	}
	
	#problemarea #presolutionarea,
	.problemarea #presolutionarea {
		margin-right: 0.5em;
		z-index: 999;
	}
	
	#problemarea #solutionarea,
	.problemarea #solutionarea {
		background-color: var(--gray-1);
		padding-left: 0.5em;
		z-index: 999;
	}
	
	#solutionarea {
		margin-top: 0;
	}
	
	.split-gutter.split-gutter-horizontal {
		align-items: center;
		background-color: var(--gray-6);
		border: 1px solid var(--gray-7);
		color: var(--gray-19);
		display: flex;
		flex-direction: column;
		justify-content: center;
		text-align: center;
		width: 7px;
		z-index: 999;
	}
	
	.split-gutter.split-gutter-horizontal:hover {
		background-color: var(--yellow-surface-14);
		cursor: col-resize;
	}
}

/* ============================================================ */
/* == react-app-desktop.css (formerly) =========================== */
/* ============================================================ */

@media only screen and (min-width: 1024px) {
	#categories, .categories {
		width: 40em;
	}
	
	.csbsformfield-richtextarea-holder {
		display: block;
		min-width: 30em;
		min-height: 5em;
	}
	
	.SkeletonTable td.column_actions {
		border: none;
	}

	.SkeletonTable td.column_actions * {
		display: none;
	}
	
	/* Standard widths of columns in tables (makes for more seamless skeletons) */
	.StandardTable thead tr th.columnlabel_actions {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_actionslong {
		min-width: 14em;
	}
	.StandardTable thead tr th.columnlabel_actionsreallyfuckinglong {
		min-width: 25em;
	}
	.StandardTable thead tr th.columnlabel_attempts,
	.StandardTable thead tr th.columnlabel_students {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_category {
		min-width: 11em;
	}
	.StandardTable thead tr th.columnlabel_categoryshort {
		min-width: 8em;
	}
	.StandardTable thead tr th.columnlabel_course {
		min-width: 11em;
	}
	.StandardTable thead tr th.columnlabel_courselong {
		min-width: 16em;
	}
	.StandardTable thead tr th.columnlabel_courseshort {
		min-width: 8em;
	}
	.StandardTable thead tr th.columnlabel_date {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_datetime {
		min-width: 12em;
	}
	.StandardTable thead tr th.columnlabel_description {
		min-width: 12em;
	}
	.StandardTable thead tr th.columnlabel_descriptionlong {
		min-width: 19em;
	}
	.StandardTable thead tr th.columnlabel_language {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_name {
		min-width: 8em;
	}
	.StandardTable thead tr th.columnlabel_number {
		min-width: 2em;
	}
	.StandardTable thead tr th.columnlabel_offering {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_openactive {
		min-width: 4.5em;
	}
	.StandardTable thead tr th.columnlabel_problemname,
	.StandardTable thead tr th.columnlabel_problemsetname {
		min-width: 12em;
	}
	.StandardTable thead tr th.columnlabel_problemnameshort {
		min-width: 8em;
	}
	.StandardTable thead tr th.columnlabel_solved {
		min-width: 6em;
	}
	.StandardTable thead tr th.columnlabel_solvedfull {
		min-width: 11em;
		white-space: nowrap;
	}
	.StandardTable thead tr th.columnlabel_status {
		min-width: 4.5em;
	}
	.StandardTable thead tr th.columnlabel_title {
		min-width: 4em;
	}
}
