:root{
    --col_Clear: rgba(0,0,0,0);
    --pri_silver_tint_40: rgba(177, 179, 179, 0.4);
    --sec_b_purple: rgba(101, 51, 135, 1.0);
    --dark_grey: rgba(85, 85, 85, 1.0);

    /* Trade Colours */
    --tra_red: rgba(235, 58, 23, 1.0);

    --tt_white: #ffffff;
    --tt_red: #007377;
    --tt_lighter_red: #00D5DD;
    --tt_orange_1: #f45b1d;
    --tt_orange_2: #f4631d;
    --tt_yellow: #faa220; 
    --tt_grey: #5f5f61 ;

    --text_black: #000000;

    /* Progress Colours */
    --text_complete: #3c763d; /* Boostrap default for .list-group-item-success */

    --jcca_blue: #0081C6;
    --jcca_black: #333;
    --jcca_darkgrey: #53565A;
    --jcca_lightgrey: #C1C6C8;
}

body, html, select, div:not(.tab-title, .fa-lock, .alert-danger), a, td, label, table, 
h1, h2:not(.tab-title, .fa-lock), h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
.section-title, .status   {   
    font-family: "Tahoma", sans-serif !important;
    color: var(--text_black) !important;
}

.navbar-static-top.navbar .menu-bar > .navbar-nav > li > a {
    font-family: "Tahoma" !important;
    font-size: 12px !important; 
}

.navbar-static-top.navbar .menu-bar > .navbar-nav > .divider-vertical
{
    height: 0px !important;
}

.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover {
    background-color: var(--text_black)!important;
    color: var(--tt_white) !important;
}

h3{
    color: var(--text_black) !important;
}

.form-control {
    border-radius: 10px;
}

.tab-title{
    color: var(--tt_white);
}

.fa-lock{
    color: var(--text_black) !important;
}

.xrm-attribute-value, .xrm-attribute-value > p, .faq {
    color: var(--text_black) !important;
    font-size: 18px !important;
}
.xrm-attribute-value > h1 {
    color: var(--text_black) !important;
    font-size: 30px !important;
}

.field-label
{
    color: var(--text_black) !important;
}

/* For create buttons on subgrids bec black on dark blue isn't good combination */
.toolbar-actions .create-action
{
	color: var(--tt_white) !important;
}

/* Navigation Bar*/
.navbar.navbar-static-top
{
    background-color: var(--jcca_blue) !important;
    margin:0px !important;
}

/* Practice Gateway Nav Bar */
.homelink, a.homelink:hover, a.homelink:focus {
    color: var(--tt_white) !important;
    font-family: "Tahoma" !important;
    font-weight: bold !important;
    font-size: 16px !important;
}

.navbar-inverse .navbar-nav > li > a
{
    color: var(--tt_white) !important;
    font-weight: bold !important;
}

.navbar-inverse .navbar-nav > li > a:hover
{
    color: var(--text_black) !important;
}

.navbar-inverse .navbar-nav > li > ul > li > a
{
    color: var(--text_black) !important;
}

div.action > ul.dropdown-menu
{
    
    background-color: var(--col_Clear) !important;
    color: var(--col_Clear) !important;
}

.navbar-inverse .navbar-nav > li > ul > li > a:hover
{
    color: var(--tt_red) !important;
}
.navbar-inverse .navbar-nav > li > a:hover
{
    background-color: var(--tt_white) !important;
	border-bottom-color: var(--tt_red) !important;
}

/* Progress List-Group for basic form pagination */
ol.progress.list-group > li.list-group-item.list-group-item-success > a
{
    color: var(--text_complete) !important;
}
ol.progress.list-group > li.list-group-item.active > a  /* This must be last so it takes priority */
{
    color: var(--tt_white) !important;
}
.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus  /* Copied from Bootstrap default and added !important to override the --col_Clear override */
{
    z-index: 2;
    color: #fff;
    background-color: #2f5fef !important;
    border-color: #2f5fef !important;
}

