/* Custom Color Scheme Override - #0B3D91 and #00C2FF */

/* Override root CSS variables */
:root {
    --theme-color: #00C2FF !important;
    /* Cyan Blue */
    --theme-color2: #0B3D91 !important;
    /* Dark Blue */
    --theme-color3: #00C2FF !important;
    /* Cyan Blue */
    --title-color: #0B3D91 !important;
    /* Dark Blue for titles */
}

/* Override all body theme classes */
body,
body.theme-blue,
body.theme-blue2,
body.theme-blue3,
body.theme-blue4,
body.theme-blue5,
body.theme-green,
body.bg-dark,
body.theme2,
body.theme3,
body.theme4,
body.theme5,
body.theme6,
body.theme7,
body.theme8,
body.theme9,
body.bg-como {
    --theme-color: #00C2FF !important;
    --theme-color2: #0B3D91 !important;
    --theme-color3: #00C2FF !important;
}

/* Buttons and Links */
.th-btn,
.th-btn.btn-gradient2,
.th-btn.style-radius {
    /* background: linear-gradient(90deg, #0B3D91 0%, #00C2FF 100%) !important; */
    color: #ffffff !important;
}

.th-btn:hover,
.th-btn.btn-gradient2:hover,
.th-btn.style-radius:hover {
    background: linear-gradient(90deg, #00C2FF 0%, #0B3D91 100%) !important;
    color: #ffffff !important;
}

/* Links - General */


a:hover {
    color: #00C2FF !important;
    /* Cyan blue on hover */
}

/* Text theme color */
.text-theme,
.text-theme2,
.text-theme3 {
    color: #00C2FF !important;
}

/* Background colors */
.bg-theme,
.bg-theme2,
.bg-theme3 {
    background-color: #00C2FF !important;
}

/* Borders */
.border-theme {
    border-color: #00C2FF !important;
}

/* Loaders and Preloader */
.th-preloader .txt-loading .characters {
    color: #00C2FF !important;
}

.preloader {
    background-color: #0B3D91 !important;
}

/* Icons and Icon Buttons */
.icon-btn,
.play-btn {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

.icon-btn:hover,
.play-btn:hover {
    background-color: #0B3D91 !important;
    color: #ffffff !important;
}

/* Service Items */
.service-item3:hover {
    background: linear-gradient(135deg, #0B3D91 0%, #00C2FF 100%) !important;
}

.service-item3 .box-number {
    color: #00C2FF !important;
}

.service-item3:hover .box-number,
.service-item3:hover .box-title {
    color: #ffffff !important;
    /* White text for number and title on hover */
}

.service-item3:hover .box-list span {
    color: #000000 !important;
    /* Black text for span tags on hover */
}

/* Process Cards */
.process-card4:hover {
    background: linear-gradient(135deg, #0B3D91 0%, #00C2FF 100%) !important;
}

.process-card4:hover .box-title,
.process-card4:hover .process-card4_text {
    color: #ffffff !important;
    /* White text on hover */
}

.process-card4_icon {
    background-color: #00C2FF !important;
}

/* Project Cards */
.project-card4:hover .project-content-wrap {
    background: linear-gradient(135deg, #0B3D91 0%, #00C2FF 100%) !important;
}

/* Testimonial Stars */
.testi-box3_review i,
.hero_review i {
    color: #00C2FF !important;
}

/* Form Elements */
input:focus,
textarea:focus,
select:focus {
    border-color: #00C2FF !important;
}

.form-control:focus {
    border-color: #00C2FF !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 194, 255, 0.25) !important;
}

/* Contact Form Button */
.contact-form4 button[type="submit"],
.contact-form4 .th-btn {
    background: linear-gradient(90deg, #0B3D91 0%, #00C2FF 100%) !important;
}

.contact-form4 button[type="submit"]:hover,
.contact-form4 .th-btn:hover {
    background: linear-gradient(90deg, #00C2FF 0%, #0B3D91 100%) !important;
}

/* Navigation Menu - Hover States */
.main-menu ul li a:hover,
.main-menu ul li.current-menu-item>a,
.th-mobile-menu ul li a:hover,
.th-mobile-menu ul li.current-menu-item>a {
    color: #00C2FF !important;
    /* Cyan blue on hover and active */
}

/* Sub-titles and Headings */
.sub-title,
.sub-title8,
.sub-title.style2 {
    color: #00C2FF !important;
}

.sec-title span,
.hero-title span {
    color: #00C2FF !important;
}

/* Blog Cards */
.blog-box2:hover .box-title a {
    color: #00C2FF !important;
}

.blog-tag {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

/* Line Buttons */
.line-btn,
.line-btn i {
    color: #00C2FF !important;
}

.line-btn:hover {
    color: #0B3D91 !important;
}

/* Accordion */
.accordion-button:not(.collapsed) {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

.accordion-button:focus {
    border-color: #00C2FF !important;
    box-shadow: 0 0 0 0.2rem rgba(0, 194, 255, 0.25) !important;
}

/* Slider Navigation */
.slider-arrow,
.slider-prev,
.slider-next {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

.slider-arrow:hover,
.slider-prev:hover,
.slider-next:hover {
    background-color: #0B3D91 !important;
}

/* Pagination */
.slider-pagination .swiper-pagination-bullet-active {
    background-color: #00C2FF !important;
}

/* Social Icons */
.th-social a {
    color: #00C2FF !important;
}

.th-social a:hover {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

/* Feature Items */
.feature-item2 .box-icon {
    background-color: #00C2FF !important;
}

/* Counter Numbers */
.counter-number {
    color: #00C2FF !important;
}

/* Experience Badge */
.th-experience2 {
    background: linear-gradient(135deg, #0B3D91 0%, #00C2FF 100%) !important;
}

/* Discount/Hire Button */
.discount-wrapp .play-btn,
.discount-wrapp2 .play-btn {
    background-color: #00C2FF !important;
}

.discount-wrapp .play-btn:hover,
.discount-wrapp2 .play-btn:hover {
    background-color: #0B3D91 !important;
}

/* Header Info Link - Phone Number */
.header-info_link a {
    color: #ffffff !important;
    /* White color for phone number */
}

.header-info_link a:hover {
    color: #00C2FF !important;
    /* Cyan blue on hover */
}

/* Brand Items */
.brand-item:hover img {
    filter: brightness(0) saturate(100%) invert(59%) sepia(89%) saturate(2477%) hue-rotate(166deg) brightness(101%) contrast(101%) !important;
}

/* Contact Info */
.contact-info2 a:hover {
    color: #00C2FF !important;
}

/* Hero Section */
.hero-style23 .hero-title .text-theme {
    color: #00C2FF !important;
}

/* Box Titles on Hover */
.box-title a:hover {
    color: #00C2FF !important;
}

/* Style Border Buttons */
.th-btn.style-border2 {
    border-color: #00C2FF !important;
    color: #00C2FF !important;
}

.th-btn.style-border2:hover {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

/* Gradients */
.btn-gradient,
.btn-gradient2 {
    background: linear-gradient(90deg, #0B3D91 0%, #00C2FF 100%) !important;
}

.btn-gradient:hover,
.btn-gradient2:hover {
    background: linear-gradient(90deg, #00C2FF 0%, #0B3D91 100%) !important;
}

/* Loading Animation */
@keyframes pulse-color {

    0%,
    100% {
        color: #00C2FF;
    }

    50% {
        color: #0B3D91;
    }
}

.txt-loading .characters {
    animation: pulse-color 2s ease-in-out infinite !important;
}

/* Scrollbar */
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #0B3D91 0%, #00C2FF 100%) !important;
}

/* Selection */
::selection {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

::-moz-selection {
    background-color: #00C2FF !important;
    color: #ffffff !important;
}

/* Cursor Custom */
.cursor,
.cursor2 {
    border-color: #00C2FF !important;
}

/* Additional hover effects */
.service-button .icon-btn:hover,
.project-content span:hover {
    color: #00C2FF !important;
}

/* FAQ Active State */
.accordion-card.style8 .accordion-button:not(.collapsed) {
    background: linear-gradient(90deg, #0B3D91 0%, #00C2FF 100%) !important;
    color: #ffffff !important;
}

/* Blog Meta Links */
.blog-meta a:hover {
    color: #00C2FF !important;
}

/* Header Button */
.header-button .th-btn {
    background: linear-gradient(90deg, #0B3D91 0%, #00C2FF 100%) !important;
}

.header-button .th-btn:hover {
    background: linear-gradient(90deg, #00C2FF 0%, #0B3D91 100%) !important;
}