/* Modern Industrial Design Updates */
/* Professional industrial aesthetic with steel and blue tones */

/* Main body background - industrial concrete/steel texture */
body {
    background: linear-gradient(135deg, #eceff1 0%, #cfd8dc 100%) !important;
    background-attachment: fixed !important;
    color: #333 !important;
    position: relative;
}

/* Add subtle diagonal line pattern for industrial texture */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image:
        repeating-linear-gradient(
            45deg,
            transparent,
            transparent 10px,
            rgba(0, 0, 0, 0.02) 10px,
            rgba(0, 0, 0, 0.02) 11px
        ),
        repeating-linear-gradient(
            -45deg,
            transparent,
            transparent 10px,
            rgba(0, 0, 0, 0.015) 10px,
            rgba(0, 0, 0, 0.015) 11px
        );
    pointer-events: none;
    z-index: 0;
}

/* Main content section - subtle background with texture */
.section {
    background: transparent !important;
    position: relative;
    z-index: 1;
}

/* Inner content area - clean white background with subtle shadow */
.inner-content-Bg {
    background: #ffffff !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1), 0 1px 2px rgba(0,0,0,0.06) !important;
    border-radius: 8px !important;
    border: none !important;
    padding: 30px 20px !important;
}

/* Content boxes - Material Design card style */
.blockGbg {
    background: #ffffff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 20px !important;
    transition: box-shadow 0.3s ease;
}

.blockGbg:hover {
    box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important;
}

/* Blue pattern background boxes - industrial blue gradient */
.bluePatternBg {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%) !important;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 25px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.bluePatternBg:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15) !important;
}

/* Banner sections - cleaner look */
.bannerSec {
    background: #ffffff !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08) !important;
}

.bannerBG {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%) !important;
}

.bannerBG p.servicesec {
    color: #ffffff !important;
}

/* Welcome banner and content */
.welcomebanner h1,
.welcomebanner h2,
.welcomebanner h3,
.welcomebanner h4 {
    color: #2c3e50 !important;
}

.welcomebanner p {
    color: #555 !important;
}

/* Sub-content styling */
.subContent h5 {
    color: #2c3e50 !important;
    border-bottom: 2px solid #1976d2 !important;
    padding-bottom: 8px;
}

.subContent h5 a {
    color: #1976d2 !important;
}

.subContent ul li span {
    color: #1976d2 !important;
}

/* List styling */
.list-of-group li {
    color: #555 !important;
}

.list-of-group li strong {
    color: #1976d2 !important;
}

/* Footer - subtle background */
#footer {
    background: #2c3e50 !important;
    box-shadow: 0 -2px 4px rgba(0,0,0,0.1) !important;
}

/* Table styling - industrial blue header */
.res-table .table > thead > tr > td {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%) !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

/* Accordion styling - Industrial Design */
.accordionjs .acc_section {
    background: #ffffff;
    margin-bottom: 8px;
    border-radius: 6px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    overflow: hidden;
}

.accordionjs .acc_section .acc_head {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%) !important;
    border: none !important;
}

.accordionjs .acc_section.acc_active > .acc_head {
    background: linear-gradient(135deg, #1565c0 0%, #0d47a1 100%) !important;
}

.accordionjs .acc_section .acc_content {
    background: #ffffff !important;
    color: #333 !important;
}

.accordionjs .acc_section .acc_content h2,
.accordionjs .acc_section .acc_content h6,
.accordionjs .acc_section .acc_content p {
    color: #333 !important;
}

.accordionjs .acc_section .acc_content ul li {
    color: #555 !important;
}

/* Contact map - modern card style */
.contact-map {
    border-radius: 8px !important;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1) !important;
    border: none !important;
}

/* Breadcrumb styling */
.breadcrumb {
    background: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    border-radius: 6px;
    padding: 10px 15px;
}

.breadcrumb > li,
.breadcrumb > li > a {
    color: #1976d2 !important;
}

/* FAQ Panel - Industrial Design cards */
.faq-panel .panel-default {
    border: none !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    border-radius: 6px;
    margin-bottom: 12px;
    overflow: hidden;
}

