/*Green theme*/
/*:root {
  --grz-blue: #056b80;
  --grz-blue_bg_input: #b6e5ef;
  --grz-blue_button: #055363;
  --grz-gray: #9b9b9b;
  --grz-gray_text : #5D5D5D;
  --grz-green_text : #26ad6e;
  --grz-red_text : #cc0033;
  --grz-gray_bg : #D7D7D7;
  --grz-yellow: #ffcd1e;
}*/
/*Blue theme*/
:root {
  --grz-blue: #2664ad;
  --grz-blue_bg_input: #d4e0ef;
  --grz-blue_button: #2664ad;
  --grz-gray: #9b9b9b;
  --grz-gray_text : #5D5D5D;
  --grz-green_text : #26ad6e;
  --grz-red_text : #cc0033;
  --grz-gray_bg : #D7D7D7;
  --grz-yellow: #ffcd1e;
}
table.table_main{
	margin-top: 50px;
}
table.table_main td{
	width:78px;
	height:78px;
	position:relative;
	text-align:center;
	/*border:1px solid #eee;*/
	padding: 5px 10px;
	font-size: 23px;
}
table.table_main td.node::before,
table.table_main td.section::before,
table.table_main td.transfo::before,
table.table_main td.substation_clone::before  {
	content: " ";
	width: 90px !important;
	position: absolute;
	left:-39px;
	top:51px;
	border-top: 1px solid #333;
}
table.table_main td.node.line-top::after {
	content: " ";
	/*height: 40px !important;*/
	position: absolute;
	/*left:24px;*/
	/*top:-27px;*/
	border-right: 1px solid #333;
}
table.table_main td.node.line-bottom::after {
	content: " ";
	height: 80px !important;
	position: absolute;
	/*left:24px;*/
	top:-27px;
	border-right: 1px solid #333;
}
/*table.table_main td.node.line-top.line-bottom::after {
	content: " ";
	height: 31px !important;
	position: absolute;
	left:29px;
	top:-25px;
	border-right: 1px solid #333;
}*/
table.table_main td.line-top::after {
	content: " ";
	height: 79px !important;
	position: absolute;
	/*left:24px;*/
	top:-27px;
	border-right: 1px solid #333;
}
table.table_main td.line-bottom::after {
	content: " ";
	height: 50px !important;
	position: absolute;
	/*left:24px;*/
	top:74px;
	border-right: 1px solid #333;
}

/*toggle color result*/
.red_top::before  {
	border-top: 4px solid var(--grz-red_text) !important;
}
.green_top::before  {
	border-top: 4px solid var(--grz-green_text) !important;
}
.blue_top::before  {
	border-top: 4px solid var(--grz-blue) !important;
}
.gray_top::before  {
	border-top: 4px solid var(--grz-gray) !important;
}
.red_right::after  {
	border-right: 4px solid var(--grz-red_text) !important;
}
.green_right::after  {
	border-right: 4px solid var(--grz-green_text)!important;
}
.blue_right::after  {
	border-right: 4px solid var(--grz-blue) !important;
}

table.table_main a{
	text-decoration: none;
}
table.table_main p{
	font-size: 10px;
	margin: 0;
	color: var(--grz-gray_text);
	height: 17px;
	/*margin-top: 5px;*/
}
/*table.table_main .transfo img{
	margin-top: 10px;
}*/
/*table.table_main .section img{
	margin-top: -10px;
}*/

table.table_design td{
	width:50px;
	height:50px;
	position:relative;
	text-align:center;
	border:1px solid #eee;		
	padding: 5px 10px;
	font-size: 23px;
}
table.table_design td.line-bottom-pole::after {
	content: " ";
	height: 50px !important;
	position: absolute;
	/*left:24px;*/
	left:50%;
	top: 0;
	border-right: 2px solid black;
}
table.table_design td.line-center-pole::before  {
	content: " ";
	width: 50px !important;
	position: absolute;
	left:-25px;
	top:24px;
	border-top: 2px solid black;
}

