/*
 Theme Name: divi-child
 Theme URI: https://mrhbazhni.com
 Description: Child theme personnalisé pour MRHBAZHNI - Divi + WooCommerce.
 Author: MRHBAZHNI
 Author URI: https://mrhbazhni.com
 Template: Divi
 Version: 1.0.0
*/

/* ============================================= */
/* MRHBAZHNI GLOBAL DESIGN SYSTEM                */
/* ============================================= */
:root {
    /* Brand colors */
    --mrhba-ink: #252334;
    --mrhba-navy: #2B2D42;
    --mrhba-slate: #8D99AE;
    --mrhba-red: #EF233C;
    --mrhba-red-deep: #D90429;
    --mrhba-sand: #F6F1E8;
    --mrhba-ivory: #FFFDF8;
    --mrhba-clay: #B86B45;
    --mrhba-gold: #C9A14A;
    --mrhba-white: #FFFFFF;
    --mrhba-black: #000000;
    --mrhba-border: #E7E1D8;
    --mrhba-surface: var(--mrhba-white);
    --mrhba-surface-soft: #FAF6EF;
    --mrhba-text-muted: #6F7380;
    --mrhba-accent: var(--mrhba-red);

    /* Legacy aliases kept for existing Divi/module CSS */
    --mw-blue-gray: var(--mrhba-slate);
    --mw-navy: var(--mrhba-navy);
    --mw-light-gray: #EDF2F4;
    --mw-red: var(--mrhba-red);
    --mw-dark-red: var(--mrhba-red-deep);
    --mw-white: var(--mrhba-white);
    --mw-black: var(--mrhba-black);

    /* Typography */
    --mrhba-font-heading: 'Playfair Display', Georgia, serif;
    --mrhba-font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

    --mrhba-text-xs: 0.8125rem;
    --mrhba-text-sm: 0.9375rem;
    --mrhba-text-md: 1rem;
    --mrhba-text-lg: 1.125rem;
    --mrhba-text-xl: 1.375rem;
    --mrhba-text-2xl: clamp(1.5rem, 1.15rem + 1.2vw, 1.875rem);
    --mrhba-text-3xl: clamp(1.875rem, 1.35rem + 2vw, 2.5rem);
    --mrhba-text-4xl: clamp(2.25rem, 1.45rem + 3.2vw, 3.5rem);

    --mrhba-line-tight: 1.15;
    --mrhba-line-snug: 1.3;
    --mrhba-line-normal: 1.6;
    --mrhba-line-relaxed: 1.75;

    /* Spacing */
    --mrhba-space-1: 0.25rem;
    --mrhba-space-2: 0.5rem;
    --mrhba-space-3: 0.75rem;
    --mrhba-space-4: 1rem;
    --mrhba-space-5: 1.25rem;
    --mrhba-space-6: 1.5rem;
    --mrhba-space-8: 2rem;
    --mrhba-space-10: 2.5rem;
    --mrhba-space-12: 3rem;
    --mrhba-space-16: 4rem;
    --mrhba-space-20: 5rem;

    /* Layout */
    --mrhba-container-sm: 760px;
    --mrhba-container: 1120px;
    --mrhba-container-lg: 1280px;
    --mrhba-header-height: 82px;
    --mrhba-nav-gap: 28px;
    --mrhba-nav-font-size: 0.92rem;

    /* Shape and depth */
    --mrhba-radius-sm: 4px;
    --mrhba-radius-md: 8px;
    --mrhba-radius-lg: 12px;
    --mrhba-radius-xl: 16px;
    --mrhba-radius-pill: 999px;

    --mrhba-shadow-sm: 0 2px 8px rgba(37, 35, 52, 0.08);
    --mrhba-shadow-md: 0 8px 24px rgba(37, 35, 52, 0.12);
    --mrhba-shadow-lg: 0 18px 48px rgba(37, 35, 52, 0.16);

    --mrhba-border-soft: 1px solid var(--mrhba-border);
    --mrhba-transition-fast: 160ms ease;
    --mrhba-transition-base: 240ms ease;

    --mrhba-z-header: 100;
    --mrhba-z-sticky: 200;
    --mrhba-z-modal: 1000;
}

