/* htbportalmain.css */
/* Participant Portal */

/*** Root Variables  ***/
:root {
    --nearly-black: #323237;
    --background-white: #ffffff;
    --background-shade: #f8f9fa;
    --background-lightblue: rgba(155,203,235,0.20);
    --border-grey: #e4e7ea;
    --text-white: #ffffff;

    --ha-navy: #10069f;
    --ha-aqua: #59BEC9;
    --brand-primary: #10069f;
    --brand-secondary: #6C8E3E;
    --brand-alternate: #E6994B;

    --progress-indicator-color: #10069f;
    
    --field-border-enabled: #c8cacc;
    --field-icon-grey: #6f6f76;

    --white-tick: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='122.877px' height='101.052px' viewBox='0 0 122.877 101.052' enable-background='new 0 0 122.877 101.052' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M4.43,63.63c-2.869-2.755-4.352-6.42-4.427-10.11c-0.074-3.689,1.261-7.412,4.015-10.281 c2.752-2.867,6.417-4.351,10.106-4.425c3.691-0.076,7.412,1.255,10.283,4.012l24.787,23.851L98.543,3.989l1.768,1.349l-1.77-1.355 c0.141-0.183,0.301-0.339,0.479-0.466c2.936-2.543,6.621-3.691,10.223-3.495V0.018l0.176,0.016c3.623,0.24,7.162,1.85,9.775,4.766 c2.658,2.965,3.863,6.731,3.662,10.412h0.004l-0.016,0.176c-0.236,3.558-1.791,7.035-4.609,9.632l-59.224,72.09l0.004,0.004 c-0.111,0.141-0.236,0.262-0.372,0.368c-2.773,2.435-6.275,3.629-9.757,3.569c-3.511-0.061-7.015-1.396-9.741-4.016L4.43,63.63 L4.43,63.63z' fill=%22%23FFFFFF%22/%3E%3C/g%3E%3C/svg%3E");
    --chevron-up-white: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 122.88 66.91' style='enable-background:new 0 0 122.88 66.91' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M11.68,64.96c-2.72,2.65-7.08,2.59-9.73-0.14c-2.65-2.72-2.59-7.08,0.13-9.73L56.87,1.97l4.8,4.93l-4.81-4.95 c2.74-2.65,7.1-2.58,9.76,0.15c0.08,0.08,0.15,0.16,0.23,0.24L120.8,55.1c2.72,2.65,2.78,7.01,0.13,9.73 c-2.65,2.72-7,2.78-9.73,0.14L61.65,16.5L11.68,64.96L11.68,64.96z' fill=%22%23FFFFFF%22/%3E%3C/g%3E%3C/svg%3E");
    --chevron-down-grey: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 122.88 66.91' style='enable-background:new 0 0 122.88 66.91' xml:space='preserve'%3E%3Cg%3E%3Cpath d='M11.68,1.95C8.95-0.7,4.6-0.64,1.95,2.08c-2.65,2.72-2.59,7.08,0.13,9.73l54.79,53.13l4.8-4.93l-4.8,4.95 c2.74,2.65,7.1,2.58,9.75-0.15c0.08-0.08,0.15-0.16,0.22-0.24l53.95-52.76c2.73-2.65,2.79-7.01,0.14-9.73 c-2.65-2.72-7.01-2.79-9.73-0.13L61.65,50.41L11.68,1.95L11.68,1.95z' fill=%22%236f6f76%22/%3E%3C/g%3E%3C/svg%3E");
}

/*** Text & Links ***/
.text-primary {
    color: var(--ha-navy) !important;
}

.content-link {
  font-weight: 600;
  text-decoration: underline !important;
}

