/* Hearing Australia overrides  */
@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Black.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-BlackItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Bold.otf') format('opentype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-BoldItalic.otf') format('opentype');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-ExtraBold.otf') format('opentype');
    font-weight: 800;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-ExtraBoldItalic.otf') format('opentype');
    font-weight: 800;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Heavy.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-HeavyItalic.otf') format('opentype');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Light.otf') format('opentype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-LightItalic.otf') format('opentype');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-MediumItalic.otf') format('opentype');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-RegularItalic.otf') format('opentype');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-SemiBold.otf') format('opentype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-SemiBoldItalic.otf') format('opentype');
    font-weight: 600;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-Thin.otf') format('opentype');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-ThinItalic.otf') format('opentype');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-UltraLight.otf') format('opentype');
    font-weight: 200;
    font-style: normal;
}

@font-face {
    font-family: 'Gilroy';
    src: url('https://hearing.com.au/Gilroy/Gilroy-UltraLightItalic.otf') format('opentype');
    font-weight: 200;
    font-style: italic;
}


/* VARS */
:root {
    --ha-font-face: "Segoe UI", Arial, sans-serif;
    --ha-primary-blue: #3269ff;
    --ha-primary-blue-80: #5687ff;
    --ha-primary-blue-60: #84a5ff;
    --ha-primary-blue-40: #abc3ff;
    --ha-primary-blue-20: #d6e1ff;
    --ha-primary-white: #ffffff;
    --ha-primary-light-grey: #f0f0f0;
    --ha-primary-black: #000000;
    --ha-primary-black-80: #333333;
    --ha-primary-black-60: #777777;
    --ha-primary-black-40: #cccccc;
    --ha-primary-black-20: #efefef;
        --ha-secondary-dark-green: #166534;
    --ha-secondary-green: #1ed4ab;
    --ha-secondary-green-80: #4bddb8;
    --ha-secondary-green-20: #d2f6ed;
    --ha-secondary-orange: #fe7055;
    --ha-secondary-orange-80: #fe8d77;
    --ha-secondary-orange-20: #ffe2dd;
    --ha-secondary-purple: #be8ef8;
    --ha-secondary-purple-80: #cd9bf9;
    --ha-secondary-purple-20: #f2e6fe;
    --ha-secondary-yellow: #ffc848;
    --ha-secondary-yellow-80: #ffd36d; 
    --ha-secondary-yellow-20: #fff4da; 
    --ha-secondary-red: #550000;
    --ha-secondary-red-80: #cc0000;
    --ha-secondary-red-20: #ee0000;
    --ha-secondary-light-red: #ff6666;
    --ha-secondary-light-red-80: #ff9999;
    --ha-secondary-light-red-20: #ffcccc;

    --navbar-color: #ff0000;
    --navbar-hover-color: #ff0000;
    --navbar-disabled-color: #ff0000;
    --navbar-active-color: #ff0000;
    --navbar-brand-color: #ff0000;
    --navbar-brand-hover-color: #00ff00;
    --navbar-toggler-border-color: #ff0000;

    --notice-border-color: #efefef;

    --table-border-color: #dfe0e1;
    --table-header-backgound-color: #f8f9fa;
    --table-weekend-background-color: #efefef;


    /* BS override */
    --bs-navbar-color: #ffffff;
    --navbar-toggler-icon-bg: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'><path stroke='rgba(255, 255, 255, 0.55)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/></svg>");

}


body {
    background-color: #f8f9fa !important;
}



/************************************************************/
/* OVERIDES                                                 */
/* Global input Readonly Style */
html[dir=ltr] .crmEntityFormView .cell.checkbox-cell div.table-info
{
    padding-left: 0;
}

/* hide built in portal Sign in nav-tabs */
.nav-tabs.nav-account {
    display: none;
}
.page-content {
    margin-top: 7.5rem; /* to ensure content clear the fixed-top nav */
}

/* fixes bootstrap button borrder missing when disabled */
.btn:disabled {
    border-style: solid;
    opacity: 0.3;
}


/************************************************************/
/* EFFECTS                                        */
/* form validation, animation effect: a fade out banner, e.g. to overide the private mode warning on top of the page */
.private-mode-banner,
.effect-fade-out {
    animation: effect-fade-out 2s 2s forwards;
    visibility: visible;
    opacity: 1;
}
@keyframes effect-fade-out {
    to {
        visibility: hidden;
        opacity: 0;
    }
}