/* ============================================= */
/* BASE TYPOGRAPHY                               */
/* ============================================= */
body {
    font-family: var(--mrhba-font-body);
    color: var(--mrhba-ink);
    background-color: var(--mrhba-ivory);
    line-height: var(--mrhba-line-normal);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--mrhba-font-heading);
    color: var(--mrhba-navy);
    font-weight: 700;
    line-height: var(--mrhba-line-tight);
    margin-top: 0;
}

h1 {
    font-size: var(--mrhba-text-4xl);
    margin-bottom: var(--mrhba-space-6);
}

h2 {
    font-size: var(--mrhba-text-3xl);
    margin-bottom: var(--mrhba-space-5);
}

h3 {
    font-size: var(--mrhba-text-2xl);
    margin-bottom: var(--mrhba-space-4);
}

h4 {
    font-size: var(--mrhba-text-xl);
    margin-bottom: var(--mrhba-space-3);
}

h5 {
    font-size: var(--mrhba-text-lg);
    margin-bottom: var(--mrhba-space-3);
}

h6 {
    font-size: var(--mrhba-text-md);
    margin-bottom: var(--mrhba-space-2);
}

p {
    margin-top: 0;
}

a {
    color: var(--mrhba-red-deep);
    transition: color var(--mrhba-transition-fast);
}

a:hover {
    color: var(--mrhba-clay);
}

:focus-visible {
    outline: 2px solid var(--mrhba-red);
    outline-offset: 3px;
}

/* ============================================= */
/* REUSABLE GLOBAL CLASSES                       */
/* ============================================= */
.mrhba-container,
.mrhba-container-sm,
.mrhba-container-lg {
    width: min(100% - 32px, var(--mrhba-container));
    margin-inline: auto;
}

.mrhba-container-sm {
    width: min(100% - 32px, var(--mrhba-container-sm));
}

.mrhba-container-lg {
    width: min(100% - 32px, var(--mrhba-container-lg));
}

.mrhba-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--mrhba-space-2);
    min-height: 44px;
    padding: 0.85rem 1.35rem;
    border: var(--mrhba-border-soft);
    border-radius: var(--mrhba-radius-md);
    font-family: var(--mrhba-font-body);
    font-size: var(--mrhba-text-sm);
    font-weight: 700;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    transition: background-color var(--mrhba-transition-base), border-color var(--mrhba-transition-base), color var(--mrhba-transition-base), transform var(--mrhba-transition-base), box-shadow var(--mrhba-transition-base);
}

.mrhba-btn:hover {
    text-decoration: none;
    transform: translateY(-1px);
}

.mrhba-btn-primary {
    background: var(--mrhba-red);
    border-color: var(--mrhba-red);
    color: var(--mrhba-white);
    box-shadow: var(--mrhba-shadow-sm);
}

.mrhba-btn-primary:hover {
    background: var(--mrhba-red-deep);
    border-color: var(--mrhba-red-deep);
    color: var(--mrhba-white);
    box-shadow: var(--mrhba-shadow-md);
}

.mrhba-btn-secondary {
    background: var(--mrhba-navy);
    border-color: var(--mrhba-navy);
    color: var(--mrhba-white);
}

.mrhba-btn-secondary:hover {
    background: var(--mrhba-ink);
    border-color: var(--mrhba-ink);
    color: var(--mrhba-white);
}

.mrhba-btn-ghost {
    background: transparent;
    border-color: var(--mrhba-border);
    color: var(--mrhba-navy);
}

.mrhba-btn-ghost:hover {
    background: var(--mrhba-sand);
    border-color: var(--mrhba-clay);
    color: var(--mrhba-ink);
}

.mrhba-btn-small {
    min-height: 38px;
    padding: 0.65rem 1rem;
    font-size: var(--mrhba-text-xs);
}

.mrhba-btn-full {
    width: 100%;
}

.mrhba-text-center {
    text-align: center;
}

.mrhba-text-muted {
    color: var(--mrhba-slate);
}

.mrhba-section {
    padding-block: var(--mrhba-space-16);
}

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

.mrhba-hidden-mobile {
    display: initial;
}

.mrhba-hidden-desktop {
    display: none;
}

@media (max-width: 767px) {
    .mrhba-hidden-mobile {
        display: none !important;
    }

    .mrhba-hidden-desktop {
        display: initial;
    }
}

@media (max-width: 390px) {
    .mrhba-container,
    .mrhba-container-sm,
    .mrhba-container-lg {
        width: min(100% - 24px, 100%);
    }

    .mrhba-section {
        padding-block: var(--mrhba-space-10);
    }
}