﻿/* Custom Styles by [A]
@import url('/site/css/select2.min.css');*/

.post-listing-categories {
    flex-wrap: wrap;
}

.post-grid-layout .card-img, .card-img-top.card-img, .card-img-top {
    max-height: 300px;
    height: 300px;
    object-fit: cover;
}

.search-results-item p {
    font-weight: 400;
}

.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    color: #565973;
    font-size: 0.875rem;
    line-height: 1.6;
    font-family: "Roboto", san-serif;
}

    .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered .select2-selection__placeholder,
    .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option.select2-results__option--highlighted,
    .select2-container--bootstrap-5 .select2-dropdown .select2-results__options .select2-results__option {
        font-family: "Roboto", san-serif;
        font-size: 0.875rem;
    }

.select2-container--bootstrap-5 .select2-selection--single {
    padding: 0.625rem 3rem 0.625rem 1rem;
    height: 44.3px;
}

.hide-label-text, .hide-button-text {
    font-size: 0;
}

.cta .form-text {
    color: var(--si-body-color);
}

    .cta .form-text a, .a-blogpost-body a, .blog-post-author a, .blog-post-body a, .a-event-content a, .a-course-content a, .a-publication a, .a-interior a, .a-contact-form a, .a-search-form a {
        color: #512BD4;
        text-decoration: none;
    }

        .cta .form-text a:hover, .a-blogpost-body a:hover, .blog-post-author a:hover, .blog-post-body a:hover, .a-event-content a:hover, .a-course-content a:hover, .a-publication a:hover, .a-interior a:hover, .a-contact-form a:hover, .a-search-form a:hover {
            color: #311A7F;
            text-decoration: underline;
        }

        .cta .form-text a.btn-primary, .blog-post-author a.btn-primary, .blog-post-body a.btn-primary, .a-event-content a.btn-primary, .a-course-content a.btn-primary, .a-publication a.btn-primary, .a-interior a.btn-primary {
            color: #FFFFFF;
            text-decoration: none;
        }

.blog-post-author iframe, .blog-post-body iframe, .a-event-content iframe, .a-course-content iframe, .a-publication iframe, .a-interior iframe {
    aspect-ratio: 16 / 9;
    height: 100%;
    width: 100%;
}

.pagination .page-link span {
    font-size: 0;
}

/* Spin animation */
@-webkit-keyframes hero-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes hero-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.hero-animation-spin {
    -webkit-animation: hero-spin 35s linear infinite;
    animation: hero-spin 35s linear infinite;
}

