/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
for details on configuring this project to bundle and minify static web assets. */

/* ---------------- SL20XX STYLES ---------------- */
body.redesign {
    background: none !important;
    font-family: "Manrope";
}
body.redesign:after {
    content: '';
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    z-index: -10;
    background: linear-gradient(235deg, #E5F3FE 0%, #FFFFFF 100%);
}
body.redesign .container {
    max-width: unset;
    padding: 0;
}
body.redesign nav > div:last-of-type {
    z-index: 500;
}
body.redesign h1, body.redesign .report-header-style3 {
    font-size: 2.625rem !important;
    font-weight: 700;
    line-height: 3.1rem;
    color: #000000;
}
body.redesign h2 {
    color: #000000;
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 2rem !important;
}
body.redesign h3 {
    color: #000000;
    margin-bottom: 2rem !important;
}
body.redesign h4 {
    margin-bottom: .5rem !important;
    font-size: 1.35rem;
    font-weight: 600;
}
body.redesign h4.blue {
    color: #356782;
}
body.redesign .note {
    display:block;
}
body.redesign .flex {
    display: flex;
}
body.redesign p b {
    font-weight: 700;
}
body.redesign .flex.align-center {
    align-items: center !important;
}
body.redesign .flex.align-bottom {
    align-items: end;
}
body.redesign .report-header-style3 {
    position: relative;
    background: none;
    text-align: left;
    /* padding-left: 2rem; */
    padding: 0;
    color: #356782;
    margin: 0 auto 3rem auto;
}
body.redesign ul.dna-bullet {
    position: relative;
    list-style: none;
}
/* body.redesign .report-header-style3:after, */
body.redesign ul.stylized li:before,
body.redesign .note:before {
    content: '';
    position: absolute;
    background: #e8e8e8;
    border-radius: 3rem;
    width: 8px;
    left: 0;
    top: 10px;
    bottom: 10px;
}

    body.redesign ul.stylized.dna-bullet ol {
        list-style-type: decimal !important;
        padding-left: 2em !important;
        margin-left: 0 !important;
    }

body.redesign ul.stylized.dna-bullet ol li::before {
    content: none !important;
    background: none !important;
}

        body.redesign ul.stylized.dna-bullet ol li {
            list-style-type: decimal !important;
            display: list-item !important;
        }

body.redesign .note:before {
    top: 0;
    bottom: 0;
    background: #356782;
}
body.redesign .blue .note:before {
    background: rgba(255,255,255,.25);
}
/* body.redesign section:not(.white) .report-header-style3:after, */
body.redesign section:not(.white) ul.stylized:not(.dna-bullet) li:before {
    background: #DBE9F4;
}
body.redesign p {
    line-height: 2rem;
    font-weight: 400;
}
body.redesign b {
    font-weight: 700;
}
body.redesign p:not(:last-of-type) {
    margin-bottom: 2rem !important;
}
body.redesign p:last-of-type, body.redesign li:last-of-type {
    margin-bottom: 0 !important;
}
body.redesign br {
    /* display: none; */
}
body.redesign .no-margin {
    margin: 0;
}
body.redesign img.small {
    max-width: 120px !important;
}
body.redesign img.medium {
    max-width: 150px !important;
}
body.redesign section {
    padding: 4rem 2rem;
}
body.redesign section.white {
    background: white;
}
body.redesign section.blue {
    background: #356782;
    color: white;
}
body.redesign section.blue a {
    color: #fff;
    font-weight: 600;
    text-decoration: underline;
}
body.redesign section.centered {
    text-align: center;
}
body.redesign section.no-padding {
    padding-top: 0;
}
body.redesign section.blue h2,
body.redesign section.blue h3 {
    color: white;
}
body.redesign section > * {
    max-width: 1140px;
    margin: auto;
}
body.redesign section.quote {
    background-color: #356782;
    color: white;
    padding-bottom: 6rem;
}
body.redesign section.quote h1,
body.redesign section.quote h2,
body.redesign section.quote h3 {
    color: white;
}
body.redesign section.quote h3 {
    margin-bottom: 2rem;
}
body.redesign section.quote span {
    float:right;
}
body.redesign .content.flex {
    display: flex;
}
body.redesign .flex.column {
    flex-direction: column;
    align-items: start;
}
body.redesign .content .flex.column {
    flex: 1;
}
body.redesign .flex.column.bottom-align {
    height: 100%;
    align-items: end;
}
body.redesign .content img {
    height: 100%;
    margin: auto;
    max-width: 300px;
}
body.redesign .content.flex.image-right img {
    margin-left:4rem;
}
body.redesign .content.flex.image-left img {
    margin-right: 4rem;
}
body.redesign ul {
    padding: 0 0 0 2rem;
}
body.redesign li {
    position: relative;
    margin-bottom: 1.25rem;
    font-weight: 400;
}
body.redesign ul.stylized li span {
    font-weight: 600;
}
body.redesign ul.stylized li {
    list-style: none;
    position: relative;
    margin-bottom: 2rem;
    line-height: 2rem;
}
body.redesign ul.stylized li i {
    font-weight: 400;
}
body.redesign ul.stylized li:before {
    left: -2rem;
}
body.redesign ul.stylized li b:first-of-type {
    font-size: 1.2rem;
}
body.redesign ul.stylized li b:first-of-type:after,
body.redesign ul.stylized li i:last-of-type:after,
body.redesign section.quote i:last-of-type:after {
    content: "\a";
    white-space: pre;
}
body.redesign .note {
    position: relative;
    font-weight: 600;
    padding-left: 1.5rem;
}
body.redesign .note b {
    font-weight: 800;
}
body.redesign .apexcharts-canvas {
    margin: auto;
}
body.redesign .enhanced-table {
    text-align: center;
    font-palette: dark;
    border: 0;
}
body.redesign .enhanced-table td {
    border: 0;
    padding: 0 .5rem;
}
body.redesign .enhanced-table div {
    background: white;
    padding: 1.5rem 1rem;
    border-radius: 10px;
}
body.redesign .enhanced-table b {
    display: block;
    margin-bottom: .25rem;
    font-weight: 800;
    font-size: 1.5rem;
}
body.redesign .enhanced-table span {
    margin-bottom: 1rem;
    display: block;
    font-weight: 600;
}
body.redesign .enhanced-table span b {
    color: #356782;
}
body.redesign .inline-svg {
    width: 28px;
    height: 28px;
    margin-right: 10px;
}
body.redesign .results-table {
    border: none;
    border-collapse: separate;
    border-spacing: .25em;
}
body.redesign .results-table tr:nth-of-type(odd):not(:first-of-type) {
    background:#DBE9F4;
}
body.redesign .results-table tr,
body.redesign .results-table td {
    border: none;
}
body.redesign .results-table td {
    padding: 15px;
}
body.redesign .results-table td:not(:last-of-type) {
    /* border-color: fff;
    border-width: 0 10px 0 0;
    border-style: solid; */
}
body.redesign .results-table tr {
    /* border-color: fff;
    border-width: 10px 0 0 0;
    border-style: solid; */
}
body.redesign .questionnaire-header-row {
    background: #356782;
    color: white;
    border: none;
}
body.redesign .results-table label {
    margin: auto 15px auto auto;
    font-weight: 800;
    
}
body.redesign .results-table label,
body.redesign .results-table td:not(.active) svg {
    display: none;
}
body.redesign .results-table svg {
    margin: auto;
}

body.redesign .results-table .excels svg path {
    fill: #3F882F;
}
body.redesign .results-table .solid svg path {
    fill: #356782;
}
body.redesign .results-table .challenge svg path {
    fill: #AC2020;
}
body.redesign .title-page {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: auto;
}
body.redesign .title-page .left-align {
    margin: auto;
}
body.redesign .title-page img {
    margin: 4rem auto;
    width: 50%;
}
body.redesign .title-page h4 {
    margin-top: auto;
    margin-bottom: 2rem !important;
    font-size: 2rem;
}
body.redesign .title-page .note {
    border-color: black;
}
body.redesign .title-page span {
    font-size: 1.25rem;
    font-weight: 400;
    line-height: 1.5rem;
}
body.redesign .title-page h2 {
    margin: 0 .5rem 0 0;
    margin-bottom: 0 !important;
}
body.redesign .title-page .report-header-style3 {
    margin: auto;
    width: auto;
}
.hidden {
    display: none;
}
body.redesign .report-header-style3.dna-bullet:after,
body.redesign ul.dna-bullet li:before {
    background-image: url('../images/redesign/DNA_Bullet.svg');
    background-repeat: repeat-y;
    background-size: 16px;
    background-color: transparent;
    content: '';
    position: absolute;
    left: -2rem;
    width: 16px;
    top: 6px;
    bottom: 5px;
}


@media print {
    body.redesign,
    body.redesign section.blue h2,
    .questionnaire-header-row,
    body.redesign .must-read {
        color: black !important;
    }
    body.redesign h1 {
        font-size: 2.5rem;
        padding: 0;
    }
    body.redesign .report-header-style3 {
        padding-left: 0;
    }
    body.redesign .report-header-style3:after {
        display: none;
    }
    body.redesign section {
        margin: 0 5rem;
    }
    body.redesign section > * {
        max-width: unset;
    }
    body.redesign ul {
        padding: 0;
    }
    body.redesign section.quote {
        padding: 4rem 2rem 5rem 2rem;
        color: black;
        border: 1px solid #d8d8d8;
        border-left: 0;
        border-right: 0;
    }
    body.redesign .note {
        padding: 10px 15px;
        border: 1px solid #d8d8d8;
        color: black;
    }
    body.redesign .must-read,
    body.redesign .results-table tr,
    body.redesign .results-table td,
    body.redesign .enhanced-table td {
        border: 1px solid #d8d8d8;
    }
    body.redesign .results-table {
        border-spacing: 0;
        border-collapse: collapse;
    }
    body.redesign section.centered {
        text-align: left;
    }
    body.redesign ul.stylized b {
        font-size: 1.5rem !important;
    }
    body.redesign section:not(.title-redesign) h2 {
        font-size: 1.5rem;
    }
    body.redesign .must-read svg {
        display: none;
    }
    body.redesign .print-margin {
        margin-top: 0;
    }
    body.redesign:after {
        background: white !important;
    }
}

@media only screen and (max-width: 768px) {
    body.redesign table tr {
        display: flex;
        flex-direction: column;
    }
    body.redesign table td {
        margin-bottom: 1rem;
    }
    body.redesign .content.flex {
        flex-direction: column;
    }
    body.redesign section:not(.no-padding):not(.must-read) > .content.flex.image-left {
        flex-direction: column-reverse;
    }
    body.redesign .report-header-style3 {
        padding-left: 1.5rem;
    }
    body.redesign h1, body.redesign .report-header-style3 {
        font-size: 1.625rem !important;
        line-height: 2rem;
    }
    body.redesign section.no-padding .content.flex img,
    body.redesign section.must-read .content.flex img {
        margin: auto auto 2rem auto;
        width: 80%;
    }
    body.redesign section:not(.no-padding):not(.must-read) .content.flex img {
        margin: 2rem auto;
        width: 80%;
    }
    body.redesign .content img {
        margin: 2rem auto 0;
    }
    body.redesign .results-table td {
        width: 100%;
    }
    body.redesign .results-table tbody > tr {
        position: relative;
    }
    body.redesign .results-table tr:first-of-type {
        display: none;
    }
    body.redesign .results-table label {
        display: block;
    }
    body.redesign .results-table td:not(:first-of-type):not(.active) {
        padding: 0;
        margin: 0;
        display: none;
    }
    body.redesign .results-table td:first-of-type {
        margin-bottom: 0;
    }
    body.redesign .results-table td.active {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    body.redesign .results-table svg {
        margin-left: 0;
    }
    body.redesign img.small { 
        display: none;
    }
}



/* -------------- END SL20XX STYLES -------------- */

a.navbar-brand {
    white-space: normal;
    text-align: center;
    text-align: center;
    word-break: break-all;
}

/* Provide sufficient contrast against white background */
a {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    font-size: 16px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}

/* Sticky footer styles
-------------------------------------------------- */
html {
    position: relative;
    min-height: 100%;
}

body {
    /* Margin bottom by footer height */
    margin-bottom: 20px;
    /*background-image: url(../images/new-logo-2026.png);*/
    background-color: #FCFCFF;
    background-repeat: no-repeat;
    background-size: 10%;
    font-size: 18px;
}

    body.body2 {
        margin-bottom: 20px;
        margin-top: 20px;
        margin-left: 40px;
        background-color: #FCFCFF;
        background-repeat: no-repeat;
        background-image: none !important;
        font-size: 18px;
        background-size: 0% !important;
    }



.footer {
    position: absolute; /* Keeps the footer at the bottom of its container */
    bottom: 0;
    width: 100%;
    white-space: nowrap;
    line-height: 60px; /* Vertically centers the text */
    z-index: 10; /* Ensures it's above other content */
    background-color: #f8f9fa; /* Optional: Light gray background */
    text-align: center;
    border-top: 1px solid #ccc; /* Optional: Visual separation */
}

h1 {
    font-size: xx-large !important;
    display: block;
    color: darkblue;
}

/* New class to double the font size */
.double-size {
    font-size: 5rem !important; /* Approximation to double xx-large size */
}
.double2-size {
    font-size: 3rem !important; /* Approximation to double xx-large size */
}
h2 {
    font-size: x-large;
    display: block;
    color: darkblue;
}
h2.print-only
{
    display: none;
}
h3 {
    font-size: larger;
    color: navy;
}

h4 {
    font-size: large;
}

tr.oddrow td {
    background-color: #eee;
}

tr.evenrow td {
    background-color: #ddd;
}

.logo {
    position: absolute;
    right: 20px;
    top: 20px;
    display: block;
    background: url(/images//new-logo-2026.png);

}

.questionnaire-table {
    width: 90%;
    align-self: center;
    border: double;
    padding-bottom: 20px;
}

.questionnaire-header-row {
    background-color: #6B9AC4;
    color: #EFEEF1;
    align-self: center;
    font-weight: bold;
    white-space: nowrap;
}

.questionnaire-header-row-kr {
    background-color: #ff2b58;
    color: #EFEEF1;
    align-self: center;
    font-weight: bold;
}

.questionnaire-question-column {
    width: 65%;
    justify-content: left;
    align-content: start;
    padding-bottom: 1px;
    padding-top: 1px;
    display: normal;
    text-align: left;
}




.questionnaire-question-row-odd {
    padding: 3px;
    background-color: #E0E0F1;
}

.questionnaire-question-row-even {
    padding: 3px;
    background-color: #EFEEF1;
}

.questionnaire-section-title {
    font-size: large;
    color: black;
    align-self: center;
    font-weight: bold;
    padding-bottom: 10px;
}


.trait-container {
    display: flex;
    justify-content: space-between;
    margin: 20px;
    width: 90%;
}

.trait-table {
    border-collapse: collapse;
    margin-right: 10px;
    table-layout: auto;
    float: left;
}

.welcome-title {
    font-size: large;
    color: black;
    align-self: center;
    font-weight: bold;
    padding-bottom: 10px;
}

.welcome-completed {
    font-size: large;
    color: black;
    align-self: center;
    font-weight: bold;
    padding-bottom: 10px;
}

.questionnaire-error-message {
    font-size: medium;
    color: purple;
    align-self: center;
    padding: 5px;
}

.progress-bar-row {
    height: 10px;
    width: 100%;
    border: solid;
}

.progress-bar-cell-complete {
    background-color: #97D8C4;
    width: 12%;
    border: solid;
}

.progress-bar-cell-incomplete {
    background-color: #ccc;
    width: 12%;
    border: solid;
}

.progress-indicator {
    color: black;
    font-size: small;
}

.progress-bar {
}

.navigation-button {
    background-color: #4059AD;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 180px;
    color: white;
}

.results-button {
    background-color: #F43942;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 420px;
    color: white;
    -webkit-animation: glowing 1500ms infinite;
    -moz-animation: glowing 1500ms infinite;
    -o-animation: glowing 1500ms infinite;
    animation: glowing 1500ms infinite;
}

.download-button {
    background-color: #F43942;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 540px;
    color: white;
    -webkit-animation: glowing 1500ms infinite;
    -moz-animation: glowing 1500ms infinite;
    -o-animation: glowing 1500ms infinite;
    animation: glowing 1500ms infinite;
}

.print-button {
    background-color: #4239F4 !important;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 140px;
    color: white;
    -webkit-animation: glowing2 1500ms infinite;
    -moz-animation: glowing2 1500ms infinite;
    -o-animation: glowing2 1500ms infinite;
    animation: glowing2 1500ms infinite;
}

.contact-button {
    background-color: #4239F4 !important;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 140px;
    color: white;
    border-radius: 8px;
    cursor: pointer;
}

.navbar .font-button {
    font-size: 16px !important; /* Base font size for the button text */
    padding: 8px 12px !important; /* Space around the button text */
    margin: 0 4px !important; /* Space between buttons */
    cursor: pointer !important; /* Pointer cursor on hover */
    background-color: #007BFF !important; /* Primary blue color for accessibility */
    color: #FFFFFF !important; /* White text color for contrast */
    border: none !important; /* Remove default button border */
    border-radius: 5px !important; /* Rounded corners for style */
    transition: background-color 0.3s !important; /* Smooth color transition */
}

    .navbar .font-button:hover {
        background-color: #0056b3; /* Darker shade on hover */
    }

    .navbar .font-button:focus {
        outline: 2px solid #FFD700; /* Outline for accessibility focus */
    }



.results-button2 {
    background-color: #F43942;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 8px 10px;
    border: none;
    display: inline-block;
    border-radius: 6px;
    width: 420px;
    color: white;
}

.questionnaire-button {
    border: none;
    opacity: 1.0;
    background-color: transparent;
    outline: none;
}

.instructions-title {
    font-size: larger;
    color: darkslateblue;
    text-align: left;
}

.instructions-content {
    font-size: medium;
    color: black;
    text-align: left;
}

.definitions-content {
    font-size: 16px;
    font-family: Calibri, 'Trebuchet MS', sans-serif,'Gill Sans', 'Gill Sans MT',;
    color: black;
    text-align: left;
}

.definitions-title {
    font-size: large;
    text-align: left;
    font-weight: 400;
}
.definitions-title2 {
    font-size: large;
    text-align: left;
    font-weight: bold;
}
.definitions-maintitle {
    font-size: large;
    color: black;
    text-align: left;
}

.graph-title {
    font-size: 15px;
    font-weight: 200;
    color: black;
    text-align: left;
}

.user-greeting {
    font-size: medium;
    color: black;
    text-align: right;
    padding-right: 100px;
}

.progress-button-complete {
    background-color: #97D8C4;
    font-size: 10px;
    text-align: center;
    padding: 2px 2px;
    border: none;
    display: inline-block;
    border-radius: 2px;
    width: 5%;
    color: white;
}

.progress-button-incomplete {
    background-color: #EFEEF1;
    font-size: 10px;
    text-align: center;
    padding: 2px 2px;
    border: none;
    display: inline-block;
    border-radius: 2px;
    width: 5%;
    color: #444444;
}

.coupontextbox {
    font-size: 48px;
    height: 56px;
    width: 340px;
    align-content: center;
    text-align: center;
}


@-webkit-keyframes glowing2 {
    0% {
        background-color: #0000B2;
        -webkit-box-shadow: 0 0 3px #0000B2;
    }

    50% {
        background-color: #0000FF;
        -webkit-box-shadow: 0 0 40px #0000FF;
    }

    100% {
        background-color: #0000B2;
        -webkit-box-shadow: 0 0 3px #0000B2;
    }
}

@-moz-keyframes glowing2 {
    0% {
        background-color: #0000B2;
        -moz-box-shadow: 0 0 3px #0000B2;
    }

    50% {
        background-color: #0000FF;
        -moz-box-shadow: 0 0 40px #0000FF;
    }

    100% {
        background-color: #0000B2;
        -moz-box-shadow: 0 0 3px #0000B2;
    }
}

@-o-keyframes glowing2 {
    0% {
        background-color: #0000B2;
        box-shadow: 0 0 3px #0000B2;
    }

    50% {
        background-color: #0000FF;
        box-shadow: 0 0 40px #0000FF;
    }

    100% {
        background-color: #0000B2;
        box-shadow: 0 0 3px #0000B2;
    }
}

@keyframes glowing2 {
    0% {
        background-color: #0000B2;
        box-shadow: 0 0 3px #0000B2;
    }

    50% {
        background-color: #0000FF;
        box-shadow: 0 0 40px #0000FF;
    }

    100% {
        background-color: #0000B2;
        box-shadow: 0 0 3px #0000B2;
    }
}


@-webkit-keyframes glowing {
    0% {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000;
    }

    50% {
        background-color: #FF0000;
        -webkit-box-shadow: 0 0 40px #FF0000;
    }

    100% {
        background-color: #B20000;
        -webkit-box-shadow: 0 0 3px #B20000;
    }
}

@-moz-keyframes glowing {
    0% {
        background-color: #B20000;
        -moz-box-shadow: 0 0 3px #B20000;
    }

    50% {
        background-color: #FF0000;
        -moz-box-shadow: 0 0 40px #FF0000;
    }

    100% {
        background-color: #B20000;
        -moz-box-shadow: 0 0 3px #B20000;
    }
}

@-o-keyframes glowing {
    0% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }

    50% {
        background-color: #FF0000;
        box-shadow: 0 0 40px #FF0000;
    }

    100% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }
}

@keyframes glowing {
    0% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }

    50% {
        background-color: #FF0000;
        box-shadow: 0 0 40px #FF0000;
    }

    100% {
        background-color: #B20000;
        box-shadow: 0 0 3px #B20000;
    }
}


