html {
    font-size: 14px;
    scroll-behavior: smooth !important;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
        scroll-behavior: smooth !important;
    }
}

.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%;
    scroll-behavior: smooth !important;
}

body {
  margin-bottom: 60px;
}


.navbar-brand {
    margin-left: 25px;
}

.navbar-font{
    font-size: 16px!Important;
}

.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;
}

/* Custom Classes */
.blue-font {
    color: #0052CC !important;
}

.grey-font {
    color: #929497 !important;
}

.login-input-width {
    width: 30% !important;
}

.blue-footer-btn {
    background-color: #3256fc !important;
    color: white !important;
}

.new-font {
    font-family: 'Lucida Bright';
    font-size: 16pt;
}

.navbar-font {
    font-size: 14pt;
}

.blue-btn {
    --bs-btn-bg: #3256fc !important;
}

.main-container {
    margin: 0 auto;
    width: 100%;
}

.medline-logo {
    width: 75px;
    height: 75px;
}

.modal-settings {
    min-width: 600px !important;
    max-width: 600px !important;
}

.hide-section {
    display: none !important;
}

.show-section {
    display: block;
}

.info-text {
    font-size: 14pt;
}

.header-container {
    height: 70px !important;
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.body-container {
    height: calc(100vh - 121px) !important;
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.login-container {
    height: calc(100vh - 120px) !important;
}

.info-container {
    min-height: 5vh !important;
    max-height: 30vh !important;
}

.footer-container {
    height: 50px !important;
    bottom: unset !important;
}

.notes-div {
    height: calc(100vh - 288px) !important;
    overflow-y: auto;
}

.chat-div {
    height: calc(100vh - 196px) !important;
    overflow-y: auto;
}

.logo-container {
    margin: 0 auto;
    width: 100%;
}

.footer-text {
    font-size: 11pt;
}

.info-header {
    font-size: 23pt !important;
}

.mobile-btn {
    width: 48px !important;
    height: 48px !important;
}

.w-33 {
    width: 33% !important;
}

.h-mobile {
    height: 48px !important;
}

.modal-no-border {
    border: none !important;
}

.organization-img {
    width: 200px;
    height: 200px;
}

::-webkit-scrollbar {
    width: 5px;
}

::-webkit-scrollbar-track {
    background: none;
}

::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Landing Page */
.landing-bg {
    background-image: linear-gradient(to top, #47BCFF, #3256FC);
}

.white-font {
    color: white;
}

@font-face {
    font-family: 'SF-Pro';
    src: url('/fonts/SF-Pro.ttf') format('truetype');
}

@font-face {
    font-family: 'CocoGothic';
    src: url('/fonts/CocoGothic_trial.ttf') format('truetype');
}

.title-font {
    font-family: 'SF-Pro', sans-serif;
}

.title-text-1 {
    font-size: 32pt;
}

.title-text-2 {
    font-size: 24pt !important;
}

.title-text-3 {
    font-size: 14pt;
}

.title-text-4 {
    font-size: 20pt !important;
}

.login-btn {
    width: 180px;
}

.login-logo {
    height: 60px;
    width: 390px;
}

.header-logo {
    height: 40px;
    width: 260px;
}

.accordion-border-new {
    border: none !important;
    box-shadow: none !important;
}

/* Desktop */
@media (pointer: coarse) and (hover: hover), (pointer: coarse) and (min-height: 1000px) and (min-width: 1000px) {
    .login-btn {
        width: 180px;
    }

    .login-logo {
        height: 60px;
        width: 390px;
    }

    .header-logo {
        height: 40px;
        width: 260px;
    }
}

/* Mobile */
@media (pointer: coarse) and (hover: none) and (max-width: 1000px) and (max-height: 1000px) {
    .login-btn {
        width: 140px;
    }

    .login-logo {
        height: 50px;
        width: 325px;
    }

    .header-logo {
        height: 30px;
        width: 195px;
    }
}

/* Desktop */
@media (pointer: coarse) and (hover: hover), (pointer: coarse) and (min-height: 1000px) and (min-width: 1000px) {
    .logo-container {
        margin: 0 auto;
        width: 100%;
    }

    .notes-div {
        height: calc(100vh - 288px) !important;
        overflow-y: auto;
    }

    .chat-div {
        height: calc(100vh - 196px) !important;
        overflow-y: auto;
    }

    .footer-text {
        font-size: 11pt;
    }

    .info-header {
        font-size: 23pt !important;
    }

    .medline-logo {
        width: 75px;
        height: 75px;
    }

    .info-text {
        font-size: 12pt;
    }

    .login-input {
        max-width: 350px !important;
    }

    .header-container {
        height: 70px !important;
        margin-left: 30px !important;
        margin-right: 30px !important;
    }
}

/* Mobile */
@media (pointer: coarse) and (hover: none) and (max-width: 1000px) and (max-height: 1000px) {
    .logo-container {
        margin: 0 auto;
        width: unset;
    }

    .footer-container {
        height: 36px !important;
        line-height: 32px !important;
    }

    .body-container {
        height: calc(100vh - 107px) !important;
        margin-left: unset !important;
        margin-right: unset !important;
    }

    .header-container {
        height: 70px !important;
        margin-left: unset !important;
        margin-right: unset !important;
    }

    .login-container {
        height: calc(100vh - 106px) !important;
    }

    .settings-container {
        height: calc(100vh - 200px) !important;
    }

    .notes-div {
        height: calc(100vh - 271px) !important;
        overflow-y: auto;
    }

    .chat-div {
        height: calc(100vh - 220px) !important;
        overflow-y: auto;
    }

    .footer-text {
        font-size: 8pt;
    }

    .info-header {
        font-size: 16pt !important;
    }

    .medline-logo {
        display: none;
    }

    .info-text {
        font-size: 12pt;
    }

    .login-input-width {
        width: 50% !important;
    }
}