/* Import Playfair Display for Luxury Headings */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

:root, [data-bs-theme=dark] {
    --luxury-gold: #D4AF37;
    --luxury-gold-hover: #C5A059;
    --dark-bg: #0D1115;
    --dark-surface: #171B20;
    --dark-surface-border: #2C3238;
    --text-primary: #F0F2F5;
    --text-secondary: #A0AAB5;
    
    --bs-body-bg: var(--dark-bg);
    --bs-body-color: var(--text-secondary);
    --bs-heading-color: var(--text-primary);
}

body {
    background-color: var(--dark-bg) !important;
    color: var(--text-secondary) !important;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Playfair Display', serif !important;
    color: var(--text-primary) !important;
}

p, span, div {
    font-family: 'Manrope', sans-serif;
}

/* Base button styling override for Luxury */
.default-btn, .service-btn, .btn {
    background-color: var(--luxury-gold) !important;
    color: #121212 !important;
    border-radius: 5px !important;
    border: 1px solid var(--luxury-gold-hover) !important;
    transition: all 0.3s ease !important;
    font-weight: 600 !important;
}

.default-btn:hover, .service-btn:hover, .btn:hover {
    background-color: transparent !important;
    color: var(--luxury-gold) !important;
    border: 1px solid var(--luxury-gold) !important;
}

/* Glassmorphism for Hero Slider */
.dental-clinic-slider-content {
    background: rgba(13, 17, 21, 0.65) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 40px !important;
    border-radius: 12px !important;
}
.dental-clinic-slider-content h1 {
    color: var(--luxury-gold) !important;
    font-size: 3rem !important;
}
.dental-clinic-slider-content .sub {
    color: var(--text-primary) !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
}

/* Add overlay to swiper slides to darken background images */
.dental-clinic-slider-area .swiper-slide::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(to right, rgba(13, 17, 21, 0.9), rgba(13, 17, 21, 0.4));
    z-index: -1;
    border-radius: 20px;
}
.dental-clinic-slider-area .swiper-slide {
    z-index: 1;
}

/* Services Area */
.services-item {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    border-radius: 12px !important;
    padding: 25px !important;
    margin-bottom: 30px !important;
    transition: all 0.4s ease !important;
}
.services-item:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 15px 30px rgba(0,0,0,0.4) !important;
    border-color: var(--luxury-gold) !important;
}
.services-item h3 a {
    color: var(--text-primary) !important;
    transition: color 0.3s !important;
}
.services-item h3 a:hover {
    color: var(--luxury-gold) !important;
}
.service-image img {
    border-radius: 8px !important;
}

/* About, Services, Doctors, Insurance Areas */
.about-area, .services-area, .insurance-area, .doctors-area {
    background-color: var(--dark-bg) !important;
}
.about-content h2 {
    color: var(--luxury-gold) !important;
}

/* Doctors Cards */
.doctors-card {
    background: linear-gradient(145deg, var(--dark-surface), #0D1115) !important;
    border: 1px solid var(--dark-surface-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    transition: all 0.5s ease !important;
    text-align: center !important;
}
.doctors-card:hover {
    transform: translateY(-10px) !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.6) !important;
    border-color: var(--luxury-gold) !important;
}
.doctor-image {
    border-bottom: 2px solid var(--luxury-gold) !important;
}
.doctor-image img {
    width: 100% !important;
    transition: transform 0.5s ease !important;
}
.doctors-card:hover .doctor-image img {
    transform: scale(1.05) !important;
}
.doctor-content {
    background: transparent !important;
    padding: 30px 20px !important;
}
.doctor-content h3 {
    margin-bottom: 10px !important;
}
.doctor-content h3 a {
    color: var(--text-primary) !important;
    font-family: 'Playfair Display', serif !important;
    font-size: 1.4rem !important;
    letter-spacing: 1px !important;
}
.doctor-content span {
    color: var(--luxury-gold) !important;
    text-transform: uppercase !important;
    font-size: 0.85rem !important;
    letter-spacing: 2px !important;
    display: block !important;
}

/* Section titles */
.section-title h2 {
    color: var(--text-primary) !important;
    position: relative !important;
    padding-bottom: 15px !important;
}
.section-title h2::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 60px !important;
    height: 2px !important;
    background-color: var(--luxury-gold) !important;
}

/* Insurance Area */
.insurance-item {
    background: rgba(255,255,255,0.05) !important;
    padding: 20px !important;
    border-radius: 12px !important;
    transition: all 0.3s !important;
}
.insurance-item:hover {
    background: rgba(255,255,255,0.1) !important;
}

/* General Layout adjustments */
.ptb-150 {
    padding-top: 100px !important;
    padding-bottom: 100px !important;
}

