/*
Theme Name: Mumtaz Deal Retail
Theme URI: https://mumtazdeals.shop/
Author: Mumtaz Deal
Description: Premium retail WooCommerce theme for Mumtaz Deal.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: mumtaz-deal
*/

:root{
    --black:#111111;
    --white:#ffffff;
    --gold:#c9a227;
    --gold-light:#e5d18a;
    --soft:#f7f7f5;
    --text:#202020;
    --muted:#777777;
    --border:#e8e6df;
    --radius:16px;
    --shadow:0 12px 35px rgba(0,0,0,.07);
}

*{
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    background:#fff;
    color:var(--text);
    font-family:
        Arial,
        Helvetica,
        sans-serif;
    line-height:1.6;
}

a{
    color:inherit;
    text-decoration:none;
}

img{
    max-width:100%;
    height:auto;
}

.md-container{
    width:min(1180px,92%);
    margin:auto;
}

/* TOP BAR */

.md-topbar{
    background:var(--black);
    color:white;
    font-size:13px;
}

.md-topbar-inner{
    min-height:38px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
}

/* HEADER */

.md-header{
    background:rgba(255,255,255,.97);
    border-bottom:1px solid var(--border);
    position:sticky;
    top:0;
    z-index:999;
    backdrop-filter:blur(12px);
}

.md-header-inner{
    min-height:78px;
    display:flex;
    align-items:center;
    gap:22px;
}

.md-logo{
    font-size:26px;
    font-weight:900;
    letter-spacing:-1px;
    white-space:nowrap;
}

.md-logo span{
    color:var(--gold);
}

.md-search{
    flex:1;
    max-width:480px;
    margin:auto;
}

.md-search form{
    display:flex;
    border:1px solid var(--border);
    border-radius:999px;
    overflow:hidden;
    background:#fff;
}

.md-search input{
    width:100%;
    min-width:0;
    border:0;
    outline:0;
    padding:13px 17px;
    font-size:14px;
}

.md-search button{
    border:0;
    background:var(--black);
    color:white;
    padding:0 20px;
    cursor:pointer;
}

.md-nav{
    display:flex;
    align-items:center;
    gap:22px;
}

.md-nav a{
    font-size:14px;
    font-weight:700;
}

.md-nav a:hover{
    color:var(--gold);
}

.md-header-actions{
    display:flex;
    align-items:center;
    gap:14px;
}

.md-action{
    font-weight:700;
    white-space:nowrap;
}

.md-menu-button{
    display:none;
    border:0;
    background:none;
    font-size:28px;
    cursor:pointer;
}

/* MOBILE MENU */

.md-mobile-menu{
    display:none;
    background:white;
    border-top:1px solid var(--border);
    padding:20px 0;
}

.md-mobile-menu.open{
    display:block;
}

.md-mobile-menu a{
    display:block;
    padding:12px 0;
    border-bottom:1px solid #eee;
    font-weight:600;
}

/* HERO */

.md-hero{
    background:
        radial-gradient(
            circle at 75% 40%,
            rgba(201,162,39,.22),
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #0f0f0f,
            #181818
        );
    color:white;
    padding:75px 0;
}

.md-hero-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:55px;
}

.md-kicker{
    color:var(--gold-light);
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:13px;
    font-weight:800;
}

.md-hero h1{
    font-size:clamp(40px,6vw,68px);
    line-height:1.02;
    margin:15px 0 20px;
    letter-spacing:-2px;
}

.md-hero p{
    color:#dddddd;
    font-size:18px;
    max-width:590px;
}

.md-buttons{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:28px;
}

.md-btn{
    display:inline-flex;
    justify-content:center;
    align-items:center;
    padding:13px 23px;
    border-radius:999px;
    font-weight:800;
    transition:.2s;
}

.md-btn-gold{
    background:var(--gold);
    color:#111;
}

.md-btn-gold:hover{
    background:#e2c45b;
}

.md-btn-dark{
    color:white;
    border:1px solid #555;
}

.md-btn-dark:hover{
    border-color:white;
}

.md-hero-visual{
    min-height:360px;
    border-radius:30px;
    background:
        radial-gradient(
            circle at 40% 30%,
            white,
            #ddd9cc 22%,
            #777261 52%,
            #222 85%
        );
    box-shadow:0 30px 80px rgba(0,0,0,.4);
    position:relative;
    overflow:hidden;
}

.md-hero-visual:after{
    content:"MUMTAZ DEAL";
    position:absolute;
    bottom:25px;
    left:25px;
    color:rgba(255,255,255,.8);
    font-size:14px;
    font-weight:900;
    letter-spacing:4px;
}

/* SECTIONS */

