/*==================================
Theme Color All Codes Variable
==================================*/

:root {
    --theme-general-color: #0A1965;
    /* theme text color - rgb(10, 25, 101) */
}

:root {
    --theme-primary-color: #001FB9;
    /* theme primary color - rgb(0, 31, 185) for headings, buttons, menu */
}

:root {
    --theme-secondary-color: #f92044;
    /* theme secondary color - rgb(0, 31, 185) for headers and navigation */
}

:root {
    --theme-white-color: #fff;
    /* theme white font color */
}

:root {
    --theme-light-color: #F5F2EB;
    /* theme light color - Sand for menu bar background - rgb(245, 242, 235) */
}

:root {
    --theme-gray-color: #efefef;
    /* theme gray color */
}

:root {
    --theme-dark-color: #0A1965;
    /* theme dark color - text color rgb(10, 25, 101) */
}

:root {
    --theme-extra-color: #222;
    /* theme extra color */
}

:root {
    --theme-footer-color: #0a1965;
    /* theme footer color - rgb(10, 25, 101) */
}

:root {
    --theme-footer-hover-color: #f92044;
    /* theme footer link hover color - rgb(249, 32, 68) */
}

:root {
    --theme-primary-opacity-color: rgba(0, 31, 185, .8);
    /* theme primary opacity color - rgb(0, 31, 185) */
}

:root {
    --theme-secondary-opacity-color: rgba(0, 31, 185, .8);
    /* theme secondary opacity color - rgb(0, 31, 185) */
}

:root {
    --theme-dark-opacity-color: rgba(10, 25, 101, .8);
    /* theme dark opacity color - rgb(10, 25, 101) */
}

:root {
    --theme-white-opacity-color: rgba(255, 255, 255, 0.5);
    /* theme light color */
}

:root {
    --text-light-color: #9b9b9b;
    /* text light color */
}

:root {
    --text-gray-color: #c3c3c3;
    /* theme text gray color */
}

:root {
    --theme-primary-color-rgba: 0, 31, 185;
    /* theme primary color rgba - rgb(0, 31, 185) */
}

:root {
    --theme-button-hover-color: #F92044;
    /* theme button hover color - rgb(249, 32, 68) */
}

:root {
    --theme-menu-hover-color: #F92044;
    /* theme menu hover color - rgb(249, 32, 68) */
}

/*==================================
Font Variable
==================================*/

:root {
    --theme-general-font: 'Montserrat', 'Barlow', sans-serif;
    /* Font use for normal text and general text - Regular weight */
}

:root {
    --theme-hiperlink-font: 'Montserrat', 'Sen', sans-serif;
    /* Font use for normal text and general text - Regular weight */
}

:root {
    --theme-highlight-font: 'Montserrat', 'Sen', sans-serif;
    /* Font used in title or special area - Medium weight */
}

:root {
    --theme-button-font: 'Montserrat', 'Sen', sans-serif;
    /* Font used for buttons - Bold weight */
}

/*==================================
Custom Brand Styling
==================================*/

/* Headings styling */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--theme-highlight-font) !important;
    font-weight: 500 !important;
    color: var(--theme-primary-color) !important;
}

/* Text styling */
body, p, span, div, li, td, th {
    font-family: var(--theme-general-font) !important;
    font-weight: 400 !important;
    color: var(--theme-general-color) !important;
}

/* Button styling */
.btn, .btn-primary {
    font-family: var(--theme-button-font) !important;
    font-weight: 700 !important;
    background-color: var(--theme-primary-color) !important;
    color: var(--theme-white-color) !important;
    border-color: var(--theme-primary-color) !important;
    transition: all 0.3s ease !important;
}
.btn-secondary {
    background-color: var(--theme-secondary-color) !important;
    color: var(--theme-white-color) !important;
    border-color: var(--theme-secondary-color) !important;  
}
.btn:hover, .btn-primary:hover, .btn-secondary:hover, button:hover,
.btn:focus, .btn-primary:focus, .btn-secondary:focus, button:focus {
    background-color: var(--theme-button-hover-color) !important;
    border-color: var(--theme-button-hover-color) !important;
    color: var(--theme-white-color) !important;
    /* transform: translateY(-1px) !important; */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2) !important;
}

/* Menu styling */
.navbar-nav .nav-link {
    color: var(--theme-primary-color) !important;
    font-family: var(--theme-general-font) !important;
    font-weight: 400 !important;
    transition: all 0.3s ease !important;
}

.navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus {
    color: var(--theme-menu-hover-color) !important;
}

/* Menu bar background - Brand specific overrides */
.header-style-1, .fixed-bg-secondary, .top-header {
    background-color: var(--theme-light-color) !important;
}

.header-style-1.fixed-bg-secondary {
    background-color: var(--theme-light-color) !important;
}

/* Navigation container background */
.main-nav {
    background-color: var(--theme-light-color) !important;
}

/* Navbar background */
.navbar, .navbar-expand-lg {
    background-color: var(--theme-light-color) !important;
}

/* Ensure dropdown menus have proper styling */
.dropdown-menu {
    background-color: var(--theme-white-color) !important;
    border: 1px solid var(--theme-light-color) !important;
}

.dropdown-item {
    color: var(--theme-primary-color) !important;
}

.dropdown-item:hover, .dropdown-item:focus {
    background-color: var(--theme-light-color) !important;
    color: var(--theme-menu-hover-color) !important;
}

