/* Responsives -------------------------------------------*/

/* Height -------------------------------------------*/

@media all and (max-height: 1150px){
	.soft-phone:not(.show) {
		height: 0;
		overflow: hidden;
	}


	.phone-wrapper .expand-soft-phone {
		display: block;
		width: 25%;
		margin-right: 5%;
	}

	#sideMenu .btn-end-call {
		width: 70%;
	}

	#sideMenu .btn-open-pad:not(.disabled) {
		display: block;
		max-height: 43.98px;
	}
	
	#sideMenu .btn-open-pad i {
		font-weight: 400;
	}
}

@media all and (max-height: 900px){
	.phone-wrapper .soft-phone {
		margin-top: 0;
	}

	#sideMenu .phone-wrapper .call-details {
		margin-bottom: 5px;
	}
	
	#sideMenu .contract-details {
		display: flex;
		flex-flow: column;
	}

	.contract-details .task-content {
		overflow: scroll;
	}
}

@media all and (max-height: 800px){
	.combined-notes {
		grid-template-rows: calc(100vh - 230px) 50px;
	}
}

/* Width -------------------------------------------*/

/* Edit menu open max */
@media all and (max-width: 1530px){
	.primary-content.show-edit-menu .tab-wrapper.edit-menu {
		height: 100%;
		left: calc(50% - 0.5em);
		position: absolute;
	}

	.primary-content.show-edit-menu .tab-wrapper {
		width: calc(50% - 1.5em);
	}
}

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

	.submit-note .quick-note-wrapper:not(.hide) {
		border-radius: 6px;
		height: 100%;
		flex-flow: row wrap;
		left: 0;
		overflow: inherit;
		padding-bottom: 2px;
		top: -6px;
		width: 100%;
	}

	.submit-note .quick-note-wrapper button {
		border-radius: 4px;
		margin: 2px;
	}
}

@media all and (max-width: 1150px){
	section.workspace .primary-content {
		flex-flow: column;
		justify-content: flex-start;
		overflow: auto;
	}

	section.workspace.hide-tabs .tab-wrapper {
		display: none;
	}

	section.workspace .tab-wrapper,
	.primary-content.show-edit-menu .tab-wrapper {
		width: calc(100% - 2em);
		margin: 0 1em;
	}

	.primary-content.show-edit-menu .tab-wrapper:last-child{
		order:1;
	}
	.primary-content.show-edit-menu .tab-wrapper:nth-child(4){
		order:2;
	}
	.primary-content.show-edit-menu .tab-wrapper:nth-child(5){
		order:3;
	}

	.primary-content.show-edit-menu .tab-wrapper.edit-menu {
		left: 0;
		position: relative;
	}
	
	.light-theme section.workspace .tab-wrapper {
		min-height: calc(100vh - 142px);
	}

	.dark-theme section.workspace .tab-wrapper {
		min-height: calc(100vh - 131px);
	}

	section.workspace .tab-wrapper:not(:nth-child(4)),
	.primary-content.show-edit-menu .tab-wrapper:nth-child(4) {
		margin-top: 1em;
	}

	section.workspace .dashboard-wrapper {
		margin-left: 1em;
	}

	.primary-content.show-edit-menu .tab-wrapper.edit-menu {
		margin-top: 0;
	}
	
	nav .toggle-view {
		display: none;
	}
	
	nav .brand-logo {
		margin: 0 10px;
	}

	nav .nav-links:nth-child(2) {
		max-width: 100%;
	}

	nav .nav-links:last-child {
		margin: 0;
	}
	
	nav .right-nav-container {
		text-align: end;
	}

	.quick-search-wrapper > button {
		right: 4px;
	}
	
	#stickyNote {
		padding-right: 0;
	}

	.show-sticky .sticky-note-wrapper {
		width: calc(100% - 20px);
	}

	.right-nav-wrapper.popup {
		border-bottom-right-radius: 0;
	}

	.right-nav-wrapper.popup > p {
		text-align: right;
	}

	.open-popup .right-nav-wrapper {
		right: -5px;
		width: 200px;
	}

	.task-overlay {
		margin-left: 1em;
		width: calc(100% - 2em);
	}

	section.workspace .user-dash-wrapper {
		margin: 0 1em;
		overflow-x: scroll;
	}

	.summary-details .summary-table,
	.summary-details .task-summary {
		min-width: 800px;
		padding-right: 33px;
	}
	
	
	.customer-call-history-header,
	.dealer-details .call-history-header {
		display: none;
	}
	
	.customer-call-history-wrapper {
		height: calc(100% - 28px);
	}
	
	.dealer-details .call-history-row,
	.customer-call-history-wrapper .call-history-row {
		flex-flow: column;
	}
	
	.dealer-details .call-history-row span,
	.customer-call-history-wrapper .call-history-row span {
		display: inline;
		margin-right: 5px;
		opacity: .5;
	}
	
	.dealer-details .call-history-row > *,
	.customer-call-history-wrapper .call-history-row > * {
		width: 100%;
	}
	
	.customer-call-history-wrapper .call-history-row .text-center {
		text-align: left !important
	}
}

