/*
Theme Name: Future MAX
Theme URI: https://future-max.com/
Template: neom-blog
Author: Future MAX
Author URI: https://future-max.com/
Description: Future MAX custom dark theme with a bold black and red visual identity, designed for a premium hair care and lifestyle experience.
Tags: dark, black, red, ecommerce, woocommerce, responsive, custom-background, custom-colors, custom-header, custom-menu, full-width-template
Version: 1.0.0
Text Domain: future-max
*/

/* =========================
   FUTURE MAX GLOBAL COLORS
========================= */

:root {
    --fm-black: #000000;
    --fm-dark: #090909;
    --fm-red: #ff102f;
    --fm-red-dark: #b30018;
    --fm-white: #ffffff;
    --fm-gray: #b8b8b8;
}

/* =========================
   BODY
========================= */

html,
body {
    background: var(--fm-black) !important;
    color: var(--fm-white) !important;
}

/* =========================
   TEXT
========================= */

body,
p,
span,
div,
li {
    color: var(--fm-white);
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--fm-red) !important;
    font-weight: 700;
}

/* Links */
a {
    color: var(--fm-red);
    transition: all 0.25s ease;
}

a:hover,
a:focus {
    color: var(--fm-white);
}

/* =========================
   HEADER
========================= */

header,
.site-header,
.main-header,
.navbar,
.navigation,
.header-area {
    background: var(--fm-black) !important;
    color: var(--fm-white) !important;
}

/* Site title / logo text */
.site-title,
.site-title a {
    color: var(--fm-white) !important;
}

/* Menu links */
.main-navigation a,
.nav-menu a,
.menu a {
    color: var(--fm-white) !important;
}

.main-navigation a:hover,
.nav-menu a:hover,
.menu a:hover {
    color: var(--fm-red) !important;
}

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

button,
.button,
.wp-block-button__link,
input[type="submit"] {
    background: transparent !important;
    color: var(--fm-white) !important;
    border: 1px solid var(--fm-red) !important;
    border-radius: 999px;
    padding: 12px 28px;
    transition: all 0.25s ease;
}

button:hover,
.button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover {
    background: var(--fm-red) !important;
    color: var(--fm-white) !important;
    box-shadow: 0 0 18px rgba(255, 16, 47, 0.55);
}

/* =========================
   CONTENT AREAS
========================= */

.site-content,
.content-area,
main,
article,
section,
.widget,
.sidebar {
    background: var(--fm-black) !important;
    color: var(--fm-white) !important;
}

/* Remove white card backgrounds */
.post,
.page,
.entry-content,
.entry-summary,
.widget-area {
    background: transparent !important;
}

/* =========================
   SIDEBAR / WIDGETS
========================= */

.widget-title {
    color: var(--fm-red) !important;
}

.widget a {
    color: var(--fm-white) !important;
}

.widget a:hover {
    color: var(--fm-red) !important;
}

/* =========================
   FOOTER
========================= */

footer,
.site-footer {
    background: var(--fm-black) !important;
    color: var(--fm-gray) !important;
    border-top: 1px solid rgba(255, 16, 47, 0.35);
}

/* =========================
   POST META
========================= */

.post-content span.tag-links {
    background: var(--fm-red);
    padding: 2px 8px;
    color: var(--fm-white);
    line-height: 2.2;
    border-radius: 4px;
}

.post-content span.cat-links {
    margin-left: 5px;
    color: var(--fm-red);
}

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

input,
textarea,
select {
    background: #0d0d0d !important;
    color: var(--fm-white) !important;
    border: 1px solid #2a2a2a !important;
}

input:focus,
textarea:focus,
select:focus {
    border-color: var(--fm-red) !important;
    outline: none;
    box-shadow: 0 0 0 2px rgba(255, 16, 47, 0.12);
}

/* =========================
   WOOCOMMERCE
========================= */

.woocommerce,
.woocommerce-page {
    background: var(--fm-black) !important;
    color: var(--fm-white) !important;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: #0b0b0b !important;
    border: 1px solid #1d1d1d;
    padding: 16px;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--fm-red) !important;
}

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
    background: var(--fm-red) !important;
    color: var(--fm-white) !important;
    border: none !important;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
    background: var(--fm-white) !important;
    color: var(--fm-black) !important;
}

/* =========================
   FUTURE MAX ACCENT
========================= */

.fm-red {
    color: var(--fm-red) !important;
}

.fm-bg-black {
    background: var(--fm-black) !important;
}

.fm-neon {
    text-shadow:
        0 0 8px rgba(255, 16, 47, 0.75),
        0 0 18px rgba(255, 16, 47, 0.45);
}