/* Container for scrollable table */
.scrollable-table-container {
    max-height: calc(100vh - 250px); /* Adjust height based on row size; 10 rows approximately */
    max-width: 100%;
    overflow-y: auto;
    border: 1px solid #ccc;
    margin-top: 10px;
    padding-bottom: 10px;
}

.scrollable-table-container2 {
    max-height: calc(100vh - 350px); /* Adjust height based on row size; 10 rows approximately */
    overflow-y: auto;
    border: 1px solid #ccc;
    margin-top: 10px;
    padding-bottom: 10px;
}

/* Basic table styling */
.scrollable-table {
    width: 100%;
    border-collapse: collapse;
}

    /* Header styling */
    .scrollable-table th {
        background-color: #f2f2f2;
        font-weight: bold;
        padding: 8px;
        border-bottom: 2px solid #ddd;
        position: sticky;
        top: 0;
        z-index: 2;
        text-align: center;
    }

    /* Row styling with alternating colors */
    .scrollable-table td {
        padding: 8px;
        border-bottom: 1px solid #ddd;
    }

    /* Alternating row colors */
    .scrollable-table tbody tr:nth-child(odd) {
        background-color: #f9f9f9;
    }

    .scrollable-table tbody tr:nth-child(even) {
        background-color: #e9e9e9;
    }


