/* ── Scrollbar ───────────────────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #0f172a; }
::-webkit-scrollbar-thumb { background: #334155; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #475569; }

/* ── RTL / Cairo font ───────────────────────────────────────────────────── */
body { font-family: 'Cairo', sans-serif; }

/* ── Time/Date input fix (LTR inside RTL pages) ─────────────────────────── */
input[type="time"], input[type="date"] { direction: ltr; }

/* ── Scheduler grid ─────────────────────────────────────────────────────── */
#scheduler-wrapper { perspective: 1400px; }
#scheduler-grid    { transform-style: preserve-3d; }

@keyframes flipOutNext {
  from { transform: perspective(1400px) rotateY(0deg);   opacity:1; }
  to   { transform: perspective(1400px) rotateY(-70deg); opacity:0; }
}
@keyframes flipInNext {
  from { transform: perspective(1400px) rotateY(70deg);  opacity:0; }
  to   { transform: perspective(1400px) rotateY(0deg);   opacity:1; }
}
@keyframes flipOutPrev {
  from { transform: perspective(1400px) rotateY(0deg);  opacity:1; }
  to   { transform: perspective(1400px) rotateY(70deg); opacity:0; }
}
@keyframes flipInPrev {
  from { transform: perspective(1400px) rotateY(-70deg); opacity:0; }
  to   { transform: perspective(1400px) rotateY(0deg);   opacity:1; }
}
.flip-out-next { animation: flipOutNext 0.33s ease-in  forwards; }
.flip-in-next  { animation: flipInNext  0.33s ease-out forwards; }
.flip-out-prev { animation: flipOutPrev 0.33s ease-in  forwards; }
.flip-in-prev  { animation: flipInPrev  0.33s ease-out forwards; }

.appt-card { position:absolute; left:3px; right:3px; border-radius:8px; padding:5px 8px;
              font-size:12px; cursor:grab; user-select:none; overflow:hidden; z-index:10;
              box-shadow:0 2px 8px rgba(0,0,0,.45); }
.appt-card:hover  { box-shadow:0 4px 16px rgba(0,0,0,.6); z-index:15; }
.appt-card:active { cursor:grabbing; }
.appt-card.dragging { opacity:.4; z-index:20; }
.resize-handle { position:absolute; bottom:0; left:0; right:0; height:7px;
                  cursor:ns-resize; border-radius:0 0 8px 8px; background:rgba(255,255,255,.18); }
.resize-handle:hover { background:rgba(255,255,255,.38); }

.sched-cell { position:absolute; left:0; right:0; box-sizing:border-box; transition:background .12s; }
.sched-cell.available { cursor:pointer; }
.sched-cell.available:hover { background:rgba(245,158,11,.10) !important; }
.sched-cell.blocked   { background:rgba(30,41,59,.85); cursor:not-allowed; }
.sched-cell.off-sched { background:repeating-linear-gradient(45deg,rgba(30,41,59,.55),rgba(30,41,59,.55) 4px,rgba(15,23,42,.75) 4px,rgba(15,23,42,.75) 8px); cursor:not-allowed; }
.sched-cell.drag-over { background:rgba(99,102,241,.28) !important; border:2px dashed #6366f1 !important; }

/* "+" add indicator shown on hover */
.sched-cell.available:hover .cell-plus { opacity:1 !important; }

.staff-col  { position:relative; flex:1; border-left:1px solid rgba(100,116,139,.2); min-width:130px; }
.staff-col:first-child { border-left:none; }
.time-gutter { width:68px; flex-shrink:0; border-left:1px solid rgba(100,116,139,.25); position:relative; background:#0f172a; }
.time-label  { text-align:center; position:absolute; right:0; left:0; pointer-events:none; padding:0 4px; }

.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.7); z-index:60;
                  display:flex; align-items:center; justify-content:center; padding:16px; }
.modal-box { background:#1e293b; border:1px solid #334155; border-radius:16px;
              width:100%; max-width:500px; max-height:92vh; overflow-y:auto;
              padding:24px; box-shadow:0 25px 60px rgba(0,0,0,.65); }

.mini-cal td, .mini-cal th { width:30px; height:30px; text-align:center; font-size:11px; vertical-align:middle; }
.mini-cal td.today    { background:#f59e0b; color:#000; border-radius:50%; font-weight:700; }
.mini-cal td.selected { outline:2px solid #f59e0b; border-radius:50%; }
.mini-cal td:not(.empty):hover { background:rgba(245,158,11,.2); border-radius:50%; cursor:pointer; }

/* ── Pagination ─────────────────────────────────────────────────────────── */
nav[aria-label="Pagination Navigation"] a,
nav[aria-label="Pagination Navigation"] span {
    display:inline-flex; align-items:center; justify-content:center;
    min-width:32px; height:32px; padding:0 8px;
    margin:0 2px; border-radius:8px; font-size:13px;
    color:#94a3b8; text-decoration:none; transition:all .15s;
}
nav[aria-label="Pagination Navigation"] a:hover { background:#1e293b; color:#fff; }
nav[aria-label="Pagination Navigation"] span[aria-current="page"] span {
    background:#f59e0b; color:#000; font-weight:700; border-radius:8px;
}