/*
Theme Name: MCS Store Theme
Theme URI: https://www.revolutionwp.com/products/free-shop-wordpress-theme
Template: wp-shop-woocommerce
Author: MicroControl Systems
Author URI: https://microcontrolsystems.company
Description: WP Shop WooCommerce is a powerful and versatile WordPress theme designed to enhance the online shopping experience for businesses using WooCommerce. Tailored specifically for WooCommerce integration, it offers a seamless platform to create a professional, user-friendly online store. The theme features a clean, modern layout that emphasizes simplicity and ease of navigation, ensuring that customers can browse products, categories, and checkout processes effortlessly. The responsive design guarantees a smooth experience on any device, whether desktop, tablet, or mobile, enhancing accessibility for a wider audience. Customization options provide businesses the flexibility to tailor their storefronts, allowing adjustments to color schemes, typography, and layout elements, ensuring the website aligns with the brand’s unique identity. Functionality is central to the WP Shop WooCommerce theme, offering smooth product showcase capabilities, easy inventory management, and secure online transactions. It supports a variety of product types, from physical goods and digital downloads to affiliate products, making it ideal for businesses with diverse product offerings. Furthermore, the theme integrates social media links, allowing businesses to expand their reach and foster customer engagement on popular platforms. Perfect for online retail businesses, WP Shop WooCommerce is an excellent solution for building an e-commerce store to sell fashion, electronics, digital content, or subscriptions. With its robust integration with WooCommerce, the theme ensures that every aspect of your online retail business is optimized for efficiency, security, and growth. This theme is ideal for a wide range of eCommerce niches, including fashion eCommerce, electronics stores, furniture shops, home decor, beauty products, organic stores, fitness products, tech gadgets, digital products, subscription boxes, sports equipment, health and wellness, pet supplies, luxury items, books and media, handmade goods, art and crafts, toys and games, accessories, food delivery, gourmet products, vintage collectibles, auto parts, gift shops, home improvement, eco-friendly products, affiliate marketing, wholesale stores, and local delivery services. With its robust integration with WooCommerce, the theme ensures that every aspect of your online retail business is optimized for efficiency, security, and growth.
Tags: one-column,two-columns,three-columns,four-columns,left-sidebar,right-sidebar,grid-layout,full-width-template,wide-blocks,editor-style,custom-background,custom-colors,custom-header,custom-logo,custom-menu,sticky-post,featured-images,footer-widgets,flexible-header,post-formats,theme-options,threaded-comments,translation-ready,rtl-language-support,e-commerce,portfolio,blog
Version: 2.1.1.1775781827
Updated: 2026-04-10 00:43:47

*/



/* ===== MCS Store Theme - Custom Styles ===== */
/* Matching microcontrolsystems.company design */

/* ===== CSS Variables ===== */
:root {
    --mcs-primary: #2563eb;
    --mcs-primary-dark: #1d4ed8;
    --mcs-primary-light: #dbeafe;
    --mcs-text: #0f172a;
    --mcs-text-secondary: #475569;
    --mcs-bg: #ffffff;
    --mcs-bg-alt: #f8fafc;
    --mcs-border: #e2e8f0;
    --mcs-radius: 12px;
    --mcs-radius-sm: 8px;
    --mcs-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --mcs-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
    --mcs-font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* ===== Global Typography ===== */
body,
h1, h2, h3, h4, h5, h6,
p, a, span, li, td, th,
button, input, select, textarea,
.woocommerce,
.site-title,
.site-description {
    font-family: var(--mcs-font) !important;
}

body {
    color: var(--mcs-text);
    background-color: var(--mcs-bg);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ===== Header / Navigation ===== */
.site-header,
#masthead,
header.site-header {
    background: rgba(255, 255, 255, 0.85) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--mcs-border);
    box-shadow: var(--mcs-shadow-sm);
}

.site-title a,
.custom-logo-link,
.site-branding a {
    color: var(--mcs-text) !important;
    font-weight: 700;
    text-decoration: none;
}

.main-navigation a,
.primary-navigation a,
.nav-menu a,
#site-navigation a {
    color: var(--mcs-text-secondary) !important;
    font-weight: 500;
    font-size: 0.9rem;
    padding: 8px 16px;
    border-radius: 8px;
    transition: color 0.2s ease, background 0.2s ease;
}

