/*
Theme Name: RR Custom Theme
Theme URI: https://example.com
Author: Your Name
Author URI: https://example.com
Description: A minimal, Elementor-ready starter theme with the Event Decoration brand colors and fonts pre-loaded. No header, footer, or content templates included by design — build everything visually in Elementor. This file only carries brand tokens + a light reset.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: rr-custom-theme
*/

/* =========================================================
   BRAND TOKENS
   Change these once here — Elementor's Global Colors /
   Global Fonts panel will also list them (see functions.php)
   ========================================================= */
:root{
    /* Brand colors, sampled from the reference design */
    --ed-color-primary:      #FF495F; /* Coral/Red — buttons, price badges, promo bar */
    --ed-color-primary-dark: #E23350; /* hover state for primary */
    --ed-color-accent:       #FE8AC6; /* Pink — badges/highlights */
    --ed-color-dark:         #272133; /* Headings / near-black navy */
    --ed-color-body:         #6B7280; /* Body copy grey */
    --ed-color-light:        #FFF3F2; /* Light pink/cream section bg */
    --ed-color-white:        #FFFFFF;
    --ed-color-border:       #ECECEC;

    /* Brand fonts */
    --ed-font-heading: 'Poppins', 'Segoe UI', sans-serif;
    --ed-font-body:    'Inter', 'Segoe UI', sans-serif;

    /* Spacing / radius scale, optional but handy in Elementor */
    --ed-radius-sm: 6px;
    --ed-radius-md: 12px;
    --ed-radius-pill: 999px;
}

/* =========================================================
   MINIMAL RESET — intentionally light so Elementor controls
   almost everything. No layout, header, or footer styling.
   ========================================================= */
*, *::before, *::after{ box-sizing: border-box; }

html{ -webkit-text-size-adjust: 100%; }

body{
    margin: 0;
    font-family: var(--ed-font-body);
    color: var(--ed-color-body);
    background: var(--ed-color-white);
    line-height: 1.6;
}

h1, h2, h3, h4, h5, h6{
    font-family: var(--ed-font-heading);
    color: var(--ed-color-dark);
    margin: 0 0 0.5em;
    line-height: 1.25;
}

a{ color: var(--ed-color-primary); text-decoration: none; }
a:hover{ color: var(--ed-color-primary-dark); }

img{ max-width: 100%; height: auto; display: block; }

button, input, select, textarea{ font-family: var(--ed-font-body); }

/* Basic block-editor / Elementor widget alignment helpers */
.alignwide{ max-width: 1200px; margin-left: auto; margin-right: auto; }
.alignfull{ max-width: none; }

/* =========================================================
   DEFAULT HOMEPAGE (front-page.php)
   Simple placeholder shown until you design the real homepage
   in Elementor. Safe to delete once Elementor content exists.
   ========================================================= */
.rr-home{
    min-height: 80vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ed-color-light);
    padding: 60px 24px;
}
.rr-home__inner{
    max-width: 560px;
    text-align: center;
}
.rr-home__logo img{
    max-height: 72px;
    width: auto;
    margin: 0 auto 24px;
}
.rr-home__mark{
    width: 72px;
    height: 72px;
    margin: 0 auto 24px;
    border-radius: var(--ed-radius-md);
    background: var(--ed-color-primary);
    color: var(--ed-color-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--ed-font-heading);
    font-weight: 700;
    font-size: 24px;
    text-transform: uppercase;
}
.rr-home__title{
    font-size: 34px;
    font-weight: 700;
    margin-bottom: 8px;
}
.rr-home__tagline{
    color: var(--ed-color-body);
    font-size: 17px;
    margin-bottom: 20px;
}
.rr-home__note{
    font-size: 14px;
    color: var(--ed-color-body);
    opacity: 0.8;
    margin-bottom: 24px;
}
.rr-home__cta{
    display: inline-block;
    background: var(--ed-color-primary);
    color: var(--ed-color-white);
    font-family: var(--ed-font-heading);
    font-weight: 600;
    font-size: 15px;
    padding: 12px 28px;
    border-radius: var(--ed-radius-pill);
}
.rr-home__cta:hover{
    background: var(--ed-color-primary-dark);
    color: var(--ed-color-white);
}

/* Skip link (accessibility) — no visible header, but keep this for a11y */
.skip-link{
    position: absolute;
    left: -9999px;
    top: 0;
    background: var(--ed-color-dark);
    color: var(--ed-color-white);
    padding: 10px 16px;
    z-index: 100000;
}
.skip-link:focus{ left: 10px; top: 10px; }
