/*
 * Tweaks for using font-awesome icons to replace jQueryUI icons
 * This file is for standard icon styling only. Specific customizaion of icons should go to their appropriate files
 */
 
.ui-icon {
	width: 16px;		
	overflow: visible;		
	font-size: 0px;	       /* To hide any placeholder text that were previously hidden by text-indent */
    text-indent: 0px !important;      /* Override components.css: text-indent: -99999px */    
    display: inline-block; /* Override components.css: display: block */
}

.ui-button-text-icon-left .ui-icon {
	text-indent: 5px !important;      /* Override the above ui-icon text-indent */
}

.ui-icon:before, 
.fa:before,
.ui-icon:after,
.fa:after {
    font-family: var(--fontawesome);
	font-size: 12px;	   /* To reset font-size: 0px above */
	font-weight: 900;      /* default font-awesome solid style */
}

.far.ui-icon:before, 
.far:before,
.far.ui-icon:after,
.far:after {
    font-family: var(--fontawesome);
	font-size: 12px;	   /* To reset font-size: 0px above */
	font-weight: 400;	   /* font-awesome regular style */
}


/* non-button jQuery ui-icon should have the same color as normal text */
.ui-icon:before {
	color: var(--syn-text-color); 
}

/* default button icon colors */
.ui-button .fa:before, 
.ui-button .ui-icon:before {
	color: var(--action-icon-default);
}

/* .e23 .ui-button .fa:before, 
.e23 .ui-button .ui-icon:before {
	color: var(--action-icon-default);
} */

/* .ui-button.ui-state-hover .fa:before, 
.ui-button.ui-state-hover .ui-icon:before {
	color: var(--text-field-icon-hover);
} */

/* fix all trashcan icon to the same style */
.fa-trash:before, .fa-trash-o:before, .fa-trash-alt:before {
    font-weight: 400 !important;
    content: "\f2ed" !important;
}

/*
 *	Replace jQueryUI image-based icons with FontAwesome icon codes
 *	PrimeFaces 6.1.x and 6.2.x comes bundled with FA 4.7.0, but we disable it, and use our own FA 5.14
 *	jQueryUI icons: http://api.jqueryui.com/theming/icons/
 *	font-awesome icons: https://fontawesome.com/icons?d=gallery
 *	Those with content: "!" are not replace yet; need to find the correct code from above font-awesome link
*/