.md-section{
    padding:65px 0;
}

.md-section-soft{
    background:var(--soft);
}

.md-section-heading{
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:20px;
    margin-bottom:28px;
}

.md-section-heading h2{
    margin:0;
    font-size:32px;
    line-height:1.1;
}

.md-section-heading p{
    margin:7px 0 0;
    color:var(--muted);
}

/* PRODUCTS */

.md-products{
    display:grid;
    grid-template-columns:
        repeat(4,1fr);
    gap:20px;
}

.md-product{
    background:white;
    border:1px solid var(--border);
    border-radius:var(--radius);
    overflow:hidden;
    box-shadow:var(--shadow);
    transition:.2s;
}

.md-product:hover{
    transform:translateY(-4px);
}

.md-product-image{
    aspect-ratio:1/1;
    background:#f5f5f3;
    display:flex;
    justify-content:center;
    align-items:center;
    overflow:hidden;
}

.md-product-image img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.md-product-body{
    padding:16px;
}

.md-product-title{
    font-weight:700;
    font-size:15px;
    margin-bottom:7px;
}

.md-price{
    font-size:18px;
    font-weight:900;
}

.md-old-price{
    color:#999;
    text-decoration:line-through;
    font-size:13px;
    margin-right:6px;
}

/* FEATURES */

.md-features{
    display:grid;
    grid-template-columns:
        repeat(3,1fr);
    gap:20px;
}

.md-feature{
    padding:28px;
    background:white;
    border:1px solid var(--border);
    border-radius:var(--radius);
}

.md-feature strong{
    display:block;
    font-size:18px;
    margin-bottom:8px;
}

/* CATEGORIES */

.md-categories{
    display:grid;
    grid-template-columns:
        repeat(4,1fr);
    gap:18px;
}

.md-category{
    min-height:150px;
    display:flex;
    justify-content:flex-end;
    flex-direction:column;
    padding:22px;
    border-radius:18px;
    background:
        linear-gradient(
            135deg,
            #eeeeeb,
            #d8d5ca
        );
    transition:.2s;
}

.md-category:hover{
    transform:translateY(-3px);
}

.md-category strong{
    font-size:18px;
}

/* FOOTER */

.md-footer{
    background:#111;
    color:white;
    padding:60px 0 20px;
}

.md-footer-grid{
    display:grid;
    grid-template-columns:
        1.5fr 1fr 1fr 1fr;
    gap:35px;
}

.md-footer h3{
    margin-top:0;
}

.md-footer p,
.md-footer a{
    color:#cfcfcf;
}

.md-footer-links{
    display:grid;
    gap:9px;
}

.md-copyright{
    border-top:1px solid #333;
    margin-top:40px;
    padding-top:20px;
    color:#999;
    font-size:13px;
}

/* WOOCOMMERCE */

.woocommerce ul.products{
    display:grid!important;
    grid-template-columns:
        repeat(4,1fr);
    gap:20px;
}

.woocommerce ul.products li.product{
    width:auto!important;
    margin:0!important;
    background:white;
    border:1px solid var(--border);
    border-radius:16px;
    padding:14px;
}

