/* Grabzies Marketplace Child Theme */

/* Import parent theme styles */
@import url("../ecommerce-modern-store/style.css");

/* Custom font overrides */
@font-face {
    font-family:'Montserrat';
    src:url('../fonts/Montserrat-Bold.woff2') format('woff2'),
        url('../fonts/Montserrat-Bold.woff') format('woff');
    font-weight:800;
    font-display:swap;
}

@font-face {
    font-family:'Open Sans';
    src:url('../fonts/OpenSans-Regular.woff2') format('woff2'),
        url('../fonts/OpenSans-Regular.woff') format('woff');
    font-weight:400;
    font-display:swap;
}

/* Light/Dark theme variables */
:root {
    --primary: #00bfa5;
    --primary-hover: #009e87;
    --background: #09131f;
    --text: #fff;
    --text-sub: #b0c4de;
    --card-bg: #0d1b2a;
    --card-bg-light: #1a2737;
    --card-bg-light-alt: #12202d;
}

body.light {
    --background: #fff;
    --text: #09131f;
    --text-sub: #555;
    --card-bg: #f0f0f0;
}

/* Apply theme colors */
body {
    background: var(--background);
    color: var(--text);
    transition: background .3s, color .3s;
    font-family: 'Open Sans', sans-serif;
}

/* Buttons */
.btn-primary {
    display:inline-block;
    padding:6px 12px;
    border-radius:999px;
    background: var(--primary);
    color: #09131f;
    font-weight:600;
    text-decoration:none;
    margin-top:10px;
    transition: background .3s;
}
.btn-primary:hover {
    background: var(--primary-hover);
}

/* Header */
header h1 {
    font-family: 'Montserrat', sans-serif;
    font-weight:800;
}
header p {
    color: var(--text-sub);
}

/* Cards */
.card {
    background: var(--card-bg);
    padding:10px;
    border-radius:8px;
    box-shadow:0 1px 3px rgba(0,0,0,0.15);
    transition: background .3s, box-shadow .3s;
    text-align:center;
}
.card:nth-child(even) { background: var(--card-bg-light); }
.card:nth-child(3n) { background: var(--card-bg-light-alt); }
body.light .card { background: var(--card-bg); box-shadow:0 1px 3px rgba(0,0,0,0.1); }