.main-navigation a:hover,
.primary-navigation a:hover,
.nav-menu a:hover,
#site-navigation a:hover {
    color: var(--mcs-text) !important;
    background: var(--mcs-bg-alt);
}

/* ===== Hide Demo Slider / Carousel ===== */
.home-slider,
.owl-carousel,
.slider-section,
.home-banner,
.rev_slider_wrapper,
.theme-starter-carousel,
#starter-carousel,
.starter-starter-template-starter,
section.starter,
.starter-section {
    display: none !important;
}

/* ===== Buttons ===== */
button,
.button,
.btn,
input[type="submit"],
input[type="button"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
a.checkout-button,
.wc-block-components-button {
    background-color: var(--mcs-primary) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--mcs-radius-sm) !important;
    font-family: var(--mcs-font) !important;
    font-weight: 600;
    font-size: 0.95rem;
    padding: 12px 24px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(37, 99, 235, 0.3);
    text-decoration: none;
}

button:hover,
.button:hover,
.btn:hover,
input[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.wc-block-components-button:hover {
    background-color: var(--mcs-primary-dark) !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
    transform: translateY(-1px);
}

/* Secondary / outline buttons */
.woocommerce a.button:not(.alt):not(.checkout-button),
.button.secondary {
    background-color: var(--mcs-bg) !important;
    color: var(--mcs-text) !important;
    border: 1px solid var(--mcs-border) !important;
}

.woocommerce a.button:not(.alt):not(.checkout-button):hover,
.button.secondary:hover {
    background-color: var(--mcs-bg-alt) !important;
    border-color: #cbd5e1 !important;
}

/* ===== Links ===== */
a {
    color: var(--mcs-primary);
    transition: color 0.2s ease;
}

a:hover {
    color: var(--mcs-primary-dark);
}

/* ===== WooCommerce Product Cards ===== */
.woocommerce ul.products li.product,
.wc-block-grid__product {
    background: var(--mcs-bg);
    border: 1px solid var(--mcs-border);
    border-radius: var(--mcs-radius);
    padding: 20px;
    transition: box-shadow 0.2s ease, transform 0.2s ease;
    box-shadow: var(--mcs-shadow-sm);
}

.woocommerce ul.products li.product:hover,
.wc-block-grid__product:hover {
    box-shadow: var(--mcs-shadow-md);
    transform: translateY(-2px);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.wc-block-grid__product-title {
    color: var(--mcs-text) !important;
    font-weight: 700;
    font-size: 1.1rem;
}

.woocommerce ul.products li.product .price,
.wc-block-grid__product-price {
    color: var(--mcs-primary) !important;
    font-weight: 700;
    font-size: 1.15rem;
}

.woocommerce ul.products li.product img,
.wc-block-grid__product-image img {
    border-radius: var(--mcs-radius-sm);
    border: 1px solid var(--mcs-border);
}

/* ===== Single Product Page ===== */
.woocommerce div.product .product_title {
    color: var(--mcs-text);
    font-weight: 800;
    font-size: 2rem;
    letter-spacing: -0.02em;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--mcs-primary) !important;
    font-weight: 700;
    font-size: 1.5rem;
}

.woocommerce div.product .woocommerce-product-gallery {
    background: var(--mcs-bg);
    border: 1px solid var(--mcs-border);
    border-radius: var(--mcs-radius);
    padding: 16px;
}

/* Product Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
    border-radius: var(--mcs-radius-sm) var(--mcs-radius-sm) 0 0;
    background: var(--mcs-bg-alt);
    border-color: var(--mcs-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: var(--mcs-bg);
    border-bottom: 2px solid var(--mcs-primary);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--mcs-primary) !important;
    font-weight: 600;
}

/* Sale Badge */
.woocommerce span.onsale {
    background-color: var(--mcs-primary) !important;
    color: #fff;
    border-radius: var(--mcs-radius-sm);
    font-weight: 600;
}

/* ===== Cart & Checkout ===== */
.woocommerce-cart table.cart,
.woocommerce table.shop_table {
    border-color: var(--mcs-border);
    border-radius: var(--mcs-radius);
}

.woocommerce table.shop_table th {
    background: var(--mcs-bg-alt);
    color: var(--mcs-text-secondary);
    font-weight: 600;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 0.05em;
}

.woocommerce table.shop_table td {
    border-color: var(--mcs-border);
    color: var(--mcs-text);
}

/* ===== Notices & Messages ===== */
.woocommerce-message,
.woocommerce-info {
    border-top-color: var(--mcs-primary) !important;
    background: var(--mcs-primary-light);
    color: var(--mcs-text);
}

.woocommerce-message::before,
.woocommerce-info::before {
    color: var(--mcs-primary) !important;
}

/* ===== Sidebar & Widgets ===== */
.widget-title,
.widgettitle {
    color: var(--mcs-text);
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 2px solid var(--mcs-primary);
    padding-bottom: 8px;
    margin-bottom: 16px;
}

.widget ul li a {
    color: var(--mcs-text-secondary);
}

.widget ul li a:hover {
    color: var(--mcs-primary);
}

/* ===== Footer ===== */
.site-footer,
footer.site-footer,
#colophon {
    background: var(--mcs-text) !important;
    color: #94a3b8 !important;
    padding: 60px 0 40px;
}

