/* Simple File List Back-End Styles
	Version 5 - Winter 2022 */
	
/* COLORS */



.eeSFL_Admin { /* <main> */
	
	box-sizing: border-box;
	padding: .5em;
	padding-top: 0;
	font-size: 16px;
	position: relative;
	
	--ee-admin-border: #777;
	--ee-admin-light-text: #eaeaef;
	--ee-admin-medium-text: #999;
	--ee-admin-dark-text: #333;
	--ee-admin-input-background: #FFF;
	--ee-admin-light-background: #f0f0f1;
	--ee-admin-medium-background: #dcdcde;
	--ee-admin-dark-background: #1d2327;
	--ee-admin-tile-background: #f0f0f1;
	--ee-admin-upsell-background: #d0ffd8;
	--ee-admin-upload-progress-bar: #23e100;
	--ee-admin-disabled-action-background: #e0e0e1;
	--ee-admin-caution-background: #FFFF00;
	
}

.eeSFL_Admin .eeSFL {

	--ee-color-table-background: none;
	--ee-color-table-border: #777;
	--ee-color-table-header-background: #1d2327;
	--ee-color-table-header-text: #eaeaef;
	--ee-color-table-row-background: #FFF;
	--ee-color-table-row-background-hover: #EEE;
	--ee-color-table-cell-text: #333;
	--ee-color-action-link-text: #333;
	--ee-color-action-link-background: #dcdcde;
	--ee-color-action-link-text-hover: #DDD;
	--ee-color-action-link-background-hover: #333;
	--ee-color-table-edit-background: #EEE;
	--ee-color-table-input-background: #FFF;
	
	
	/* TILES */
	--ee-color-tile-border: #777;
	--ee-color-tile-header-background: #dcdcde;
	--ee-color-tile-background: #FFF;
	
	/* FLEX */
	--ee-color-flex-border: #777;
	--ee-color-flex-background: #FFF;
	--ee-color-flex-file-background: #EEE;
	
	padding-top: 1em;

}

.ee {
	color: #d4ffdd;
}


.eeSFL_Admin {
	min-width: 800px;
	
}
.eeSFL_Admin h1,
.eeSFL_Admin h2,
.eeSFL_Admin h3 {
	margin-bottom: 1em;
}
.eeSFL_Admin p,
.eeSFL_Admin ul,
.eeSFL_Admin li {
	padding: 0;
	margin-bottom: 1.5em;
	font-size: 1rem;
	line-height: 1.3;
}
.eeSFL_Admin ul {
	list-style-type: circle;
}
.eeSFL_Admin ul li {
	margin-left: 1em;
	margin-bottom: .5em;
}
.eeSFL_Admin ul li ul {
	margin-left: 1em;
	margin-bottom: .5em;
}
.eeSFL_Admin ul li ul li {
	margin-left: 1em;
	margin-bottom: .5em;
}
.eeSFL_Admin ul code {
	line-height: 2;
}
.eeSFL_Admin .notice p {
	margin: 1.5em 0 1.5em .5em;
}

.eeGoPro h1 {
	font-weight: 600;
	font-size: 2em;
	line-height: 1;
	margin-bottom: .5em;
}
.eeGoPro h2 {
	font-weight: 500;
	font-size: 1.5em;
	line-height: 1;
	margin-bottom: .5em;
}
.eeGoPro p {
	padding-bottom: 2em;
}
.eeGoPro ul {
	padding-bottom: 2em;
}
.eeGoPro .button {
	font-size: 1.5em;
}

#eeGoProBanner {
	background-color: var(--ee-admin-upsell-background);
	padding: 10px;
	border: 1px solid var(--ee-admin-border);
}
main.eeSFL_Admin div.notice.notice-success.is-dismissible ul {
	list-style: none;
	list-style-type: none;
}
#eeGoProBanner p {
	font-size: 100%;
	color: #666;
}
#eeGoProBanner a.button {
	float: right;
	margin: 0 0 2px 25px;
}


/* ADMIN HEADER */

.eeSFL_Admin header {
	background-color: var(--ee-admin-medium-background);
	padding: .75em;
	margin: 0 0 .5em;
	border: 1px solid var(--ee-admin-border);
}

.eeSFL_Admin header img {
	display: block;
	float: left;
	height: 4em;
	width: auto;
	margin: .25em 1.5em .25em .25em;
}
.eeSFL_Admin header div {
	float: left;
}
.eeSFL_Admin header .eeShortCodeOps {
	float: right;
}
.eeSFL_Admin header .eeShortCodeOps p {
	line-height: 1.5;
	text-align: right;
}
.eeSFL_Admin header p.heading {
	margin: 0;
	margin-bottom: .1em;
	padding: 0;
	font-size: 2em;
	line-height: 1;
}
.eeSFL_Admin header p.eeTagLine {
	font-size: 90%;
	margin: 0;
	padding: 0;
	border-bottom: 2px solid var(--ee-admin-border);
}
.eeSFL_Admin header p.eeHeaderLinks {
	font-size: .7em;
	margin: 0;
	margin-top: .5em;
	line-height: 1;
}
.eeSFL_Admin header p.eeHeaderLinks a {
	text-decoration: none;
	display: inline-block;
	margin-right: .5em;
	color: var(--ee-admin-light-text);
	background-color: var(--ee-admin-dark-background);
	padding: .25em .3em;
	border-radius: .33em;
	border: 1px solid var(--ee-admin-dark-background);
}
.eeSFL_Admin header p.eeHeaderLinks a:hover {
	color: var(--ee-admin-dark-text);
	background-color: var(--ee-admin-medium-background);
	border: 1px solid var(--ee-admin-border);
}

