/* ==========================================================================
   Codontix Brand Color Overrides
   Loaded AFTER style.css to override medicalcenter template defaults.

   Color Mappings:
     #0f61ef  (primary theme)       -> #4E9EDA
     #1f2b7b  (dark accent)         -> #3A7CB8
     #0d4ac4  (button bg)           -> #4E9EDA
     #396cf0, #3957ff (hero/footer) -> #4E9EDA
     gradient rgb(36,192,241)->rgb(76,154,254)
           -> rgb(78,158,218)->rgb(58,124,184)
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Header Navigation
   -------------------------------------------------------------------------- */
.main-menu ul li a:hover,
.main-menu ul li .active {
    color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   2. Header Button
   -------------------------------------------------------------------------- */
.header-btn {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.header-btn:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   3. Hero Section
   -------------------------------------------------------------------------- */
.slider-area .hero__caption h1 {
    font-size: 7rem;
}

.slider-area .hero__caption {
    min-width: 600px;
}

@media (max-width: 767px) {
    .slider-area .hero__caption {
        min-width: auto;
        padding-bottom: 40px;
    }
    .slider-area .single-slider {
        height: auto !important;
        min-height: 500px;
        padding: 60px 0;
    }
    .slider-area .hero__caption h1 {
        font-size: 4rem;
    }
    .slider-area .hero__caption .cd-headline {
        font-size: 1.8rem !important;
    }
    .slider-area .hero__caption p {
        font-size: 1.5rem;
    }

    /* Comparison table — prevent horizontal scroll, wrap text instead */
    .table-responsive {
        overflow-x: visible !important;
    }
    .table-responsive .table {
        table-layout: fixed !important;
        width: 100% !important;
        font-size: 16px !important;
    }
    .table-responsive .table td:first-child,
    .table-responsive .table th:first-child {
        white-space: normal !important;
        word-break: keep-all !important;
        width: 26% !important;
        padding: 10px 8px !important;
    }
    .table-responsive .table td,
    .table-responsive .table th {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
        padding: 10px 8px !important;
    }

    /* FAQ accordion — smaller question text, allow wrapping */
    #faqAccordion .btn {
        font-size: 14px !important;
        white-space: normal !important;
        text-align: left !important;
    }

    /* Blog tags — own line above title */
    .blog_details .blog-info-link {
        display: block !important;
        overflow: hidden !important;
        margin-bottom: 10px !important;
    }
    .blog_details .blog-info-link li {
        float: none !important;
        display: block !important;
    }
    .blog_details .blog-info-link + a {
        display: block !important;
        clear: both !important;
    }

    /* CTA buttons — fit both on one line */
    .section-padding2 .about-btn,
    .section-padding2 .hero-btn {
        padding: 10px 16px !important;
        font-size: 16px !important;
    }
    .section-padding2 .about-btn {
        margin-right: 8px !important;
    }

    /* Center the Contact Info footer column */
    .footer-area .single-footer-caption .footer-tittle {
        text-align: center;
    }
    .footer-area .footer-social {
        width: 100% !important;
        justify-content: center !important;
    }
    .footer-area .footer-social a {
        padding-right: 0 !important;
    }

    .ti-arrow-right {
        left: 0px !important;
    }

    .btn {
        padding: 18px 40px 18px 40px !important;
    }

    /* Contact page — center contact info block */
    .media.contact-info {
        flex-direction: column !important;
        align-items: center !important;
        text-align: center !important;
    }
    .media.contact-info .media-body {
        text-align: center !important;
    }
    .contact-info__icon {
        padding-bottom: 8px !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .slider-area .hero__caption h1 {
        font-size: 4.5rem;
    }
    .slider-area .hero__caption .cd-headline {
        font-size: 1.8rem !important;
    }
}

.hero__caption > span {
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center;
    gap: 15px;
    padding-left: 0 !important;
}

.hero__caption > span::before {
    content: "" !important;
    position: static !important;
    transform: none !important;
    width: 70px !important;
    height: 2px !important;
    background: #4E9EDA !important;
    flex-shrink: 0;
}

.hero__caption > span::after {
    content: "";
    width: 70px;
    height: 2px;
    background: #4E9EDA;
    flex-shrink: 0;
}

@media (max-width: 575px) {
    .hero__caption > span::before,
    .hero__caption > span::after {
        width: 50px !important;
    }
}

/* Remove inherited hero-caption span styles from the animated words wrapper */
.hero__caption .cd-words-wrapper {
    padding-left: 0 !important;
    margin-bottom: 0 !important;
    font-size: inherit !important;
    letter-spacing: normal !important;
    text-transform: none !important;
}

.hero__caption .cd-words-wrapper::before {
    display: none !important;
}

/* Left-align all rotating words consistently */
.hero__caption .cd-words-wrapper b {
    text-align: left !important;
}

@media (min-width: 2020px) {
    .slider-area .container {
        padding-left: 0;
    }
    .slider-area .hero__caption {
        transform: translateX(-10vw);
    }
}

.hero-btn {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.hero-btn:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   4. Section Titles
   -------------------------------------------------------------------------- */
.section-tittle {
    text-align: center !important;
}

.section-tittle h2 {
    text-align: center !important;
}

.section-tittle span {
    color: #4E9EDA !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 15px;
    padding-left: 0 !important;
}

.section-tittle span::before {
    position: static !important;
    transform: none !important;
    flex-shrink: 0;
    background: #4E9EDA !important;
}

.section-tittle span::after {
    content: "";
    width: 50px;
    height: 2px;
    background: #4E9EDA;
    flex-shrink: 0;
}

@media (max-width: 575px) {
    .section-tittle span::before,
    .section-tittle span::after {
        width: 40px !important;
    }
}

/* --------------------------------------------------------------------------
   5. About Buttons
   -------------------------------------------------------------------------- */
.about-btn {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
    padding: 19px 22px 19px 20px !important;
}

.about-btn:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   6. Department Tabs
   -------------------------------------------------------------------------- */
.depart_ment_tab .nav-link.active,
.depart_ment_tab .nav-link:hover {
    background: linear-gradient(to right, #4E9EDA, #3A7CB8) !important;
    background: -webkit-linear-gradient(to right, #4E9EDA, #3A7CB8) !important;
    border-color: #4E9EDA !important;
    color: #fff !important;
}

.depart_ment_tab .nav-link.active i,
.depart_ment_tab .nav-link:hover i {
    color: #fff !important;
}

.depart_ment_tab .nav-link:hover h4 {
    color: #fff !important;
}

.depart_ment_tab .tab-content .dept_info {
    background: linear-gradient(to right, #4E9EDA, #3A7CB8) !important;
    padding: 30px;
    border-radius: 4px;
}

.depart_ment_tab .tab-content .dept_info h2,
.depart_ment_tab .tab-content .dept_info h3,
.depart_ment_tab .tab-content .dept_info h4,
.depart_ment_tab .tab-content .dept_info p,
.depart_ment_tab .tab-content .dept_info li,
.depart_ment_tab .tab-content .dept_info a {
    color: #fff !important;
}

/* Department tab equal sizing */
.depart_ment_tab .nav {
    display: flex !important;
    flex-wrap: wrap !important;
}

.depart_ment_tab .nav-item {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    margin: 0 10px !important;
}

.depart_ment_tab .nav-item:first-child {
    margin-left: 0 !important;
}

.depart_ment_tab .nav-item:last-child {
    margin-right: 0 !important;
}

/* Non-selected tab: light blue background */
.depart_ment_tab .nav-link {
    background: #eaf4fb !important;
}

/* Allow line breaks in tab titles */
.depart_ment_tab .nav li a h4 br {
    display: inline !important;
}

/* Department tab PNG icons — no color filter, just display the black outline PNGs as-is */
.dept-icon {
    width: 64px;
    height: 64px;
    object-fit: contain;
    display: block;
}

.depart_ment_tab .nav-link.active .dept-icon,
.depart_ment_tab .nav-link:hover .dept-icon {
    filter: brightness(0) invert(1);
}

.dep-btn {
    color: #4E9EDA !important;
}

.dep-btn:hover {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   7. Testimonial Section
   -------------------------------------------------------------------------- */
.testimonial-caption .testimonial-top-cap p {
    color: #4E9EDA !important;
}

.testimonial-caption .testimonial-top-cap span,
.testimonial-caption .testimonial-top-cap .quotes-icon {
    color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   8. Team Social Hover
   -------------------------------------------------------------------------- */
.team-social a:hover {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   9. Blog Dates & Read More
   -------------------------------------------------------------------------- */
.date-info span {
    background: #4E9EDA !important;
}

.blog_item_date,
.blog_item_date:hover {
    background: #4E9EDA !important;
    text-decoration: none;
    opacity: 1;
}

.read-more1:hover {
    color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   10. Footer
   -------------------------------------------------------------------------- */
.footer-area .footer-number h4 span {
    color: #4E9EDA !important;
}

.footer-social a:hover {
    color: #4E9EDA !important;
}

.newsletter-submit,
.email_icon {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.newsletter-submit:hover,
.email_icon:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

.footer-area a:hover {
    color: #4E9EDA !important;
}

.footer-tittle ul li a {
    font-size: 16px !important;
    font-weight: 600 !important;
}

.footer-tittle h4 {
    font-size: 18px !important;
}

.footer-logo img {
    max-width: 120px !important;
    height: auto !important;
}

.footer-padding {
    padding-top: 60px !important;
    padding-bottom: 20px !important;
}

.footer-area .footer-bottom {
    padding-top: 15px !important;
    padding-bottom: 20px !important;
}

/* --------------------------------------------------------------------------
   11. Preloader
   -------------------------------------------------------------------------- */
.preloader-circle {
    border-top-color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   12. Back to Top
   -------------------------------------------------------------------------- */
#back-top,
#back-top a,
#scrollUp {
    background: #4E9EDA !important;
}

#back-top:hover,
#back-top a:hover,
#scrollUp:hover {
    background: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   13. Pricing Cards (Custom)
   -------------------------------------------------------------------------- */
.pricing-card.featured {
    border-top: 4px solid #4E9EDA !important;
}

.pricing-card.featured .pricing-btn,
.pricing-card .pricing-btn:hover {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   14. Blog Sidebar / Boxed Buttons
   -------------------------------------------------------------------------- */
.btn_1.boxed-btn,
.button-contactForm,
.primary-bg {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.btn_1.boxed-btn:hover,
.button-contactForm:hover,
.primary-bg:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   15. Contact Section
   -------------------------------------------------------------------------- */
.contact-section .alert {
    font-size: 16px !important;
}

.contact-section .form-control {
    font-size: 18px !important;
}

.contact-section .form-control.error {
    border-color: #4E9EDA !important;
}

.contact-section label.error {
    color: #4E9EDA !important;
    font-size: 14px;
    margin-top: 5px;
}

.button-contactForm {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
    color: #fff !important;
}

.button-contactForm:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   16. Hero Page Banner (slider-area2)
   -------------------------------------------------------------------------- */
.slider-area2 {
    background: radial-gradient(circle at center, #e7f0fd 0%, #f1f6fc 100%) !important;
}

.slider-height2 {
    height: 140px !important;
}

.slider-area2 .hero-cap h2 {                                                                                                                                                                                                                                     418 +    color: #2d72a7 !important;
    color: #2d72a7 !important;
}                                                                                                                                                                                                                                                                   

.section-padding2 {
    padding-top: 150px !important;
}

.blog_item_img img.card-img {
    height: 350px;
    object-fit: cover;
    object-position: center 18%;
}

/* Blog post hero banner — show full image without aggressive cropping */
.blog-hero-banner {
    width: 100%;
}

.blog-hero-banner img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    object-position: center 30%;
}

/* --------------------------------------------------------------------------
   17. Pagination Active
   -------------------------------------------------------------------------- */
.page-item.active .page-link {
    background-color: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.page-link:hover {
    color: #4E9EDA !important;
}

/* --------------------------------------------------------------------------
   18. Submit / Action Buttons
   -------------------------------------------------------------------------- */
.submit-info .btn,
.contact-form-main .btn {
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
}

.submit-info .btn:hover,
.contact-form-main .btn:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   19. General Anchor Hover in Content Areas
   -------------------------------------------------------------------------- */
.blog_right_sidebar a:hover,
.single-post-area a:hover,
.content-area a:hover,
.main-content a:hover {
    color: #4E9EDA !important;
}

.btn_1.boxed-btn {
    color: #fff !important;
}

.btn_1.boxed-btn:hover,
.btn_1.boxed-btn:active {
    color: #fff !important;
    background: #3A7CB8 !important;
}

.single-post-area div[style*="border-left"] {
    font-size: 18px !important;
}

.single-post-area .single-post p {
    font-size: 18px !important;
}

.generic-blockquote {
    font-size: 24px !important;
}

.blog_details h2 {
    font-size: 32px !important;
}

.brand-mention {
    font-weight: 700;
    color: #2d72a7;
}

.tag_cloud_widget .list a {
    cursor: pointer;
}

.tag_cloud_widget .list a:hover,
.tag_cloud_widget .list a.active {
    background: #4E9EDA !important;
    color: #fff !important;
}

.cat-list .d-flex p:last-child {
    margin-left: 5px;
}

.cat-filter.active p {
    color: #4E9EDA !important;
    font-weight: 700;
}

.search_widget .input-group-append .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #4E9EDA !important;
    border-color: #4E9EDA !important;
    color: #fff !important;
}

.search_widget .input-group-append .btn i {
    left: 0 !important;
}

.search_widget .input-group-append .btn:hover {
    background: #3A7CB8 !important;
    border-color: #3A7CB8 !important;
}

/* --------------------------------------------------------------------------
   20. Department Active Tab Icon
   -------------------------------------------------------------------------- */
.depart_ment_tab .nav-link.active i,
.depart_ment_tab .nav-link.active span {
    color: #fff !important;
}

/* --------------------------------------------------------------------------
   Gradient Overrides (global)
   Replace original rgb(36,192,241)->rgb(76,154,254) gradients
   -------------------------------------------------------------------------- */
.gradient-bg,
.btn-gradient {
    background: linear-gradient(to right, rgb(78, 158, 218), rgb(58, 124, 184)) !important;
    background: -webkit-linear-gradient(to right, rgb(78, 158, 218), rgb(58, 124, 184)) !important;
}

/* --------------------------------------------------------------------------
   FAQ Accordion
   -------------------------------------------------------------------------- */
#faqAccordion .btn[aria-expanded="true"] .faq-icon {
    transform: rotate(45deg);
}

#faqAccordion .card-body,
#faqAccordion .card-body p,
#faqAccordion .card-body li,
#faqAccordion .card-body ul {
    font-size: 16px !important;
}

#faqAccordion .btn:hover {
    background: #345f8a !important;
}

#faqAccordion .btn:focus {
    box-shadow: none;
    outline: none;
}

/* --------------------------------------------------------------------------
   Utility Classes
   -------------------------------------------------------------------------- */
.bg-brand {
    background-color: #4E9EDA !important;
}

.text-brand {
    color: #4E9EDA !important;
}

.border-brand {
    border-color: #4E9EDA !important;
}

/* ── Landing header brand (matches intake logo style) ────────── */
.landing-brand {
    display: flex !important;
    align-items: center;
    gap: 10px;
    text-decoration: none !important;
    white-space: nowrap;
    flex-shrink: 0;
}

.landing-brand:hover {
    text-decoration: none !important;
}

.landing-brand-icon {
    width: 54px !important;
    height: 54px !important;
    object-fit: contain;
    flex-shrink: 0;
}

.landing-brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1;
    gap: 4px;
    flex-shrink: 0;
}

.landing-brand-name {
    font-family: 'Nunito', 'Segoe UI', sans-serif;
    font-size: 2rem;
    font-weight: 900;
    letter-spacing: 0.1em;
    color: #1a2a3a;
    white-space: nowrap;
}

.landing-brand-accent {
    color: #2d72a7;
}

.landing-brand-tagline {
    font-family: 'Nunito', 'Segoe UI', sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    letter-spacing: 0.26em;
    color: #1d3383;
    text-transform: uppercase;
    padding-left: 15px;
    white-space: nowrap;
}

/* Scale down on smaller desktops / tablets */
@media (max-width: 1199px) {
    .landing-brand-icon {
        width: 40px !important;
        height: 40px !important;
    }
    .landing-brand-name {
        font-size: 1.4rem;
    }
    .landing-brand-tagline {
        font-size: 1rem;
        padding-left: 10px;
    }
}

@media (max-width: 991px) {
    .landing-brand-icon {
        width: 34px !important;
        height: 34px !important;
    }
    .landing-brand-name {
        font-size: 1.4rem;
    }
    .landing-brand-tagline {
        font-size: 1rem;
        padding-left: 8px;
    }
}

/* Keep email addresses lowercase in footer */
.footer-tittle ul li a[href^="mailto:"] {
    text-transform: lowercase;
}