/* Footer */
footer .footer-bottom
{
    background-color: var(--jcca_black) !important;
}

footer .footer-bottom a
{
    color: var(--tt_white) !important;
}

footer .footer-bottom a:hover
{
    color: var(--tt_red) !important;
}

/** Generic Items **/
a
{
	color: var(--text_black) !important;
}

a:hover
{
	color: var(--tt_orange_1) !important;
}

th> a {
    color: var(--tt_red) !important;
}

.dropdown-menu > .active > a{
    background-color: var(--text_black) !important;
    color: var(--tt_white) !important;
    font-weight:bold !important;
}
.breadcrumb{
    background-color: var(--tt_white) !important;
    font-size:16px !important;
}
.breadcrumb > .active {
    font-weight: bold !important;
    color: var(--text_black) !important;
}

/** New rounded Buttons Requested by EP **/
.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 20px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 30px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Primary Buttons */
.btn-primary
{
    background: linear-gradient(135deg, var(--tt_red) 0%, var(--tt_lighter_red) 100%) !important;
    color:var(--tt_white) !important;
    border-color: var(--tt_red) !important;
}

.btn-primary:hover
{
    background-color: var(--tt_white) !important;
    background: var(--tt_white) !important;
    color:var(--tt_red) !important;
}
.btn-primary > a
{
    color: var(--tt_white) !important;
}
.btn-primary > a:hover
{
    background-color: var(--tt_white) !important;
    background: var(--tt_white) !important;
    color: var(--tt_red) !important;
}

/* Default Buttons*/
.btn-default
{
    background-color: var(--tt_white) !important;
    border-color: var(--tt_red) !important;
    color:var(--tt_red) !important;
}
.btn-default:hover
{
    background-color: var(--tt_red) !important;
    color:var(--tt_white) !important;
}

div.action > ul > li> a 
{
    background-color: var(--col_Clear) !important;
    border-color: var(--sec_Clear) !important;
    color:var(--tt_grey) !important;
}
div.action > ul > li> a:hover 
{
    background-color: var(--col_Clear) !important;
    border-color: var(--col_Clear) !important;
    color:var(--tt_red) !important;
}

.btn-default > a
{
    color: var(--text_black) !important;
}
.btn-default > a:hover
{
    color: var(--tt_white) !important;
}

/* Default Buttons on Tax Return Edit form actions*/
div.form-action-container-left > .btn-default
{
    margin-left: 5px;
}

/* Info Buttons*/
.btn-info
{
    background: linear-gradient(135deg, var(--tt_red) 0%, var(--tt_lighter_red) 100%) !important;
    color:var(--tt_white) !important;
    border-color: var(--tt_red) !important;
}
.btn-info:hover
{
    background-color: var(--tt_white) !important;
    background: var(--tt_white) !important;
    color:var(--tt_red) !important;
}
.btn-info > a
{
    color:var(--tt_red) !important;
}
.btn-info > a:hover
{
    color:var(--tt_white) !important;
}

/* Info Alert */
.alert-info
{
    background-color: var(--jcca_darkgrey) !important;
    color:var(--tt_white) !important;
    font-weight: bold !important;
}
.alert-info > .xrm-attribute > .xrm-attribute-value
{
    color:var(--tt_white) !important;
}

/* Danger Alert */
.alert-danger
{
    background-color: var(--tt_red) !important;
    color:var(--tt_white) !important;
    font-weight: bold !important;
}


/* General panel styles */
.panel,
.panel-default {
    background: var(--tt_white) !important;
    color: var(--text_black) !important;
    border: none !important;
    border-radius: 20px;
    position: relative;
    overflow: hidden; /* Ensure content doesn't overflow the rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important; /* Single shadow for the entire panel */
}

