:root {
    --orgPrimaryColor: #E60000;
	--orgPrimaryColorButton: #E60000;
	--orgPrimaryColorButtonHover: #c30000;
	--orgSecondaryColorButton: #ed0000;
	--orgHeadingColor: #444444;
	--ApproveGreen:#008a00
	--RejectRed: #E60000
}
h1, h2, h3, h5, h6 {
	color: var(--orgHeadingColor);
}

select {
	font-size: 16px;
}

* {
	font-family: 'Vodafone' !important;
}
/* Grey Background */
 .mainbackground {
	background: #f2f2f2;
}
/* Global */

.flow {
	font-size: 18px;
	color: #000000;
	
	.select-menu {
		border: 1px solid #D0D5DD;
	}
	.native-select-input {
		background: #FFFFFF;
        border: 1px solid #D0D5DD;
        box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
    }
	.select-option:hover,
	.select-option.highlighted {
		color: #000000;
		background-color: #F1F8FB;
	}
	.select-input {
		border: 1px solid;
		border-color: #d9d9d9 #ccc #b3b3b3;
	}
	.select-toggle {
		border-color: #D0D5DD;
	}
	.page-component > input,
	.select-controls > input,
	.page-component > textarea,
	.textarea, 
	.select-clear {
		background: #FFFFFF;
		border: 1px solid #D0D5DD;
		box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	}
}

/* outcomes start */
.flow {
	.btn-primary:hover {
		border-color: #f0f0f0;
	}
	.btn-primary:hover,
	.btn-primary:focus,
	.btn-primary.focus,
	.btn-primary:active,
	.btn-primary.active,
	.open>.dropdown-toggle.btn-primary {
		background-color: var(--orgPrimaryColorButtonHover) !important;
	}
	button.outcome:hover {
		background-color: var(--orgPrimaryColorButtonHover) !important;
	}
	button.button.button-outcome:nth-child(3) {
	background-color: var(--orgPrimaryColorButton) !important;
	color: #ffffff;
	border-color: transparent;
	}
button.button.button-outcome:nth-child(3):hover {
	background-color: var(--orgPrimaryColorButtonHover) !important;
	color: #ffffff;
	border-color: transparent;
}
	.btn-default:hover,
	.btn-default:focus,
	.btn-default.focus,
	.btn-default:active,
	.btn-default.active,
	.open>.dropdown-toggle.btn-default {
		color: #ffffff
	}

}
/* outcomes end */



.checkbox-row-label {
        color: #666;
    }

/* Asset picker - START */
.flow {
	.fcmmod-dialog-button-bar-button:hover {
		background-color: var(--orgPrimaryColorButtonHover);
	}
}
/* Asset picker - END */

     /*SFT - START*/
    .flow {
	.sft-ribbon-search-icon,
	.sft-ribbon-search-button-icon,
	.a-magnifying-glass,
	.fa-filter,
	.fa-ban {
		color: var(--orgPrimaryColor) !important;
	}

    .sft-ribbon-search-button-icon:hover {
        color: #003d58 ;
        transition: background-color 0.25s ease-out,color 0.25s ease-out;
    }
    .sft-column-header {
        background-color: #f9f9f9;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc;
    }
    .sft-column-header:hover {
        background-color: #ccc !important;
    }
    .sft-column-header-title-label {
        color: #666;
    }
    .sft-table-cell-button {
        color: #fefefe !important;
        background-color: #003d58;
    }
    .sft-footer-summary-label,
    .sft-footer-perpage-label,
    .sft-footer-pagination-label {
        color: #666;
    }
    .sft-footer-pagination-button {
        color: #666;
    }
    .sft-footer-pagination-button-disabled {
        color: #ccc;
    }
    .sft-footer-select {
        border: 1px solid #ccc;
        color: #666 !important;
    }
    .sft-table-row {
        border-bottom: 1px solid #ccc;
    }
    .sft-table-row:not(.sft-table-row-selected):nth-of-type(even) {
        background-color: #f9f9f9; /* Same as background*/
    }
    .sft-table-row-selected {
        background-color: #d9edf7 !important;
    }
    .sft-column-header {
        background-color: #f9f9f9;
        border-top: 1px solid #ccc;
        border-bottom: 1px solid #ccc; 
    }
	.sft-column-header:hover {
            background-color: #ccc !important;
        }

    .sft-ribbon-search-wrapper {
        border: 1px solid #ccc;
		background-color: #fff;
    }
	.sft-ribbon-search-left-wrapper{
        display: none !important;
    }
    .sft-footer-summary-label,
    .sft-footer-perpage-label,
    .sft-footer-pagination-label,
    .sft-footer-nav-label,
    .sft-nav-pg {
        color: #666;
    }
    .sft-nav-pg-selected {
        background-color: #ecf0ff;
    }
    .sft-footer-pagination-label {
        padding-left: 0;
    }
    .sft-footer-pagination-button {
        color: #000;
    }
    .sft-footer-pagination-button-disabled {
        color: #ccc;
    }
    .sft-footer-select {
        border: 1px solid #ccc;
        color: #666 !important;
    }
   .sft-table-row {
        border-bottom: 1px solid #ccc;
    }
    .sft-table-row:hover {
        background-color: #ecf0ff !important;
    }
    .sft-table-row:not(.sft-table-row-selected):nth-of-type(even) {
        background-color: #f9f9f9;
    }
    .sft-table-row-selected {
        background-color: #d9edf7 !important;
    }
/* Search Table Header colour fixes */

}
/*SFT - END*/