/* Header & Navbar */
.top-header-area {
    background-color: transparent !important;
    border-bottom: none !important;
    color: var(--text-secondary) !important;
}
.top-header-area a, .top-header-area i {
    color: var(--text-secondary) !important;
    transition: color 0.3s ease;
}
.top-header-area a:hover, .top-header-area a:hover i {
    color: var(--luxury-gold) !important;
}

.main-navbar, .navbar-area, #navbar.sticky {
    background-color: rgba(13, 17, 21, 0.95) !important;
    backdrop-filter: blur(10px) !important;
    border-bottom: 1px solid var(--dark-surface-border) !important;
    box-shadow: none !important;
}
#navbar.sticky .navbar-inner {
    background-color: transparent !important;
}
.main-navbar .navbar .navbar-nav .nav-item .nav-link,
#navbar.sticky .navbar-nav .nav-item .nav-link {
    color: var(--text-primary) !important;
    font-weight: 500 !important;
}
.main-navbar .navbar .navbar-nav .nav-item .nav-link:hover,
.main-navbar .navbar .navbar-nav .nav-item .nav-link.active,
#navbar.sticky .navbar-nav .nav-item .nav-link:hover,
#navbar.sticky .navbar-nav .nav-item .nav-link.active {
    color: var(--luxury-gold) !important;
}

/* Dropdown Menu */
.dropdown-menu {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}
.dropdown-menu .nav-item .nav-link {
    color: var(--text-secondary) !important;
}
.dropdown-menu .nav-item .nav-link:hover {
    color: var(--luxury-gold) !important;
    background-color: transparent !important;
}

/* Offcanvas Mobile Menu */
.offcanvas {
    background-color: var(--dark-bg) !important;
    border-left: 1px solid var(--dark-surface-border) !important;
}
.offcanvas-header .close-btn {
    color: var(--text-primary) !important;
}
.accordion-button, .accordion-body, .accordion-item {
    background-color: transparent !important;
    color: var(--text-primary) !important;
    border-color: var(--dark-surface-border) !important;
}
.accordion-button:not(.collapsed) {
    color: var(--luxury-gold) !important;
    background-color: transparent !important;
}
.accordion-link {
    color: var(--text-secondary) !important;
}
.accordion-link:hover {
    color: var(--luxury-gold) !important;
}

/* Footer & Subscribe */
.footer-area {
    background-color: #0A0D10 !important;
    border-top: 1px solid var(--dark-surface-border) !important;
    color: var(--text-secondary) !important;
}
.footer-area h3, .footer-area h4 {
    color: var(--text-primary) !important;
    font-family: 'Playfair Display', serif !important;
}
.footer-area a, .footer-area span, .footer-area p, .footer-area li {
    color: var(--text-secondary) !important;
    transition: color 0.3s ease;
}
.footer-area a:hover {
    color: var(--luxury-gold) !important;
}
.single-footer-widget .info-list li i, .single-footer-widget .info-list li svg {
    color: var(--luxury-gold) !important;
}

.subscribe-area {
    background-color: var(--dark-surface) !important;
    border-radius: 12px !important;
    padding: 40px 0 !important;
    border: 1px solid var(--dark-surface-border) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5) !important;
}
.subscribe-content h3 {
    color: var(--luxury-gold) !important;
}
.subscribe-content span {
    color: var(--text-secondary) !important;
}
.subscribe-form .form-control {
    background-color: var(--dark-bg) !important;
    border: 1px solid var(--dark-surface-border) !important;
    color: var(--text-primary) !important;
}
.subscribe-form .form-control:focus {
    border-color: var(--luxury-gold) !important;
    box-shadow: 0 0 0 0.25rem rgba(212, 175, 55, 0.25) !important;
}

/* Fix specific inputs and form elements */
input.form-control, textarea.form-control, select.form-control {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    color: var(--text-primary) !important;
}
input.form-control:focus, textarea.form-control:focus, select.form-control:focus {
    border-color: var(--luxury-gold) !important;
    outline: none !important;
}

/* Back to Top Button */
#back-to-top {
    background-color: var(--luxury-gold) !important;
    color: #121212 !important;
    border: none !important;
    transition: all 0.3s ease !important;
}
#back-to-top:hover {
    background-color: var(--text-primary) !important;
    transform: translateY(-3px) !important;
}

