/* ================================
   BUTTON STYLES
   ================================ */
button {
    padding: 8px 16px;
    background: var(--dusk);
    color: var(--bud);
    border: none;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;

    &:hover {
        background: var(--shade);
        color: var(--bloom);
    }

    &:active {
        background: var(--stem);
    }
}

/* ================================
   NEXT DAY BUTTON (IN HEADER)
   ================================ */
.next-day-btn {
    background: var(--stem);
    color: var(--bloom);
    border: 1px solid var(--frond);
    padding: 5px 12px 4px 12px;
    border-radius: 5px;
    font-size: var(--base-font-size);
    font-weight: bold;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    height: auto;
    min-height: unset;

    &:hover {
        background: var(--frond);
        border-color: var(--bud);
    }

    &:active {
        background: var(--stem);
    }
}

/* ================================
   ACTION BUTTONS (IN FOOTER)
   ================================ */
.action-btn {
    background: rgba(76, 175, 80, 0.2);
    border: 1px solid var(--bud);
    color: var(--bud);
    padding: 4px 8px;
    font-size: var(--base-font-size);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    margin: 0;

    &:hover {
        background: rgba(76, 175, 80, 0.4);
        color: var(--bloom);
        border-color: var(--bloom);
    }
}