html {
  font-size: 12px;
}

@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;
}

.table {
    --bs-table-color-type: initial;
    --bs-table-bg-type: initial;
    --bs-table-color-state: initial;
    --bs-table-bg-state: initial;
    --bs-table-color: var(--bs-emphasis-color);
    --bs-table-bg: var(--bs-body-bg);
    --bs-table-border-color: var(--bs-border-color);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--bs-emphasis-color);
    --bs-table-striped-bg: rgba(var(--bs-emphasis-color-rgb), 0.05);
    --bs-table-active-color: var(--bs-emphasis-color);
    --bs-table-active-bg: rgba(var(--bs-emphasis-color-rgb), 0.1);
    --bs-table-hover-color: var(--bs-emphasis-color);
    --bs-table-hover-bg: rgba(var(--bs-emphasis-color-rgb), 0.075);
    width: 100%;
    margin-bottom: 1rem;
    vertical-align: top;
    border-color: var(--bs-table-border-color)
}

.mynav-btn {
    max-width: 54px;
}

.calendar-table {
    width: 100%;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
    box-shadow: 5px 5px 5px 0px;
    height: 760px;
    max-height: 515px;
    padding: 5px;
    padding-left: 25px;
    background: var(--bs-orange);
    padding-top: 25px;
}

.event-colors {
    background-color: black;
    color: white;
}

.calendar-header-show {
    margin-top: 5px;
}

.hide-small {
    display: none;
}

.hide-large {
    display: inline;
}

@media screen and (min-width: 576px)
{
    .calendar-table {
        width: 825px;
        height: 760px;
        max-height: 760px;
/*
        border-radius: 5px;
        border-width: 2px;
        border-style: solid;
        box-shadow: 5px 5px 5px 0px;
        padding: 5px;
        padding-left: 25px;
        background: var(--bs-orange);
        padding-top: 25px;
*/
    }

    .calendar-header-show {
        margin-top: 25px;
    }

    .hide-small {
        display: inline;
    }

    .hide-large {
        display: none;
    }

    .event-colors {
        background-color: white;
        color: black;
    }

}

.password-container {
    position: relative;
    display: inline-block;
    width: 100%;
}

#password {
    padding-right: 30px; /* Space for the eye icon */
}

.eye-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 18px;
}