.faq-panel .panel-default > .panel-heading {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%) !important;
    border: none !important;
}

/* Product thumbnail cards */
.thumbImg .thumbaction {
    display: block;
    padding: 15px;
    background: #ffffff;
    border-radius: 8px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08);
}

.thumbImg .thumbaction:hover {
    transform: translateY(-4px);
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
}

.thumbImg .thumbaction p {
    color: #2c3e50 !important;
    font-weight: 600;
}

/* Link colors - industrial blue accent */
a {
    color: #1976d2;
    transition: color 0.2s ease;
}

a:hover {
    color: #0d47a1;
}

.welcomebanner p a {
    color: #1976d2 !important;
}

/* Blue text accent */
.bluetext,
.txt-blue {
    color: #1976d2 !important;
}

/* Service banner - clean white card */
.serviceBanner {
    background: #ffffff !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.08) !important;
    border-radius: 6px;
}

/* Buttons - Material Design style */
.btn {
    border-radius: 6px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.3s ease;
}

.btn:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
    transform: translateY(-1px);
}

/* Ensure text readability on white backgrounds */
.inner-content-Bg h1,
.inner-content-Bg h2,
.inner-content-Bg h3,
.inner-content-Bg h4,
.inner-content-Bg h5,
.inner-content-Bg h6 {
    color: #2c3e50 !important;
}

.inner-content-Bg p,
.inner-content-Bg li {
    color: #555 !important;
}

/* White border utility - update for modern look */
.whiteBorder {
    border: 1px solid #e0e0e0 !important;
}

/* Blue border utility - use industrial blue */
.blueBorder {
    border: 2px solid #1976d2 !important;
}

/* Photo gallery - card grid */
.photoGallery {
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

/* Modern Industrial Navigation Bar */
.MenuSection {
    background: linear-gradient(135deg, #1976d2 0%, #0d47a1 100%) !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    position: relative;
    z-index: 100;
}

.MenuSection .navbar-nav > li > a {
    color: #ffffff !important;
    font-weight: 500 !important;
    letter-spacing: 0.5px;
    transition: all 0.3s ease !important;
    position: relative;
}

.MenuSection .navbar-nav > li > a::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 3px;
    background: #ffffff;
    transition: all 0.3s ease;
    transform: translateX(-50%);
}

.MenuSection .navbar-nav > li > a:hover::after,
.MenuSection .navbar-nav > .active > a::after {
    width: 80%;
}

.MenuSection .navbar-nav > li > a:hover,
.MenuSection .navbar-nav > li > a:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

.MenuSection .navbar-nav > .active > a,
.MenuSection .navbar-nav > .active > a:hover,
.MenuSection .navbar-nav > .active > a:focus {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
}

/* Remove old separator lines */
.MenuSection .navbar-nav > li + li:before {
    display: none !important;
}

/* Dropdown menu modernization */
.navbar-nav > li > .dropdown-menu {
    background: linear-gradient(135deg, #0d47a1 0%, #1565c0 100%) !important;
    border: none !important;
    border-radius: 6px !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important;
    margin-top: 0 !important;
}

.dropdown-menu > li > a {
    color: #ffffff !important;
    transition: all 0.2s ease;
    padding: 10px 20px !important;
}

.dropdown-menu > li > a:hover {
    background: rgba(255, 255, 255, 0.2) !important;
    padding-left: 25px !important;
}

/* Header modernization */
#header {
    background: #ffffff !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.08) !important;
}

/* Top menu section */
.topMenuSec > ul.nav > li::before {
    background: #1976d2 !important;
}

.phoneNo {
    color: #1976d2 !important;
    font-weight: 600;
}

/* Banner sections with texture */
.bannerSec {
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(10px);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .inner-content-Bg {
        padding: 20px 15px !important;
        border-radius: 6px !important;
    }

    .blockGbg,
    .bluePatternBg {
        border-radius: 6px !important;
        padding: 15px !important;
    }

    .MenuSection {
        box-shadow: 0 2px 6px rgba(0,0,0,0.12) !important;
    }
}