/*
 * Frontend: Aylık Takvimli Fiyatlandırma Sistemi CSS (GÜNCELLENDİ - INLINE/RESPONSIVE)
 * Lokasyon: /scripts/month-prices-system/css/month-prices-system-frontend.css
 */

/* ==========================================================
 * 1. ANA TAKVİM KONTEYNERİ
 * ========================================================== */

.me-price-calendar-wrapper {
    /* Takviminizi ürün detay sayfasında göstermek istediğiniz alana göre bu stilleri ayarlayın */
    margin: 20px 0;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.me-price-calendar-wrapper h3 {
    font-size: 1.4em;
    margin-top: 0;
    margin-bottom: 15px;
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
    color: #333;
}

/* Yükleme Göstergesi */
#me-calendar-loading-indicator {
    text-align: center;
    padding: 10px 0;
    color: #007bff;
    font-weight: bold;
    min-height: 20px;
}

/* ==========================================================
 * 2. FULLCALENDAR ÖZEL STİLLERİ
 * ========================================================== */

#me-frontend-price-calendar {
    padding: 0; /* İç dolguyu kaldırarak tam genişlik kullanımını sağlar */
}

/* Takvim Başlık (Prev/Next) */
.fc .fc-toolbar-title {
    font-size: 1.5em;
    font-weight: 600;
    color: #333;
}

/* Takvim Hücreleri (Genel) */
.fc-daygrid-day-frame {
    padding: 2px;
    border: 1px solid #eee;
    transition: all 0.2s ease;
    cursor: pointer;
}

/* Hafta İçi Başlıkları */
.fc .fc-col-header-cell-cushion {
    padding-top: 5px;
    padding-bottom: 5px;
    color: #666;
    font-weight: 500;
}

/* Kapalı Tarih Stili (background event) */
.fc-daygrid-day-events .fc-daygrid-event.fc-event-background {
    opacity: 0.2; 
}
.fc-daygrid-day[style*="--fc-bg-event-color:#ffdddd"] {
    background-color: #fcebeb; /* Kapalı günler için arka plan rengi */
}

/* Fiyatlı Gün Stili */
.fc-daygrid-day-frame:hover {
    background-color: #f0f8ff;
    border-color: #007bff;
}
.me-price-available {
    background-color: transparent;
    border-color: transparent;
    color: #333 !important;
    bottom: 0;
    top: 15px;
    font-weight: 700;
}
.fc-daygrid-block-event .fc-event-time, .fc-daygrid-block-event .fc-event-title {
    padding: 0;
    color: #000;
    font-size: 12px;
}
.me-price-available:hover {
    background-color: transparent !important;
}

/* Fiyat Etiketi (Event içinde) */
.me-price-label {
    display: block;
    font-size: 12px;
    font-weight: bold;
    color: #000000; /* Yeşil ton */
    margin-top: 3px;
    line-height: 1.2;
}

/* ==========================================================
 * 3. SEÇİM BİLGİ KUTUSU (YENİ STİL)
 * ========================================================== */

#me-selected-price-info.me-price-info-box {
    margin-top: 20px;
    padding: 15px;
    border: 2px solid #ccc;
    border-radius: 6px;
    background-color: #f7f7f7;
    transition: border-color 0.3s ease;
}

#me-selected-price-info.open-day {
    border-color: #4CAF50; /* Yeşil */
    background-color: #e8ffe8;
}

#me-selected-price-info.closed-day {
    border-color: #ff6666; /* Kırmızı */
    background-color: #fff0f0;
}

#me-selected-price-info.no-price-day {
    border-color: #999; /* Gri */
    background-color: #f0f0f0;
}
td.fc-day{
    transition: background-color .10s;
}
td.fc-day.me-set-selected-full-calendar{
    background-color: #a5d6ff;
}
td.fc-day.me-set-selected-full-calendar:hover{
    background-color: #a5d6ff;
}
td.fc-day.me-set-selected-full-calendar .fc-daygrid-day-frame:hover {
    background-color: #a5d6ff;
    border-color: #a5d6ff;
}
.fc .fc-daygrid-day-number {
    font-size: 13px !important;
}
#me-calendar-loading-indicator{
    position: absolute;
    background: #000000;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border-radius: 8px;
    z-index: 9;
    opacity: .8;
}
#me-calendar-loading-indicator-return{
    position: absolute;
    background: #000000;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border-radius: 8px;
    z-index: 9;
    opacity: .8;
}
.me-price-calendar-wrapper{
    position: relative;
}
.fc .fc-button {
    padding: 0.25em 0.25em;
}
.fc .fc-toolbar-title {
    font-size: 1.3em;
}
.fc .fc-button.fc-ozelButon-button{
    background: #ffffff;
    border: 1px solid #000;
    color: #000;
    font-size: 13px;
    padding: 6px;
    padding-right: 7px;
    padding-left: 7px;
    font-weight: bold;
}
/* ==========================================================
 * 4. MOBİL UYUMLULUK (FULLCALENDAR KENDİLİĞİNDEN RESPONSIVE'DİR)
 * ========================================================== */
@media (max-width: 600px) {
    /* Mobilde fontları küçültme */
    .fc .fc-toolbar-title {
        font-size: 1.2em;
    }
    .me-price-calendar-wrapper {
        padding: 0;
        border: none;
    }
    .me-price-available {
        top:11px;
    }
}
.fc .fc-daygrid-day-number {
    padding: 4px;
    position: absolute;
    z-index: 4;
    top: -4px;
    right: -2px;
    font-size: 14px;
}
.fc .fc-bg-event .fc-event-title {
    font-size: 12px;
    font-style: inherit;
    margin: 0.5em;
    position: absolute;
    bottom: -4px;
    color: #3b3b3b;
    font-weight: 600;
}
.fc .fc-bg-event{
    opacity: 1;
}
.reservation-right-image{
    
}