:root {
  --border-grey: solid 1px rgba(208, 208, 208, 0.65);
  --border-darkgrey: solid 1px rgba(195, 195, 195, 0.65);
  --border-lightgrey: solid 1px #e0e0e0;
  --border-button: solid 1px rgba(34, 113, 177, 0.55);

  --bg-g: #f8f8f8; 
  --bg-w6: rgba(255, 255, 255, 0.6);
  --bg-w85: rgba(255, 255, 255, 0.85);
  --bg-e7:#e7e7e7aa;
  --bg-ef: #efefefab;
  --bg-form: rgba(130,130,130,.05);
  --bg-button: #fcfdfd;
  
  --table-border-color: #e3e3e3;

  --c-fe: #fefefe;
  --c-f9: #f9f9f9;
  --c-b: #bbb;

  --c-progress: rgba(0, 20, 129, 0.8);
  --px-3: 3px;
  --px-4: 4px;

  --t-dark: #f6f7f7;
  --t-light: #fcfcfc;

  --drop-200: 0.5px 0.5px 0.5px rgba(200, 200, 200, 0.5);
}

.atec-page DIV { box-sizing: border-box; }
.atec-page { font-size: 1.1em; line-height: 1.45; }
.atec-page H1 { margin: .67em 0 }
/* .atec-page H3 { line-height: 1.7em; } */
.atec-page H4 { margin: 0.5em 0; font-weight: 600; font-size: 1.25em; }
.atec-pro-box H4 { font-size: 14px; line-height: 1.4em; margin: 0; }
.atec-page HR { box-sizing: content-box; height: 0; margin-top:0; overflow: visible; width: 100%; }
.atec-page PRE { font-family: monospace, monospace; font-size: 1em }
.atec-page SMALL { font-size: 90% }
.atec-page INPUT::placeholder { color: var(--c-b); }

