﻿/* =========================================================
   MAQMA THEME
   Clean / Desktop First / Mobile Optimized
========================================================= */

body.theme-maqma {
    --bg: #f6f8fb;
    --surface: #ffffff;
    --surface-2: #eef2f7;
    --text: #1b2430;
    --text-soft: #6b7785;
    --line: #dce3ec;
    --primary: #1f3c88;
    --primary-hover: #162e6e;
    --accent: #2d4ea3;
    --accent-soft: #e8edf7;
    --success: #16a34a;
    --danger: #dc2626;
    --warning: #f59e0b;
    --radius-sm: 10px;
    --radius-md: 16px;
    --radius-lg: 22px;
    --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.05);
    --shadow-md: 0 10px 28px rgba(15, 23, 42, 0.08);
    background: var(--bg);
    color: var(--text);
}

/* =========================================================
   GLOBAL
========================================================= */

.theme-maqma,
.theme-maqma * {
    box-sizing: border-box;
}

    .theme-maqma a {
        color: inherit;
        text-decoration: none;
        transition: all .18s ease;
    }

    .theme-maqma img {
        max-width: 100%;
        display: block;
    }

    .theme-maqma button,
    .theme-maqma input,
    .theme-maqma select,
    .theme-maqma textarea {
        font: inherit;
    }

    /* =========================================================
   HEADER
========================================================= */

    .theme-maqma .hdr-top {
        background: linear-gradient(90deg, #1f3c88 0%, #162e6e 100%);
        color: #fff;
        border-bottom: 1px solid rgba(255,255,255,.10);
    }

        .theme-maqma .hdr-top a {
            color: #fff;
        }

    .theme-maqma .hdr-main {
        background: linear-gradient(180deg, #ffffff 0%, #f4f7fb 100%);
        border-bottom: 1px solid var(--line);
    }

    .theme-maqma .hdr-logo-text {
        color: var(--primary);
        font-weight: 800;
        letter-spacing: -.02em;
    }

    .theme-maqma .hdr-links a {
        color: #fff;
        opacity: .92;
    }

        .theme-maqma .hdr-links a:hover {
            opacity: 1;
        }

    /* =========================================================
   NAVIGATION
========================================================= */

    .theme-maqma .mega-nav,
    .theme-maqma .mobile-nav {
        background: #fff;
        border-bottom: 1px solid var(--line);
    }

        .theme-maqma .mega-nav a,
        .theme-maqma .mobile-nav a {
            color: var(--text);
            font-weight: 500;
        }

            .theme-maqma .mega-nav a:hover,
            .theme-maqma .mobile-nav a:hover {
                color: var(--primary);
            }

    /* =========================================================
   SEARCH
========================================================= */

    .theme-maqma .hdr-search {
        position: relative;
    }

        .theme-maqma .hdr-search input {
            width: 100%;
            height: 48px;
            border: 1px solid var(--line);
            border-radius: 999px;
            background: #fff;
            color: var(--text);
            padding: 0 56px 0 18px;
            outline: none;
            transition: all .18s ease;
        }

            .theme-maqma .hdr-search input:focus {
                border-color: var(--primary);
                box-shadow: 0 0 0 4px rgba(31, 60, 136, .10);
            }

        .theme-maqma .hdr-search button {
            position: absolute;
            top: 50%;
            right: 6px;
            transform: translateY(-50%);
            width: 38px;
            height: 38px;
            border: 0;
            border-radius: 50%;
            background: var(--primary);
            color: #fff;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all .18s ease;
        }

            .theme-maqma .hdr-search button:hover {
                background: var(--primary-hover);
            }

    /* =========================================================
   BUTTONS
========================================================= */

    .theme-maqma .hero-btn,
    .theme-maqma .promo-btn,
    .theme-maqma .mini-cart-btn,
    .theme-maqma .btn-primary {
        border: 0;
        border-radius: 999px;
        background: var(--primary);
        color: #fff;
        font-weight: 600;
        transition: all .18s ease;
    }

        .theme-maqma .hero-btn:hover,
        .theme-maqma .promo-btn:hover,
        .theme-maqma .mini-cart-btn:hover,
        .theme-maqma .btn-primary:hover {
            background: var(--primary-hover);
            transform: translateY(-1px);
        }

    .theme-maqma .btn-outline {
        background: #fff;
        border: 1px solid var(--line);
        color: var(--text);
    }

        .theme-maqma .btn-outline:hover {
            border-color: var(--primary);
            color: var(--primary);
        }

    /* =========================================================
   CARDS
========================================================= */

    .theme-maqma .plp-card,
    .theme-maqma .prd-card,
    .theme-maqma .promo-card,
    .theme-maqma .cat-card {
        background: var(--surface);
        border: 1px solid var(--line);
        border-radius: var(--radius-lg);
        box-shadow: var(--shadow-sm);
        overflow: hidden;
        transition: all .20s ease;
    }

        .theme-maqma .plp-card:hover,
        .theme-maqma .prd-card:hover,
        .theme-maqma .promo-card:hover,
        .theme-maqma .cat-card:hover {
            transform: translateY(-3px);
            box-shadow: var(--shadow-md);
        }

    /* =========================================================
   FILTERS / SORT
========================================================= */

    .theme-maqma .listing-sort,
    .theme-maqma .listing-filters {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: var(--radius-md);
    }

        .theme-maqma .listing-sort select,
        .theme-maqma .listing-filters select,
        .theme-maqma .listing-filters input {
            border: 1px solid var(--line);
            border-radius: 12px;
            background: #fff;
            color: var(--text);
        }

            .theme-maqma .listing-sort select:focus,
            .theme-maqma .listing-filters select:focus,
            .theme-maqma .listing-filters input:focus {
                border-color: var(--primary);
                box-shadow: 0 0 0 3px rgba(31, 60, 136, .08);
                outline: none;
            }

    /* =========================================================
   BADGES
========================================================= */

    .theme-maqma .plp-badge,
    .theme-maqma .prd-badge,
    .theme-maqma .acc-chip {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        border-radius: 999px;
        background: var(--accent-soft);
        color: var(--primary);
        font-size: .82rem;
        font-weight: 700;
    }

    .theme-maqma .badge-success {
        background: rgba(22,163,74,.12);
        color: var(--success);
    }

    .theme-maqma .badge-danger {
        background: rgba(220,38,38,.10);
        color: var(--danger);
    }

    .theme-maqma .badge-warning {
        background: rgba(245,158,11,.12);
        color: var(--warning);
    }

    /* =========================================================
   ACCOUNT DROPDOWN
========================================================= */

    .theme-maqma .acc-drop {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 18px;
        overflow: hidden;
        box-shadow: var(--shadow-md);
    }

        .theme-maqma .acc-drop a {
            display: flex;
            align-items: center;
            gap: 10px;
            padding: 12px 16px;
            color: var(--text);
        }

            .theme-maqma .acc-drop a:hover {
                background: var(--primary);
                color: #fff;
            }

    /* =========================================================
   MINI CART
========================================================= */

    .theme-maqma .mini-cart {
        background: #fff;
        border: 1px solid var(--line);
        border-radius: 22px;
        box-shadow: var(--shadow-md);
    }

    .theme-maqma .mini-cart-item {
        border-bottom: 1px solid var(--line);
    }

        .theme-maqma .mini-cart-item:last-child {
            border-bottom: 0;
        }

    /* =========================================================
   FORM ELEMENTS
========================================================= */

    .theme-maqma .form-control,
    .theme-maqma .form-select {
        min-height: 46px;
        border: 1px solid var(--line);
        border-radius: 14px;
        background: #fff;
        color: var(--text);
    }

        .theme-maqma .form-control:focus,
        .theme-maqma .form-select:focus {
            border-color: var(--primary);
            box-shadow: 0 0 0 4px rgba(31, 60, 136, .08);
        }

    /* =========================================================
   TABLES
========================================================= */

    .theme-maqma table {
        width: 100%;
        border-collapse: collapse;
    }

        .theme-maqma table th {
            background: #f3f6fb;
            color: var(--text);
            font-weight: 700;
        }

        .theme-maqma table th,
        .theme-maqma table td {
            border-color: var(--line);
        }

    /* =========================================================
   FOOTER
========================================================= */

    .theme-maqma footer {
        background: #fff;
        border-top: 1px solid var(--line);
    }

        .theme-maqma footer a:hover {
            color: var(--primary);
        }

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 991.98px) {

    .theme-maqma .hdr-main {
        padding: 10px 0;
    }

    .theme-maqma .hdr-search input {
        height: 44px;
        padding-left: 14px;
    }

    .theme-maqma .hdr-search button {
        width: 34px;
        height: 34px;
    }

    .theme-maqma .plp-card,
    .theme-maqma .prd-card,
    .theme-maqma .promo-card,
    .theme-maqma .cat-card {
        border-radius: 18px;
    }

    .theme-maqma .listing-sort,
    .theme-maqma .listing-filters {
        border-radius: 14px;
    }

    .theme-maqma .acc-drop {
        border-radius: 16px;
    }
}

@media (max-width: 767.98px) {

    .theme-maqma {
        font-size: 14px;
    }

        .theme-maqma .hdr-top {
            font-size: .82rem;
        }

        .theme-maqma .hero-btn,
        .theme-maqma .promo-btn,
        .theme-maqma .mini-cart-btn,
        .theme-maqma .btn-primary {
            width: 100%;
            justify-content: center;
        }

        .theme-maqma .plp-badge,
        .theme-maqma .prd-badge,
        .theme-maqma .acc-chip {
            font-size: .76rem;
        }
}
