@use 'sass:math';
@use 'sass:map';
@use 'sass:meta';
@use 'vuetify/lib/styles/tools/functions' as *;

// Custom Variables
// colors
$white: #fff !default;

// cards
$card-title-size: 18px !default;

$body-font-family: 'Plus Jakarta Sans' !default;
$border-radius-root: 7px;
$btn-font-weight: 400 !default;
$btn-letter-spacing: 0 !default;

// Global Shadow
$box-shadow: 0 2px 6px rgba(37,83,185,.1) ;

// Global Radius as per breakeven point

@forward 'vuetify/settings' with (
    $color-pack: false !default,
    // Global font size and border radius
    $font-size-root: 1rem,
    $border-radius-root: $border-radius-root,
    $body-font-family: $body-font-family,
    $heading-font-family: $body-font-family !default,
    // 👉 Typography
    $typography:
        (
            'h1': (
                'size': 2.25rem,
                'weight': 600,
                'line-height': 2.75rem,
                'font-family': inherit
            ),
            'h2': (
                'size': 1.875rem,
                'weight': 600,
                'line-height': 2.25rem,
                'font-family': inherit
            ),
            'h3': (
                'size': 1.5rem,
                'weight': 600,
                'line-height': 2rem,
                'font-family': inherit
            ),
            'h4': (
                'size': 1.25rem,
                'weight': 600,
                'line-height': 1.6rem,
                'font-family': inherit
            ),
            'h5': (
                'size': 1.125rem,
                'weight': 600,
                'line-height': 1.6rem,
                'font-family': inherit
            ),
            'h6': (
                'size': 1rem,
                'weight': 500,
                'line-height': 1.2rem,
                'font-family': inherit
            ),
            'subtitle-1': (
                'size': 0.875rem,
                'weight': 400,
                'line-height': 1.1rem,
                'font-family': inherit
            ),
            'subtitle-2': (
                'size': 0.75rem,
                'weight': 400,
                'line-height': 1rem,
                'font-family': inherit
            ),
            'body-1': (
                'size': 0.875rem,
                'weight': 400,
                'font-family': inherit
            ),
            'body-2': (
                'size': 0.75rem,
                'weight': 400,
                'font-family': inherit
            ),
            'button': (
                'size': 0.875rem,
                'weight': 500,
                'font-family': inherit,
                'text-transform': capitalize
            ),
            'caption': (
                'size': 0.75rem,
                'weight': 400,
                'font-family': inherit
            ),
            'overline': (
                'size': 0.75rem,
                'weight': 500,
                'font-family': inherit,
                'text-transform': uppercase
            )
        )
        !default,
    // 👉 Button
    $button-border-radius: $border-radius-root !default,
    $button-text-letter-spacing: 0 !default,
    $button-text-transform: capitalize,
    $button-elevation: (
        'default': 0,
        'hover': 4,
        'active': 8
    )
    !default,

    // 👉 Tooltip
    $tooltip-background-color: #212121 !default,
    $tooltip-text-color: #fff !default,
    $tooltip-font-size: 0.75rem !default,
    $tooltip-border-radius: 4px !default,
    $tooltip-padding: 4px 8px !default,

    // 👉 Rounded
    $rounded:
        (
            0: 0,
            'sm': $border-radius-root * 0.5,
            null: $border-radius-root,
            'md': $border-radius-root * 1,
            'lg': $border-radius-root + 3,
            'xl': $border-radius-root + 11,
            'pill': 9999px,
            'circle': 50%
        ),

    // 👉 Card
    // $card-color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity)) !default,
    $card-elevation: 10 !default,
    $card-title-line-height: 1.6 !default,
    $card-text-padding: 30px !default,
    $card-item-padding: 20px 30px 30px !default,
    $card-actions-padding: 10px 24px 24px !default,
    $card-subtitle-opacity: 1 !default,
    // $card-border-color	$border-color-root
);