.woocommerce ul.products li.product .button{
    background:#111;
    color:white;
    border-radius:999px;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button{
    background:#111;
    color:white;
    border-radius:999px;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{
    background:var(--gold);
    color:#111;
}

/* RESPONSIVE */

@media(max-width:1000px){

    .md-nav{
        display:none;
    }

    .md-menu-button{
        display:block;
        margin-left:auto;
    }

    .md-header-actions{
        display:none;
    }

    .md-hero-grid{
        grid-template-columns:1fr;
    }

    .md-products,
    .woocommerce ul.products{
        grid-template-columns:
            repeat(2,1fr);
    }

    .md-categories{
        grid-template-columns:
            repeat(2,1fr);
    }

    .md-footer-grid{
        grid-template-columns:
            repeat(2,1fr);
    }
}

@media(max-width:600px){

    .md-topbar{
        font-size:11px;
    }

    .md-topbar .md-right{
        display:none;
    }

    .md-header-inner{
        min-height:65px;
        flex-wrap:wrap;
    }

    .md-logo{
        font-size:22px;
    }

    .md-search{
        order:10;
        width:100%;
        max-width:none;
        margin-bottom:10px;
    }

    .md-hero{
        padding:52px 0;
    }

    .md-hero h1{
        font-size:43px;
    }

    .md-hero p{
        font-size:16px;
    }

    .md-hero-visual{
        min-height:240px;
    }

    .md-section{
        padding:45px 0;
    }

    .md-section-heading h2{
        font-size:27px;
    }

    .md-products,
    .woocommerce ul.products{
        grid-template-columns:
            repeat(2,1fr);
        gap:12px;
    }

    .md-categories{
        grid-template-columns:
            repeat(2,1fr);
        gap:12px;
    }

    .md-features{
        grid-template-columns:1fr;
    }

    .md-footer-grid{
        grid-template-columns:1fr;
    }
}

/* =========================================================
   CUSTOMER ACCOUNT + THEME MODE
   Existing layout preserved; additions only.
   ========================================================= */

.md-theme-toggle{
    border:1px solid var(--border);
    background:var(--white);
    color:var(--text);
    border-radius:999px;
    width:42px;
    height:42px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    font-size:17px;
    transition:.2s;
}
.md-theme-toggle:hover{border-color:var(--gold);transform:translateY(-1px)}
.md-account-link{font-weight:800}

/* Dark mode keeps the original structure and changes only colors. */
html.md-dark-mode body{background:#101010;color:#f3f3f3}
html.md-dark-mode .md-header,
html.md-dark-mode .md-mobile-menu,
html.md-dark-mode .md-search form,
html.md-dark-mode .md-theme-toggle{background:#171717;color:#f3f3f3}
html.md-dark-mode .md-header,
html.md-dark-mode .md-mobile-menu,
html.md-dark-mode .md-search form{border-color:#2b2b2b}
html.md-dark-mode .md-search input{background:#171717;color:#fff}
html.md-dark-mode .md-nav a:hover{color:var(--gold-light)}
html.md-dark-mode .md-section-soft{background:#161616}
html.md-dark-mode .md-category,
html.md-dark-mode .md-feature,
html.md-dark-mode .md-product{background:#181818;border-color:#2b2b2b}
html.md-dark-mode .md-footer{background:#0b0b0b}
html.md-dark-mode .md-footer p,
html.md-dark-mode .md-footer a{color:#bdbdbd}
html.md-dark-mode .woocommerce-account .woocommerce-MyAccount-navigation,
html.md-dark-mode .woocommerce-account .woocommerce-MyAccount-content,
html.md-dark-mode .woocommerce form.login,
html.md-dark-mode .woocommerce form.register,
html.md-dark-mode .woocommerce form.lost_reset_password{background:#181818;border-color:#2b2b2b;color:#f3f3f3}
html.md-dark-mode .woocommerce input.input-text,
html.md-dark-mode .woocommerce input[type=email],
html.md-dark-mode .woocommerce input[type=password],
html.md-dark-mode .woocommerce input[type=text],
html.md-dark-mode .woocommerce textarea,
html.md-dark-mode .woocommerce select{background:#111;color:#fff;border-color:#333}

/* WooCommerce My Account dashboard */
.woocommerce-account .woocommerce-MyAccount-navigation{
    width:25%;
    background:#fff;
    border:1px solid var(--border);
    border-radius:var(--radius);
    padding:12px;
    box-shadow:var(--shadow);
}
.woocommerce-account .woocommerce-MyAccount-content{width:71%;background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow)}
.woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0;padding:0}
.woocommerce-account .woocommerce-MyAccount-navigation li{margin:0 0 5px}
.woocommerce-account .woocommerce-MyAccount-navigation a{display:block;padding:11px 13px;border-radius:10px;font-weight:700}
.woocommerce-account .woocommerce-MyAccount-navigation a:hover,
.woocommerce-account .woocommerce-MyAccount-navigation .is-active a{background:var(--black);color:#fff}
.woocommerce-account .woocommerce-MyAccount-content a{color:#9a7710}
.woocommerce-account .woocommerce-MyAccount-content .button,
.woocommerce form .button{background:var(--black);color:#fff;border:0;border-radius:999px;padding:12px 20px;font-weight:800}
.woocommerce form.login,.woocommerce form.register,.woocommerce form.lost_reset_password{border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:28px;background:#fff}
.woocommerce form .input-text{border:1px solid var(--border);border-radius:10px;padding:12px 13px}
.woocommerce form .input-text:focus{outline:2px solid rgba(201,162,39,.22);border-color:var(--gold)}
.woocommerce .woocommerce-form-login__submit,.woocommerce .woocommerce-form-register__submit{background:var(--gold)!important;color:#111!important}
.woocommerce .woocommerce-form-login__rememberme{margin:8px 0 12px}

@media(max-width:900px){
    .woocommerce-account .woocommerce-MyAccount-navigation,
    .woocommerce-account .woocommerce-MyAccount-content{width:100%;float:none;margin-bottom:18px}
}

@media(max-width:760px){
    .md-theme-toggle{width:40px;height:40px}
    .md-header-actions{gap:8px}
    .md-account-link{font-size:13px}
}