/* Panel heading styles */
.panel-heading-custom {
    background: var(--tt_white) !important;
    border: none !important;
    border-radius: 20px 20px 0 0; /* Top rounded corners */
    position: relative; /* Ensure stacking context */
    z-index: 1; /* Lower z-index so it integrates with panel's shadow */
    padding: 10px; /* Adjust padding as needed */
    margin-top: -10px; /* Overlap heading slightly with the panel */
}

/* Panel title text color and size */
.panel-title {
    color: var(--text_black) !important;
    font-weight: bold !important;
    font-size: 14px; /* Adjust font size as needed */
    margin-top: 0; /* Reset margin to avoid spacing issues */
    padding-top: 20px; /* Ensure content doesn't touch the top */
    border-bottom: none !important; /* Remove bottom border */
    padding-left: 10px !important;
}

/* Content padding to keep away from shadow */
.panel-body {
    padding: 20px;
    position: relative; /* Ensure it's part of the same stacking context */
    z-index: 0; /* Place behind the heading for overlap */
}

/* Optional: Remove shadow overlap between panel and body */
.panel::before {
    content: "";
    position: absolute;
    top: -10px; /* Adjust to the amount the heading overlaps */
    left: 0;
    right: 0;
    height: 10px;
    background: var(--pri_white); /* Match the panel's background */
    z-index: 0; /* Ensure it sits behind the heading */
}


.nav1 > span
{
    color: var(--text_black) !important;
    font-size: 16px;
}
.glyphicon-envelope,  .glyphicon-earphone
{
    color: var(--text_black) !important;
}

/* Bold Text In Panel */
b, strong {
    color: var(--text_black) !important;
    font-size: 16px;
}
h4 > strong {
    color: var(--tt_red) !important;
}
h5
{
    color: var(--text_black) !important;
}

h5> strong > a {
    color: var(--text_black) !important;
}

td:nth-child(1) {
    color: var(--text_black) !important;
}

td:nth-child(2) {
    color: var(--text_black) !important;
}

.table-striped>tbody>tr:nth-child(odd)>td, .table-striped>tbody>tr:nth-child(odd)>th,
.table-striped>tbody>tr:nth-child(even)>td, .table-striped>tbody>tr:nth-child(even)>th {

    font-size: 15px !important;
}

/*** Signed Out ***/
/*Thin bar on home page when Signed Out*/
h2.blue_border
{
	border-bottom-color: var(--tt_orange_2) !important;
    
}
h2.blue_border>.xrm-attribute>.xrm-attribute-value>div{
    color: var(--text_black) !important;
    font-size: 40px !important;
    text-align: center !important;
}
.page_section h2
{
    color: var(--text_black) !important;
}
.page_section h4
{
    color: var(--text_black) !important;
}

.ui-icon-triangle-1-e, .ui-icon-triangle-1-s{
    display:none !important;
}

/* Standard Items */
h1, .h1{
    font-size: 30px !important;
}

.form-horizontal .control-label {
    text-align: right;
    font-size: 18px !important;
}

#ContentContainer_MainContent_MainContent_LocalLogin > .col-md-6 {
    width: 70% !important;
}

.ui-accordion .ui-accordion-icons {
    padding-left: 1.0em;
    border-radius: 20px;
}

.ui-accordion .ui-accordion-header {
    font-weight: bold;
    font-size: large;
}

#footericon
{
    height: 50px;
}

.tablecontent{
    font-size: 16px;
}

.page_section p {
    border-top: none !important; 
    padding-top: 5px !important;
}

/* Tax Return form */
/* Horizontal Picklist for Status */
.picklistHorizontalStatus > label
{
    width: 5% !important;
}

.picklistHorizontalStatusDA > label
{
    width: 15% !important;
}

/* Horizontal Picklist for Student Loan */
.picklistHorizontalStudent > label
{
    width: 20% !important;
}

.entitylist-filter {
    background: none !important;
}
.select-items div:hover, .same-as-selected
{
    background-color: var(--text_black) !important;
color:var(--tt_white) !important;
}
.tooltip-inner {
    background-color: var(--tt_red) !important;
}