/* animation effect: a circular glowing effect, e.g. Alert Icon on the header */
.effect-glow {
    animation: effect-glow 1s infinite alternate;
}
@keyframes effect-glow {
  from {
    border: none;
    box-shadow: 0 0 10px -10px rgba(255, 255, 255, 0);
  }
  to {
    border: solid 1px rgba(255, 255, 255, 1);
    box-shadow: 0 0 10px 10px rgba(255, 255, 255, 0.1);
  }
}

.highlight-item {
    background-color: var(--ha-primary-blue-20);
    animation: effect-highlight-blue 0.5s infinite alternate;
}
@keyframes effect-highlight-blue {
  from {
    background-color: var(--ha-primary-blue-20) !important;
  }
  to {
    background-color: transparent !important;
  }
}

/* Validation */
.validation-error {
    color: var(--ha-secondary-red-80);
}
.validation-alert {
    animation: effect-validation-alert 0.5s infinite alternate;
}
@keyframes effect-validation-alert {
  from {
    border: solid 1px var(--ha-secondary-red-80) !important;
  }
  to {
    border: solid 1px var(--ha-primary-black-40) !important;
  }
}
/* for Bootstrap floating form, add required marker */
.form-floating input.form-control.required + label:after {
    content: '*';
    padding-left: 0.5rem;
    color: var(--ha-secondary-red-80);
}



/************************************************************/
/* VIEW: MOBILE FIRST                                       */

.hearing-australia {
    font-family: var(--ha-font-face) !important;
}

