/* ==========================================================
   ADAOWERRI KITCHEN DESIGN SYSTEM
   VARIABLES.CSS
   Version: 1.0
   ========================================================== */

:root{

/*==========================================================
  BRAND COLORS
==========================================================*/

--color-primary:#1F5E3B;
--color-primary-dark:#17482D;
--color-primary-light:#2E7D53;

--color-secondary:#D62828;
--color-secondary-dark:#B51F1F;
--color-secondary-light:#F05C5C;

--color-accent:#F4A300;
--color-accent-light:#FFD166;

--color-success:#16A34A;
--color-warning:#F59E0B;
--color-danger:#DC2626;

--color-white:#FFFFFF;
--color-black:#101010;

--color-bg:#FFFDF8;
--color-bg-alt:#F8F5EE;

--color-surface:#FFFFFF;

--color-text:#1E1E1E;
--color-text-light:#6B7280;
--color-text-muted:#9CA3AF;

--color-border:#ECECEC;


/*==========================================================
  TYPOGRAPHY
==========================================================*/

--font-heading:'Poppins',sans-serif;
--font-body:'Inter',sans-serif;

--font-size-xs:.75rem;
--font-size-sm:.875rem;
--font-size-base:1rem;
--font-size-lg:1.125rem;
--font-size-xl:1.25rem;
--font-size-2xl:1.5rem;
--font-size-3xl:2rem;
--font-size-4xl:2.75rem;
--font-size-5xl:3.5rem;

--line-height:1.7;


/*==========================================================
  FONT WEIGHTS
==========================================================*/

--fw-light:300;
--fw-regular:400;
--fw-medium:500;
--fw-semibold:600;
--fw-bold:700;
--fw-black:800;


/*==========================================================
  CONTAINERS
==========================================================*/

--container-width:1320px;
--container-small:1180px;


/*==========================================================
  SPACING
==========================================================*/

--space-xs:.5rem;
--space-sm:.75rem;
--space-md:1rem;
--space-lg:1.5rem;
--space-xl:2rem;
--space-2xl:3rem;
--space-3xl:4rem;
--space-4xl:6rem;


/*==========================================================
  BORDER RADIUS
==========================================================*/

--radius-xs:4px;
--radius-sm:8px;
--radius-md:14px;
--radius-lg:20px;
--radius-xl:30px;
--radius-pill:999px;


/*==========================================================
  SHADOWS
==========================================================*/

--shadow-xs:0 2px 6px rgba(0,0,0,.04);

--shadow-sm:0 8px 25px rgba(0,0,0,.06);

--shadow-md:0 18px 45px rgba(0,0,0,.08);

--shadow-lg:0 25px 70px rgba(0,0,0,.12);


/*==========================================================
  TRANSITIONS
==========================================================*/

--transition-fast:.2s ease;

--transition:.35s ease;

--transition-slow:.6s ease;


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

--button-height:56px;

--button-radius:999px;


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

--header-height:90px;

--mobile-header-height:72px;


/*==========================================================
  Z INDEX
==========================================================*/

--z-header:1000;

--z-dropdown:1100;

--z-overlay:1200;

--z-modal:1300;

--z-toast:1400;


/*==========================================================
  IMAGE RADIUS
==========================================================*/

--image-radius:20px;


/*==========================================================
  CARD
==========================================================*/

--card-radius:20px;

--card-padding:1.5rem;

--card-bg:#FFFFFF;

}