/* Tax Information Request accordion */
#EntityFormPanel .tab-column > div > fieldset {
    margin-bottom: 10px;
}

#EntityFormPanel .required-element::after {
    content: " *";
    font-weight: "bold";
    color: var(--tra_red);
}

#EntityFormPanel fieldset > legend.ui-accordion-header > h3 {
    margin-top: 0px;
    margin-bottom: 0px;
}

/* Subgrid action buttons */
.view-grid .dropdown.action>.btn {
    display: none;
}
.view-grid .dropdown.action .dropdown-menu {
    display: block;
    position: static !important;
    position: initial !important;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
    max-width: 95px;
    min-width: 95px;
    width: 95px;
    left: auto !important;
    top: auto !important;
    padding: 0px;
}
.view-grid .dropdown.action .dropdown-menu li {
    display: inline-block;
    text-align: center;
}
.view-grid .dropdown.action .dropdown-menu li a {
    font-size: 0;
    padding: 2px;
    margin: 0;
}
.view-grid .dropdown.action .dropdown-menu li a>span {
    font-size: 18px;
}
.view-grid .dropdown.action .dropdown-menu li a:hover {
    color: var(--tt_red) !important;
    background: transparent;
}
td[aria-label="action menu"] {
    padding-top: 2px !important;
}

/* Navigation bar links on  Tax Information Request forms */
.list-group-item a {
    cursor: pointer;
}

.btn-info
div#DocumentsList > ul >li > a,
div#contactList > ul > li > a
{
    background: var(--pri_silver_tint_40) !important;
    color: var(--text_black) !important;
    font-size: 18px !important;
    border-radius: 20px;
}
div#DocumentsList > ul >li > a:hover,
div#contactList > ul > li > a:hover
{
    background: var(--tt_grey) !important;
    color: var(--tt_white) !important;
    font-size: 18px !important;
    border-radius: 20px;
}
div#DocumentsList > ul >li.active > a
{
    background: var(--tt_red) !important;
    color: var(--tt_white) !important;
    font-size: 18px !important;
    border-radius: 20px;
}

.nav1-ndash {
    padding-left: 15px !important;
}

div.cal-day-outmonth{
    background: var(--jcca_darkgrey) !important;   
    color: var(--tt_white) !important;
}
div.cal-day-outmonth > span{
    background: var(--col_Clear) !important;   
    color: var(--tt_white) !important;
}
div.cal-day-inmonth{
    background: var(--tt_white) !important;   
    color: var(--tt_white) !important;
}
div.cal-day-inmonth:hover{
    background: var(--pri_silver_tint_40) !important;   
    color: var(--tt_white) !important;
}
div.cal-day-inmonth > span{
    background: var(--col_Clear) !important;   
    color: var(--text_black) !important;
}

div.cal-day-today {
    background: var(--pri_silver_tint_40) !important;   
    color: var(--tt_white) !important;
}
div.cal-day-today > span{
    background: var(--col_Clear) !important;   
    color: var(--text_black) !important;
}

div.events-list > a.event-info.dayWorking{
    background-color: var(--tt_red) !important;    
    color:var(--tt_white) !important;
}

div.events-list > a.event-info.dayNonWorking,
div.events-list > a.event-info.dayAbsence,
div.events-list > a.event-info.dayAnnualLeave,
div.events-list > a.event-info.dayTravelling,
div.events-list > a.event-info.dayOther{
    background-color: var(--jcca_darkgrey) !important;    
    color:var(--tt_white) !important;
}