/* Link Styling to match Housing Australia style

.content-link, .msg-toggle, .content-link:focus, .msg-toggle:focus {
    text-decoration: none;
    color: #000000;
    background: linear-gradient(0deg, #fadd99 0, #fadd99 53%, rgba(255, 255, 255, 0) 53%, rgba(255, 255, 255, 0) 100%);
    background-position: 100% -9px;
    background-size: 200% 200%;
    background-clip: content-box;
    line-height: 18px;
    padding-bottom: .375rem;
    transition: background-position .15s ease-in-out;
}
.content-link:hover, .msg-toggle:hover, .content-link:active, .msg-toggle:active {
    text-decoration: none;
    color: #000000;
    background-position: 100% 100%;
}
.content-link {
    font-weight: 600;
}
    */

/** Bootstrap Alert **/
.alert.hide {
    display: none;
}

/*** Nav Header ***/
    .navbar-brand.navbar-header {
        margin: 0;
        padding: 0;
    }

    .navbar-brand.navbar-header img {
        margin: 0 !important;
        height: auto !important;
        max-height: 54px;
    }

/*** Page Footer ***/
    footer {
        padding: 0 !important;
    }
    footer .footer-bottom {
        border-top: 1rem solid var(--ha-aqua);
    }

/*** Page Headers ***/
    h3, .h3{
        font-size: 23px;
    }

/*** Controls, Inputs, Buttons ***/

    /* Limit btn height */
    /* .btn, .button2, .btn-secondary, .btn-default {
        max-height: 35px; 
    } */

    .btn:disabled, .btn.disabled {
        background-color: #6f6f76;
    }

    .btn.btn-default.btn-md {
        /* Action Button */
        background-color: var(--background-white);
    }

    /* Portal Export Button */
    .btn-info, a.entitylist-download.btn.btn-info.float-end.action {
        color: #FFFFFF;
        border-radius: 0;
        font-family: Arial;
        font-weight: 400;
        font-size: 18px;
        border-color: var(--ha-navy);
        width: fit-content;
        border-style: solid;
        border-width: 1.6px;
        align-items: center;
        justify-content: center;
        background-color: var(--ha-navy);
        /* max-height: 35px; */
    }

    /* Search box */
    .query.form-control {
        font-size: 18px !important; 
    }

    /* Radio button */
    input[type=radio] {
        accent-color: var(--ha-navy);
    }

    .picklist.vertical label {
        display: inline-block;
        vertical-align: top;
        max-width: 98%; 
    }

    /* Checkbox */
    input[type=checkbox] {
        accent-color: var(--ha-navy);
    }

    /* Multiselect Dropdown */
    .msos-focused {
        box-shadow: none !important;
        border-color: var(--ha-navy) !important;
    }

    /* Hide required validation asterix when needed */
    .hide-required-after::after {
        content: none !important;
    }

    /* Custom file upload */
    input[type="file"]::-webkit-file-upload-button {
        border-color: #10069f;
        border-radius: 2px;
        font-family: Arial;
        font-weight: 400;
        font-size: 16px;
        padding: 6px 20px;
        width: fit-content;
        border-style: solid;
        background-color: #10069f;
        color: #FFFFFF;
        cursor: pointer;
    }

    input[type="file"]:hover::-webkit-file-upload-button {
        background-color: #0038B2;
        border-color: #0038B2;
    }

    input[type="file"]:disabled::-webkit-file-upload-button {
        background-color: #6f6f76;
        border-color: #6f6f76;
    }

/*** Pagination ***/

    ul.pagination li a {
        background-color: var(--background-white);
        font-weight: bold;
        color: var(--ha-navy);
        padding-top: 9px;
    }

    ul.pagination li a:hover {
        background-color: var(--border-grey);
        color: var(--nearly-black);
    }

    ul.pagination li.active a,
    ul.pagination li.active a:hover,
    ul.pagination li.active a:focus,
    ul.pagination li.active a:active {
        background-color: var(--ha-navy) !important;
        color: var(--background-white);
        border-radius: 50%;
    }

