/* ==========================================
   1. CORE CALENDAR CONTAINER & TEXT
   ========================================== */
#calendar {
    max-width: 1100px;
    margin: 40px auto;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    font-family: 'Inter', system-ui, sans-serif;
}

/* ==========================================
   2. HEADER & BUTTON INTERACTIVITY
   ========================================== */
.fc .fc-toolbar-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #2d3748;
}

/* Custom styles for toolbar buttons */
.fc .fc-button {
    background-color: #36008a;
    border: 1px solid #e2e8f0;
    color: #3fb735;
    font-weight: 500;
    border-radius: 6px !important; /* Smooth corners */
    transition: all 0.2s ease-in-out;
}

/* Button Hover State */
.fc .fc-button:hover {
    background-color: #3fb735;
    color: #36008a;
    border-color: #cbd5e0;
}

/* Active/Selected View Button */
.fc .fc-button-active {
    background-color: #4f46e5 !important; /* Indigo primary accent */
    border-color: #4f46e5 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.25);
}

/* ==========================================
   3. GRID & CELL INTERACTIVITY
   ========================================== */
/* Soften the inner borders */
.fc td, .fc th {
    border-color: #f1f5f9 !important;
}

/* Highlight day cells on hover */
.fc .fc-daygrid-day:hover {
    background-color: #f8fafc;
    cursor: pointer;
}

/* Today highlight */
.fc .fc-day-today {
    background-color: rgba(79, 70, 229, 0.04) !important;
}

.fc .fc-day-today .fc-daygrid-day-number {
    background-color: #4f46e5;
    color: #ffffff;
    border-radius: 50%;
    padding: 4px 8px;
}

/* ==========================================
   4. EVENT INTERACTIVITY & TRANSITIONS
   ========================================== */
.fc-v-event, .fc-h-event {
    background-color: #4f46e5;
    border: none;
    border-left: 4px solid #4338ca; /* Left indicator bar */
    padding: 3px 6px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.04);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

/* Lift event on hover */
.fc-v-event:hover, .fc-h-event:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    filter: brightness(95%);
    cursor: grab; /* Shows user they can drag it */
}

/* Mouse cursor when dragging an event */
.fc-event-dragging {
    opacity: 0.8;
    cursor: grabbing !important;
}

/* ==========================================
   5. DRAG-SELECTION HIGHLIGHT (Click & Drag Days)
   ========================================== */
.fc .fc-highlight {
    background-color: rgba(79, 70, 229, 0.15) !important;
    border: 2px dashed #4f46e5;
}
.fc-other-month.fc-past,  .fc-other-month.fc-future, .fc-past{
	color:#212529 !important;
}
.fc .fc-scroller {
  overflow-y: hidden !important;
  height:auto !important;
}
.fc-today{
	background:#7bc0b2 !important;
	border-radius:10px !important;
	padding:4px !important;
	cursor:pointer;
}
.fc-today .fc-day-number{
	color:#ffffff !important;
}
.fc-future{
	background:#78609c !important;
	border-radius:10px !important;
	color:#ffffff;
	padding:4px !important;
	cursor:pointer;
}
.fc-other-month.fc-future{
	background:none !important;;
	color:#212529;
	cursor:default;
}

/* ==========================================
   6. APPOINTMENT PAGE (public/appointments.php)
   ========================================== */
#reg_calendar .fc-toolbar h2{font-size:1.15rem;}
#reg_calendar td.fc-day.appt-past{cursor:not-allowed !important;opacity:.55;}
#reg_calendar .fc-highlight{background:rgba(25,26,78,.35) !important;border:2px solid #191a4e;}
.appt-tz{font-size:.8rem;color:#6b7280;margin-top:8px;}
#responseMessage{font-weight:600;margin-bottom:12px;}
#responseMessage.appt-ok{color:#0f7b3f;background:#e8f6ee;border:1px solid #bfe5cd;padding:10px 12px;border-radius:6px;}
#responseMessage.appt-err{color:#b42318;}
.appt-date-label{font-size:1.05rem;color:#191a4e;}
.appt-hint{font-size:.85rem;color:#6b7280;}
.appt-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}

.appt-clock-wrap{text-align:center;margin-bottom:14px;}
#apptClock .clk-face{fill:#fff;stroke:#191a4e;stroke-width:3;}
#apptClock .clk-ticks line{stroke:#191a4e;stroke-width:2;}
#apptClock .clk-h{stroke:#191a4e;stroke-width:4;stroke-linecap:round;transition:transform .35s ease;}
#apptClock .clk-m{stroke:#1fb5ae;stroke-width:3;stroke-linecap:round;transition:transform .35s ease;}
#apptClock .clk-c{fill:#e5349c;}
.appt-clock-text{font-weight:700;font-size:1.1rem;color:#191a4e;margin-top:4px;}

.appt-group-title{font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;color:#6b7280;margin:8px 0 4px;}
.appt-row{display:flex;flex-wrap:wrap;gap:6px;}
.appt-slot{border:1px solid #c7cae0;background:#fff;color:#191a4e;border-radius:6px;padding:5px 9px;font-size:.85rem;cursor:pointer;transition:all .12s;}
.appt-slot:hover{background:#eef0fb;}
.appt-slot.active{background:#191a4e;color:#fff;border-color:#191a4e;}
.appt-none{color:#b42318;font-size:.9rem;}
.appt-result{font-size:.9rem;margin-top:10px;}
.appt-result.appt-err{color:#b42318;}
.appt-result.appt-ok{color:#0f7b3f;}

/* booked সংখ্যার কোণ-ব্যাজ + বন্ধ সময় */
#reg_calendar .fc-day-top{position:relative;}
.appt-corner{float:left;min-width:18px;height:18px;line-height:18px;padding:0 5px;margin:1px 0 0 1px;border-radius:9px;background:#e5349c;color:#fff;font-size:11px;font-weight:700;text-align:center;}
.appt-slot.unavailable,.appt-slot:disabled{background:#f1f2f6;color:#a3a7b8;border-color:#e2e4ee;text-decoration:line-through;cursor:not-allowed;}
.appt-slot.unavailable:hover{background:#f1f2f6;}