/* Fade animation */
@-webkit-keyframes hero-fade {
    0%, 100% {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}


@keyframes hero-fade {
    0%, 100% {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}



.hero-animation-fade {
    -webkit-animation: hero-fade 4s ease-in infinite;
    animation: hero-fade 4s ease-in infinite;
}

.hero-animation-delay-1,
.hero-animation-delay-2,
.hero-animation-delay-3 {
    opacity: 0;
}

.hero-animation-delay-1 {
    animation-delay: .75s;
}

.hero-animation-delay-2 {
    animation-delay: 1.5s;
}

.hero-animation-delay-3 {
    animation-delay: 2s;
}
/* Spin animation */
@-webkit-keyframes hero-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes hero-spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.hero-animation-spin {
    -webkit-animation: hero-spin 35s linear infinite;
    animation: hero-spin 35s linear infinite;
}

/* Fade animation */
@-webkit-keyframes hero-fade {
    0%, 100% {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}

@keyframes hero-fade {
    0%, 100% {
        opacity: 0
    }

    50% {
        opacity: 1
    }
}

.hero-animation-fade {
    -webkit-animation: hero-fade 4s ease-in infinite;
    animation: hero-fade 4s ease-in infinite;
}

.hero-animation-delay-1,
.hero-animation-delay-2,
.hero-animation-delay-3 {
    opacity: 0;
}

.hero-animation-delay-1 {
    animation-delay: .75s;
}

.hero-animation-delay-2 {
    animation-delay: 1.5s;
}

.hero-animation-delay-3 {
    animation-delay: 2s;
}

.btn-x, .btn-globe, .btn-award {
    fill: #222222;
    transition: fill 0.3s ease;
}

    .btn-x:hover, .btn-x:focus, .btn-x:active {
        color: #fff !important;
        background-color: #222222 !important;
        fill: #FFFFFF !important;
        border-color: #222222 !important;
        box-shadow: 0 0.375rem 1.125rem -0.375rem rgba(0, 0, 0, 0.8) !important;
    }

    .btn-globe:hover, .btn-globe:focus, .btn-globe:active {
        color: #fff !important;
        background-color: #222222 !important;
        border-color: #222222 !important;
        fill: #FFFFFF !important;
        box-shadow: 0 0.375rem 1.125rem -0.375rem rgba(0, 0, 0, 0.8) !important;
    }

    .btn-award:hover, .btn-award:focus, .btn-award:active {
        color: #fff !important;
        background-color: #222222 !important;
        border-color: #222222 !important;
        fill: #FFFFFF !important;
        box-shadow: 0 0.375rem 1.125rem -0.375rem rgba(0, 0, 0, 0.8) !important;
    }

h2, .h2 {
    /*color: var(--si-brand-heading-2-color);*/
}

.a-hero-banner h1 {
    font-family: Montserrat, sans-serif;
}

.a-related-resources h3 a {
    color: var(--si-heading-color);
}

.a-btn-special {
    border: 0px solid;
    border-image: linear-gradient(128.87deg,#d600aa 14.05%,#f65163 89.3%);
    background: rgba(32, 43, 109, 1);
    background-image: linear-gradient(128.87deg,#d600aa 14.05%,#f65163 89.3%);
}

.a-btn-special-2 {
    border: 0px solid;
    border-image: linear-gradient(128.87deg,#512bd4 14.05%,#d600aa 89.3%);
    background: rgba(32, 43, 109, 1);
    background-image: linear-gradient(128.87deg,#512bd4 14.05%,#d600aa 89.3%);
}

.grecaptcha-badge {
    visibility: hidden !important;
}

@media (max-width: 767.98px) {
    .a-navbar a.dropdown-item {
        color: var(--si-nav-link-color);
    }
}

@media (max-width: 991.98px) {
    .a-highlight-resources-multiple {
        padding-bottom: 3rem !important;
    }
}

@media (min-width: 768px) {
    .a-call-to-action {
        position: relative; /* Ensure the section is a positioned parent */
    }

        /* Constrain the backdrop to the section */
        .a-call-to-action .modal-backdrop {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

        /* Position the modal absolutely within the section */
        .a-call-to-action .modal {
            position: absolute;
            top: 0;
            left: 0;
            display: none;
            overflow: hidden;
            z-index: 1000;
        }

            /* Display the modal when it's shown */
            .a-call-to-action .modal.show {
                display: block;
            }

        /* Ensure the modal dialog is centered within the section */
        .a-call-to-action .modal-dialog {
            margin: 1.75rem auto;
        }

        .a-call-to-action .modal-backdrop.fade.show {
            display: none;
        }

    .a-catalog-listing-row .modal-backdrop.fade.show {
        display: block;
    }

    body.modal-open {
        overflow: auto !important;
        padding-right: 0 !important;
    }
}

.a-invalid-tooltip {
    font-size: 0.875em;
}

.a-article h1 .text-primary, .a-article h2 .text-primary, .a-article h3 .text-primary, .a-article h4 .text-primary {
    color: inherit !important;
}

.a-form-thanks-message {
    display: none;
}

.gist-file {
    border: 1px solid !important;
    border-image: linear-gradient(to left, #743ad5, #d53a9d) !important;
    border-image-slice: 1 !important;
    border-radius: 8px !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
}

.gist-data {
    height: 300px;
}

.gist-meta {
}

/* AI Search */
.chat-container {
    height: 100vh;
    display: flex;
    flex-direction: column;
    transition: all 0.5s ease;
}

.centered-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    align-items: center;
    transition: all 0.5s ease;
}

.chat-input-container {
    position: relative;
    width: 80%;
    max-width: 800px;
    border-radius: 12px; /* Moved from .chat-textarea */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Moved from .chat-textarea */
    border: 1px solid #ccc;
}

.chat-textarea {
    resize: none;
    border-radius: 12px;
    font-size: 1.1rem;
    overflow-y: hidden;
    overflow-x: hidden;
    padding-right: 80px;
    padding-bottom: 60px; /* Adjust padding to avoid text going behind elements */
    min-height: 60px;
    max-height: 150px; /* Approximately 5 lines */
    transition: height 0.2s ease, overflow-y 0.2s ease; /* Add overflow-y transition */
    border: 0px solid transparent;
}

.submit-button {
    position: absolute;
    top: 10px;
    right: 10px;
}

.model-options {
    position: absolute;
    bottom: 10px;
    left: 10px;
    display: flex;
    gap: 8px;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 8px;
    padding: 2px 5px;
    z-index: 10;
    margin-left: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
}

.model-badge {
    cursor: pointer;
    transition: all 0.2s ease;
}

    .model-badge.selected {
        transform: scale(1.1);
        box-shadow: 0 0.5rem 1.125rem -0.5rem rgba(118, 13, 214, 0.9);
    }

.input-help {
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 0.8rem;
    color: #6c757d;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 8px;
    padding: 2px 8px;
    z-index: 10;
}

.chat-content {
    display: none;
    width: 100%;
    padding: 20px;
    overflow-y: auto;
}

.typing-animation::after {
    content: "•••";
    animation: typing 1.5s infinite;
    font-weight: bold;
}

@keyframes typing {
    0% {
        opacity: 0.3;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0.3;
    }
}

.chat-message {
    margin-bottom: 20px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.5s ease;
}

    .chat-message.show {
        opacity: 1;
        transform: translateY(0);
    }

.user-message {
    background-color: #f0f7ff;
    border-radius: 12px;
    padding: 15px;
}

.assistant-message {
    background-color: #f8f9fa;
    border-radius: 12px;
    padding: 15px;
}

.footer-input {
    padding: 20px;
    background-color: #fff;
    border-top: 1px solid #dee2e6;
    display: none;
}

.animated-text {
    display: inline;
    position: relative;
}

    .animated-text::after {
        content: "";
        position: relative;
        display: inline-block;
        background-color: #212529;
        width: 2px;
        height: 1.2em;
        margin-left: 2px;
        vertical-align: text-bottom;
        animation: blink 1s infinite;
    }

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}

.a-search-ai-button {
    font-size: 1.5rem;
}

.thank-you-card {
    max-width: 600px;
    border: none;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

    .thank-you-card .card-header {
        background: linear-gradient(135deg, #512bd4 0%, #d600aa 100%);
        color: white;
        border: none;
        padding: 1.5rem;
        margin: 0;
        width: 100%;
    }

        .thank-you-card .card-header h2 {
            color: white;
        }

    .thank-you-card .check-icon {
        background-color: #28a745;
        color: white;
        border-radius: 50%;
        width: 80px;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 40px;
        margin: 0 auto 1.5rem;
    }

.ai-chat-response .ai-chat-logo {
    width: 24px;
}

.ai-chat-response .ai-chat-body pre,
.ai-chat-response .ai-chat-body code {
    font-family: inherit; /* Use the same font as the rest of your text */
    font-size: inherit; /* Inherit font size from parent element */
    line-height: inherit; /* Match the line height for consistent spacing */
    color: inherit; /* Inherit text color */
    background-color: transparent; /* Remove any background color */
    padding: 0; /* Remove default padding */
    margin: 0,0,0,1.25rem; /* Remove default margins */
    border: none; /* Remove any borders */
    white-space: normal; /* Allow text to wrap like in a paragraph */
    box-shadow: none;
}


.a-blogpost {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.a-blogpost-body {
    padding-top: 0 !important;
}

.a-blogpost-image {
    display: none !important;
}

.a-latest-blogpost-filters .nav-tabs .nav-link {
    color: #512bd4;
    background-color: rgba(81,43,212,.05);
}

.a-latest-blogpost-filters .nav-tabs .nav-link.active, .a-latest-blogpost-filters .nav-tabs .nav-item.show .nav-link {
    color: var(--si-nav-tabs-link-active-color);
    background-color: var(--si-nav-tabs-link-active-bg);
    border-color: var(--si-nav-tabs-link-active-border-color);
}
.a-blogpost-sharing a {
    color: rgb(51, 53, 77);
}

pre {
    white-space: pre-wrap !important;
    margin: 1rem 0 !important;
}

    pre code {
        white-space: pre-wrap !important;
        margin: 1rem 0 !important;
    }