/*NAV - START*/
.nm-mi-label  {
                color: #0D0D0D !important;
                font-size: 1.2rem;
            }
.hactive:hover {
                /*When hover over main menu*/
                border-bottom: var(--orgPrimaryColorButton) !important;
            }
.sactive:hover {
                /*When hover over sub menu*/
                text-decoration-color: var(--orgPrimaryColorButton) !important;
            
            }
            
.nm-utils-dot {
                cursor: pointer;
                background-color: #e51c23;
                border-radius: 100%;
            }
.nm-main {
    background-color: transparent;
    border-right: 1px solid #ccc;
}
.nm-expander-title-icon {
                display: none;
            }
.nmh-title {
                display: none;
            }

.nmh-mi-label {
    color: #111;
}
/* Styling for submenu - vodafone*/
.nm-smi {
    padding: 0.3rem 0.8rem 0.3rem 0.8rem;
}
.nmh-expander {
            left: 0 !important;
            width: 100% !important;
            max-height: 15rem;
            flex-flow: column !important;
            flex-wrap: wrap !important;
            align-content: flex-start;
            flex-direction: column !important;
            gap: 0rem 3rem;
            opacity: 1 !important;
            &>.nm-expander-title{
                display: none;
            }
            
            &>.nmh-smi-group {
                position: relative;
                
                & .nmh-smi {
                    padding: 0.5rem 1rem 0.5rem 1rem;
                    
                    & .nm-smi-caret {
                        margin: auto 0;
                    }
                }
                
                & .nmh-expander {
                    left: 100% !important;
                    top: 0;
                }
            }
        }
		
    .nm-mi-select {
            font-size: 0.8rem !important;
            padding: 0 !important;
            box-shadow: 0px 0px 1px 0px #666 !important;
            display: flex;
            flex-direction: row;
            flex: 1 0 auto;
            border: inset 1px transparent;
            position: relative;
        
            &:hover {
                border: inset 1px #ccc;
            }
        
            &>.current {
                display: flex;
                flex-direction: row;
                flex: 1 0 auto;
        
                & img {
                    width: 1rem;
                    margin: auto 0.5rem;
                }
        
                & span {
                    margin: auto 0;
                    flex: 1 0 auto;
                    font-size: 1.2rem;
                }
        
                & .caret {
                    margin: auto 0.5rem;
                }
            }
        
            &>.dropdown {
                display: flex;
                flex-direction: column;
                bottom: 100%;
                left: 0;
                width: 100%;
                height: fit-content;
                position: absolute;
                z-index: 10000;
                background-color: #fff;
                border: 1px solid #ccc;
        
                & .list {
                    list-style: none;
                    padding: 0.5rem 0;
                    display: flex;
                    flex-direction: column;
                    border: 1px solid transparent;
                    margin: 0;
        
                    & .option{
                        display: flex;
                        
                        &:hover {
                            text-decoration: underline;
                            text-decoration-color: var(--orgPrimaryColorButton) !important;
                            text-decoration-thickness: 2px;
                            text-underline-offset: 5px;
                        }
        
                        & img {
                            width: 1rem;
                            margin: auto 0.5rem;
                        }
        
                        & span {
                            margin: auto 0;
                            flex: 1 0 auto;
                            font-size: 1.2rem;
                        }
                    }
                }
            }
            
        }    
 
/*NAV - END*/


/* Classes - Cookies Acceptance - Start*/

.cookiesbutton {
	flex-direction: column;
}
.cookiesbutton>div>button.button-outcome,
button.button-outcome,
button.button.button-outcome {

	color: #0D0D0D;
}



.cookiesbutton>div>button.button-outcome:nth-child(1) {
	&:hover {
		background-color: var(--orgPrimaryColorButtonHover) !important;
		color: #ffffff;
	}
}

.cookiesbutton>div>button.button-outcome:nth-child(2) {
	background-color: var(--orgPrimaryColorButton) !important;
	color: #ffffff;
	border-color: transparent;

	&:hover {
		background-color: var(--orgPrimaryColorButtonHover) !important;
	}
}
.cookiesacceptance-vodafone {
	margin-bottom: 35px !important;
	margin-left: 16px;
	margin-right: 16px;

	& .page-component-outcomes {
		float: right;
	}
}