/*** Entity List / Tables ***/

    .crmEntityFormView, .entitylist {
        border: none !important;
    }
    
    /*
    .entitylist {
        padding-bottom: 40px;
    }
    */

    .table>:not(caption)>*>* {
        border-bottom-width: 0;
    }

    td {
        align-content: center;
    }

    .table>thead {
        background-color: var(--ha-navy);
    }
    
    .table>thead>tr, .table>thead>tr a {
        color: var(--text-white);
    }

    .table-striped>tbody>tr:nth-of-type(odd)>* {
        --bs-table-accent-bg: var(--background-white);
    }

    .table-striped>tbody>tr:nth-of-type(even)>* {
        --bs-table-accent-bg: var(--background-lightblue);
    }

    .view-grid {
        min-height: 200px; /* ensure no vertical scroll appears when taking action */
    }

    .btn-default[data-bs-toggle="dropdown"]:hover, .btn-default[data-bs-toggle="dropdown"]:focus, .btn-default.show[data-bs-toggle="dropdown"]  {
        color: var(--ha-navy); /* Dropdown arrow needs to stay ha-navy on lists */
    }

/*** Entity Form ***/
    #EntityFormView {
        margin-left: 20px; /* space from Progress Indicator */
    }

    .crmEntityFormView .field-label {
        font-weight: 400;
    }

    .crmEntityFormView .cell {
        padding: 0 0 20px;
    }

    .crmEntityFormView .tab-title {
        border-bottom: none;
    }

    .crmEntityFormView .actions {
        border-top: none;
        margin-left: 20px; /* space from Progress Indicator */
    }

    .crmEntityFormView .description {
        font-style: italic;
        color: var(--ha-navy);
    } 

    /* Form Input */
    .form-control:focus {
        box-shadow: none;
        border-color: var(--ha-navy);
    }  

    select.form-control {
        border-color: #949494;
    }

    textarea.form-control {
        border-color: #949494;
    }

    /* Added arrow to lookups rendered as dropdowns */
    select.form-control {
        background-repeat: no-repeat;
        background-position: right .75rem center;
        background-size: 16px 12px;
        background-image: url("data:image/svg+xml;charset=utf8, %3Csvg viewBox='0 0 16 16' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23000000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' fill='none' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"); 
    }

    