.atec-page BUTTON SPAN, .atec-page .button { vertical-align: middle; }
.atec-page BUTTON SPAN:nth-child(2) { display: inline-block; height: 15px; vertical-align: bottom; }
.atec-page .button { line-height: 1em; background: var(--bg-button); border: var(--border-button); min-height: 30px !important; max-height: 30px !important; padding: 0 8px !important; }
.atec-page .button:hover, .atec-btn-small:hover { background: rgba(34, 113, 177, 0.05); }
.atec-page .button-primary { background: #2271b1 !important; }

.atec-page P.submit	{ padding-bottom: 0.5em; }
.atec-page P, .atec-box-white { font-size: 1em; line-height: 1.25em; }

.atec-page .nav-icon	{ height: 18px; vertical-align: middle; filter: brightness(0) saturate(100%) invert(39%) sepia(67%) saturate(653%) hue-rotate(166deg) brightness(86%) contrast(90%); }
.atec-page .nav-tab { padding: 4px 8px; border: var(--border-darkgrey); border-bottom: none; border-top-left-radius: var(--px-3); border-top-right-radius: var(--px-3); background: var(--bg-form) !important; font-size: 1var(--px-3); }
.atec-page .nav-tab:hover { background: white; }
.atec-page .nav-tab-active { background: var(--bg-g) !important; border-bottom: solid 1px var(--bg-g); }
.atec-page .nav-tab-wrapper { height: 32px; padding: 0 !important; border: none; }

.atec-center	 	{ text-align: center; }
.atec-left		 	{ text-align: left !important; }

.atec-clear		{ clear: both; margin-top: 0.5rem !important; }
.atec-red			{ color: red !important; }
.atec-orange		{ color: #fe9d00ff !important; }
.atec-green		{ color: green !important; }
.atec-grey			{ color: grey !important; }
.atec-violet		{ color: rgb(127, 0, 197) !important; }
.atec-blue			{ color: rgb(34, 113, 177) !important; }
.atec-black		{ color: black !important; }
.atec-lightgrey	{ color: #aaa !important; }

.atec-code, .atec-box-white { border: var(--border-grey); padding: 10px; max-width:fit-content; margin: 5px 0; border-radius: var(--px-4);; }
.atec-code { white-space: break-spaces; font-size: 1em; line-height: 1.3em; }

.atec-plugin-icon, .atec-sys-icon { filter: drop-shadow(0.5px 0.5px 0.5px rgba(0, 0, 0, 0.25)); }
.atec-plugin-icon { max-width: 22px; width: auto; height: 22px; }
.atec-headline	{ display: block; font-size: 14px; font-weight: 600; margin-bottom: 5px; }
.atec-box-white, .atec-code { background: white; box-shadow: var(--drop-200); }
.atec-bg-w 		{ background: white; }
.atec-bg-w6 	{ background:  var(--bg-w6); }
.atec-bg-w85 	{ background:  var(--bg-w85); }

.atec-float-left		{ float: left; }
.atec-float-right	{ float: right; }
.atec-logo 		{ height:20px; width: auto; max-height: 20px; vertical-align: bottom; padding-bottom: 2px; }
.atec-nowrap	{ white-space: nowrap; word-wrap: normal; }
.atec-anywrap	{ white-space: break-spaces; word-wrap: anywhere; }
.atec-label		{ font-size: 1.1em; }
.atec-label, .atec-bold { font-weight: 600; }
.atec-nodeco	{ text-decoration: none !important; }
.atec-under		{ padding-bottom: px; border-bottom: solid 1px var(--c-b); }
.atec-small		{ font-size: 0.8em !important; }
.atec-radius-3	{ border-top-left-radius: var(--px-3); border-top-right-radius: var(--px-3); }
.atec-pro-btn	{ display: inline-block; font-weight: bold; width:28px; border: solid 1px white; border-radius: var(--px-3); height:20px; padding: 0 4px; font-size:8px; color:#333; }
.atec-pro			{ font-size:10px; color:white; font-weight: 600; height: 6px; text-shadow: 1px 1px 1px #333; }
.atec-pro-box	{ display: inline-block; background: white; border: var(--border-grey); padding: 10px; margin-bottom: 10px; width: fit-content; }
.atec-sys-icon 	{ vertical-align: text-top; height:16px; margin-right: 5px; }
.atec-cursor		{ cursor: pointer !important; }
.atec-box-30	{ height: 32px; }
.atec-badge		{ display:flex; width:fit-content; height:fit-content; border:solid 1px #ddd; margin: 0px 10px 5px 0; border-radius: var(--px-4);; padding: 3px 6px; vertical-align: top; }

.atec-counter 	{ display: inline-block; margin: 0px 5px 5px 0; background: #a7e598a5; border: var(--border-grey); border-radius: var(--px-4); 
					min-width:24px; text-align: center; padding: 0px 2px; white-space: nowrap; font-size: 12px; font-weight: 500; animation: atec-pop 0.5s ease; }
@keyframes atec-pop { 0% { transform: scale(0.95); opacity: 0; } 50% { transform: scale(1.05); opacity: 1; } 100% { transform: scale(1); } }

.atec-courier		{ font-family: "courier new" !important; }
.atec-db			{ display: block !important; }
.atec-dilb			{ display: inline-block; }
.atec-dil			{ display: inline; }
.atec-dc			{ display: table-cell; }
.atec-dn			{ display: none !important; }
.atec-df			{ display: flex; }
.atec-df1			{ flex:1; }
.atec-fit, .atec-box-white { width: fit-content !important; }
.atec-box-white { display: block; }

.atec-vat			{ vertical-align: top; }
.atec-vam			{ vertical-align: middle; }

.atec-sticky-left, .atec-sticky-right, .atec-notice { background: var(--c-f9); border: solid 1px white; position:absolute; top: 10px; padding: 2px 4px; border-radius: var(--px-3); }
.atec-sticky-left { left: 0px; z-index: 0; }
.atec-sticky-right { right: 21px; z-index: 0; }
.atec-notice { left: 0px; z-index: 999; }
.atec-integritry { background: var(--c-f9); border: solid 1px white; padding: 2px 4px; border-radius: var(--px-3); text-decoration: none !important; font-weight: 600; }

.atec-table { border: 1px solid var(--table-border-color); border-spacing: 0; table-layout: auto; max-width: 100%; margin-bottom: 10px; box-shadow: var(--drop-200); border-radius: var(--px-3); }
.atec-table-fit	{ table-layout: auto; width: fit-content; }

.atec-table TH { background: white; white-space: pretty; text-align: left; font-weight: 600; }
.atec-table TH, .atec-table TD { font-size: 14px; line-height: 1.4em; padding: 8px 10px; border-bottom: 1px solid var(--table-border-color); }
.atec-table TH { padding: 10px; }
.atec-table TR:last-child TD { border-bottom: none; }
.atec-table TBODY TR { background: var(--t-dark); }
.atec-table TBODY TR:nth-child(2n) { background: var(--t-light); }

.atec-table-tiny TD { padding: 4px 6px !important; }
.atec-table-tiny TH { padding: 6px !important; }

.atec-table-mid TD { padding: 5px 7px; }
.atec-table-mid TH { padding: 7px; }

.atec-table THEAD TD, .atec-table-td-first TD:first-child, .atec-table-tr-bold TD { font-weight: 600; }
.atec-table .button { min-height: 30px !important; max-height: 30px !important; }
.atec-table-td-right { text-align: right !important; white-space: nowrap !important; }

.atec-TDBR { border-right: 1px solid var(--table-border-color); }
.emptyTR1,.emptyTR2{ background: var(--bg-g) !important; }
.emptyTR1 { display:none !important; }
.emptyTR2{ border-left:none !important; border-right:none !important; padding:1px !important; }

.atec-help	 { display: none; border: var(--border-grey); background: var(--bg-w85); padding: 4px 8px !important; width: fit-content; margin-bottom: 10px !important; }
.atec-help LI { list-style-type: disc; }
.atec-help UL { margin-left: 20px; }
.atec-help-button { background: var(--bg-w85); border-color: #ffb742a8 !important; cursor:pointer; display: inline-block !important; width: fit-content !important; font-size: 0.9em; margin: 0 5px 5px 0 !important; vertical-align: middle !important; }
.atec-help-button .dashicons { font-size: 22px; padding-top: 2px; }

.atec-g { display: grid; width: 100%; gap: 0 1rem; grid-template-columns: repeat(auto-fit, minmax(100%, 1fr)); margin-bottom: 10px; align-items: start; }
.atec-g.atec-border { background: var(--bg-g); }
.atec-g:last-child { margin-bottom: 0; }
.atec-g-14 { grid-template-columns: repeat(7, 1fr); }
.atec-g-25 { grid-template-columns: repeat(4, 1fr); }
.atec-g-50 { grid-template-columns: repeat(2, 1fr); }
.atec-g-30-70 { grid-template-columns: 1fr 2fr; }
.atec-g-70-30 { grid-template-columns: 2fr 1fr; }
.atec-g-auto-2 { grid-template-columns: auto auto; }
.atec-g-100 { grid-template-columns: 1fr; }

.atec-page { padding: 20px 20px 0 0; display: grid; width: auto; grid-template-areas: "header" "main"; grid-template-rows: 1fr; }
.atec-header { grid-area: header; height: 70px; }
.atec-main { grid-area: main; margin-bottom: 10px; overflow: auto; }
.atec-footer { margin: 0 20px 0 0; color:#777; display: block; }
.atec-footer A { text-decoration: none; }

.atec-head { background: var(--bg-w85); border-bottom:var(--border-grey); width: fit-content; margin-bottom: 10px; padding: 0 10px; border-top-left-radius: var(--px-3); border-top-right-radius: var(--px-3); height: 30px; }
.atec-header H3, .atec-head H3 { margin: 0; }

#wpbody-content { padding-bottom: 40px; }
.notice { z-index: 1; margin-left: 0; padding: 0 8px; }
.atec-page .notice { width: fit-content; }
.atec-page .notice p { margin: 0.25em 0; }
.atec-page .notice-dismiss  { padding: 0.5em; }

@media only screen and (max-width: 1280px) 
{
	.atec-g { margin-bottom: 5px; }
	.atec-g-14 { grid-template-columns: repeat(5, 1fr); }
	.atec-g-25 { grid-template-columns: repeat(2, 1fr); }
	.atec-g-50 { grid-template-columns: 1fr; }
	.atec-head { margin-bottom: 10px; }
}

@media only screen and (max-width: 960px) 
{
	.atec-page { padding: 10px 15px 0 0; } 
	.atec-clear-nav	{ clear: both; }
	.nav-tab-wrapper A { font-size: 12px; }
	.nav-icon { height: 17px; }
}

@media only screen and (max-width: 782px) 
{ 
	.atec-g-14 { grid-template-columns: repeat(3, 1fr); }
	.atec-g-25, .atec-g-30-70, .atec-g-70-30 { grid-template-columns: 1fr; } 

	.atec-page { padding: 10px 10px 0 0; } 
	.atec-head { padding: 2px 4px; } 
	.atec-main { margin-bottom: 10px; }
	.atec-footer { width: calc(100% - 10px); }
	
	.atec-table { table-layout: auto; width: 100%; }
	.atec-table TH, .atec-table TD { word-wrap: anywhere; }
	.atec-sticky-right { right: 11px; }
	
	.nav-tab-wrapper A { font-size: 11px; }
	.nav-icon { height: 15px; }
	.atec-pro { font-size:8px; }

	#wpbody-content { padding-bottom: 10px; }
	.notice { margin-right: 10px; margin-top: 5px; }
}

.atec-m-0				{ margin: 0px !important; }
.atec-m-5				{ margin: 5px !important; }
.atec-m-10			{ margin: 10px !important; }

.atec-ml-5			{ margin-left: 5px !important; }
.atec-ml-10			{ margin-left: 10px !important; }
.atec-ml-20			{ margin-left: 20px !important; }

.atec-mb-0			{ margin-bottom: 0px !important; }
.atec-mb-5			{ margin-bottom: 5px !important; }
.atec-mb-10			{ margin-bottom: 10px !important; }
.atec-mb-20			{ margin-bottom: 20px !important; }

.atec-mt-0			{ margin-top: 0px !important; }
.atec-mt-2			{ margin-top: 2px !important; }
.atec-mt-5			{ margin-top: 5px !important; }
.atec-mt-20			{ margin-top: 20px !important; }

.atec-mr-0			{ margin-right: 0px !important; }
.atec-mr-5			{ margin-right: 5px !important; }
.atec-mr-10			{ margin-right: 10px !important; }

.atec-p-0				{ padding: 0px !important; }
.atec-p-5				{ padding: 5px !important; }
.atec-p-10			{ padding: 10px !important; }
.atec-pb-0			{ padding-bottom: 0 !important; }
.atec-pt-0			{ padding-top: 0px !important; }
.atec-pt-10			{ padding-top: 10px !important; }

.atec-fs-8				{ font-size: 8px; }
.atec-fs-9				{ font-size: 9px; }
.atec-fs-10			{ font-size: 10px; }
.atec-fs-12			{ font-size: 12px; }
.atec-fs-14			{ font-size: 14px; }
.atec-fs-16			{ font-size: 16px; }

.atec-btn-small	{ display: inline-block; padding: 2px 6px !important; max-height: 24px !important; background: var(--bg-button); border: solid 1px white; margin-top: 5px; border-radius: var(--px-3); }
.atec-btn-bg, .atec-btn-div { display: inline-block; }
.atec-btn-bg		{ border-radius: var(--px-3); background: var(--bg-e7); border: var(--border-grey); padding: 2px 4px;}
.atec-btn-div 		{ margin-bottom: 10px; width: 100%; background: var(--bg-w6); border: var(--border-grey); padding: 5px 5px 0 5px; }
.atec-btn-div DIV.atec-float-left { margin: 0 10px 5px 0; }
.atec-btn-div DIV.atec-float-left:last-child { margin-right: 0; }

.atec-border-bottom { border-bottom: var(--border-darkgrey); margin-bottom: 10px; padding-bottom: 2px; }

.atec-border, .atec-border-tiny { border: var(--border-grey); padding: 10px; border-radius: var(--px-3); }
.atec-border-tiny		{ padding: 5px; }
.atec-border-white 		{ margin-bottom: 1rem; background: #f5f5f5fc; border-radius: var(--px-3); padding: 10px; box-shadow: var(--drop-200); border: solid 1px #ededed; }
.atec-border-white H2:first-child, .atec-border-white H3:first-child, .atec-border-white H4:first-child { margin-top: 0; }
.atec-overflow { overflow-x: auto; }
.atec-progress { width: 33.3%; height:var(--px-3); line-height: var(--px-3); display: block; margin: 1px 0 0 33.3%; }
.atec-progressBar { background: var(--c-progress); opacity: 1; height:100%; animation: atec-progress 5s linear forwards; border-radius: var(--px-3); }
@keyframes atec-progress { 0% { margin-left: 50%; width: 0%; opacity: 1; } 50% { margin-left: 25%; width: 50%; } 99% { margin-left: 0.5%; width: 99%; } 100% { margin-left: 0%; width: 100%; opacity:0; } }

.atec-loader-dots { height: 9px; }
.atec-loader-dots span { display: inline-block; vertical-align: middle; width: 7px; height: 7px; background: var(--c-progress); border-radius: 7px; animation: atec-loader-dots 1.4s infinite alternate; }
.atec-loader-dots span:nth-of-type(1) { animation-delay: 0.1s; }
.atec-loader-dots span:nth-of-type(2) { animation-delay: 0.2s; }
.atec-loader-dots span:nth-of-type(3) { animation-delay: 0.3s; }
.atec-loader-dots span:nth-of-type(4) { animation-delay: 0.4s; }
.atec-loader-dots span:nth-of-type(5) { animation-delay: 0.5s; }
.atec-loader-dots span:nth-of-type(6) { animation-delay: 0.6s; }
.atec-loader-dots span:nth-of-type(7) { animation-delay: 0.7s; }
@keyframes atec-loader-dots { 0% { opacity: 0.9; transform: scale(0.5); } 100% { opacity: 0.1; transform: scale(1); }}

.dashicon-spin { display: inline-block; animation: dashicon_spin 2s linear infinite; }
@keyframes dashicon_spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
