/*
==================================================
Dream Kingdom
Design System v1.0
Theme Tokens
==================================================
Author  : Dream Kingdom
Purpose : Global design tokens used throughout
          the application.
==================================================
*/

:root{

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

--dk-primary:#6D5DFC;
--dk-primary-light:#8B7BFF;
--dk-primary-dark:#5548D9;

--dk-gold:#FFD54F;

--dk-success:#34C759;
--dk-warning:#FF9800;
--dk-danger:#FF6B6B;
--dk-info:#4DA3FF;


/*=================================================
= COLORS - FANTASY WORLD
=================================================*/

--dk-sky:#7ED6FF;
--dk-night:#2C2C54;

--dk-castle:#A79BFF;

--dk-tree:#4CAF50;
--dk-leaf:#66BB6A;

--dk-fire:#FF7043;
--dk-water:#42A5F5;
--dk-earth:#8D6E63;

--dk-magic:#C084FC;


/*=================================================
= BACKGROUNDS
=================================================*/

--dk-bg:#F6F8FF;

--dk-bg-gradient:
linear-gradient(
135deg,
#5B4BDB 0%,
#6D5DFC 45%,
#7ED6FF 100%
);

--dk-card-bg:
rgba(255,255,255,.14);

--dk-card-border:
rgba(255,255,255,.22);

--dk-overlay:
rgba(0,0,0,.45);


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

--dk-text:#2C2C54;

--dk-text-light:#6E7191;

--dk-text-muted:#9DA3B4;

--dk-text-white:#FFFFFF;


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

--dk-font-family:
'Baloo 2',
sans-serif;

--dk-font-size-xs:12px;
--dk-font-size-sm:14px;
--dk-font-size-md:16px;
--dk-font-size-lg:20px;
--dk-font-size-xl:28px;
--dk-font-size-hero:42px;


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

--dk-font-light:400;
--dk-font-normal:500;
--dk-font-semibold:600;
--dk-font-bold:700;
--dk-font-heavy:800;


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

--dk-space-1:4px;
--dk-space-2:8px;
--dk-space-3:12px;
--dk-space-4:16px;
--dk-space-5:20px;
--dk-space-6:24px;
--dk-space-7:32px;
--dk-space-8:40px;
--dk-space-9:48px;
--dk-space-10:64px;


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

--dk-radius-sm:10px;
--dk-radius-md:16px;
--dk-radius-lg:24px;
--dk-radius-xl:32px;

--dk-radius-round:9999px;


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

--dk-shadow-sm:
0 4px 10px rgba(0,0,0,.08);

--dk-shadow-md:
0 10px 25px rgba(0,0,0,.12);

--dk-shadow-lg:
0 20px 45px rgba(0,0,0,.18);

--dk-shadow-xl:
0 30px 80px rgba(0,0,0,.25);


/*=================================================
= GLASSMORPHISM
=================================================*/

--dk-glass-blur:18px;

--dk-glass-opacity:.14;


/*=================================================
= BORDERS
=================================================*/

--dk-border-width:1px;

--dk-border-color:
rgba(255,255,255,.18);


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

--dk-transition-fast:
all .2s ease;

--dk-transition:
all .3s ease;

--dk-transition-slow:
all .5s ease;


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

--dk-z-base:1;

--dk-z-card:10;

--dk-z-dropdown:100;

--dk-z-sticky:500;

--dk-z-modal:1000;

--dk-z-toast:2000;

--dk-z-loading:9999;

}