/*==================== PAGE LAYOUT ====================*/
/* PAGE LAYOUT */
.hearing-australia.page-layout {
    margin: 7rem 0;
}

    /* PAGE: BREADCRUMBS */
    .hearing-australia .breadcrumb {
        padding: 0;
        margin: 0 1.5rem;
    }

        
    /* PAGE: HEADER */
    .header .header-welcome {
        display: none;
        /*
        font-size: 1.2rem;
        font-weight: 500;
        color: var(--ha-primary-white);
        margin-right: 1rem;
        */
    }


    /* HEADER: ALERTS */
    .header-alerts {
        position: relative;
        margin-right: 1rem;
        flex-grow: 1;
        justify-items: flex-end;
    }


    #alerts-bell {
        position: relative;
        background: none;
        border: none;
        color: white;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 0.5rem;
        border-radius: 50%;
        transition: background-color 0.3s ease;
        width: 3rem;
        height: 3rem;
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0.3;
    }

    #alerts-bell:hover {
        background-color: rgba(255, 255, 255, 0.1);
        color: white;
        opacity: 0.3;
    }

        #alerts-bell.effect-glow {
            opacity: 1 !important;
        }

    .alerts-badge {
        position: absolute;
        top: 0;
        right: 0;
        background-color: #dc3545;
        color: white;
        border-radius: 50%;
        width: 1.2rem;
        height: 1.2rem;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 0.75rem;
        font-weight: bold;
    }

    #alerts-panel {
        position: absolute;
        top: 100%;
        right: 6rem;
        width: 320px;
        max-width: 90vw;
        background: white;
        border-radius: 1rem;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
        z-index: 1000;
        display: none;
        margin-top: 0.5rem;
        transform: translate(50%, 0%);
    }

    #alerts-panel.show {
        display: block;
    }

    .alerts-header {
        padding: 1rem;
        border-bottom: 1px solid #e9ecef;
        display: flex;
        justify-content: between;
        align-items: center;
    }

    .alerts-item {
        padding: 1rem;
        border-bottom: 1px solid #dee2e6;
        cursor: pointer;
        transition: background-color 0.2s ease;
        display: flex;
    }

    .alerts-item:hover {
        background-color: #f8f9fa;
    }

    .alerts-item:last-child {
        border-bottom: none;
        border-radius: 0 0 1rem 1rem;
    }

    .alerts-dot {
        width: 0.5rem;
        height: 0.5rem;
        background-color: #3268FF;
        border-radius: 50%;
        display: inline-block;
        margin-right: 0.5rem;
    }

    .alerts-time {
        font-size: 0.8rem;
        color: #6c757d;
    }


    /* PAGE: HEADER PANEL*/
    .hearing-australia .header-panel {
        background-color: var(--ha-primary-blue);
        border-color: transparent; 
    }

    .hearing-australia .header-panel .custom-container {
        display: flex;
        align-items: center;
        gap: 0 0.5rem;
        padding-top: 0;
        padding-bottom: 0.5rem;
    }

        /* HEADER PANEL: Logo */
        .hearing-australia .custom-container .navbar-brand {
            color: #ffffff;
            flex-grow: 1; 
        }

            .hearing-australia .custom-container .navbar-brand  .header-logo {
                height: 5rem;
            }


        /* HEADER PANEL: Toggler/Burger */
        .hearing-australia .custom-container .custom-navbar-toggler {
            flex-grow: 0;
        }

        /* HEADER PANEL: Toggler/Burger */
        .hearing-australia .navbar-toggler {
            background-color: transparent;
            /* border: solid 1px var(--ha-primary-blue-20); */
        }
        .hearing-australia .navbar-toggler:hover {
            border-color: #ffffff;
        }

        .hearing-australia .navbar-toggler .navbar-toggler-icon {
            background-image: var(--navbar-toggler-icon-bg);
        }


    .hearing-australia .divider-vertical {
        border-right-color: #ffffff;
        border-left-color: #111; 
    }

    /* NAV BAR */
    .hearing-australia #navbar {
        background-color: var(--ha-primary-blue-40);
        margin: 0 auto;
        padding: 0;
        border-radius: 0 0 2rem 2rem;
    }

        /* NAV BAR: HEADER LINK USER PROFILE */
        .hearing-australia .nav-user-link {
            border: none;
        }
            .hearing-australia .nav-user-link .nav-link {
                color: #ffffff;
            }
            .hearing-australia .nav-user-link .nav-link:hover,
            .hearing-australia .nav-user-link .nav-link:focus-visible
            {
                background-color: transparent;
                border: none;
            }


        /* NAV BAR: Menu */
        .hearing-australia .navbar-nav {
            flex-direction: row;
            justify-content: center;
        }
            .hearing-australia .navbar-nav > li > a {
                color: var(--ha-primary-black-80); 
                margin: 0 1rem;
            }

            .hearing-australia .navbar-nav > li > a:hover {
                color: var(--ha-primary-black);
                background-color: transparent;
                cursor: pointer;
            }

            .hearing-australia .navbar-nav > li > a:focus {
                color: var(--ha-primary-black);
                background-color: transparent;
                outline: 1px dashed #ffffff; 
            }

        /* NAV BAR: ICON LINK */
        .hearing-australia .nav-icon-link {
            background-color: var(--ha-primary-blue);
            padding: 0.7rem;
            border-radius: 2rem;
            border: solid 1px var(--ha-primary-blue-80);   
        }
            .hearing-australia .nav-icon-link:hover {
                border: solid 1px var(--ha-primary-white);    
            }

            .hearing-australia .nav-icon-link img {
                width: 1.5rem;
                height: 1.5rem;
            }
            .hearing-australia .nav-icon-link svg {
                width: 1.5rem;
                height: 1.5rem;
                fill: var(--ha-primary-white);
            }

            .hearing-australia .nav-icon-link .tool-tip {
                color: var(--ha-primary-white);
                visibility: hidden;
                width: 120px;
                background-color: black;
                color: #fff;
                text-align: center;
                padding: 0.5rem 0;
                border-radius: 6px;
                
                /* Position the tooltip text - see examples below! */
                position: absolute;
                top: 4rem;
                z-index: 1;
            }
            .hearing-australia .nav-icon-link .tool-tip::after {
                content: "";
                position: absolute;
                top: -10px;
                left: 10px;
                margin-left: -5px;
                border-width: 5px;
                border-style: solid;
                border-color: #000 transparent transparent transparent;
                transform: rotate(180deg);
            }

            .hearing-australia .nav-icon-link:hover .tool-tip {
                visibility: visible;
            }
            
        .hearing-australia .nav-break {
            flex-basis: 100%;
            height: 0;
        }

    /* PAGE: COLUMNBLOCKLAYOUT */
    .hearing-australia .column-block-layout {
        margin: 0 0 1rem;
        padding: 0;
        /*
        columns: 1;
        column-width: 300px;
        */
        display: flex;
        flex-grow: 1;
    }

        .hearing-australia .column-block-layout > .column-block {
            columns: 1;
            flex-grow: 2;    
        }

        .hearing-australia .column-block-layout> .column-block .block,
        .hearing-australia .column-block-layout> .column-block [class^="dashboard-"] {
            margin: 0 0 2rem;;
            padding: 0;
            break-inside: avoid;
        }

        .hearing-australia .column-block-layout > .column-block .block:first-child,
        .hearing-australia .column-block-layout> .column-block [class^="dashboard-"] .block:first-child {
            margin-top: 0;
        }

    /* PAGE: FOOTER */
    .footer .footer-bottom {
        background-color: transparent;
    }

        /* FOOTER: NAV BAR */
        .footer .navbar-nav {
            justify-content: flex-start;
        }

        .footer .navbar-nav > li > a {
            color: var(--ha-primary-black);
        }

        .footer .navbar-nav > li > a:hover {
            color: var(--ha-primary-blue) !important;
        }

        .footer .navbar-nav > li > a:focus {
            color: var(--ha-primary-blue) !important;
        }
        