.ui-icon-blank:before {content: " "} 
.ui-icon-carat-1-n:before {content: "!";} 
.ui-icon-carat-1-ne:before {content: "!";} 
.ui-icon-carat-1-e:before {content: "!";} 
.ui-icon-carat-1-se:before {content: "!";} 
.ui-icon-carat-1-s:before {content: "!";} 
.ui-icon-carat-1-sw:before {content: "!";} 
.ui-icon-carat-1-w:before {content: "!";} 
.ui-icon-carat-1-nw:before {content: "!";} 
.ui-icon-carat-2-n-s:before {content: "\f0dc";} 
.ui-icon-carat-2-e-w:before {content: "!";} 
.ui-icon-triangle-1-n:before {content: "\f0d8"; } 
.ui-icon-triangle-1-ne:before {content: "!";} 
.ui-icon-triangle-1-e:before {content: "\f0da"; } 
.ui-icon-triangle-1-se:before {content: "!";} 
.ui-icon-triangle-1-s:before {content: "\f0d7"; } 
.ui-icon-triangle-1-sw:before {content: "!";} 
.ui-icon-triangle-1-w:before {content: "\f0d9"; } 
.ui-icon-triangle-1-nw:before {content: "!";} 
.ui-icon-triangle-2-n-s:before {content: "!";} 
.ui-icon-triangle-2-e-w:before {content: "!";} 
.ui-icon-arrow-1-n:before {content: "!";}
.ui-icon-arrow-1-ne:before {content: "!";}
.ui-icon-arrow-1-e:before {content: "\f054";}
.ui-icon-arrow-1-se:before {content: "!";}
.ui-icon-arrow-1-s:before {content: "!";}
.ui-icon-arrow-1-sw:before {content: "!";}
.ui-icon-arrow-1-w:before {content: "\f053";}
.ui-icon-arrow-1-nw:before {content: "!";}
.ui-icon-arrow-2-n-s:before {content: "!";}
.ui-icon-arrow-2-ne-sw:before {content: "!";}
.ui-icon-arrow-2-e-w:before {content: "!";}
.ui-icon-arrow-2-se-nw:before {content: "!";}
.ui-icon-arrowstop-1-n:before {content: "!";}
.ui-icon-arrowstop-1-e:before {content: "\f101";}
.ui-icon-arrowstop-1-s:before {content: "!";}
.ui-icon-arrowstop-1-w:before {content: "\f100";}
.ui-icon-arrowthick-1-n:before {content: "!";}
.ui-icon-arrowthick-1-ne:before {content: "!";}
.ui-icon-arrowthick-1-e:before {content: "!";}
.ui-icon-arrowthick-1-se:before {content: "!";}
.ui-icon-arrowthick-1-s:before {content: "!";}
.ui-icon-arrowthick-1-sw:before {content: "!";}
.ui-icon-arrowthick-1-w:before {content: "!";}
.ui-icon-arrowthick-1-nw:before {content: "!";}
.ui-icon-arrowthick-2-n-s:before {content: "!";}
.ui-icon-arrowthick-2-ne-sw:before {content: "!";}
.ui-icon-arrowthick-2-e-w:before {content: "!";}
.ui-icon-arrowthick-2-se-nw:before {content: "!";}
.ui-icon-arrowthickstop-1-n:before {content: "!";}
.ui-icon-arrowthickstop-1-e:before {content: "!";}
.ui-icon-arrowthickstop-1-s:before {content: "!";}
.ui-icon-arrowthickstop-1-w:before {content: "!";}
.ui-icon-arrowreturnthick-1-w:before {content: "!";}
.ui-icon-arrowreturnthick-1-n:before {content: "!";}
.ui-icon-arrowreturnthick-1-e:before {content: "!";}
.ui-icon-arrowreturnthick-1-s:before {content: "!";}
.ui-icon-arrowreturn-1-w:before {content: "!";}
.ui-icon-arrowreturn-1-n:before {content: "!";}
.ui-icon-arrowreturn-1-e:before {content: "!";}
.ui-icon-arrowreturn-1-s:before {content: "!";}
.ui-icon-arrowrefresh-1-w:before {content: "!";}
.ui-icon-arrowrefresh-1-n:before {content: "!";}
.ui-icon-arrowrefresh-1-e:before {content: "!";}
.ui-icon-arrowrefresh-1-s:before {content: "!";}
.ui-icon-arrow-4:before {content: "\f047";}
.ui-icon-arrow-4-diag:before {content: "\f0b2";}
.ui-icon-extlink:before {content: "\f08e";}
.ui-icon-newwin:before {content: "\f17a";}
.ui-icon-refresh:before {content: "!";}
.ui-icon-shuffle:before {content: "!";}
.ui-icon-transfer-e-w:before {content: "!";}
.ui-icon-transferthick-e-w:before {content: "!";}
.ui-icon-folder-collapsed:before {content: "!";}
.ui-icon-folder-open:before {content: "!";}
.ui-icon-document:before {content: "!";}
.ui-icon-document-b:before {content: "!";}
.ui-icon-note:before {content: "!";}
.ui-icon-mail-closed:before {content: "!";}
.ui-icon-mail-open:before {content: "!";}
.ui-icon-suitcase:before {content: "!";}
.ui-icon-comment:before {content: "!";}
.ui-icon-person:before {content: "!";}
.ui-icon-print:before {content: "!";}
.ui-icon-trash:before {content: "!";}
.ui-icon-locked:before {content: "!";}
.ui-icon-unlocked:before {content: "!";}
.ui-icon-bookmark:before {content: "!";}
.ui-icon-tag:before {content: "!";}
.ui-icon-home:before {content: "\f015";}
.ui-icon-flag:before {content: "!";}
.ui-icon-calendar:before {content: "\f073";}
.ui-icon-cart:before {content: "!";}
.ui-icon-pencil:before {content: "!";}
.ui-icon-clock:before {content: "!";}
.ui-icon-disk:before {content: "!";}
.ui-icon-calculator:before {content: "!";}
.ui-icon-zoomin:before {content: "!";}
.ui-icon-zoomout:before {content: "!";}
.ui-icon-search:before {content: "\f002";}
.ui-icon-wrench:before {content: "!";}
.ui-icon-gear:before {content: "\f013";} 
.ui-icon-heart:before {content: "!";}
.ui-icon-star:before {content: "\f005";} 
.ui-icon-link:before {content: "!";}
.ui-icon-cancel:before {content: "!";}
.ui-icon-plus:before {content: "!";}
.ui-icon-plusthick:before {content: "\f067";}
.ui-icon-minus:before {content: "\f068";}
.ui-icon-minusthick:before {content: "\f068";}
.ui-icon-close:before {content: "\f00d";}
.ui-icon-closethick:before {content: "\f00d";}
.ui-icon-key:before {content: "\f084";} 
.ui-icon-lightbulb:before {content: "!";}
.ui-icon-scissors:before {content: "!";}
.ui-icon-clipboard:before {content: "!";}
.ui-icon-copy:before {content: "!";}
.ui-icon-contact:before {content: "!";}
.ui-icon-image:before {content: "!";}
.ui-icon-video:before {content: "!";}
.ui-icon-script:before {content: "!";}
.ui-icon-alert:before {content: "\f071";}
.ui-icon-info:before {content: "!";}
.ui-icon-notice:before {content: "!";}
.ui-icon-help:before {content: "!";}
.ui-icon-check:before {content: "\f00c";} 
.ui-icon-bullet:before {content: "\f111";} 
.ui-icon-radio-on:before {content: "!";}
.ui-icon-radio-off:before {content: "!";}
.ui-icon-pin-w:before {content: "!";}
.ui-icon-pin-s:before {content: "!";}
.ui-icon-play:before {content: "!";}
.ui-icon-pause:before {content: "!";}
.ui-icon-seek-next:before {content: "\f105";} 
.ui-icon-seek-prev:before {content: "\f104";} 
.ui-icon-seek-end:before {content: "\f101";} 
.ui-icon-seek-start:before {content: "\f100";} 
.ui-icon-seek-first:before {content: "\f100";} 
.ui-icon-stop:before {content: "!";}
.ui-icon-eject:before {content: "!";}
.ui-icon-volume-off:before {content: "!";}
.ui-icon-volume-on:before {content: "!";}
.ui-icon-power:before {content: "\f011";} 
.ui-icon-signal-diag:before {content: "!";}
.ui-icon-signal:before {content: "!";}
.ui-icon-battery-0:before {content: "!";}
.ui-icon-battery-1:before {content: "!";}
.ui-icon-battery-2:before {content: "!";}
.ui-icon-battery-3:before {content: "!";}
.ui-icon-circle-plus:before {content: "!";}
.ui-icon-circle-minus:before {content: "!";}
.ui-icon-circle-close:before {content: "\f00d";}
.ui-icon-circle-triangle-e:before {content: "\f0da";} /*was f138 -> changed to fa-caret-right */
.ui-icon-circle-triangle-s:before {content: "\f0d7";} /*was f13a -> changed to fa-caret-down */
.ui-icon-circle-triangle-w:before {content: "\f137";}
.ui-icon-circle-triangle-n:before {content: "\f139";}
.ui-icon-circle-arrow-e:before {content: "!";}
.ui-icon-circle-arrow-s:before {content: "!";}
.ui-icon-circle-arrow-w:before {content: "!";}
.ui-icon-circle-arrow-n:before {content: "!";}
.ui-icon-circle-zoomin:before {content: "!";}
.ui-icon-circle-zoomout:before {content: "!";}
.ui-icon-circle-check:before {content: "!";}
.ui-icon-circlesmall-plus:before {content: "!";}
.ui-icon-circlesmall-minus:before {content: "!";}
.ui-icon-circlesmall-close:before {content: "!";}
.ui-icon-squaresmall-plus:before {content: "!";}
.ui-icon-squaresmall-minus:before {content: "!";}
.ui-icon-squaresmall-close:before {content: "!";}
.ui-icon-grip-dotted-vertical:before {content: "!";}
.ui-icon-grip-dotted-horizontal:before {content: "!";}
.ui-icon-grip-solid-vertical:before {content: "!";}
.ui-icon-grip-solid-horizontal:before {content: "!";}
.ui-icon-gripsmall-diagonal-se:before {content: "";} /* As of FA 5.14, no icon exists for this yet. Check newer version later */
.ui-icon-grip-diagonal-se:before {content: "!";}

