/* Aktiv Grotesk Regular */
@font-face {
  font-family: "AktivGrotesk";
  src: url("../font/AktivGrotesk-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Degular Regular */
@font-face {
  font-family: "Degular";
  src: url("../font/Degular-Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/*------------------------------------------------------------------------*/


:root {
    /* Typography */
    --font-family-primary: "Degular", sans-serif;
    --font-family-secondary: "AktivGrotesk", sans-serif;

    /* Font Sizes */
    --headline: 1.5rem; /* 24px */
    --sub-head: 1.125rem; /* 18px */
    --base-text: 1rem; /* 16px */
    --caption: 0.75rem; /* 12px */

    --font-size-sm: 0.875rem; /* 14px */
    --font-size-md: 1rem; /* 16px */
    --font-size-lg: 1.125rem; /* 18px */
    --font-size-xl: 1.5rem; /* 24px */
    --font-size-xxl: 2rem; /* 32px */
    --header-xl: 1.75rem; /* 28px */

    /* Font Weight */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;

    /* Colors (Light, Clean Finance Dashboard) */
    --primary-color: #2563eb;       /* Bright Blue */
    --primary-light: #3b82f6;       /* Light Blue */
    --primary-dark: #1e40af;        /* Dark Blue */
    --primary-light-1: #e0ecff;       /* white Blue */

    

    --secondary-color: #f59e0b;     /* Amber */
    --secondary-light: #fbbf24;     /* Light Amber */
    --secondary-dark: #b45309;      /* Dark Amber */

    --background-color: #f9f9f9;    /* Light Gray Background */
    /*--background-color: #f9fafb;*/    /* Light Gray Background */
    /*--background-color: #fff;    /* white Background */
    --background-secondary: #ffffff;/* White Cards */

    --card-bg: #ffffff;
    --sidebar-bg: #f3f3f5;
    /*--sidebar-bg: #f3f4f6;*/
    /*--sidebar-bg: #fff;*/
    --btn-gradient-color: linear-gradient(90deg, #2563eb 0%, #1e40af 100%);
    --btn-gradient-color1: linear-gradient(180deg, #4480FF 0%, #115DFC 50%, #0550ED 100%);

    /* Text Colors */
    --text-primary-color: #111827;  /* Dark Gray */
    --text-secondary-color: #374151;/* Medium Gray */
    --text-disabled-color: #9ca3af; /* Light Gray */
    --text-hint-color: #6b7280;
    --text-white-color: #ffffff;
    --text-black-color: #000000;
    --text-link-color: #2563eb;
    --text-error-color: #dc2626;    /* Red */
    --text-success-color: #16a34a;  /* Green */
    --text-warning-color: #f59e0b;  /* Amber */

    /* Border Radius */
    --border-radius-xsm: 4px;
    --border-radius-sm: 6px;
    --border-radius-md: 10px;
    --border-radius-lg: 16px;
    --btn-round: 30px;

    /* Spacing */
    --spacing-xxs: 4px;
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-xxl: 48px;
    --letter-spacing-sm: 0.02em;

    /* Shadows (Soft, Subtle for cards) */
    --shadow-xs: 0px 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-sm: 0px 2px 6px rgba(0, 0, 0, 0.08);
    --shadow-md: 0px 4px 10px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0px 10px 20px rgba(0, 0, 0, 0.12);

    /* Social Media Colors */
    --facebook: #1877f2;
    --twitter: #1da1f2;
    --linkedin: #0077b5;
    --instagram: #e4405f;
    --whatsapp: #25d366;
    --youtube: #ff0000;
    --telegram: #0088cc;

    /* Transition */
    --transition-fast: 150ms ease-in-out;
    --transition-medium: 300ms ease-in-out;
    --transition-slow: 500ms ease-in-out;
}