/*==================== COMMONS ====================*/
/* COMMONS: Typography */
.hearing-australia h1, 
.hearing-australia h2, 
.hearing-australia h3, 
.hearing-australia h4, 
.hearing-australia h5, 
.hearing-australia div 
.hearing-australia p {
    font-family: var(--ha-font-face) !important;
}  

/* COMMONS: Buttons */
/* override theme btn colours */
.hearing-australia .btn {
    border-radius: 0.5rem;
    padding: 0.5rem 1rem;
}

.hearing-australia .btn-primary {
    background-color: var(--ha-primary-blue);
    border-color: var(--ha-primary-blue);
}

.hearing-australia .btn-primary:hover,
.hearing-australia .btn-primary:focus {
    background-color: var(--ha-primary-blue-80);
    border-color: var(--ha-primary-blue);
}

.hearing-australia .btn-secondary {
    background-color: var(--ha-secondary-red-20);
    border-color: var(--ha-secondary-red-20);
    color: #ffffff;
}

.hearing-australia .btn-secondary:hover,
.hearing-australia .btn-secondary:focus {
    background-color: var(--ha-secondary-red-80);
    border-color: var(--ha-secondary-red-80);
}

.hearing-australia .btn-tertiary {
    background-color: var(--ha-primary-black-20);
    border-color: var(--ha-primary-black-20);
    color: var(--ha-primary-black);
}

.hearing-australia .btn-tertiary:hover,
.hearing-australia .btn-tertiary:focus {
    background-color: var(--ha-primary-black-60);
    border-color: var(--ha-primary-black-60);
}

.hearing-australia .btn-outline-primary {
    background-color: #ffffff;
    border: solid 1px var(--ha-primary-blue);
}

.hearing-australia .btn-outline-primary:hover {
    border-color: var(--ha-primary-blue-80);
    background-color: var(--ha-primary-blue-20);;
    color: var(--ha-primary-blue-80);
}

.hearing-australia .btn-outline-primary:disabled {
    color: var(--ha-primary-black-60) !important;
    border-color: var(--ha-primary-black-60) !important; /* Adjust color for your Bootstrap version's primary color */
}

.hearing-australia .btn-outline-secondary {
    background-color: #ffffff;
    border: solid 1px var(--ha-secondary-red-20);
    color: var(--ha-secondary-red-20);
}

.hearing-australia .btn-outline-secondary:hover {
    border-color: var(--ha-secondary-red-80);
    background-color: var(--ha-secondary-red-20);
    color: var(--ha-secondary-red-80);
}

.hearing-australia .btn-outline-tertiary {
    background-color: #ffffff;
    border: solid 1px var(--ha-primary-black-20);
    color: var(--ha-primary-black);
}

.hearing-australia .btn-outline-tertiary:hover {
    border-color: var(--ha-primary-black-80);
    background-color: var(--ha-primary-black-20);
    color: var(--ha-primary-black-80);
}


.hearing-australia .form-control:disabled {
    background-color: #e9ecef !important;
    opacity: 1;
    color: var(--ha-primary-black-60);
    font-style: italic;
}

/* COMMON: Modal */
.hearing-australia .modal-body {
    padding: 2rem 1rem;
}

    .hearing-australia .modal-body a,
    .hearing-australia .modal-body a:link,
    .hearing-australia .modal-body a:visited,
    .hearing-australia .modal-body a:active {
        font-weight: 500;
        text-decoration: underline;
    }
    .hearing-australia .modal-body a:hover {
        font-weight: 700;
    }

.hearing-australia .modal-spinner {
    background-color: var(--ha-secondary-green-20);
    border-radius: 1rem;
    padding: 0.5rem 2rem;
    font-weight: 400;
    font-size: 1rem;
    width: fit-content;
}