/* ADMIN TABS */

.eeSFL_Admin .nav-tab {
	float: none;
}
.eeSFL_Admin h2.nav-tab-wrapper {
	display: flex;
	border-bottom: 2px solid var(--ee-admin-border);
}
.eeSFL_Admin h2.nav-tab-wrapper span {
	display: flex;
	flex: 1 1 50%;
}
.eeSFL_Admin h2.nav-tab-wrapper .nav-tab-wrapper-right {
	justify-content: end;
}
.eeSFL_Admin h2.nav-tab-wrapper .nav-tab-wrapper-left a:first-child {
	margin-left: 0;
}
.eeSFL_Admin h2.nav-tab-wrapper a.eeActiveTab {
	color: var(--ee-admin-light-text);
	background-color: var(--ee-admin-dark-background);
}






/* ADMIN SETTINGS */
.eeSFL_Admin h2.nav-tab-wrapper .ee-nav-sub-tabs {
	margin-top: 1em;
}
.eeSFL_Admin h2.nav-tab-wrapper .ee-nav-sub-tabs a:first-child {
	margin-left: 2em;
}

/* MAIN SETTINGS CONTAINER */
.eeSFL_Settings {
	margin-top: 0;
	padding: .5em 1em 1em 0;
	border: 2px solid var(--ee-admin-border);
	border-top: none;
	background-color: var(--ee-admin-dark-background);
}
.eeColumns {
	display: flex;
	margin-top: 0;
}
.eeColFull {
	flex: 0 1 100%;
}
.eeColLeft,
.eeColRight {
	flex: 2 1 0%;
	display: flex;
	flex-direction: column;
}

/* FULL COLUMN WITH INLINE CONTENT */
.eeColInline {
	display: flex;
}
.eeColInline .eeColHalfLeft {
	display: flex;
	flex: 0 0 50%;
    align-items: center;
}
.eeColInline .eeColHalfRight {
	display: flex;
	flex: 0 0 50%;
	justify-content: end;
    align-items: center;
}

.eeColInline h1,
.eeColInline a,
.eeColInline small,
.eeColInline input[type=submit] {
	margin: 0;
	padding: 0;
}
.eeColInline h1 {
	font-size: 2em;
	margin-right: 1em;
}
.eeColInline a.button {
	font-size: 1em;
	margin-right: .5em;
	text-align: center;
}
.eeColInline input[type=submit] {
	font-size: 1em;
	padding: .25em .75em; 
}



/* SETTINGS TILES */
.eeSettingsTile {
	padding: 1.5em;
	margin: 1em 0 1em 1em;
	margin-bottom: 0;
	background-color: var(--ee-admin-tile-background); /*  #f0f0f1 */
	flex: 1;
}
.eeSettingsTile h2,
.eeSettingsTile h3 {
	margin: 0 0 1em 0;
}
.eeSettingsTile h3 {
	font-size: .9em;
	margin-bottom: .3em;
}
.eeSettingsTile p,
.eeSettingsTile ul {
	margin: 0 0 .75em 0;
}

.eeSettingsTile fieldset{
	margin-bottom: 1.25em;
}
.eeSettingsTile fieldset div {
	margin-bottom: .75em;
}
.eeSettingsTile fieldset label,
.eeSettingsTile fieldset input[type=text],
.eeSettingsTile fieldset input[type=email],
.eeSettingsTile fieldset select,
.eeSettingsTile fieldset input[type=checkbox] {
	display: inline-block;
	margin-right: .75em;
	font-size: .9em;
}

.eeSettingsTile fieldset label input[type=checkbox],
.eeSettingsTile fieldset label select {
	margin-left: 1em;
}

.eeSettingsTile fieldset label.eeBlock {
	display: block;
	width: 100%;
	line-height: 2;
}
.eeSettingsTile fieldset label.eeBlock input[type=text] {
	display: block;
	width: 100%;
}

.eeSettingsTile fieldset input[type=checkbox] {
	transform: scale(1.2);
	padding: .5em;
	background-color: var(--ee-admin-input-background);
}
.eeSettingsTile fieldset input[type=text] {
/* 	width: 40%; */
	background-color: var(--ee-admin-input-background);
}
.eeSettingsTile fieldset textarea {
	width: 100%;
}