.cookiesacceptance-vodafone.mw-presentation>div>label {
	display: none;
}

.cookiesmain {
	color: #475467;

}

/* Classes - Cookies Acceptance - End*/

/* Classes (not specific to components) - Start------*/


.charts-container>.container-content>.page-component-presentation>div>p {
	color: var(--orgPrimaryColor) !important;
}
.outcomesButtonSave {
	background: var(--orgPrimaryColorButton) !important;
	padding: 18px 20px !important;
    border-radius: 5px !important;
    color: #fff !important;
    border: 1px solid var(--orgPrimaryColorButton) !important;
    margin-top: 20px !important;
}
.outcomesButtonReject{
       padding: 18px 20px !important;
      border-radius: 5px !important;
      margin-top: 20px !important;

}
.outcomesButtonSave:hover {
	background: var(--orgPrimaryColorButtonHover) !important;
	color: #FFFFFF !important;
}

.cardstyle .page-component-presentation:hover {
	background-color: var(--orgPrimaryColorButtonHover) !important;
}

.cardstyle .page-component-presentation:hover h5 {
	color: #ffffff !important;
}
/*My Approvals - Start*/
.myApprovalsApprove:hover {
	background-color: var(--ApproveGreen) !important;
	border: 1px solid #53af53;
}
.myApprovalsReject:hover {
	background-color: var(--RejectRed) !important;
	border: 1px solid #e93b3b;
}
/*My Approvals - End*/
.vodafonedontdisplay {
            display: none !important;
        }

/* .title {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
  padding: 0;
  margin: 0;
 margin: 0 0 -4% 0;
}

.titleA {
  color: #222; 
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
} */

/* .titleA:hover {
  text-decoration: underline;
} */

/* .titleB {
  color: var(--orgPrimaryColor); 
  font-size: 16px;
  font-weight: 600;
  margin: 0 2px;
}

.titleC {
  color: #111;
  font-weight: 600;
  cursor: default;
} */

/* .title {
  display: flex !important;
  align-items: center;       
  gap: 6px;
  padding: 10px 16px;
  margin: 0 0 16px 0;
  background-color: #ffffff;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  line-height: 1.4;         
} */

/* Breadcrumb bar */

.titleA {
  color: #222; 
  font-weight: 500;
  cursor: pointer;
  text-decoration: none;
} 


.titleB {
  color: var(--orgPrimaryColor); 
  font-size: 16px;
  font-weight: 600;
  margin: 0 2px;
}
.titleC {
  color: #111;
  font-weight: 600;
  cursor: default;
}
.titleC a {
  color: #111 !important;             
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: #000;         
}

/* Help & Support - Start */
[data-testid="collapse-plus"] {
  display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  background-size: contain;
  background-repeat: no-repeat;
  text-indent: -9999px;
  vertical-align: middle;
  transition: transform 0.22s ease, opacity 0.18s;
  opacity: 0.95;
  margin-left: 6px;
  background-image: url(https://master-boomi-flow-assets-prod-eu-central-1.s3.amazonaws.com/724842f1-7715-43a6-9925-58fb704b7f0d/chevrondown_vodafone.png);
}
[data-testid="collapse-minus"] {
   display: inline-block;
  width: 1.2rem;
  height: 1.2rem;
  background-size: contain;
  background-repeat: no-repeat;
  text-indent: -9999px; 
  vertical-align: middle;
  transition: transform 0.22s ease, opacity 0.18s;
  opacity: 0.95;
  margin-left: 6px;
  background-image: url(https://master-boomi-flow-assets-prod-eu-central-1.s3.amazonaws.com/724842f1-7715-43a6-9925-58fb704b7f0d/chevronup_vodafone.png);
}
/* Help & Support - End */

/* My Catalogue - Start */
.webshop-cart-icon:hover {
  border: 2px solid var(--orgPrimaryColorButtonHover);
}
/* My Catalogue - End */
/* Asset Details View - Start */
.assetDetailView p strong {
  font-size: 16px;
  color: #222;
  border-bottom: 2px solid var(--orgPrimaryColor);
  display: inline-block;
  padding-bottom: 2px;
  margin-bottom: 12px;
}




/* Asset Details View - End */

/* Asset details - My services  - Start*/


.asset-details p strong {
  display: inline-block;
  font-size: 16px;
  color: #222;
  font-weight: 700;
  padding-bottom: 4px;
  margin-bottom: 12px;
  position: relative;
}
.asset-details p strong::after {
  content: "";
  display: block;
  width: 90px;
  height: 3px;
  background: var(--orgPrimaryColor);
  margin-top: 8px;
  border-radius: 2px;
}
/* Asset details - My services  - End*/