.site-footer a,
footer.site-footer a,
#colophon a {
    color: #94a3b8 !important;
    transition: color 0.2s ease;
}

.site-footer a:hover,
footer.site-footer a:hover,
#colophon a:hover {
    color: #fff !important;
}

.site-footer .widget-title,
footer .widgettitle {
    color: #fff !important;
    border-bottom-color: #60a5fa;
}

.site-info,
.footer-credits,
.copyright {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 32px;
    text-align: center;
    font-size: 0.85rem;
    color: #94a3b8 !important;
}

/* ===== Forms ===== */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="url"],
textarea,
select {
    border: 1px solid var(--mcs-border) !important;
    border-radius: var(--mcs-radius-sm) !important;
    padding: 10px 14px;
    font-family: var(--mcs-font) !important;
    color: var(--mcs-text);
    background: var(--mcs-bg);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus {
    border-color: var(--mcs-primary) !important;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
    outline: none;
}

/* ===== Breadcrumbs ===== */
.woocommerce-breadcrumb {
    color: var(--mcs-text-secondary);
    font-size: 0.85rem;
}

.woocommerce-breadcrumb a {
    color: var(--mcs-primary);
}

/* ===== Pagination ===== */
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
    border-color: var(--mcs-border);
    color: var(--mcs-text-secondary);
    border-radius: var(--mcs-radius-sm);
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--mcs-primary) !important;
    color: #fff;
    border-color: var(--mcs-primary);
}

/* ===== Specs Table (for product descriptions) ===== */
.specs-table {
    width: 100%;
    border-collapse: collapse;
    margin: 1.5em 0;
}

.specs-table th {
    text-align: left;
    padding: 10px 16px;
    background: var(--mcs-bg-alt);
    border: 1px solid var(--mcs-border);
    font-weight: 600;
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--mcs-text-secondary);
}

.specs-table td {
    padding: 10px 16px;
    border: 1px solid var(--mcs-border);
    color: var(--mcs-text);
    font-weight: 600;
}

/* ===== Relay Specs Component ===== */
.relay-specs {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 1.5em 0;
    padding: 16px;
    background: var(--mcs-bg-alt);
    border: 1px solid var(--mcs-border);
    border-radius: var(--mcs-radius-sm);
}

.relay-spec {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1;
    min-width: 100px;
    text-align: center;
}

.relay-spec-label {
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--mcs-text-secondary);
}

.relay-spec-value {
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--mcs-primary);
}

/* ===== Use Case Tags ===== */
.usecase-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    background: var(--mcs-primary-light);
    color: var(--mcs-primary-dark);
    font-size: 0.85rem;
    font-weight: 500;
    border-radius: 100px;
    white-space: nowrap;
    margin: 4px;
}

/* ===== General Layout ===== */
.site-content,
.content-area {
    background: var(--mcs-bg);
}

.entry-content,
.page-content {
    color: var(--mcs-text);
}

h1, h2, h3, h4, h5, h6 {
    color: var(--mcs-text);
    font-weight: 700;
    letter-spacing: -0.02em;
}

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .relay-specs {
        flex-direction: column;
    }
    
    .relay-spec {
        min-width: auto;
    }
    
    .woocommerce div.product .product_title {
        font-size: 1.5rem;
    }
}