:root {
    --deep: #05054d; /* гарчиг */
    --grid: #dee2e6; /* хүснэгтийн хүрээ */
    --cell-hover: #f6f8ff;

    --court-deep: #05054d; /* гүн хөх */
    --court-gold: #c89c54; /* алтлаг */
    --court-gold-2: #e6c76f; /* алтлаг градиент */
    --court-gold-light: #f0e9db;
    --court-gold-light-2: #f1e8db;
    --court-gray: #f2f2f2;
    --court-muted: #666;
}

.cal-card .card-header {
    background: transparent;
    border-bottom: none;
}

.cal-subtitle {
    color: var(--deep);
    font-weight: 700;
}

/* Календарийн хүснэгт */
.cal-table {
    width: 100%;
    border: 1px solid var(--grid);
    border-collapse: separate;
    border-spacing: 0;
    table-layout: fixed;
    background: #fff;
}

.cal-table th,
.cal-table td {
    border-right: 1px solid var(--grid);
    border-bottom: 1px solid var(--grid);
    vertical-align: top;
}

.cal-table th:last-child,
.cal-table td:last-child {
    border-right: none;
}

.cal-table th {
    background: var(--court-gray);
    font-weight: 600;
    text-align: center;
    padding: .6rem .25rem;
    color: #495057;
}

.cal-cell {
    min-height: 60px;
    padding: .5rem .5rem .4rem;
    position: relative;
}

.cal-cell:hover {
    background: var(--cell-hover);
}

.cal-cell.other {
    background: var(--court-gray);
    color: #9aa0a6;
}

.cal-date {
    font-weight: 700;
    font-size: .95rem;
    color: #212529;
}

.cal-date.muted {
    color: #9aa0a6;
}

/* Өнгийн дөрвөлжин (event) */
.cal-dots {
    display: flex;
    gap: .4rem;
    flex-wrap: wrap;
    margin-top: .35rem;
    cursor: pointer;
}

.cal-dot {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    display: inline-block;
}

.dot-green {
    background: #18a058;
}

.dot-blue {
    background: #3b82f6;
}

.dot-orange {
    background: #f97316;
}

.dot-yellow {
    background: #eabe6c;
}

.dot-gray {
    background: #94a3b8;
}

/* Өнөөдөр */
.cal-cell.today {
    outline: 1px solid var(--court-gold);
    background: var(--court-gold-light);
}

/* Жижиг дэлгэц дээр өндөр багасгана */
@media (max-width: 576px) {
    .cal-cell {
        min-height: 70px;
    }
}