/* Basic styles for tab container and buttons */
/*.tab-container {
    display: flex;
    border-bottom: 2px solid #ccc;
}

.tab-button {
    padding: 10px 20px;
    cursor: pointer;
    background-color: #f1f1f1;
    border: none;
    outline: none;
    font-size: 16px;
    transition: background-color 0.3s;
}

    .tab-button:hover {
        background-color: #ddd;
    }

    .tab-button.active {
        background-color: #fff;
        border-bottom: 2px solid #007bff;
        color: #007bff;
    }*/


/* Tab container styling */
.tab-container {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start; /* Align buttons to the left */
    align-items: flex-start; /* Align buttons to the top */
    gap: 10px; /* Spacing between buttons */
}

.tab-button, .accordion-button {
    display: inline-flex; /* For consistent alignment */
    align-items: center; /* Center text vertically */
    justify-content: center; /* Center text horizontally */
    text-align: center; /* Center text inside the button */
    height: 40px; /* Uniform height */
    padding: 10px 15px;
    margin: 0 5px; /* Horizontal spacing */
    line-height: normal;
    border: 1px solid #ddd; /* Border for button */
    border-radius: 5px; /* Rounded corners */
    background-color: #f8f9fa; /* Default background color */
    font-weight: normal; /* Default font weight */
    transition: background-color 0.3s, font-weight 0.3s; /* Smooth transitions */
}

    /* Active state for tabs and accordion buttons */
    .tab-button.active, .accordion-button.active {
        background-color: #e9ecef;
        font-weight: bold; /* Bold font only for active state */
        border-color: #ccc; /* Slightly darker border for active state */
    }

    /* Remove hover bolding */
    .tab-button:hover, .accordion-button:hover {
        background-color: #f1f1f1; /* Slightly darker background on hover */
        cursor: pointer; /* Indicate clickable buttons */
        font-weight: normal; /* Ensure hover does not change font weight */
    }

