html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
    color: var(--bs-secondary-color);
    text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
    text-align: start;
}

:root {
    --bg: white;
    --text: black;
    --primary: #0d6efd;
    --secondary: #6c757d;
    --accent: #ffc107;
}

[data-theme="dark"] {
    --bg: #121212;
    --text: white;
    --primary: #66b2ff;
    --secondary: #aaaaaa;
    --accent: #ffdd57;
}


.hamburger-default {
    margin-right: 12px;
}

/* small width */
.logosmall {
    max-width: 80px;
    max-height: 80px;
}

/* ||||||||||Light theme (default) */
body {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

/* Navbar (light theme) */
.navbar {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

.navbar .nav-link {
        color: var(--text) !important;
}

/* Light footer */
footer {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

/*light navbar link hover*/
.navbar .nav-link:hover {
    color: var(--secondary) !important; /* Light mode blue */
}

/*light hamburger icon*/
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='black' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}


#themeToggle i {
    color: var(--text) !important;
}

.textcolor {
    color: var(--text) !important;
    border-color: var(--text) !important;
}

    .socialicon:hover {
        color: var(--secondary) !important;
    }

.secondarycolor{
    color: var(--secondary) !important;
}

/*|||||||||||||||| Dark theme */
[data-theme="dark"] body {
    background-color: var(--bg) !important;
    color: var(--text);
}

/* Navbar (dark theme) */
[data-theme="dark"] .navbar {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

    [data-theme="dark"] .navbar .nav-link {
        color: var(--text) !important;
    }

/* Dark footer */
[data-theme="dark"] footer,
[data-theme="dark"] .footer {
    background-color: var(--bg) !important;
    color: var(--text) !important;
}

/*dark navbar link hover*/
[data-theme="dark"] .navbar .nav-link:hover {
    color: var(--secondary) !important; 
}

/*dark hamburger icon*/
[data-theme="dark"] .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='white' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

[data-theme="dark"] .navbar-toggler {
    border-color: white !important;
}

[data-theme="dark"] #themeToggle i {
    border-color: var(--text) !important;
    color: var(--text) !important;
}

[data-theme="dark"] .secondarycolor {
    color: var(--secondary) !important;
}

[data-theme="dark"] .textcolor {
    color: var(--text) !important;
    border-color: var(--text) !important;
}

[data-theme="dark"] .socialicon:hover {
    color: var(--secondary) !important;
}