@media all and (max-width: 1000px){
	.dealer-details-title {
		flex-flow: column;
		margin-top: 1em;
	}
}

@media all and (max-width: 1000px) and (min-width: 769px){

	nav .show-search .quick-search {
		position: absolute;
		width: calc(100% - 51px);
	}
	
	nav .show-search .quick-search-wrapper {
		left: -8vw;
		right: -14vw;
	}

	nav.minimal .show-search .quick-search-wrapper {
		right: -14px;
	}

	nav.minimal .show-search .quick-search-wrapper > button {
		margin-right: 5px;
	}
}

/* Nav collapse */
@media all and (max-width: 768px){
	
	body.dark-theme #statusBar {
		background: transparent;
		border-color: transparent;		
	}

	.dark-theme section.workspace .tab-wrapper {
		min-height: calc(100vh - 23px);
	}
	
	.dark-theme nav {
		padding-top: 0;
	}
	
	.mobile-only {
		display: block;
	}
	
	.non-mobile-only {
		display: none;
	}
	
	nav .brand-logo {
		margin-left: 10px;
	}
	
	nav .brand-logo img {
		width: 60px;
	}

	.show-sticky .sticky-note-wrapper {
		border-radius: 0;
		height: 100vh;
		left: 0;
		padding-top: 1em;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 200;
	}
	
	.quick-search-wrapper > button {
		right: 0.5em;
		/*	Spacing from the top for the close button */
		top: 13px;
	}
	
	#mainContent,
	.workspace {
		display: flex;
		flex-flow: column;
	}
	
	#sideMenu {
		margin: 0 1em;
		order: 1;
		width: calc(100% - 2em);
	}
	
	#sideMenu .phone-wrapper {
		display: none;
	}

	#sideMenu .overlay-menu {
		height: 100%;
	}

	#sideMenu .touches-wrapper {
		margin-bottom: 0;
	}
	
	section.workspace {
		margin-bottom: 0.5em;
		order: 2;
	}

	section.workspace .primary-content {
		order: 2;
	}

	#sideMenu .contract-details-wrapper {
		margin-bottom: 0;
	}

	#statusBar {
		display: flex;
		flex-flow: row wrap;
		padding: .5em 0;
	}
	
	#statusBar .flagged-wrapper > .btn {
		background: var(--primary);
	}

	body.light-theme #mainContent {
		margin-top: 0;
	}

	#statusBar .environment-label,  
	#statusBar .tasks-wrapper {    
		margin-bottom: 0.5em;
	}

	#statusBar .flagged-wrapper-container {
		order: 1;
		width: 100%;
	}

	#statusBar .tasks-wrapper .task-container {    
		border-radius: 4px;
		height: calc(100vh - 77px);
		padding-top: 60px;
		top: -5px;
		width: 100%;
		max-width: 100%;
	}
	
	.environment-label {
		border: none;
	}

	.tab-wrapper .tabs {
		border-top: 8px solid var(--accent);
		border-radius: 2px;
	}
	
	.btn.nav-collapse {
		display: block;
		margin-left: 0.5em;
	}

	.open > .btn.nav-collapse .fa-bars {
		display: none;
	}

	.open > .btn.nav-collapse .fa-xmark {
		display: block;
	}
	
	nav {
		padding: 0;
	}

	nav .nav-links:nth-child(2) {
		padding: 0 .5em;
	}

	nav .nav-links.show-search:nth-child(2) {
		position: absolute;
		padding: 0 0 0 1em;
	}

	nav.minimal .show-search .quick-search {
		margin: 0;
		/* Space beside input box for X to close results */
		margin-right: 48px;
	}

	nav .show-search .quick-search-wrapper {
		position: absolute;
		left: 0;
		width: 100%;
	}

	nav.minimal .show-search .quick-search-wrapper {
		left: 0;
		top: -15px;
	}

	.right-nav-links {
		padding: 14px 0;
	}
	
	.right-nav-links:not(.open) > .btn:not(.nav-collapse),
	.right-nav-links:not(.open) > a {
		display: none;
	}
	
	.right-nav-links.open {
		background: var(--primary);
		color: #fff;
		margin-left: 10px;
	}

	.open-popup .right-nav-wrapper {
		background: var(--primary);
		right: 0;
		width: 100%;
	}
	
	.scroll:not(form) {
		max-height: calc(100vh - 97px);
	}
	
	.contract-details .scroll {
		max-height: 100%;
	}
	
	#sideMenu {
		margin-bottom: 1em;
	}

	#sideMenu .contract-details {
		justify-content: center;
	}

	.task-overlay {
		margin-left: 0;
		position: fixed;
		top: 0;
		width: 100%;
		z-index: 500;
	}

	.manager-request.popup,
	.sms-queue.popup {
		border-radius: 20px;
		padding: 50px 7px 28px;
		width: 100%;
	}
	
	body.light-theme .manager-request.popup,
	body.light-theme .sms-queue.popup {
		height: calc(100vh - 85px);
		top: 10px;
	}

	body.dark-theme .manager-request.popup,
	body.dark-theme .sms-queue.popup {
		height: calc(100vh - 74px);
		top: 0;
	}
	
	.combined-notes {
		grid-template-rows: calc(100vh - 41vh) 30vh;
	}

	section.workspace.empty {
		order: 1;
	}

	section.workspace .user-dash-wrapper {
		max-height: 100%;
	}
	
	.user-dash-wrapper .summary-details {
		order: 2;
	}
	
	.customer-call-history-wrapper.scroll {
		max-height: 100%;
	}
	
	.dashboard-wrapper {
		padding: 1em;
	}

	.notes-wrapper {
		min-height: calc(100vh - 406px);
	}

	.sales-map #salesMap {
		min-height: calc(100vh - 132px);
	}
}