.hearing-australia .modal-header .btn-close {
    background: transparent url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22currentColor%22%20class%3D%22bi%20bi-x-circle%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20d%3D%22M8%2015A7%207%200%201%201%208%201a7%207%200%200%201%200%2014m0%201A8%208%200%201%200%208%200a8%208%200%200%200%200%2016%22%2F%3E%3Cpath%20d%3D%22M4.646%204.646a.5.5%200%200%201%20.708%200L8%207.293l2.646-2.647a.5.5%200%200%201%20.708.708L8.707%208l2.647%202.646a.5.5%200%200%201-.708.708L8%208.707l-2.646%202.647a.5.5%200%200%201-.708-.708L7.293%208%204.646%205.354a.5.5%200%200%201%200-.708%22%2F%3E%3C%2Fsvg%3E') center/1.25rem auto no-repeat;
}


/* COMMON: Callout */
.callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    background-color: var(--ha-callout-bg, var(--ha-primary-light-grey));
    border-left: 0.25rem solid var(--ha-callout-border, var(--ha-primary-black-40));
}


.callout-info {
    --ha-callout-bg: var(--ha-primary-blue-20);
    --ha-callout-border: var(--ha-primary-blue-40);
}

.callout-warning {
    --ha-callout-bg: var(--ha-secondary-orange-20);
    --ha-callout-border: var(--ha-secondary-orange-80);
}

.callout-danger {
    --ha-callout-bg: var(--ha-secondary-light-red-20);
    --ha-callout-border: var(--ha-secondary-light-red-80);
}


.callout>:last-child {
    margin-bottom: 0
}

.callout+.bd-callout {
    margin-top: -.25rem
}


/* COMMONS: Dashboard */
section[id^="dashboard-"] {
    break-inside: avoid;
    padding-bottom: 1rem;
}

/* Dashboard Typography */
[id^="dashboard-"] h3 {
    font-size: 1.5rem;
    font-weight: 400;
    color: var(--ha-primary-blue);
    margin: 0 0 0.5rem;
}
[id^="dashboard-"] h4 {
    font-size: 1.5rem;
    font-weight: 400;
    margin: 1rem 0 0.5rem;
}
[id^="dashboard-"] h5 {
    font-size: 1rem;
    font-weight: 600;
    margin: 0.5rem 0;
}

[id^="dashboard-"] p,
[id^="dashboard-"] div,
[id^="dashboard-"] li
[id^="dashboard-"] a {
    font-size: 1rem;
    line-height: 1.2;
}