/*** Progress Indicator  ***/

    div[id$="ProgressIndicator"], ol.progress.list-group.left {
        padding: 0;
        margin: 0;
    }

    div[id$="ProgressIndicator"] > ol{
        padding: 0;
        margin: 0;
    }

    ol.progress.left {
        background-color: var(--background-white);
        box-shadow: none;
    }

    ol.progress.left > li > span {
        float: right;
        background-color: var(--progress-indicator-color);
        background-image: var(--white-tick);
        background-size: 13px auto;
        background-position: 50%;
        background-repeat: no-repeat;
        border: 2px solid var(--progress-indicator-color);
        border-radius: 50%;
        width: 25px;
        height: 25px;
        margin-top: -2px;
        padding: 0px !important;
    }

    ol.progress.left > li > span:after {
        content: "";
        margin: 20px auto 0;
        display: block;
        width: 3px;
        height: 30px;
        background-color: var(--progress-indicator-color);
        position: relative;
    }

    ol.progress.left > li > span:before {
        content: none;
    }

    ol.progress.left > li.incomplete:after,
    ol.progress.left > li.active:after {
        content: "";
        float: right;
        background-color: var(--background-white);
        border: 2px solid var(--progress-indicator-color);
        border-radius: 50%;
        width: 25px;
        height: 25px;
        margin-top: -2px;
        padding: 0px !important;
    }

    ol.progress.left > li.active {
        font-weight: bold;
    }

    ol.progress.left > li.incomplete {
        margin-top: 0px !important;
    }

    ol.progress.left > li.incomplete:after {
        border-color: var(--field-border-enabled);
    }

    ol.progress.left > li.incomplete:before {
        content: "";
        margin: 3px 11px 0px auto;
        display: block;
        width: 3px;
        height: 30px;
        background-color: var(--field-border-enabled);
    }

    ol.progress.left > li.list-group-item {
        background-color: var(--background-white);
        color: var(--nearly-black);
        border: none;
        margin-top: 30px;
        padding-top: 0;
        padding-bottom: 0;
        padding-right: 0;
    }

    ol.progress.list-group.left {
        font-size: 14px;
    }

    @media (min-width: 0px) and (max-width: 767px) {
        div[id$="ProgressIndicator"] {
            display: none;
        }
    }

    /*** Breadcrumbs ***/
    .breadcrumb {
        padding: 0
    }

    .breadcrumb > li a {
        padding: 0;
    }


    /*Content Tab Navigation */
    .nav-tabs {
        border-bottom: 2px solid #10069f;
    }

    .nav-tabs .nav-link {
        color: #000;
        padding: 1rem 3rem;
        font-weight: 500;
        font-size: 25px;
        position: relative;
        top: 1px;
        border-width: 2px;
        margin-left: -2px;
    }
    
    .nav-tabs .nav-item .nav-link, .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active, .nav-tabs .nav-link:hover {
        border-radius: 0 !important;
    }

    .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active, .nav-tabs .nav-link:hover {
        border: 2px solid #10069f;
    }

    .nav-tabs .nav-link.active {
        border-bottom: 2px solid #fff;
        position: relative;
        top: 1px;
    }

    .nav-tabs .nav-link.active {
        color: #10069f;
    }

    .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
        background-color: #86d3db;
        color: #10069f;
    }

    .nav-tabs .nav-link:focus {
        background-color: #fff;
        color: #10069f;
    }

    /* Entity List Filter */
    .entitylist-filter {
        border: none !important;
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
    }

    .entitylist-filter-option-group .h4 {
        font-weight: 600;
        font-size: 16px;
    }

    ul#entitylist-filters{
        display:flex;
        flex-wrap:nowrap;
        justify-content:space-between;
        align-items:flex-start;
        padding-left:0;
        margin:0;
    }

    ul#entitylist-filters>li.list-inline-item{
        margin-right:0;
        flex:1 1 0;
        min-width:0;
        padding:0 .5rem;
        box-sizing:border-box;
    }

    ul#entitylist-filters>li.entitylist-filter-option-group{
        display:flex;
        flex-direction:column;
        min-width:0;
    }

    ul#entitylist-filters>li.entitylist-filter-option-group>ul.list-unstyled{
        margin:0;
        padding:0;
    }

    ul#entitylist-filters .input-group{
        width:100%;
        flex-wrap:nowrap;
    }

    ul#entitylist-filters .entitylist-filter-option-group-label{
        margin-bottom:.25rem;
        white-space:nowrap;
        overflow:hidden;
        text-overflow:ellipsis;
    }

    @media (max-width:992px){
        ul#entitylist-filters{flex-wrap:wrap;}
        ul#entitylist-filters>li.list-inline-item{
        flex:1 1 260px;
        margin-bottom:.75rem;
        }
    }

    #entitylist-filters .input-group-text{
        color:#10069f;
        background-color:var(--background-lightblue);
    }

    #entitylist-filters .input-group-text .fa{
        color:inherit;
    }

    #entitylist-filters .form-control, #entitylist-filters .input-group-text {
        border-radius:0;
        border-color: #ced4da;
    }

    .entitylist-filter .btn-entitylist-filter-submit {
        margin-top: 1rem;
        margin-right: 0.5rem;
    }

   .view-toolbar  {
        display:flex;
        justify-content:flex-end;
        gap:10px;
    }

    input.query{
        border:0px;
    }

    button.btn.btn-default[aria-label="Search Results"][title="Search Results"]{
        border:0px;
    }

    .entitylist-search{
        border: 2px solid var(--ha-navy);
        border-radius: 5px;
        padding-bottom:5px;
    }

    a.selected-view{
        border: 2px solid var(--ha-navy);
    }


a.entitylist-download.btn.btn-info.float-end.action {
  padding: 8px;
}