/* Modern Services Cards */
.modern-service-card {
    background: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    margin-bottom: 30px !important;
    transition: all 0.4s ease !important;
    position: relative !important;
}
.modern-service-card:hover {
    transform: translateY(-10px) !important;
    box-shadow: 0 20px 40px rgba(0,0,0,0.6) !important;
    border-color: var(--luxury-gold) !important;
}
.modern-service-img {
    position: relative !important;
    overflow: hidden !important;
    height: 240px !important;
}
.modern-service-img img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.6s ease !important;
}
.modern-service-card:hover .modern-service-img img {
    transform: scale(1.1) !important;
}
.modern-service-overlay {
    position: absolute !important;
    bottom: -60px !important;
    right: 20px !important;
    transition: all 0.4s ease !important;
    opacity: 0 !important;
}
.modern-service-card:hover .modern-service-overlay {
    bottom: 20px !important;
    opacity: 1 !important;
}
.read-more-btn {
    display: inline-block !important;
    width: 50px !important;
    height: 50px !important;
    line-height: 50px !important;
    text-align: center !important;
    background-color: var(--luxury-gold) !important;
    color: #121212 !important;
    border-radius: 50% !important;
    font-size: 20px !important;
    box-shadow: 0 10px 20px rgba(0,0,0,0.3) !important;
    transition: all 0.3s ease !important;
}
.read-more-btn:hover {
    background-color: var(--text-primary) !important;
    transform: rotate(-45deg) !important;
}
.modern-service-content {
    padding: 30px !important;
    background: linear-gradient(180deg, transparent, rgba(13, 17, 21, 0.4)) !important;
}
.modern-service-content h3 {
    margin-bottom: 15px !important;
}
.modern-service-content h3 a {
    color: var(--text-primary) !important;
    font-family: 'Playfair Display', serif !important;
    font-size: 1.4rem !important;
    transition: color 0.3s ease !important;
}
.modern-service-content h3 a:hover {
    color: var(--luxury-gold) !important;
}
.modern-service-content p {
    color: var(--text-secondary) !important;
    font-size: 0.95rem !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

/* Inner Page Specific Styles */
.page-banner-area {
    position: relative !important;
    background-color: #0A0D10 !important;
}
.page-banner-area::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(to right, rgba(13, 17, 21, 0.95), rgba(13, 17, 21, 0.75)) !important;
    z-index: 0 !important;
}
.page-banner-content {
    position: relative !important;
    z-index: 1 !important;
}
.page-banner-content h2 {
    color: var(--luxury-gold) !important;
    font-family: 'Playfair Display', serif !important;
}
.page-banner-content ul li {
    color: var(--text-secondary) !important;
}
.page-banner-content ul li a {
    color: var(--text-primary) !important;
}
.page-banner-content ul li a:hover {
    color: var(--luxury-gold) !important;
}

/* Common Areas */
.fun-fact-area, .contact-area, .contact-us-area, .contact-info-area, .contact-form-area, .appointment-area, .team-area, .gallery-area, .pricing-area, .faq-area, .appointment-wrap-area {
    background-color: var(--dark-bg) !important;
}
.contact-info-card, .appointment-form, .contact-form, .contact-us-form, .pricing-card, .faq-accordion .accordion-item, .appointment-wrap-inner {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    border-radius: 12px !important;
    padding: 30px !important;
}
.contact-us-form h3, .appointment-wrap-inner h3 {
    color: var(--luxury-gold) !important;
    margin-bottom: 25px !important;
}
.contact-info-card h3, .contact-info-card a, .contact-info-card span {
    color: var(--text-primary) !important;
}
.contact-info-card p {
    color: var(--text-secondary) !important;
}
.contact-info-card .icon,
.contact-info-card .icon.bg2,
.contact-info-card .icon.bg3,
.contact-info-card .icon.bg4 {
    background-color: rgba(197, 168, 128, 0.1) !important;
    color: var(--luxury-gold) !important;
}
.contact-info-card .icon i,
.contact-info-card .icon svg {
    color: var(--luxury-gold) !important;
    stroke: var(--luxury-gold) !important;
}
.contact-us-form label, .appointment-wrap-inner label {
    color: var(--text-secondary) !important;
}

/* Services Details Page */
.services-details-area {
    background-color: var(--dark-bg) !important;
}
.services-details-sidebar .services-box,
.services-details-sidebar .working-info,
.services-details-desc {
    background-color: var(--dark-surface) !important;
    border: 1px solid var(--dark-surface-border) !important;
    border-radius: 12px !important;
    padding: 30px !important;
    margin-bottom: 30px !important;
}
.services-details-sidebar h3,
.services-details-desc h2,
.services-details-desc h3 {
    color: var(--luxury-gold) !important;
}
.services-details-sidebar .list {
    padding: 0 !important;
    margin: 0 !important;
}
.services-details-sidebar .list li {
    border-bottom-color: var(--dark-surface-border) !important;
    background-color: transparent !important;
}
.services-details-sidebar .list li a {
    color: var(--text-primary) !important;
    background-color: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid var(--dark-surface-border) !important;
}
.services-details-sidebar .list li a i {
    color: var(--luxury-gold) !important;
}
.services-details-sidebar .list li a:hover {
    color: var(--luxury-gold) !important;
    background-color: rgba(197, 168, 128, 0.05) !important;
    border-color: var(--luxury-gold) !important;
}
.services-details-sidebar .list li span {
    color: var(--text-secondary) !important;
}
.services-details-desc p {
    color: var(--text-secondary) !important;
}

/* Blog Details Area */
.blog-details-desc .article-content {
    background-color: var(--dark-surface) !important;
}