/* Dashboard console container */
[id^="dashboard-"] .console {
    border-radius: 1rem;
    border: none;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
    background-color: #ffffff;
    padding: 0;
    margin-bottom: 1rem;
}
    [id^="dashboard-"] .console .card-body {
        background-color: transparent;
    }

    [id^="dashboard-"] .console .list-group-item {
        padding: 1rem;
    }

    [id^="dashboard-"] .console .list-group-item:first-child {
        border-top-left-radius: 1rem;
        border-top-right-radius: 1rem;
    }
    [id^="dashboard-"] .console .list-group-item:last-child{
        border-bottom-left-radius: 1rem;
        border-bottom-right-radius: 1rem;
    }

    [id^="dashboard-"] .console .card-body-show-hover:hover,
    [id^="dashboard-"] .console .list-group-item:hover,
    [id^="dashboard-"] .console .list-group-item-action:hover {
        background-color: #f3f4f6 !important;
    }
    
    [id^="dashboard-"] .console .form-otb-container {
        padding: 2rem 1rem;
    }

    /* Override for the OTB forms */
    [id^="dashboard-"] .console .crmEntityFormView,
    [id^="dashboard-"] .console .entitylist {
        padding: 0;
        border: none;
        box-shadow: none !important;
        background: transparent !important;

    }

        .entitylist .tab,
        .crmEntityFormView .tab {
            padding: 0;
            margin-bottom: 0;
        }

        .entitylist .tab-title,
        .crmEntityFormView .tab-title {
            display: none !important;
        }

        .crmEntityFormView .cell.zero-cell {
            display: none !important;
        }

    [id^="dashboard-"] .console .entitylist-container {
        border: none;
        border-radius: 2rem;
        padding: 1rem;
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
    }
        /* makes the OTB columns side by side */
        [id^="dashboard-"] .console .entity-form table.section {
            table-layout: fixed;
            width: 100%;
        }

        [id^="dashboard-"] .console .entity-form td.cell {
            padding: 0 0.5rem 0.5rem !important;
            display: block;
        }

        [id^="dashboard-"] .console .entity-form td.cell .table-info {
            padding: 0.5rem 0;
        }


        [id^="dashboard-"] .console .entity-form td.cell .control {
            flex-grow: 1;
        }

        [id^="dashboard-"] .console .entity-form td.cell .control input,
        [id^="dashboard-"] .console .entity-form td.cell .control textarea,
        [id^="dashboard-"] .console .entity-form td.cell .control a {
            padding: 0.5rem;
        }

        [id^="dashboard-"] .console .entity-form td.cell .control textarea.form-control {
            height: 5rem;
        }

        [id^="dashboard-"] .console .entity-form td.cell .control input.locked,
        [id^="dashboard-"] .console .entity-form td.cell .control a.locked {
          display: block;
          /* Add padding to the right to make space for the icon */
          padding-right: 2.5em !important;
          background-repeat: no-repeat;
          background-position: right 0.75em center;
          background-size: 1.2em 1.2em;
          /* Inline SVG lock icon for accessibility and performance */
          background-image: url('data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22currentColor%22%20class%3D%22bi%20bi-lock%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M8%200a4%204%200%200%201%204%204v2.05a2.5%202.5%200%200%201%202%202.45v5a2.5%202.5%200%200%201-2.5%202.5h-7A2.5%202.5%200%200%201%202%2013.5v-5a2.5%202.5%200%200%201%202-2.45V4a4%204%200%200%201%204-4M4.5%207A1.5%201.5%200%200%200%203%208.5v5A1.5%201.5%200%200%200%204.5%2015h7a1.5%201.5%200%200%200%201.5-1.5v-5A1.5%201.5%200%200%200%2011.5%207zM8%201a3%203%200%200%200-3%203v2h6V4a3%203%200%200%200-3-3%22%2F%3E%3C%2Fsvg%3E');
        }
        
        /* for accessibility when focused */
        [id^="dashboard-"] .console .entity-form td.cell .control input:focus {
          outline: 1px solid var(--ha-primary-black-40);
          outline-offset: 0;
        }
        

    /*
    .entitylist,
    .crmEntityFormView {
        border: none;
        border-radius: 2rem;
        padding: 1rem;
        box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075) !important;
    }
    */

        
    /* COMMONS: Appointment Booking */
    .appointment-booking { 
        margin-bottom: 2rem;
    }
        .appointment-booking .clinician-selector {
            margin: 0 0 1rem;
        }

        .appointment-booking .clinician-selector .btn-check:checked+.btn, 
        .appointment-booking .clinician-selector .btn.active, 
        .appointment-booking .clinician-selector .btn.show, 
        .appointment-booking .clinician-selector .btn:first-child:active, 
        .appointment-booking .clinician-selector :not(.btn-check)+.btn:active {
            border: none;
            background-color: var(--ha-secondary-yellow);
        }
        
        .appointment-booking .clinician-selector .btn-check+.btn:hover {
            background-color: var(--ha-secondary-yellow-80);
        }

        .appointment-booking .clinician-selector .btn {
            border: none;
            background-color: var(--ha-primary-light-grey);
        }


        .appointment-booking .appointment-selector .selector-flexbox {
            display: block;
        }

        .appointment-booking .appointment-selector .selector-flexbox .selector-date {
            display: flex;
            border: solid 1px var(--table-border-color);
        }
        
        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-header {
            flex: 0 0 80px;
            align-content: center;
            text-align: center;
            background-color: var(--table-header-backgound-color);
            padding: 0.5rem;
            font-weight: 500;
            font-size: 0.8rem;
            border-right: solid 1px var(--table-border-color);
            border-bottom: none;
        }
        
        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-body {
            flex: 1 0;
            align-self: center;
            align-content: center;
            /* border-left: solid 1px var(--table-border-color); */
            min-height: 100px;
            padding: 0.5rem;
        }

        .appointment-booking .appointment-selector .selector-flexbox .selector-date.weekend .selector-date-header,
        .appointment-booking .appointment-selector .selector-flexbox .selector-date.weekend .selector-date-body
        {
            background-color: var(--table-weekend-background-color);
        }

        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-body button {
            margin: 0.25rem 0.5rem;
            padding: 0.25rem 0.5rem;
            width: 5rem;

        }
        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-body button.hide {
            display: none;
        }

        .appointment-booking .appointment-selector .row-toggler {
            display: none;  /* hide on mobile */
            text-align: center;
        }
        .appointment-booking .appointment-selector .row-toggler button {
            font-size: 0.8rem;
            line-height: 1;
            text-decoration: none;
            font-weight: 300;
            border-radius: 0 0 0.5rem 0.5rem;
            border: solid 1px var(--table-border-color);
            border-top: none;
        }
        .appointment-booking .appointment-selector .row-toggler button:hover {
            font-size: 0.8rem;
            font-weight: 500;
            background-color: var(--ha-primary-black-20);
        }
    



