/* calendar.css — style wydzielone z HTML w ramach porządkowania CSP — 2026-09-24. */
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
    .custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
    .custom-scrollbar::-webkit-scrollbar-thumb { background-color: #cbd5e1; border-radius: 20px; }
    .custom-scrollbar:hover::-webkit-scrollbar-thumb { background-color: #94a3b8; }
    .dark .custom-scrollbar::-webkit-scrollbar-thumb { background-color: #475569; }
    .dark .custom-scrollbar:hover::-webkit-scrollbar-thumb { background-color: #64748b; }
    [x-cloak] { display: none !important; }

.calendar-mini-label{font-size:.625rem;line-height:1rem}

/* Dynamiczne kolory kalendarza korzystają z właściwości niestandardowej ustawianej przez element.style.setProperty(). */
.calendar-event-accent-border { border-left-color: var(--calendar-event-color, #10b981); }
.calendar-event-accent-text { color: var(--calendar-event-color, #10b981); }
.calendar-event-accent-bg { background-color: var(--calendar-event-color, #10b981); }
.calendar-event-past { opacity: .72; }

/* Modal kalendarza — archiwalny status na zdjęciu.
   Pełne, nieprzezroczyste tło gwarantuje czytelność niezależnie od grafiki pod spodem. */
.calendar-modal-archive-badge{
    background:#111827;
    color:#ffffff;
    border:1px solid rgba(255,255,255,.95);
    box-shadow:0 4px 14px rgba(0,0,0,.45);
    text-shadow:0 1px 2px rgba(0,0,0,.7);
    opacity:1;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
.calendar-modal-archive-badge i{
    color:#ffffff;
}


/* Modal kalendarza — nowoczesne kafelki bez małych ikonek.
   Ikony działają jako delikatny watermark w tle, a całość ma więcej przestrzeni na treść. */
.calendar-modal-fact-modern{
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-rows:auto auto 1fr;
    align-content:start;
    gap:.22rem;
    min-width:0;
    min-height:5.8rem;
    padding:.82rem .95rem .9rem;
    border-radius:1rem;
    border:1px solid rgba(148,163,184,.18);
    background:
        linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)),
        radial-gradient(circle at 100% 0%, rgba(255,255,255,.08), transparent 48%),
        rgba(15,23,42,.46);
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.08),
        0 12px 28px rgba(2,6,23,.20);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    text-align:center;
    isolation:isolate;
}
.calendar-modal-fact-modern::before{
    content:"";
    position:absolute;
    inset:0 auto 0 0;
    width:4px;
    background:linear-gradient(180deg, rgba(52,211,153,.95), rgba(59,130,246,.9));
    opacity:.95;
    z-index:0;
}
.calendar-modal-fact-modern::after{
    content:"";
    position:absolute;
    right:-1.15rem;
    top:50%;
    width:4.4rem;
    height:4.4rem;
    transform:translateY(-50%);
    border-radius:999px;
    border:1px solid rgba(255,255,255,.10);
    background:
        radial-gradient(circle at 38% 38%, rgba(52,211,153,.16) 0 12%, transparent 13%),
        radial-gradient(circle at 50% 50%, rgba(59,130,246,.10) 0 46%, transparent 47%);
    box-shadow:
        0 0 0 .65rem rgba(255,255,255,.025),
        inset 0 0 1.25rem rgba(255,255,255,.03);
    z-index:0;
    pointer-events:none;
}

.calendar-modal-fact-modern .calendar-modal-balanced-title,
.calendar-modal-fact-modern .calendar-modal-balanced-primary,
.calendar-modal-fact-modern .calendar-modal-balanced-secondary{
    position:relative;
    z-index:1;
    justify-self:center;
    min-width:0;
}
.calendar-modal-fact-modern .calendar-modal-balanced-title{
    width:100%;
    margin:0 0 .08rem;
    font-size:.72rem;
    line-height:.92rem;
    font-weight:800;
    letter-spacing:.045em;
    text-transform:uppercase;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color:rgba(226,232,240,.86);
}
.calendar-modal-fact-modern .calendar-modal-balanced-primary{
    width:100%;
    font-size:1.1rem;
    line-height:1.2rem;
    font-weight:800;
    text-align:center;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    color:#ffffff;
}
.calendar-modal-fact-modern .calendar-modal-balanced-secondary{
    width:100%;
    margin-top:.08rem;
    padding:0 .1rem;
    font-size:.79rem;
    line-height:.95rem;
    font-weight:500;
    text-align:center;
    color:rgba(226,232,240,.78);
    overflow-wrap:anywhere;
}
.calendar-modal-fact-modern--price .calendar-modal-balanced-secondary{
    color:rgba(248,113,113,.95);
    font-weight:700;
}
.calendar-modal-fact-modern--date{
    min-height:5.8rem;
}
.calendar-modal-fact-modern--date .calendar-modal-balanced-primary{
    font-size:1.06rem;
}
.calendar-modal-fact-modern--status .calendar-modal-balanced-primary{
    font-size:1.05rem;
}
@media (max-width:379px){
    .calendar-modal-fact-modern{
        min-height:5.45rem;
        padding:.72rem .75rem .8rem;
    }
    .calendar-modal-fact-modern::after{
        right:-1.35rem;
        width:4rem;
        height:4rem;
    }
    .calendar-modal-fact-modern .calendar-modal-balanced-title{
        font-size:.65rem;
        line-height:.82rem;
    }
    .calendar-modal-fact-modern .calendar-modal-balanced-primary{
        font-size:1rem;
    }
    .calendar-modal-fact-modern .calendar-modal-balanced-secondary{
        font-size:.72rem;
        line-height:.88rem;
    }
}
@media (min-width:640px){
    .calendar-modal-fact-modern .calendar-modal-balanced-title{
        font-size:.76rem;
        line-height:1rem;
    }
}