table.table_design td.line-center-left-pole::after  {
	content: " ";
	width: 50px !important;
	position: absolute;
	left:26px;
	top:24px;
	border-top: 2px solid black;
}

.table>tbody>tr:hover{
	background-color: var(--grz-blue_bg_input);
}
.table>tbody>tr:nth-of-type(odd){
	background-color: var(--grz-blue_bg_input);
}
.table{
	border: none;
}
.table td:first-child,
.table th:first-child {
  border-radius: 10px 0 0 10px;
}
.table td:last-child,
.table th:last-child {
  border-radius: 0 10px 10px 0;
}
.table td:only-child {
  border-radius: 10px 10px 10px 10px;
}
table, 
table a{
	color: var(--grz-blue) !important;
}

.form-check-input:checked[type=checkbox]{
	color: var(--grz-blue);
	border: 1px solid #000000 !important;
	background-color: #FFFFFF !important;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fdd00d' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e") !important;
}
.form-check-input:checked[type=radio]{
	
	border: 1px solid #000000 !important;
	background-color: #FFFFFF !important;
	background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fdd00d'/%3e%3c/svg%3e") !important;
}

.login .card,
.home .card,
.register .card,
.forgetpass .card,
.collapse .card{	
	width: 100%;
	height: 100%;
    padding: 0;
    margin: 0;
}
.card{	
	width: 158px;
	height: 90px;
    padding: 0;
    margin: 0;
}
.card .card-header{
	font-size: 12px;
    padding: 2px;
    margin: 0;
}
.card li{
	font-size: 12px;
    padding: 2px;
    margin: 0;
}
.plus_sub_section_above,
.plus_sub_section_above_side{
	position: absolute;
	bottom: 64px;
	z-index: 2;
	left: 28px;
}
.plus_sub_section_below,
.plus_sub_section_below_side{
	position: absolute;
    top: 68px;
    left: 0;
    right: 0;
    z-index: 2;
}

.img_brand{
	position: absolute;
	right: 0;
	text-align: center;
	/*padding-right: 20px;*/
}
.img_brand img{
	width: 7%;
}
.select_input{
	/*height: 35px;*/
  	min-width: 100px;
  	margin-left: 10px !important;
  	background-color: var(--grz-blue_bg_input);
  	border-radius: 0.25rem !important;
  	/*border: none !important;*/
}
.select_input:focus{
	background-color: #FFFFFF !important;
}

.input-group-text{
	background-color: var(--grz-blue_bg_input) !important;
	border-radius: 0.25rem !important;
	border: none !important;
}
.input-group{
	align-items: center;
}
.table_input{
	height: 35px;
  	width: 100px;
}

.border_bottom{
	border-bottom: 2px solid black !important;
}

.border_left{
	border-left: 2px solid black !important;
}

.border_top{
	border-top: 2px solid black !important;
}

.menu_calculate{
	font-size: 22px;
}

/*Green theme*/
/*.grad_bg {
	background-image: url('../img/groza-bg.png'), linear-gradient(90deg, rgba(102,184,201,1) 0%, rgba(7,92,110,1) 100%);
  background-size: cover;
  background-attachment: fixed;
}*/
/*Blue theme*/
.grad_bg {
	background-image: url('../img/groza-bg.png'), linear-gradient(90deg, rgba(139,198,238,1) 0%, rgba(8,98,195,1) 100%);
  background-size: cover;
  background-attachment: fixed;
}

.blue_title{
	color: var(--grz-blue);
}

.green_title{
	color: var(--grz-green_text);
}

.grey_title{
	color: var(--grz-gray_text);
}

.btn_grz_blue{
	background-color: var(--grz-blue_button);
	color: #ffffff !important;
}

.content_center{
	/*width: 550px;*/
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	margin: auto;
	display: table;
}

/* dataTables Search input box */
.dataTables_filter {
    position: relative;
    margin-bottom: 15px;
}

.dataTables_filter input {
    width: 250px;
    height: 35px;
    background: #fcfcfc;
    border: 1px solid #aaa;
    border-radius: 5px;
    /*box-shadow: 0 0 3px #ccc, 0 10px 15px #ebebeb inset;*/
    text-indent: 10px;
    margin-left: 0px !important;
}