/*==================== DASHBOARD ====================*/
/* DASHBOARD: Upcoming Appointment */


/* DASHBOARD: My Details */


/* DASHBOARD: My Devices */
#dashboard-my-devices ul.my-device {
    list-style-type: none;
    padding: 0;
}

#dashboard-my-devices ul.my-device li {
    /* display: inline-block; */
    display: flex;
    align-items: baseline;
    flex-direction: column;
    margin: 0 0 1rem;
}

#dashboard-my-devices li.ear-left::before{
    color: var(--ha-primary-blue);
}

#dashboard-my-devices li.ear-right::before {
    color: var(--ha-secondary-red-20);
}



/* DASHBOARD: My Preferred Site */
#dashboard-my-preferred-site ul.opening-hours {
    padding: 0.5rem 0 1rem;
    list-style: none;
}

#dashboard-my-preferred-site ul.opening-hours li {
    padding: 0.25rem 0;
    border-bottom: solid 1px var(--ha-primary-black-20);   
}


/* DASHBOARD: My Hearing */
#dashboard-my-hearing {

}

    #dashboard-my-hearing .my-hearing-figure {
        border: solid 2px var(--ha-primary-black-20);
        border-radius: 0.25rem;
        padding: 0.5rem;
    }

    #dashboard-my-hearing .my-hearing-description ol {
        padding: 0 0 0 1rem;
    }
    #dashboard-my-hearing .my-hearing-description ul {
        padding: 0 0 0 1rem;
        margin: 0;
    }

    #dashboard-my-hearing .my-hearing-description ul li {
        list-style: none;
    }

    #dashboard-my-hearing .my-hearing-description ul li::before {
        content: '';
        display: inline-block;
        width: 0.7rem;
        height: 0.7rem;
        -moz-border-radius: 0.7rem;
        -webkit-border-radius: 0.7rem;
        border-radius: 0.7rem;
        background-color: var(--ha-primary-light-grey);
        margin: 0 0.25rem 0 -1rem;
    }
    
    #dashboard-my-hearing ul.my-hearing-legend {
        display: flex;
        padding: 0;
    }

    #dashboard-my-hearing ul.my-hearing-legend li {
        padding: 0;
        margin: 0 1rem 0 0;
        flex-wrap: nowrap;
        list-style: none;
        display: flex;
        align-items: center;
    }

    #dashboard-my-hearing ul.my-hearing-legend li::before {
        content: '';
        display: inline-block;
        width: 0.7rem;
        height: 0.7rem;
        -moz-border-radius: 0.7rem;
        -webkit-border-radius: 0.7rem;
        border-radius: 0.7rem;
        background-color: var(--ha-primary-light-grey);
        margin: 0 0.25rem 0 0;
    }

        #dashboard-my-hearing .my-hearing-description ul li.legend-normal::before,   
        #dashboard-my-hearing ul.my-hearing-legend li.legend-normal::before {
            background-color: var(--ha-secondary-green);
        }
        #dashboard-my-hearing .my-hearing-description ul li.legend-mild::before,
        #dashboard-my-hearing ul.my-hearing-legend li.legend-mild::before {
            background-color: var(--ha-primary-blue-40);
        }
        #dashboard-my-hearing .my-hearing-description ul li.legend-moderate::before,
        #dashboard-my-hearing ul.my-hearing-legend li.legend-moderate::before {
            background-color: var(--ha-primary-blue-60);
        }
        #dashboard-my-hearing .my-hearing-description ul li.legend-severe::before,
        #dashboard-my-hearing ul.my-hearing-legend li.legend-severe::before {
            background-color: var(--ha-primary-blue-80);
        }
        #dashboard-my-hearing .my-hearing-description ul li.legend-profound::before,
        #dashboard-my-hearing ul.my-hearing-legend li.legend-profound::before {
            background-color: var(--ha-primary-blue);
        }





