body { min-height: 101vh; } body, p, h1, h2, h3, h4, h5, h6 { font-family: 'Inter', sans-serif; } h1, h2, h3, h4, h5, h6 { font-weight: 700; } :root { --bs-primary-rgb: 52, 152, 219; --bs-secondary-rgb: 127, 140, 141; --bs-success-rgb: 46, 204, 113; --bs-info-rgb: 236, 240, 241; --bs-warning-rgb: 241, 196, 15; --bs-danger-rgb: 192, 57, 43; --bs-primary: #3498db; --bs-secondary: #7f8c8d; --bs-success: #2ecc71; --bs-info: #ecf0f1; --bs-warning: #f1c40f; --bs-danger: #c0392b; /* Custom Colors */ --bs-orange: #e67e22; --gradient-white-lime: linear-gradient( 179.4deg, rgb(252, 239, 233) 2.2%, rgb(211, 242, 185) 96.2% ); --gradient-light-soft-blue: linear-gradient( 109.6deg, rgba(125, 89, 252, 1) 11.2%, rgba(218, 185, 252, 1) 91.1% ); --gradient-dark-soft-blue: linear-gradient( 109.6deg, rgba(218, 185, 252, 1) 11.2%, rgba(125, 89, 252, 1) 91.1% ); --gradient-light-soft-blue-vertical: linear-gradient( 0deg, rgba(125, 89, 252, 1) 11.2%, rgba(218, 185, 252, 1) 91.1% ); --soft-box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; } .btn.btn-primary, .btn.btn-outline-primary, .btn.btn-light { --bs-btn-border-radius: 50px; --bs-btn-padding-x: 24px; --bs-btn-padding-y: 8px; } .btn.btn-primary { --bs-btn-bg: #965de9; } .btn.btn-outline-primary { --bs-btn-color: #965de9; --bs-btn-border-color: #965de9; --bs-btn-hover-bg: #965de9; --bs-btn-hover-border-color: #965de9; --bs-btn-active-bg: #965de9; --bs-btn-active-border-color: #965de9; } .btn-light { --bs-btn-color: var(--bs-body-color); --bs-btn-bg: var(--bs-gray-200); --bs-btn-border-color: var(--bs-gray-100); --bs-btn-hover-color: var(--bs-body-color); --bs-btn-hover-bg: var(--bs-gray-300); --bs-btn-hover-border-color: var(--bs-gray-300); --bs-btn-focus-shadow-rgb: 211, 212, 213; --bs-btn-active-color: var(--bs-body-color); --bs-btn-active-bg: var(--bs-gray-300); --bs-btn-active-border-color: var(--bs-gray-300); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: var(--bs-body-color); --bs-btn-disabled-bg: var(--bs-gray-500); --bs-btn-disabled-border-color: var(--bs-gray-500); } .btn-dark { --bs-btn-color: var(--bs-body-bg); --bs-btn-bg: var(--bs-body-color); --bs-btn-border-color: var(--bs-body-color); --bs-btn-hover-color: var(--bs-body-bg); --bs-btn-hover-bg: var(--bs-gray-700); --bs-btn-hover-border-color: var(--bs-gray-700); --bs-btn-focus-shadow-rgb: 66, 70, 73; --bs-btn-active-color: var(--bs-body-bg); --bs-btn-active-bg: var(--bs-gray-700); --bs-btn-active-border-color: var(--bs-gray-700); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: var(--bs-body-bg); --bs-btn-disabled-bg: var(--bs-gray-500); --bs-btn-disabled-border-color: var(--bs-gray-500); } .btn-outline-dark { --bs-btn-color: var(--bs-gray-900); --bs-btn-border-color: var(--bs-gray-900); --bs-btn-hover-color: var(--bs-body-color); --bs-btn-hover-bg: var(--bs-gray-200); --bs-btn-hover-border-color: var(--bs-gray-900); --bs-btn-focus-shadow-rgb: 33, 37, 41; --bs-btn-active-color: var(--bs-body-color); --bs-btn-active-bg: var(--bs-gray-200); --bs-btn-active-border-color: var(--bs-gray-900); --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --bs-btn-disabled-color: var(--bs-gray-900); --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: var(--bs-gray-900); --bs-gradient: none; } .btn-outline-dark.nav-link:hover { --bs-nav-link-hover-color: var(--bs-black); } .dropdown-menu { --bs-dropdown-item-padding-y: 12px; } .alert { --bs-alert-border-radius: 18px; } .form-control, .form-control:focus { border-radius: 18px; background-color: var(--bs-body-bg); color: var(--bs-body-color); } .card { --bs-card-bg: var(--bs-gray-100); } .navbar { --bs-navbar-color: var(--bs-body-color); --bs-navbar-hover-color: var(--bs-gray-500); } /* Dark Mode */ [data-theme='dark']:root { --bs-black: #fff; --bs-white: #000; --bs-gray: #6c757d; --bs-gray-dark: #343a40; --bs-gray-100: #212529; --bs-gray-200: #343a40; --bs-gray-300: #495057; --bs-gray-400: #6c757d; --bs-gray-500: #adb5bd; --bs-gray-600: #ced4da; --bs-gray-700: #dee2e6; --bs-gray-800: #e9ecef; --bs-gray-900: #f8f9fa; --bs-light: #212529; --bs-dark: #f8f9fa; --bs-light-rgb: 33, 37, 41; --bs-dark-rgb: 248, 249, 250; --bs-white-rgb: 0, 0, 0; --bs-black-rgb: 255, 255, 255; --bs-body-color-rgb: 255, 255, 255; --bs-body-bg-rgb: 33, 37, 41; --bs-body-color: #fff; --bs-body-bg: #222; --bs-border-width: 1px; --bs-border-style: solid; --bs-border-color: #dee2e6; --bs-border-color-translucent: rgba(0, 0, 0, 0.175); --bs-link-color: #0d6efd; --bs-link-hover-color: #0a58ca; --bs-code-color: #d63384; --bs-highlight-bg: #fff3cd; --gradient-white-lime: linear-gradient(179.4deg, rgb(3, 16, 22) 2.2%, rgb(44, 13, 67) 96.2%); --gradient-light-soft-blue: linear-gradient( 109.6deg, rgba(125, 89, 252, 1) 11.2%, rgba(25, 25, 25, 1) 91.1% ); --gradient-dark-soft-blue: linear-gradient( 109.6deg, rgba(25, 25, 25, 1) 11.2%, rgba(125, 89, 252, 1) 91.1% ); --gradient-light-soft-blue-vertical: linear-gradient( 0deg, rgba(125, 89, 252, 1) 11.2%, rgba(25, 25, 25, 1) 91.1% ); --soft-box-shadow: rgba(0, 0, 0, 0.3) 0px 7px 29px 0px; }