/* Accordion content styling */
.accordion-content {
    display: none;
    background-color: white;
    padding: 10px;
    border: 1px solid #ddd;
    border-top: none;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    margin-top: 5px;
    width: auto; /* Automatically adjust width */
    max-width: 100%; /* Prevent overflow */
}

    /* Sub-tabs inside accordion */
    .accordion-content .tab-button {
        width: 100%; /* Full-width buttons inside accordion */
        margin: 5px 0; /* Vertical spacing between sub-tabs */
    }

/* Show accordion content when active */
.accordion-button.active + .accordion-content {
    display: block;
}


/* Prevent the accordion from exceeding the width of the main tab container */


.right-aligned {
    margin-left: auto; /* Push the group to the far right */
    display: flex; /* Use flexbox for horizontal alignment */
    gap: 15px; /* Add spacing between the items */
    align-items: center; /* Align vertically */
    font-size: 0.75em; /* Adjust font size (85% of the default) */
}

.gray-checkbox {
    appearance: none; /* Removes default checkbox style */
    width: 16px;
    height: 16px;
    background-color: lightgray; /* Set background color to gray */
    border: 1px solid gray;
    pointer-events: none; /* Makes it readonly */
    display: inline-block;
    position: relative;
    top: 0; /* Ensures alignment */
    z-index: 1; /* Ensures visibility over scrolling rows */
}

    /* Checked state */
    .gray-checkbox:checked::after {
        content: '';
        position: absolute;
        top: 2px;
        left: 4px;
        width: 6px;
        height: 10px;
        border: solid white;
        border-width: 0 2px 2px 0;
        transform: rotate(45deg);
    }


