/* UI Improvements for Charm Residential Cleaning Service */

/* ===== INCREASED BORDER RADIUS ===== */
/* Buttons - Increased from 4px to 12px for modern look */
.cleaning-btn {
    border-radius: 12px !important;
}

.qout-btn {
    border-radius: 12px !important;
}

/* Form submit buttons */
.qoute-form-area input[type="submit"] {
    border-radius: 12px !important;
}

.contact-form-area input.sbmt-btn {
    border-radius: 12px !important;
}

.comment-form-wrap input.sbmt-btn {
    border-radius: 12px !important;
}

/* Subscribe form buttons */
.subscribe-form button {
    border-radius: 12px !important;
}

.subscribe button {
    border-radius: 12px !important;
}

/* Login/Sign Up button in header */
.mainmenu .btn, .btn.btn-outline {
    border-radius: 12px !important;
}

/* Cart and action buttons */
.cart-btn {
    border-radius: 12px !important;
}

.add-to-cart {
    border-radius: 12px !important;
}

/* Select plan buttons */
.single-price-table .select-plan {
    border-radius: 12px !important;
}

/* Read more buttons */
.read-more-btn {
    border-radius: 12px !important;
}

/* Pager buttons */
.pager li > a {
    border-radius: 12px !important;
}

/* Team profile buttons */
.team-profile > a {
    border-radius: 12px !important;
}

/* Form inputs - Increased from 0/3px to 8px */
.qoute-form-area input {
    border-radius: 8px !important;
}

.qoute-form-area textarea {
    border-radius: 8px !important;
}

.contact-form-area .form-group > input {
    border-radius: 8px !important;
}

.contact-form-area .form-group > textarea {
    border-radius: 8px !important;
}

.comment-form-wrap input {
    border-radius: 8px !important;
}

.comment-form-wrap textarea {
    border-radius: 8px !important;
}

.subscribe input {
    border-radius: 8px !important;
}

.subscribe-form input {
    border-radius: 8px !important;
}

/* ===== FORM BACKGROUND IMAGES ===== */
/* Quote form area with subtle background */
.qoute-form-area {
    background-image: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(240,248,255,0.95) 100%);
    background-size: cover;
    background-position: center;
    position: relative;
}

.qoute-form-area::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="%23f0f8ff" opacity="0.3"/><circle cx="75" cy="75" r="1" fill="%23e6f3ff" opacity="0.3"/><circle cx="50" cy="10" r="0.5" fill="%23d4e9ff" opacity="0.2"/><circle cx="10" cy="60" r="0.5" fill="%23cce5ff" opacity="0.2"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>');
    opacity: 0.6;
    z-index: -1;
}

/* Contact form area with background */
.contact-form-area {
    background-image: linear-gradient(135deg, rgba(255,255,255,0.92) 0%, rgba(248,250,255,0.92) 100%), url('https://images.unsplash.com/photo-1557804506-669a67965ba0?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=2074&q=80');
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.08);
}

.contact-form-area::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="dots" width="20" height="20" patternUnits="userSpaceOnUse"><circle cx="10" cy="10" r="1" fill="%23e6f3ff" opacity="0.3"/></pattern></defs><rect width="100" height="100" fill="url(%23dots)"/></svg>');
    opacity: 0.3;
    z-index: -1;
    border-radius: 12px;
}

/* Subscribe form with background */
.subscription .subscribe-form {
    background-image: linear-gradient(135deg, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.05) 100%);
    background-size: cover;
    background-position: center;
    position: relative;
    padding: 20px;
    border-radius: 12px;
    backdrop-filter: blur(10px);
}

/* ===== NAVIGATION BOTTOM LINE INSTEAD OF BACKGROUND ===== */
/* Remove background change on active/hover */
.mainmenu ul li:hover > a:not(.btn),
.mainmenu ul li.active > a:not(.btn) {
    background: transparent !important;
    color: #6699ff !important;
    text-decoration: none;
}

