html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100%;
}

body {
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
    width: 100%;
}

/* Navbar background */
.custom-navbar,
.custom-navbar .navbar-menu {
    background-color: #222;    
}

/* Logo + company name */
.custom-navbar .navbar-item,
.custom-navbar .navbar-link {
    color: #E5E4E2;
}

/* Hover */
.custom-navbar .navbar-menu .navbar-item:hover:not(.is-active),
.custom-navbar .navbar-menu .navbar-link:hover:not(.is-active) {
    background-color: #444 !important;
    color: #d4af37 !important;
}
.custom-navbar .navbar-brand .navbar-item:hover,
.custom-navbar .navbar-brand .navbar-link:hover {
    background-color: #444;
}

.custom-navbar .navbar-item.is-active {
    background-color: #d4af37;
    border-radius: 0 0 4px 4px;
    box-shadow: 0px 5px 2px #8884;
    margin-bottom: 2px;
    color: #000;
}

/* Dropdown menu */
.custom-navbar .navbar-dropdown {
    background-color: #222;
    border-top: 2px solid #d4af37;
}

/* Dropdown item */
.custom-navbar .navbar-dropdown .navbar-item {
    background-color: #222 !important;
    color: #E5E4E2 !important;
}

.custom-navbar .navbar-dropdown .navbar-item.has-text-danger {
    color: red !important;
}

/* Dropdown hover */
.custom-navbar .navbar-dropdown .navbar-item:hover {
    background-color: #d4af37;
    /* color: #000; */
}

/* Navbar burger */
.custom-navbar .navbar-burger {
    color: #d4af37;
}

.custom-navbar .container {
    margin: 0 2%;
    max-width: 96% !important;
}

.custom-footer {
    background-color: #222;
    color: #E5E4E2;
}

.custom-footer a {
    color: #E5E4E2;
}

.login-background {
    background: linear-gradient(
        135deg,
        #0f0f0f 0%,
        #1a1a1a 100%
    );
}

.login-card {
    border-radius: 18px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
    overflow: hidden;
    border: 1px solid #2a2a2a;
}

.login-card .card-content {
    padding: 3rem;
}

.input {
    border-radius: 10px;
}

.button {
    border-radius: 10px;
}

.label {
    font-weight: 600;
}

.login-wrapper {
    width: 420px;
    max-width: 95vw;
}

.w-120 { width: 120px !important; }
.w-90 { width: 90px !important; }

.tooltip-wrapper {
  position: relative;
  display: inline-block;
}

.tooltip-box {
  display: none;
  position: absolute;
  bottom: 20px;
  left: 0;
  z-index: 9999;
}

.tooltip-wrapper:hover .tooltip-box {
  display: block;
}