.report-header-style {
    background-color: #1b6ec2;
    color: white;
    width: 100%;
    text-align: left;
    padding: 2px 2px 2px 10px;
    margin: 0;
    font-size: 2em; /* Matches default h1 size */
    font-weight: bold; /* Ensures it looks like an h1 */
}

.report-header-style2 {
    background-color: #1b6ec2;
    color: white;
    width: 100%;
    text-align: left;
    padding: 2px 2px 2px 10px;
    margin: 0;
    font-size: 1.5em; /* Matches default h1 size */
    font-weight: bold; /* Ensures it looks like an h1 */
}

.report-header-style3 {
    background-color: #1b6ec2;
    color: white;
    width: 100%;
    text-align: center;
    padding: 2px 2px 2px 10px;
    margin: 0;
    font-size: 2em; /* Matches default h1 size */
    font-weight: bold; /* Ensures it looks like an h1 */
}

.custom-checkbox {
    appearance: none; /* Removes default checkbox style */
    width: 16px;
    height: 16px;
    background-color: white; /* Background color for clickable checkbox */
    border: 1px solid gray;
    cursor: pointer; /* Show pointer on hover to indicate clickability */
    display: inline-block;
    position: relative;
    transition: background-color 0.2s;
}

    /* Checked state */
    .custom-checkbox:checked {
        background-color: lightblue; /* Color for checked state */
        border-color: darkgray;
    }

        /* Checkmark style */
        .custom-checkbox:checked::after {
            content: '';
            position: absolute;
            top: 2px;
            left: 4px;
            width: 6px;
            height: 10px;
            border: solid white;
            border-width: 0 2px 2px 0;
            transform: rotate(45deg);
        }

    /* Optional: Hover effect */
    .custom-checkbox:hover {
        background-color: #f0f0f0; /* Slight background change on hover */
    }