.dataTables_filter .fa-search {
    position: absolute;
    top: 10px;
    left: auto;
    right: 10px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button.current, 
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
	background: var(--grz-blue_bg_input) !important;
}
/* remove border */
.dataTable thead th,
.dataTable thead td,
.dataTable tbody tr,
.dataTable tbody td,
.dataTables_wrapper.no-footer .dataTables_scrollBody{
	border-bottom: none !important;
}

.text_gray{
	color: var(--grz-gray);
	text-decoration: none;
	display: flex;
}
.text_gray .img_load{
	height: 35px;
    margin-right: 5px;
}
.text_gray .img_save{
	height: 34px;
	margin-right: 5px;
}
.text_gray span{
	font-size: 11px;
}

.btn-close {
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%232664ad'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat !important;
    opacity: 1;
}

.loading-image {
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
  position: absolute;
  right: 50%;
  top: 30%;
  text-align: center;
}
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.loading {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background-color: #5c5e609e;
}

.height_node{
	width: 47%!important;
}

.width_icon{
	/*width: 70%!important;*/
	width: 40px!important;
}

.w-13{
	width: 13%!important;
}

.w-15{
	width: 15%!important;
}

.tbc_close_sub{
	color: var(--grz-gray);
}

.overlay_close{
	position:relative;
	text-align: center;
}

.overlay_close span{
	position: absolute;
  top: -13px;
  right: 0;
  padding: 5px;
  font-size: 13px;
  color: #707070;
  background-color: #cecece;
  shape-outside: circle();
  clip-path: circle();
}

.section_img_process{
	position: relative;
	z-index: 1;
}
.line_red,
.line_green,
.line_blue,
.square_green_mini,
.square_red_mini,
.square_blue_mini,
.square_yellow_mini{
  display: flex;
  align-items: center;  
}
.line_red:before {
  content: '';
  width: 75px;
  height: 4px;
  margin: 10px 10px;
  background: #cc0033;
}

.line_green::before{
	content: '';
  width: 75px;
  height: 4px;
  margin: 10px 10px;
  background: #26ad6e;
}

.line_blue::before{
	content: '';
  width: 75px;
  height: 4px;
  margin: 10px 10px;
  background: #2664ad;
}

.gfd_map{
	align-self: center;
	border: 1px solid #2664ad;
	padding: 2px;
	border-radius: 6px;
	margin-left: 5px;
	margin-top: 5px;
}

.input_table{
	height: 35px;
  min-width: 100px;
  margin-left: 10px !important;
  background-color: var(--grz-blue_bg_input);
  border-radius: 0.25rem !important;
  border: 1px solid #c5c2c2;
}

.input_table:disabled{
	height: 35px;
  min-width: 100px;
  margin-left: 10px !important;
  background-color: var(--grz-gray_bg);
  border-radius: 0.25rem !important;
  border: 1px solid var(--grz-gray_bg);
}

.width_label{
	width: 30%;
}

.width_label_section{
	width: 22%;
}

#btn-show-pwd {
  position: absolute;
  top: 20px;
  right: 9px;
  font-size: 18px;
}

.text_white{
	color: #ffffff !important;
}

.square_green{
	height: 35px;
  width: 70px;
  background-color: var(--grz-green_text);
  margin-bottom: 9px;
}

.square_red{
	height: 35px;
  width: 70px;
  background-color: var(--grz-red_text);
 	margin-bottom: 9px;
}

.square_blue{
	height: 35px;
  width: 70px;
  background-color: #2664ad;
 	margin-bottom: 9px;
}

.square_yellow{
	height: 35px;
  width: 70px;
  background-color: var(--grz-yellow);
 	margin-bottom: 9px;
}

.square_gray{
	height: 35px;
  width: 70px;
  background-color: var(--grz-gray);
 	margin-bottom: 9px;
}

.square_green_mini:before {
  content: '';
	height: 20px;
  width: 25px;
  margin: 10px 10px;
  background-color: var(--grz-green_text);
}