/* ICOMOON ICON */

@font-face {
  font-family: 'icomoon';
  src:  url('fonts/icomoon.eot?141541');
  src:  url('fonts/icomoon.eot?141541#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?141541') format('truetype'),
    url('fonts/icomoon.woff?141541') format('woff'),
    url('fonts/icomoon.svg?141541#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^="icomoon-"], [class*=" icomoon-"],[class*=" icomoon-"]::before {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icomoon-Add-Row {
	width: auto !important;
	margin: 0 !important;
	transform: translate(-50%, -50%);
}

.e23 .icomoon-Add-Row:before {
	font-size: 24px;
}

.icomoon-Add-Sub-Item:before,
.icomoon-Delete-Line-Item:before,
.icomoon-Vertical-ellipsis:before {
  font-weight: 500 !important;
  font-size: 16px !important;
}

button[class*="icomoon-"]{
	background: transparent !important;;
}

button[class*="icomoon-"] > span{
	display: none !important;
}
button[class*="icomoon-"]:before,
.ui-icon[class*="icomoon-"]:before, 
.fa[class*="icomoon-"]:before,
.ui-icon[class*="icomoon-"]:after,
.fa[class*="icomoon-"]:after {
	font-size: 18px;
}

/* UPDATE DELETE BUTTON FOR QUICK MAINTENANCE */
.e22-quick-maintenance .e22-entry-side-panel button.delete-batch-button .ui-icon:before,
.light-md .master button.delete-batch-button .ui-icon:before,
.e1-page .e1-side-bar button.delete-batch-button .ui-icon:before{
	content: "\e91d";
}

.light-md .master .ui-datatable-tablewrapper .rows_delete,
.e1-page .e1-side-bar .ui-datatable-tablewrapper .rows_delete{
	background: transparent;
} 

/* CONFIG SIZE ICON ON TOP BAR */
.e22-entry-top-button-bar button.ui-button.e23-header-export-button.ui-state-default .ui-icon.icomoon-Export-TXT::before {
	font-size: 36px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Variation::before {
	font-size: 28px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Add-Row::before,
.e23 .e22-summary-datatable .synfaces-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Add-Row:before {
	font-size: 35px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Retrieve::before {
	font-size: 27px !important;
}

.e22 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Print::before {
	font-size: 36px !important;
}

.e22 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Back::before {
	font-size: 27px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Back::before {
	font-size: 38px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Search::before {
	font-size: 30px !important;
}

.e22 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon.icomoon-Search::before {
	font-size: 21px !important;
}
.e23 .e22-details-form .synfaces-button-bar button.ui-button-icon-only .ui-icon.icomoon-Search-square:before {
	font-size: 36px;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only[id$=":previewButton"] .ui-icon::before {
	font-size: 24px !important;
}

.e23 .e22-entry-top-button-bar button.ui-button.ui-button-icon-only .ui-icon[class*="icomoon-"]::before {
	font-size: 24px !important;
}

.e23 .icon-xs .ui-icon::before {
	font-size: 24px !important;
}

.e23 .icon-sm .ui-icon::before {
	font-size: 27px;
}

.e23 .icon-md .ui-icon::before {
	font-size: 30px !important;
}

.e23 .icon-lg .ui-icon::before {
	font-size: 36px;
}

.e23 .icon-xl .ui-icon::before {
	font-size: 45px;
}

.e23 .ui-icon.outgoing-bar::before {
	color: var(--syn-outgoing-bar);
} 

.search-trigger .ui-icon-triangle-1-s::before,
.search-trigger.syn-selectcheckboxmenu .ui-selectcheckboxmenu-trigger .ui-icon::before {
	content: "\f002"
}