/* =========================================================
   GTCLED STORE CONTENT THEME (Header & Footer Excluded)
   ========================================================= */

:root {
    --gtc-green: #00e676;
    --gtc-green-dark: #00c853;
    --gtc-dark: #0f172a;
    --gtc-dark-2: #1e293b;
    --gtc-text: #ffffff;
    --gtc-muted: #94a3b8;
    --gtc-border: rgba(255,255,255,0.10);
}

/* =========================
   MAIN PAGE BACKGROUND
   ========================= */

body {
    background: #f8fafc;
    color: #1e293b;
}

#mainWrapper,
#wrapper {
    background: #f8fafc;
}

/* =========================
   MAIN CONTENT & HEADINGS
   ========================= */

#contentMainWrapper {
    background: #f8fafc;
}

#contentMainWrapper,
#contentMainWrapper p,
#contentMainWrapper div {
    color: #1e293b;
}

h1,
h2,
h3 {
    color: #0f172a;
}

h1 {
    font-weight: 800;
}

h2,
h3 {
    font-weight: 700;
}

.centerBoxHeading,
.sideBoxHeading {
    color: #0f172a;
}

/* =========================
   PRODUCT CARDS
   ========================= */

.productBoxContents,
.centerBoxContentsProducts,
.productListing-data,
.productListing-even,
.productListing-odd {
    background: #ffffff;
}

.productBoxContents,
.centerBoxContentsProducts {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
}

.productBoxContents:hover,
.centerBoxContentsProducts:hover {
    border-color: var(--gtc-green);
    box-shadow: 0 8px 25px rgba(15,23,42,0.10);
}

.productBoxContents a,
.centerBoxContentsProducts a {
    color: #0f172a;
    font-weight: 700;
}

.productBoxContents a:hover,
.centerBoxContentsProducts a:hover {
    color: var(--gtc-green-dark);
}

/* =========================
   BUTTONS
   ========================= */

.button,
.cssButton,
#cartAdd,
input[type="submit"],
input[type="button"] {
    background: var(--gtc-green);
    color: #0f172a;
    border: none;
    border-radius: 6px;
    font-weight: 700;
}

.button:hover,
.cssButton:hover,
#cartAdd:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
    background: var(--gtc-green-dark);
    color: #ffffff;
}

/* =========================
   SIDEBARS
   ========================= */

.leftBoxContainer,
.rightBoxContainer {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 15px;
}

.leftBoxHeading,
.rightBoxHeading {
    background: #0f172a;
    color: #ffffff;
    border-bottom: 2px solid var(--gtc-green);
    padding: 10px 12px;
    font-weight: 700;
}

.leftBoxContents,
.rightBoxContents {
    background: #ffffff;
    color: #334155;
}

.leftBoxContents a,
.rightBoxContents a {
    color: #334155;
}

.leftBoxContents a:hover,
.rightBoxContents a:hover {
    color: var(--gtc-green-dark);
}

/* =========================
   BREADCRUMBS
   ========================= */

#navBreadCrumb {
    background: #e2e8f0;
    color: #475569;
    padding: 8px 15px;
}

#navBreadCrumb a {
    color: #0f172a;
}

#navBreadCrumb a:hover {
    color: var(--gtc-green-dark);
}

/* =========================
   FORMS
   ========================= */

input[type="text"],
input[type="email"],
input[type="password"],
textarea,
select {
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    background: #ffffff;
    color: #1e293b;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
    border-color: var(--gtc-green);
    outline: none;
    box-shadow: 0 0 0 3px rgba(0,230,118,0.12);
}

/* =========================
   MOBILE
   ========================= */

@media (max-width: 600px) {
    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 22px;
    }
}