/* Styles for tab content sections */
.tab-content {
    margin-top: 20px;
}


.tab-section {
    display: none;
}
    .tab-section .print-only {
        display: none !important;
    }

    .tab-section.active {
        display: block;
    }
        .tab-section.active .print-only {
            display: none !important;
        }

.print-only {
    display: none !important;
}

div.print-only {
    display: none !important; /* Added !important to enforce rule */
}



@media print {

    .results-table {
        font-size: 95% !important;
        width: 100% !important;
    }

        .results-table td,
        .results-table th {
            padding: 1px !important;
        }

    .questionnaire-header-row,
    .questionnaire-question-row-odd,
    .questionnaire-question-row-even {
        font-size: 95% !important;
    }

    .print-content {
        font-size: 22px; /* Larger size for printing */
    }

    .print-smaller {
        font-size: 90%;
    }

    .no-print {
        display: none;
    }

    .print-only {
        display: block !important;
        font-size: 22px; /* Larger size for printing */
    }

    .tab-section {
        display: none !important; /* Hide all sections by default during print */
    }

        .tab-section.active {
            display: block !important; /* Only show the active section during print */
        }

            .tab-section.active .print-only {
                display: block !important; /* Ensure print-only elements in active section are visible */
            }

        section.blue,
        section.blue * {
            background: white !important;
            background-color: white !important;
        }
            section.quote,
            section.quote * {
                background: white !important;
                background-color: white !important;
            }
    body {
        background-color: white !important; /* Sets the whole page background to white */
        font-size: 22px !important;
    }

    .your-print-section {
        background-color: white !important; /* Optionally target specific sections */
    }
}