/* Footer Styling */
footer, .footer, .bg-footer, .footer-area {
    background-color: var(--theme-footer-color) !important;
}

/* Footer text - all white */
footer, footer p, footer span, footer div, footer li, footer td, footer th,
.footer, .footer p, .footer span, .footer div, .footer li, .footer td, .footer th,
.bg-footer, .bg-footer p, .bg-footer span, .bg-footer div, .bg-footer li, .bg-footer td, .bg-footer th,
.footer-area, .footer-area p, .footer-area span, .footer-area div, .footer-area li, .footer-area td, .footer-area th {
    color: var(--theme-white-color) !important;
}

/* Footer headings - white and uppercase */
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6,
footer .h1, footer .h2, footer .h3, footer .h4, footer .h5, footer .h6,
.footer h1, .footer h2, .footer h3, .footer h4, .footer h5, .footer h6,
.footer .h1, .footer .h2, .footer .h3, .footer .h4, .footer .h5, .footer .h6,
.bg-footer h1, .bg-footer h2, .bg-footer h3, .bg-footer h4, .bg-footer h5, .bg-footer h6,
.bg-footer .h1, .bg-footer .h2, .bg-footer .h3, .bg-footer .h4, .bg-footer .h5, .bg-footer .h6,
.footer-area h1, .footer-area h2, .footer-area h3, .footer-area h4, .footer-area h5, .footer-area h6,
.footer-area .h1, .footer-area .h2, .footer-area .h3, .footer-area .h4, .footer-area .h5, .footer-area .h6,
.footer-widget .widget-title, .footer-widget h1, .footer-widget h2, .footer-widget h3, 
.footer-widget h4, .footer-widget h5, .footer-widget h6 {
    color: var(--theme-white-color) !important;
    text-transform: uppercase !important;
    font-family: var(--theme-highlight-font) !important;
    font-weight: 500 !important;
}

/* Footer links - white with red hover */
footer a, .footer a, .bg-footer a, .footer-area a,
.footer-widget a, .footer-widget li a {
    color: var(--theme-white-color) !important;
    transition: all 0.3s ease !important;
}

footer a:hover, footer a:focus,
.footer a:hover, .footer a:focus,
.bg-footer a:hover, .bg-footer a:focus,
.footer-area a:hover, .footer-area a:focus,
.footer-widget a:hover, .footer-widget a:focus,
.footer-widget li a:hover, .footer-widget li a:focus {
    color: var(--theme-footer-hover-color) !important;
    text-decoration: none !important;
}

/* Footer form elements */
footer .form-control, .footer .form-control, .bg-footer .form-control, .footer-area .form-control {
    background-color: var(--theme-white-color) !important;
    border: 1px solid var(--theme-white-color) !important;
    color: var(--theme-general-color) !important;
}

/* Footer buttons */
footer .btn, .footer .btn, .bg-footer .btn, .footer-area .btn {
    background-color: var(--theme-primary-color) !important;
    border-color: var(--theme-primary-color) !important;
    color: var(--theme-white-color) !important;
}

footer .btn:hover, .footer .btn:hover, .bg-footer .btn:hover, .footer-area .btn:hover {
    background-color: var(--theme-footer-hover-color) !important;
    border-color: var(--theme-footer-hover-color) !important;
    color: var(--theme-white-color) !important;
}

/* Added alpha seperately */

.select-custom li input[type="radio"]:checked+label {
    background-color: rgba(var(--theme-primary-color-rgba), 0.1)
}

.sub-title {
    font-size: 17px;
}

.breadcrumb-item>a {
    color: #0096ff;
}

#scroll {
    color: var(--theme-white-color) !important;
    background-color: var(--theme-secondary-color) !important;
}

/*==================================
Global Image and Background Styling
==================================*/

/* Curved corner effect for all images */
img,
.thumbnail-img,
.thumbnail-img img,
.property-block .thumbnail-img,
.property-block .thumbnail-img img,
.property-grid-1 .thumbnail-img,
.property-grid-1 .thumbnail-img img,
.property-grid-2 .thumbnail-img,
.property-grid-2 .thumbnail-img img,
.property-list-2 .thumbnail-img,
.property-list-2 .thumbnail-img img {
    border-radius: 0 !important;
    overflow: hidden !important;
}

/* Sand background elements with curved corners */
.property_text,
[style*="background-color: #F5F2EB"],
[style*="background-color:#F5F2EB"],
.bg-sand,
.sand-background {
    border-radius: 0 0 20px 0 !important;
}

/* Ensure parent containers maintain overflow hidden */
.property-block .overflow-hidden,
.property-grid-1 .overflow-hidden,
.property-grid-2 .overflow-hidden,
.property-list-2 .overflow-hidden,
.overflow-hidden {
    border-radius: 0 0 20px 0 !important;
}

/* Callout blocks and content sections */
.bg-light,
.testimonial-simple,
.widget,
.content-block,
.info-block,
.feature-block {
    border-radius: 0 0 20px 0 !important;
}

/*==================================
Phone Number Styling
==================================*/

/* Make phone number in top header blue */
.top-contact li a,
.top-contact li a:hover,
.top-contact li a:focus {
    color: var(--theme-primary-color) !important;
}

/* Make phone number in inner page menu blue */
.navbar-nav .nav-link[href^="tel:"] {
    color: var(--theme-primary-color) !important;
}

.navbar-nav .nav-link[href^="tel:"]:hover,
.navbar-nav .nav-link[href^="tel:"]:focus {
    color: var(--theme-menu-hover-color) !important;
}