/* Enhanced bottom line styling - ONLY for main menu items, NOT submenu */
.mainmenu > ul > li > a:not(.btn):before {
    position: absolute;
    bottom: 0;
    content: "";
    width: 100%;
    height: 4px; /* Increased from 3px to 4px */
    background: linear-gradient(90deg, #6699ff 0%, #4d7aff 100%); /* Gradient effect */
    left: 0;
    opacity: 0;
    transition: all 0.3s ease 0s;
    visibility: hidden;
    border-radius: 2px 2px 0 0; /* Rounded top corners */
    box-shadow: 0 2px 4px rgba(102, 153, 255, 0.3); /* Subtle shadow */
}

.mainmenu > ul > li:hover > a:not(.btn):before,
.mainmenu > ul > li.active > a:not(.btn):before {
    opacity: 1;
    visibility: visible;
    transform: scaleX(1.1); /* Slight scale effect */
}

/* Submenu styling - NO bottom line, improved colors */
.mainmenu li ul {
    background: #6699ff !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
    border: none !important;
    padding: 8px 0 !important;
}

.mainmenu li ul li a:not(.btn) {
    color: #ffffff !important;
    background: transparent !important;
    border-radius: 4px !important;
    margin: 2px 8px !important;
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
    text-shadow: none !important;
    padding: 8px 15px !important;
}

.mainmenu li ul li a:not(.btn):before {
    display: none !important; /* Remove bottom line from submenu */
}

/* Submenu hover state */
.mainmenu li ul li:hover > a:not(.btn) {
    background: transparent !important;
    color: #ffffff !important;
    text-decoration: underline !important;
}

/* Submenu active/selected state */
.mainmenu li ul li.active > a:not(.btn) {
    background: transparent !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

/* Ensure submenu text is clearly visible */
.mainmenu li ul li a:not(.btn) {
    font-weight: 500 !important;
    text-shadow: none !important;
}

/* ===== ADDITIONAL ENHANCEMENTS ===== */
/* Enhanced button hover effects */
.cleaning-btn:hover,
.qout-btn:hover,
.qoute-form-area input[type="submit"]:hover,
.contact-form-area input.sbmt-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 153, 255, 0.3);
    transition: all 0.3s ease;
}

/* Enhanced form input focus states */
.qoute-form-area input:focus,
.qoute-form-area textarea:focus,
.contact-form-area .form-group > input:focus,
.contact-form-area .form-group > textarea:focus,
.comment-form-wrap input:focus,
.comment-form-wrap textarea:focus {
    border-color: #6699ff !important;
    box-shadow: 0 0 0 3px rgba(102, 153, 255, 0.1) !important;
    outline: none;
    transition: all 0.3s ease;
}

/* Enhanced working info boxes */
.single-working-info {
    border-radius: 16px !important; /* Increased from 0 20px to 16px */
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.single-working-info:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(102, 153, 255, 0.15);
}

/* Enhanced service items */
.single-service-item-block {
    transition: all 0.3s ease;
    border-radius: 12px;
    overflow: hidden;
}

.single-service-item-block:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

/* Enhanced testimonial cards */
.testimonial-slide-item {
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
}

.testimonial-slide-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.12);
}

/* Enhanced profile items */
.profile-item {
    border-radius: 50% !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

.profile-item:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 25px rgba(102, 153, 255, 0.2);
}

/* Enhanced counter boxes */
.counter-box {
    border-radius: 16px !important;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.counter-box:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(255,255,255,0.2);
}

/* Enhanced location thumbnails */
.locThumbnail {
    border-radius: 12px !important;
    overflow: hidden;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.locThumbnail:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

/* Enhanced social icons */
.social-icon a,
.social-icos a {
    border-radius: 50% !important;
    transition: all 0.3s ease;
}

.social-icon a:hover,
.social-icos a:hover {
    transform: translateY(-2px) scale(1.1);
    box-shadow: 0 4px 15px rgba(102, 153, 255, 0.3);
}

/* Enhanced back to top button */
#back-to-top {
    border-radius: 12px !important;
    transition: all 0.3s ease;
}

#back-to-top:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(102, 153, 255, 0.3);
} 

.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img {
    width: 100%;
}