/* DASHBOARD: My Transations */


/* DASHBOARD HA Card */   
#dashboard-my-ha-card {
}
    #dashboard-my-ha-card .ha-card {
        background-color: var(--ha-primary-blue);
        color: var(--ha-primary-white);
        border-radius: 1rem;
    }

    #dashboard-my-ha-card #qrcode img, 
    #dashboard-my-ha-card #qrcode svg {
        vertical-align: middle;
        width: 100%;
        min-width: 150px;
        height: auto;
    }



/*==================== COMPONENTS ====================*/






/************************************************************/
/* VIEW: TABLET / DESKTOP                                   */
@media (min-width: 992px) {

    /*==================== PAGE LAYOUT ====================*/
    /* PAGE LAYOUT */
    .hearing-australia.page-layout {
        margin: 7rem 0;
    }

        /* PAGE: HEADER */
        .header .header-welcome {
            display: block;
            font-size: 1.5rem;
            font-weight: 500;
            color: var(--ha-primary-white);
            text-align: right;
        }

        /* HEADER: ALERTS */
        .header-alerts {
            flex-grow: 0;
        }            
        .alerts-panel {
            width: 400px;
            top: 100%;
            /* right: 0; */
        }


        /* PAGE: HEADER PANEL*/
        .hearing-australia .header-panel {
            border-radius: 0 0 2rem 2rem;
        }        
            .hearing-australia .header-panel .custom-container {
                padding-top: 1rem;
            }

                /* NAV BAR: Logo */
                .hearing-australia .custom-container .navbar-brand  .header-logo {
                    height: 3rem;
                }


        /* PAGE: NAV BAR */
        .hearing-australia .navbar-nav > li > a:hover {
            color: #fff;
            background-color: transparent;
        }


        /* PAGE: COLUMNBLOCKLAYOUT */
        /* Tablet/Desktop show 2 columns */
        .hearing-australia .column-block-layout > .column-block {
            columns: 2;
            gap: 2rem;
        }



    /* COMMONS: Appointment Booking */
    .appointment-booking { 

    }

        .appointment-booking .clinician-selector {
        }

        .appointment-booking .clinician-selector .btn-check:checked+.btn, 
        .appointment-booking .clinician-selector .btn.active, 
        .appointment-booking .clinician-selector .btn.show, 
        .appointment-booking .clinician-selector .btn:first-child:active, 
        .appointment-booking .clinician-selector :not(.btn-check)+.btn:active {
        }
        
        .appointment-booking .clinician-selector .btn-check+.btn:hover {
        }

        .appointment-booking .clinician-selector .btn {
        }

        .appointment-booking .appointment-selector {
            margin-bottom: 1rem;
        }

        .appointment-booking .appointment-selector .selector-flexbox {
            display: flex;
        }


        .appointment-booking .appointment-selector .selector-flexbox .selector-date {
            flex-direction: column;
            flex: 1;
        }
        
        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-header {
            border-bottom: solid 1px var(--table-border-color);
            border-right: none;
        }
        
        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-body {
            align-self: normal;
            align-content: start;
            min-height: unset;
        }

        .appointment-booking .appointment-selector .selector-flexbox .selector-date.weekend .selector-date-header,
        .appointment-booking .appointment-selector .selector-flexbox .selector-date.weekend .selector-date-body {
            text-align: center;
        }

        .appointment-booking .appointment-selector .selector-flexbox .selector-date .selector-date-body button {
        }

        .appointment-booking .appointment-selector .row-toggler {
            display: block;  /* show on desktop */
        }

    /*==================== COMMONS ====================*/
    

    /* Dashboard console container */
        /* makes the OTB columns side by side */
        [id^="dashboard-"] .console .entity-form td.cell {
            padding: 0 1rem 0.5rem !important;
            display: flex;
        }

        [id^="dashboard-"] .console .entity-form td.cell .table-info {
            width: 30%;
            padding: 0;
            flex-shrink: 0;
            align-content: center;
        }



    

        
    /*==================== DASHBOARD ====================*/

    
    /*==================== COMPONENTS ====================*/

}







/************************************************************/
/* VIEW: HIGH CONTRAST                                      */
@media screen and (-ms-high-contrast: active) {
    .hearing-australia .navbar-toggle .icon-bar {
        background-color: #fff; 
    } 
}
