// RedmineX Theme
// Copyright 2020 RedmineX
// For license, see https://www.projectino.cz
// Created by Michael Staněk
// Created without vendor prefixes, "AutoPrefixed" by PrePros v5 (https://prepros.io)
 
// Media Queries to Copy / Paste:
 
// 380px
// @include media-breakpoint-up(xxs) {}

// 480px
// @include media-breakpoint-up(xs) {}

// 576px
// @include media-breakpoint-up(sm) {}

// 768px
// @include media-breakpoint-up(md) {}

// 899px
// @include media-breakpoint-up(redmine-mobile) {}

// 992px
// @include media-breakpoint-up(lg) {}

// 1200px
// @include media-breakpoint-up(xl) {}

// 1500px
// @include media-breakpoint-up(hd) {}

// 1900px
// @include media-breakpoint-up(2k) {}

/* ==========================================================================
   Redmine CRM
   ========================================================================== */

span.contact {
	display: inline !important;
}

table.contacts,
table.note_data {
	
	&.index td.name h1 {
		font-size: 1rem !important;
	}
	
	td.avatar {
		padding-right: 0 !important;
	}
	
	.avatar img.gravatar {
		width: 18px;
		height: 18px;
		margin: 0;
	}
}

table.contacts {
	background: $table-bg;
	
	.avatar img.gravatar {
		top: -2px;
	}
}

table.note_data {
	
	td {
		padding: 0.5rem !important;
	}
}

.live_search input.live_search_field {
	font-size: $font-size-sm2 !important;
}

.controller-contacts {
	
	div.contact {
		@include rounded;
		background: $query-form-bg;
		border: 1px solid $border-color-light;
		margin-bottom: 1rem;
	}
	
	.wiki-edit {
		width: 100%;
	}
	
	img.gravatar {
		background: $white;
	}
	
	.contextual {
		justify-content: flex-start;
	}
	
	#edit_tags_link {
		@include btn;
		@include btn-tetriary;
		opacity: 1;
	}
	
	div.add-note {
		margin: 0;
	}
	
	p.extended-attributes {
		margin-bottom: 1rem !important;
	}
	
	.select2-container--default .select2-selection--multiple .select2-selection__choice {
		margin: 3px;
		padding-right: 6px;
	}
	
	table.note_data td.name h4 {
		letter-spacing: normal;
		line-height: 1.25;
	}
}

.controller-contacts,
.controller-deals, 
.controller-expenses,
.controller-invoices {
	
	fieldset:not(#filters):not(#options):not(.collapsible).extended-attributes {
		margin-top: 1rem !important;
	}
	
	.name h1 {
		margin-bottom: 0.25em;
		margin-top: 0;
	}
}

.controller-contacts,
.controller-deals, 
.controller-expenses,
.controller-invoices,
.controller-helpdesk {
	
	#sidebar {
		padding-top: 3rem;
		flex: 0 0 420px;
	}
	
	#sidebar table th, 
	#sidebar table td {
	    padding: 0.25rem 0.5rem 0.25rem 0;
	}
}

.controller-notes {
	
	.edit_note {
		
		table {
			
			td:first-child {
				padding-left: 0 !important;
			}
		}
	}
}

.controller-deals,
.controller-expenses {
	
	.icon-contact {
		background-position: center;
	}
}

.controller-deals {
	
	#select2-deal_contact_id-container {
		padding-left: 1.5rem;
	}
	
	div.deal {
		@include rounded;
		background: $query-form-bg;
		border: 1px solid $border-color-light;
		margin-bottom: 1rem;
	}
	
	table.subject_header td.subject_info {
		border-left: none !important;
	}
	
	table.contacts.deals.index td.avatar {
		padding: 1rem;
	}
}

#expense_contact_id_add_link	 {
	@include rounded;
	@include btn-primary;
	width: auto;
    width: 2rem;
    height: auto;
    text-align: center;
	display: inline-block !important;
	position: relative;
	top: 2px;
	left: 2px;
	padding: 0;
	
	img {
		display: none;
	}
}

#sidebar {
	
	.tag-label-color a {
		color: $white;
	}
	
	.tag-label-color {
		margin: 0 !important;
	}
}

/* ==========================================================================
   Helpdesk
   ========================================================================== */

.small-card div.contact.card table.subject_header td.avatar img {
	background: $white;
}

.controller-helpdesk {
	
	#sidebar table a {
		color: $link-color;
		
		&:hover {
			color: darken($link-color, 10%);
		}
	}
}

#sidebar {
	
	div.contact {
		width: 100%;
		background: $query-form-bg;
	}
}

.flyout-menu {
	
	div.contact {
		width: 100%;
		background: rgba($black, .125);
		border-color: rgba($black, .125);
		
		td {
			padding: 0 !important;
		}
		
		a#avatar {
			padding: 0 !important;
		}
		
		#avatar img {
			width: 32px;
			height: 32px;
			margin: 0;
		}
		
		.avatar {
			text-align: center;
		}
		
		h2 {
			margin: 0 !important;
			
			&:after {
				content: none !important;
			}
		}
	}
}