/* System Notes collapsed on mobile */
@media all and (max-height: 800px) and (max-width: 750px){
	.combined-notes {
		grid-template-rows: calc(100vh - 122px) 32px;
	}
}

@media all and (max-width: 600px) {
	nav .touches-wrapper {
		display: none;
	}

	.dealer-details > .col {
		width: 100%;
	}
	
	.btn.nav-collapse {
		margin: 0;
		padding-left: 1em;
	}
}

@media all and (max-width: 500px){
	#mainContent {
		display: flex;
		flex-flow: column;
	}

	.light-theme section.workspace .tab-wrapper,
	.dark-theme section.workspace .tab-wrapper {
		min-height: calc(100vh - 15px);
	}

	.payment-history .scroll {
		max-height: calc(100vh - 205px);
	}

	section.workspace .tab-wrapper,
	.primary-content.show-edit-menu .tab-wrapper {
		width: calc(100% - 1em);
		margin: 0 .5em;
	}

	section.workspace .tab-wrapper:not(:last-child) {
		margin-bottom: .5em;
	}

	#sideMenu .contract-details-wrapper {
		margin: .5em 0;
	}

	section.workspace .tab-wrapper,
	#sideMenu {
		margin: 0 .5em;
		width: calc(100% - 1em);
	}

	#statusBar {
		margin: 0 .5em;
	}

	.right-nav-links.open {
		margin: 0 !important;
		position: absolute;
		right: 0;
		width: calc(100% - 46px);
	}

	.right-nav-links.open > .nav-collapse {
		margin-right: auto;
		padding-left: 1em;
	}

	.btn.nav-collapse {
		margin: 0;
		padding-left: 0;
	}

	nav .nav-links:nth-child(2):not(.show-search) {
		justify-content: end;
	}

	nav .nav-links:not(.show-search) #stickyNote {
		padding-left: 0;
	}
	
	nav .nav-links:not(.show-search) .mobile-quick-search {
		display: block;
	}

	nav .nav-links:not(.show-search) .quick-search {
		display: none;
	}
	
	nav .nav-links.show-search {
		position: static;
	}
	
	.show-search .quick-search-wrapper {
		left: 5px;
		right: 5px;
	}

	.quick-search-wrapper .results-title {
		flex-flow: column-reverse;
	}

	.show-search.advanced .quick-search-wrapper {
		border-radius: 0;
		left: 0;
		max-height: calc(100vh + 10px);
		right: 0;
	}
	
	#advancedSearchForm .form-row:nth-child(2) {
		flex-flow: column;
	}

	#advancedSearchForm .form-row:nth-child(2) .radio-toggle {
		justify-content: end;
	}

	#advancedSearchForm .form-row:nth-child(2) .radio-toggle:nth-child(5) {
		margin-bottom: 0;
	}

	section.workspace .user-dash-wrapper {
		overflow-x: hidden;
	}

	.user-dash-wrapper .summary-details {
		padding: 1em;
	}

	section.workspace .dashboard-wrapper {
		margin: 0.5em 0.5em 0;
		padding: 0.5em;
		width: calc(100% - 1em);
	}

	.summary-details .summary-table,
	.summary-details .task-summary {
		min-width: 100%;
		padding-right: 0;
	}

	.summary-details .summary-header {
		display: none;
	}
	
	.summary-details .row:not(.task) .col {
		flex-basis: 25%;
	}

	.summary-details .row:not(.task) .col:first-child {
		overflow-x: hidden;
		text-overflow: ellipsis;
		text-wrap: nowrap;
	}
	
	.summary-details .task-summary .row {
		flex-flow: column;
	}

	.summary-details .task-summary .row > div{
		text-align: center;
	}

	section.workspace .tab-wrapper:not(:nth-child(5)),
	.primary-content.show-edit-menu .tab-wrapper:nth-child(5) {
		margin-top: .5em;
	}
	
	.dealer-details .tab-content {
		flex-flow: column;
	}
	.dealer-details .tab-content > .col{
		width: 100%;
	}

	.scroll:not(form) {
		max-height: calc(100vh - 90px);
	}

	.sales-map #salesMap {
		min-height: calc(100vh - 124px);
	}

	#statusBar .tasks-wrapper.opened {
		margin: 0;
		width: 100%;
	}

	#statusBar .tasks-wrapper.opened .task-container {
		margin: 0;
	}
}

