:root {
    /* Новата цветова схема */
    --dj-bg: #0F1112;
    --dj-card: #0F1112CC;
    --dj-primary: #CAAB33;      /* Основен златист (рамки) */
    --dj-head: #FFE78A;         /* Светло златист (заглавия и акценти) */
    --dj-busy: #ef4444;         /* Червено за заети дати (оставено за яснота) */
    --dj-text: #FFFAE7;         /* Основен текст */
    --dj-glass: #0F1112CC;      /* Полупрозрачен тъмен фон */
    --dj-glow: #CAAB33D4;       /* Златисто сияние */
    --dj-active-bg: #FFC65542;  /* Фон при селекция/hover */
}

.dj-calendar-wrapper {
    width: 100%;
    max-width: 1200px; /* По-широк за 3 месеца */
    margin: 0 auto;
    font-family: 'Montserrat', sans-serif;
}

/* Основен контейнер */
#dj-calendar-root {
    background: var(--dj-glass);
    border: 1px solid var(--dj-primary);
    border-radius: 16px;
    padding: 20px;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(10px);
    position: relative;
}

/* Навигация (стрелки) */
.dj-controls {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.dj-btn-nav {
    background: var(--dj-active-bg);
    border: 1px solid var(--dj-primary);
    color: var(--dj-head);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 1.2rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dj-btn-nav:hover {
    background: var(--dj-primary);
    color: #0F1112;
    box-shadow: 0 0 15px var(--dj-glow);
}

/* Мрежа за месеците: Десктоп = 3 колони, Мобил = 1 колона */
.dj-months-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

/* За мобилни устройства - само 1 колона */
@media (max-width: 900px) {
    .dj-months-container {
        grid-template-columns: 1fr; 
    }
}

.dj-month-block {
    background: rgba(255,255,255,0.02);
    padding: 15px;
    border-radius: 12px;
}

.dj-month-title {
    text-align: center;
    color: var(--dj-head);
    font-size: 1.1rem;
    margin-bottom: 15px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    border-bottom: 1px solid rgba(202, 171, 51, 0.3);
    padding-bottom: 8px;
}

/* Дни */
.dj-days-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 5px;
    text-align: center;
}

.dj-day-name { 
    color: var(--dj-primary); 
    font-size: 0.75rem; 
    margin-bottom: 5px; 
    opacity: 0.8;
}

.dj-date {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    font-size: 0.9rem;
    color: var(--dj-text);
    position: relative; /* За tooltip */
    transition: all 0.2s;
    border: 1px solid transparent;
}

.dj-date:not(.empty) { 
    background: rgba(255, 255, 255, 0.03); 
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.dj-date:not(.empty):not(.busy):hover {
    border-color: var(--dj-primary);
    background: var(--dj-active-bg);
}

/* Заета дата */
.dj-date.busy {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid var(--dj-busy);
    color: #ffaaaa;
    cursor: help; /* Курсор въпросителна */
}

/* TOOLTIP (Балонче с текст) */
.dj-date.busy:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 110%;
    left: 50%;
    transform: translateX(-50%);
    background: #0F1112;
    border: 1px solid var(--dj-primary);
    color: var(--dj-head);
    padding: 8px 12px;
    border-radius: 6px;
    white-space: nowrap;
    font-size: 0.8rem;
    z-index: 100;
    box-shadow: 0 5px 15px var(--dj-glow);
    pointer-events: none;
}
/* Стрелкичка на тултипа */
.dj-date.busy:hover::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: var(--dj-primary) transparent transparent transparent;
}

/* Модален прозорец (Админ) */
.dj-modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0,0,0,0.85); z-index: 9999;
    display: flex; align-items: center; justify-content: center;
}
.dj-modal-content {
    background: var(--dj-card); padding: 30px; border-radius: 12px;
    width: 400px; border: 1px solid var(--dj-primary);
    box-shadow: 0 0 30px var(--dj-glow);
    text-align: center;
}
.dj-modal-content h3 { color: var(--dj-head); margin-top: 0; }
.dj-modal-content input {
    width: 100%; margin: 15px 0; background: #0F1112;
    border: 1px solid var(--dj-primary); color: var(--dj-text); padding: 10px;
    border-radius: 6px; outline: none;
}
.dj-modal-content input:focus {
    box-shadow: 0 0 10px var(--dj-glow);
}
.dj-modal-buttons { display: flex; justify-content: space-between; margin-top: 15px; }

/* Легенда */
.dj-legend { 
    display: flex; justify-content: center; gap: 20px; 
    margin-top: 15px; color: var(--dj-text); font-size: 0.9rem; opacity: 0.8;
}
.dot { width: 10px; height: 10px; border-radius: 50%; display: block; }
.free .dot { background: rgba(255, 255, 255, 0.2); border: 1px solid var(--dj-primary); }
.busy .dot { background: var(--dj-busy); box-shadow: 0 0 8px var(--dj-busy); }