/* /booking-system/assets/sport-calendar.css */


.spinner { width: 50px; height: 50px; border: 5px solid rgba(255, 214, 0, 0.2); border-top: 5px solid #FFD600; border-radius: 50%; animation: spin 1s linear infinite; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }

.cal-wrapper { 
    background: var(--booking-bg);  
    border-radius: var(--booking-border-radius); 
    overflow: hidden;
    padding: 10px; 
}

.cal-grid { 
    display: grid; 
    grid-template-columns: 60px repeat(5, 1fr); 
    gap: 0; 
}

.cal-col-header { 
    padding: 15px 0; 
    color:#000; 
    text-align: center; 
    font-weight: 800; 
    font-size: var(--booking-font-size-header); 
    z-index: 2;
}

.cal-day-column:nth-child(even):before {
    content: "";
    background: #fafafa;
    top: -50px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    border-radius: 20px;
    position: absolute
}

.cal-time-label { 
    font-size: var(--booking-font-size-label); 
    color: #000; 
    font-weight: 600; 
    height: 40px; 
    display: flex; 
    align-items: center; 
    justify-content: flex-end; 
    padding-right: 15px; 
}

.cal-slot-visual {
    position: relative;
}

.cal-slot-visual:before {
    position:absolute;
    content: "";
    bottom: 0px;
    left: 2%;
    right: 2%;
    height: 1px;
    background-color: #f2f2f2;
}

.cal-day-column:nth-child(even) .cal-slot-visual:before {
    background-color: #ededed;
}

.cal-day-column .cal-slot-visual:last-of-type:before {
    background-color: transparent !important
}

/* Markery Rezerwacji */
.res-marker { 
    position: absolute; 
    top: 1px; 
    border-radius: var(--booking-border-radius-pill); 
    font-weight: 700; 
    font-size: var(--booking-font-size-tiny); 
    color: #000; 
    cursor: help; 
    z-index: 0; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    overflow: visible !important; 
}

.res-marker:hover {
    z-index: 99
}

.res-text { 
    overflow: hidden; 
    text-overflow: ellipsis; 
    white-space: nowrap; 
    width: 100%; 
    text-align: center; 
    pointer-events: none; 
    padding: 0 2px; 
}

/* Tooltip */
.info-tooltip { 
    visibility: hidden; 
    background-color: #222; 
    color: #fff; 
    text-align: center; 
    padding: 8px 12px; 
    border-radius: var(--booking-border-radius-pill); 
    position: absolute; 
    z-index: 99999; 
    bottom: 100%; 
    left: 50%; 
    transform: translateX(-50%); 
    width: max-content; 
    max-width: 200px; 
    font-size: var(--booking-font-size-small); 
    opacity: 0; 
    transition: opacity 0.2s; 
    pointer-events: none; 
    margin-bottom: 5px; 
}

.res-marker:hover .info-tooltip { 
    visibility: visible !important; 
    opacity: 1 !important; 
}

/* Kolory Markerów */
.type-H { background-color: var(--booking-type-h) !important; }
.type-ST { background-color: var(--booking-type-st) !important; }
.type-B { background-color: var(--booking-type-b) !important; }
.type-SG { background-color: var(--booking-type-sg) !important; }
.status-pending { 
    background-color: var(--booking-pending) !important; 
    color: #666 !important; 
    border: 1px dashed #999 !important; 
}

/* Legenda */
.cal-legend { 
    display: flex; 
    gap: var(--booking-gap); 
    justify-content: center; 
    margin-bottom: var(--booking-margin-bottom); 
    flex-wrap: wrap; 
    font-size: var(--booking-font-size-label); 
}

.legend-item { 
    display: flex; 
    align-items: center; 
    font-weight: 600; 
    color: #555; 
}

.legend-color { 
    width: 14px; 
    height: 14px; 
    border-radius: 3px; 
    margin-right: 6px; 
    border: 1px solid var(--booking-border); 
}

/* Dodatek do sport-calendar.css */
.status-gray { 
    background-color: #dcdcdc !important; 
    color: #555 !important; 
}

#sp-invoice-section {
    display: none
}

.cbf-item__span-2 {
    grid-column: span 2
}