#MonthViewToggleButton.active, #YearViewToggleButton.active{
    background-color: var(--tt_red) !important;
    color: var(--tt_white) !important;
}
div#calendarGrid >div.btn-group > a.btn-primary {
    background-color: var(--tt_red) !important;
    color: var(--tt_white) !important;
    border-color: var(--text_black) !important;
}
div#calendarGrid >div.btn-group > a.btn-primary:hover,
#MonthViewToggleButton:hover,#YearViewToggleButton:hover {
    background-color: var(--jcca_darkgrey) !important;
    color: var(--tt_white) !important;
    border-color: var(--text_black) !important;
}
div#calendarGrid >div.btn-group > a.btn-secondary,
div.modal-body > div.btn-group > a.btn-secondary{
    background-color: var(--jcca_darkgrey) !important;
    color: var(--tt_white) !important;
    border-color: var(--text_black) !important;
}
div#calendarGrid >div.btn-group > a.btn-secondary:hover,
div.modal-body > div.btn-group > a.btn-secondary:hover{
    background-color: var(--tt_red) !important;
    color: var(--tt_white) !important;
    border-color: var(--text_black) !important;
}
div#calendarHelpBox, div#calendarHelpBox > span,div#calendarHelpBox > button,
div#calendarCreateHelpBox, div#calendarCreateHelpBox > span,div#calendarCreateHelpBox > button,
div#calendarEditHelpBox, div#calendarEditHelpBox > span,div#calendarEditHelpBox > button,
div#calendarSetupHelpBox, div#calendarSetupHelpBox > span,div#calendarSetupHelpBox > button,
div#calendarSubmissionHelpBox, div#calendarSubmissionHelpBox > span,div#calendarSubmissionHelpBox > button{
    color:var(--tt_white) !important;
}
div#calendarErrorBox > .xrm-attribute-value-encoded.xrm-attribute-value{
    color:var(--tt_white) !important;
}

a[data-attribute="Pending Signing"] {
    background-color: var(--tt_red) !important;
    border-color: var(--tt_red) !important;
}

a[data-attribute="Signed"] {
    background-color: var(--text_complete) !important;
    border-color: var(--text_complete) !important;
}

h5.bigger-bold{
    color: var(--text_black) !important;
}

#ClientMessage,#ClientMessage>#ClientMessageBody {
    background: var(--pri_silver_tint_40) !important; 
    color: var(--text_black) !important;
}

#UserMessage,#UserMessage>#UserMessageBody {
    background: var(--tt_red) !important;
    color: var(--tt_white) !important;
}

/* Progress bar on Identity Verification page */
.progress.sticky, .progress-bar.sticky {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 24px;
    z-index: 100;
}

#contactList {
    text-align: -webkit-center;
    max-height: 25vh;
    overflow-y: auto;
}
#contactList ul {
    width:90%;
    margin-bottom: 2px;
}
#contactList ul li {
    vertical-align: middle;
}
#contactList ul li a {
    text-overflow:ellipsis;
    min-height:7vh;
    border-radius:10px;
    align-content:center;
}

#sharedDocumentsRow {
	border-bottom: 1px solid #eee !important;
}

/* Apply standards for mobile, i.e. 1-1200px */
@media (max-width: 1200px)
{
    body, html, select,  div, a, td, label, table,
    h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6,
    .section-title, .status   {
        font-family: "Tahoma" !important;
    }

    .navbar-static-top.navbar .menu-bar > .navbar-nav > li > a {
        font-family:  "Tahoma" !important;
        font-size: 16px !important; 
    }


    .navbar-static-top .navbar-brand {
        
        color: white !important;
        text-transform: uppercase !important;
        font-size: 30px !important;
        padding-left: 5px;
        padding-top: 10px;
    }
    .tab-title{
        font-size: 20px;
    }

    .navbar-inverse .navbar-nav > li > ul > li > a{
    color: var(--tt_white) !important;
    }

    /* Tax Return form */
    /* Horizontal Picklist for Status */
    .picklistHorizontalStatus > label
    {
        width: 15% !important;
    }

    /* Horizontal Picklist for Student Loan */
    .picklistHorizontalStudent > label
    {
        width: 20% !important;
    }

    .panel,
    .panel-default {
        padding: initial !important; /* Reset to default */
    }
}