﻿.angus-modal-header {
    background-color: #dfe7e8;
    color: var(--custom-palette-primary);
    font-weight: 400;
    font-size: 1.75rem;
}

/********* START: Custom Calendar Monthly Rent Component Table *********/
.calendar-table-container {
    overflow-x: auto;
    width: 100%;
}

.calendar-rent-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

/* Header Styles */
.calendar-term-header {
    text-align: left;
    padding-bottom: 10px;
}

.calendar-date-header {
    text-align: center;
    font-weight: normal;
    padding: 10px 0;
}

/* Cell & Row Alignment */
.calendar-term-label {
    padding: 20px 0;
}

.calendar-price-cell {
    padding: 0 !important;
    height: 80px;
    text-align: center;
    position: relative;
}

/* Vertical Column Highlight */
.calendar-active-col {
    background-color: var(--custom-palette-hover-secondary) !important;
}

/* The Button Fix: Full Width and Full Height */
.calendar-price-btn {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    background: transparent;
    cursor: pointer;
    font-size: 1rem;
    color: var(--custom-palette-text-secondary) !important;
    transition: all 0.2s;
}

    /* Selected State: Dark Blue Box */
    .calendar-price-btn.selected {
        background-color: var(--custom-palette-hover-primary) !important;
        color: var(--custom-palette-text-primary) !important;
        font-weight: bold;
        height: 100%;
        width: 100%;
        margin: auto;
    }
/********* END: Custom Calendar Monthly Rent Component Table *********/