@media all and (max-width: 430px){
	#sideMenu .contract-details {
		text-align: center;
	}
	
	#sideMenu .contract-details .ellipsis-container {
		justify-content: center;
	}

	.sms-row {
		display: flex;
		flex-flow: column;
	}

	.sms-row:not(.Incoming) {
		flex-flow: column-reverse;
	}

	.sms-row .sms-details {
		justify-content: flex-end;
		margin-right: 2em;
		text-align: right;
		width: 100%;
	}

	.sms-row:not(.Incoming) .sms-details .agent {
		border-color: transparent;
	}
	
	.sms-row .sms-divider {
		display: none;
	}

	.sms-content {
		width: 100%;
	}
	
	.show-search .quick-search > i:first-child {
		display: none;
	}

	nav.minimal .show-search .quick-search-wrapper {
		padding-left: 24px;
		left: 0;
	}
	
	.tab-wrapper .tab-item {
		font-size: .9em;
	}
}


/* Height and Width ---------------------------------*/

@media all and (max-height: 900px) and (max-width: 430px){
	nav .show-search .quick-search-wrapper {
		height: calc(100vh + 10px);
		border-radius: 0;
		position: fixed;
	}

	nav .show-search .quick-search-wrapper .scroll{
		max-height: 100%;
	}

	nav .nav-links.show-search:nth-child(2) {
		position: fixed;
	}

	nav.minimal .show-search .quick-search-wrapper {
		top: -9px;
	}
}

@media all and (max-height: 832px) and (min-width: 750px){
	.make-payment form.extend {
		height: initial;
	}
}