.eeSettingsTile fieldset legend {
	display: block;
	width: 100%;
	padding-bottom: .25em; 
	border-bottom: 1px solid var(--ee-admin-border);
	margin-bottom: .5em;
}

.eeSettingsTile .eeNote {
	font-size: .8em;
	font-style: italic;
	padding: .25em;
	margin-bottom: .33em;
	color: var(--ee-admin-dark-text);
	background-color: var(--ee-admin-medium-background);
	border: 1px solid var(--ee-admin-border);
	border-radius: .25em;
}


/* ADMIN UPLOAD FORM */
.eeSFL_Settings .eeAdminUploadForm #eeSFL_FileDropZone {
	padding: 1em;
	border: 4px dashed var(--ee-admin-border);
}
.eeSFL_Settings .eeAdminUploadForm label {
	display: block;
}
.eeSFL_Settings .eeAdminUploadForm textarea {
	display: block;
	width: 100%;
	height: 4em;
	margin-bottom: 1.5em;
	background-color: var(--ee-admin-input-background);
}
.eeSFL_Settings .eeAdminUploadForm input[type=file] {
	display: block;
	width: 100%;
	padding: .33em;
	font-size: 120%;
	background-color: var(--ee-admin-input-background);
	border: 1px solid var(--ee-admin-border);
}
.eeSFL_Settings .eeAdminUploadForm #eeSFL_FilesDrug {
	display: none;
	padding: .33em;
	font-size: 120%;
	background-color: var(--ee-admin-input-background);
	border: 1px solid var(--ee-admin-border);
}
.eeSFL_Settings .eeAdminUploadForm #eeSFL_UploadGo {
	float: right;
	margin: 1.5em 3em 0 0;
	font-size: 120%;
}
.eeSFL_Settings .eeAdminUploadForm #eeSFL_UploadProgress {
	display: none; /* Show with javascript */
	overflow: hidden;
	width: 1%;
	height: 2em;
	line-height: 2em;
	background-color: var(--ee-admin-upload-progress-bar);
	color: var(--ee-admin-light-text);
	font-size: 1em;
	text-align: center;
	vertical-align: text-top;
}
.eeSFL_Settings .eeAdminUploadForm #eeSFL_UploadProgress em, /* Show with javascript */
.eeSFL_Settings .eeAdminUploadForm p.sfl_instuctions {
	display: none; 
}

/* Upload Queue */

#eeSFL_FileUploadQueue p {
	position: relative;
	margin: 1em;
}
#eeSFL_FileUploadQueue span.eeSFL_FileUploadName {
	display: block;
	border-bottom: 1px solid var(--ee-color-drop-zone-border);
	padding-bottom: .25em;
	font-weight: bold;
}
#eeSFL_FileUploadQueue span.eeSFL_FileUploadType {
	display: inline-block;
	margin-left: 2em;
}
#eeSFL_FileUploadQueue .eeSFL_FileUploadRemove {
	position: absolute;
	top: 0;
	right: 0;
	font-size: 1.5em;
	line-height: 1;
	cursor: pointer;
}



/* ADMIN FOOTER */

.eeSFL_Admin > footer {
	background-color: var(--ee-admin-medium-background);
	border: 1px solid var(--ee-admin-border);
	border-top: 3px solid var(--ee-admin-border);
	margin-top: 1.5em;
	padding: 1.5em;
}

.eeSFL_Admin > footer > a {
	display: inline-block;
	color: var(--ee-admin-light-text);
	background: var(--ee-admin-dark-background);
	padding: .2em .5em;
	margin-right: .5em;
	margin-bottom: .25em;
	border-radius: .2em;
	text-decoration: none;
}
.eeSFL_Admin > footer > a.eeCaution {
	font-weight: bold;
	background-color: var(--ee-admin-caution-background);
	color: var(--ee-admin-dark-text);
}

.eeSFL_Admin > footer > p.ee-plugin-version {
	border-top: .25em solid var(--ee-admin-border);
	margin-top: 1em;
	padding-top: .5em;
	text-align: center;
}

#eeSFL_LangOption {
	display: block;
	float: right;
	max-width: 33%;
	text-align: right;
}
#eeSFL_LangOption p {
	margin-bottom: .25em
}

.eeSFL_Admin p.eeAlert {
	font-size: 125%;
	color: red;
	background-color: #DDD;
	margin: 20px;
	padding: 4px;
	text-align: center;
}



.eeSFL article.eeSFL_Tile {
	margin-top: .5em;
	background-color: #FFF;
}

.eeFortyPercent {
	width: 40% !important;
}



.eeSFL table.eeFiles {
	margin-top: 0;
}
.eeSFL table.eeFiles .eeSFL_ListFileActions a.eeDisabledAction {
	border: 1px solid var(--ee-admin-border);
	background-color: var(--ee-admin-light-background);
	color: var(--ee-admin-medium-text);
}

.wp-core-ui .button, .wp-core-ui .button-secondary {
	vertical-align: middle;
}