.square_red_mini:before {
  content: '';
	height: 20px;
  width: 25px;
  margin: 10px 10px;
  background-color: var(--grz-red_text);
}

.square_blue_mini:before {
  content: '';
	height: 20px;
  width: 25px;
  margin: 10px 10px;
  background-color: #2664ad;
}

.square_yellow_mini:before {
  content: '';
	height: 20px;
  width: 25px;
  margin: 10px 10px;
  background-color: var(--grz-yellow);
}

.square_green_red{
	height: 35px;
  width: 58px;
  background: linear-gradient(215deg, var(--grz-green_text) 50%, var(--grz-red_text) 50%);
 	margin-bottom: 9px;
}

.square_green_blue{
	height: 35px;
  width: 58px;
  background: linear-gradient(215deg, var(--grz-green_text) 50%, var(--grz-blue) 50%);
 	margin-bottom: 9px;
}

.square_red_blue{
	height: 35px;
  width: 58px;
  background: linear-gradient(215deg, var(--grz-red_text) 50%, var(--grz-blue) 50%);
 	margin-bottom: 9px;
}

.square_gray_lightning{
	height: 58px;
  width: 75px;
	/*height: 35px;
  width: 58px;*/
  background-color: var(--grz-gray);
 	position: relative;
  bottom: 26px;
  margin-left: 6px;
}

.square_green_lightning{
	height: 58px;
  width: 75px;
  background-color: var(--grz-green_text);
}

.square_red_lightning{
	height: 58px;
  width: 75px;
  background-color: var(--grz-red_text);
}

.square_yellow_lightning{
	height: 58px;
  width: 75px;
  background-color: var(--grz-yellow);
}

.square_llpd_amount > p{
	height: 11px !important;
	font-size: 9px !important;
}

table#table_main_result_llpd p{
	font-size: 8px;
	margin: 0;
	color: var(--grz-gray_text);
	height: 14px;
	/*margin-top: 5px;*/
}

table.table_design_lightning td{
	width:15px;
	height:15px;
	position:relative;
	text-align:center;
	border:1px solid #eee;		
	padding: 1px 2px;
	font-size: 6px;
}
table.table_design_lightning td.line-bottom-pole::after {
	content: " ";
	height: 15px !important;
	position: absolute;
	left:5px;
	top: 0;
	border-right: 1px solid black;
}
table.table_design_lightning td.line-center-pole::before  {
	content: " ";
	width: 15px !important;
	position: absolute;
	left:-9px;
	top:6px;
	border-top: 1px solid black;
}

table.table_design_lightning td.line-center-left-pole::after  {
	content: " ";
	width: 12px !important;
	position: absolute;
	left:3px;
	top:6px;
	border-top: 1px solid black;
}

.circle_pole{
	border: 2px solid red;
	border-radius: 50%;
	margin: -5px;
}

.carousel-control-next-icon:after{
  content: "\F285";
  font-size: 40px;
  color: #000000;
  font-family:'Bootstrap-icons'
}

.carousel-control-prev-icon:after {
  content: "\F284";
  font-size: 40px;
  color: #000000;
  font-family:'Bootstrap-icons'
}

.checkbox_scale2{
	transform: scale(2);
}

#modal_llpd_deployment table.table_main td {
	padding:0;
}
#modal_llpd_deployment table.table_main td > div.mt-2.overlay_close {
	margin-top:-22px !important;
}
#modal_llpd_deployment table.table_main td .square_gray_lightning {
	bottom:0;
}

.form-group.required label::after, 
.form-floating.required label::after {
	content:" *";
	color:red;
}

/* PAGINATION */
.dataTables_wrapper .dataTables_paginate {
	margin-top: 10px !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button {
	padding: 0 !important;
}
.dataTables_wrapper .dataTables_paginate .paginate_button i.fa-caret-right::before,
.dataTables_wrapper .dataTables_paginate .paginate_button i.fa-caret-left::before {
	line-height: 1;
}
input[readonly], input[disabled], select[disabled], button[disabled] {
    cursor: not-allowed;
}