/* Core calendar CSS (clean, mobile-friendly) */

.prrc-hourly-grid, .prrc-month-grid {
  font-family: "Open Sans", Arial, sans-serif;
  color: #fff;
  width: 100%;
  box-sizing: border-box;
}

/* Header */
.prrc-calendar-header-outer {
  display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px;
  padding-left:10px !important; padding-right:10px !important;
}
.prrc-header-edge-btn { background:#ff8c42 !important; border:1px solid rgba(255,255,255,0.06); color:#fff; padding:8px 12px; border-radius:8px; cursor:pointer; font-weight:600; }
.prrc-header-edge-btn:hover { border-color: rgba(255,255,255,0.12); }
.prrc-header-center { display:flex; align-items:center; justify-content:center; flex:1; min-width:0; }
.prrc-week-date-stack { display:flex; flex-direction:column; align-items:center; gap:8px; min-width:120px; }
.prrc-calendar-week-label-centered { font-weight:700; font-size:16px; color:#fff; text-align:center; }
.prrc-view-select { background: rgba(255,255,255,0.02); color:#fff; border:1px solid rgba(255,255,255,0.04); padding:6px 8px; border-radius:8px; font-weight:600; }

/* Hour grid */
.prrc-hourly-grid-header { display:flex; gap:8px; align-items:center; margin-bottom:8px; box-sizing:border-box; padding:0 6px; }
.prrc-hour-column-header.empty-header { flex:0 0 80px; max-width:80px; height:36px; box-sizing:border-box; }
.prrc-day-header { flex:1 1 0; min-width:0; background: rgba(255,255,255,0.02); padding:8px 10px; border-radius:8px; text-align:center; font-weight:600; box-sizing:border-box; }
.prrc-day-header .day-name { font-size:13px; color:#ccc; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prrc-day-header .date-label { font-size:15px; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prrc-hourly-grid-body { position:relative; display:block; border-top:1px solid rgba(255,255,255,0.04); }
.prrc-hour-row { display:flex; gap:8px; align-items:flex-start; padding:4px 0; min-height:48px; box-sizing:border-box; border-bottom:1px dashed rgba(255,255,255,0.02); }
.prrc-hour-label { flex:0 0 80px; max-width:80px; color:#9aa6b6; font-size:12px; padding:6px 8px; box-sizing:border-box; text-align:right; }
.prrc-day-cell { flex:1 1 0; min-width:0; background:transparent; min-height:1px; position:relative; box-sizing:border-box; }
.prrc-day-cell .prrc-cell-content { position:relative; height:100%; width:100%; box-sizing:border-box; }

/* Overlays and events */
.prrc-day-column-overlay { pointer-events:none; top:0; z-index:5; position:absolute; box-sizing:border-box; }
.prrc-event-block { box-sizing:border-box; border-left:4px solid rgba(0,0,0,0.15); border-radius:8px; padding:8px; color:#fff; font-size:11px; overflow:hidden; display:flex; align-items:flex-start; gap:8px; cursor:pointer; pointer-events:auto; transition:transform .15s ease, box-shadow .15s ease; box-shadow:0 2px 10px rgba(0,0,0,0.45); }
.prrc-event-block:hover, .prrc-event-block:focus { transform:translateY(-2px); box-shadow:0 6px 18px rgba(0,0,0,0.55); outline:none; }
.prrc-event-title { font-weight:700; font-size:11px; line-height:1.1; }
.prrc-event-time { font-size:12px; color:rgba(255,255,255,0.9); position:absolute; bottom: 0; }
.prrc-event-block.prrc-event-mini { padding:4px 6px; border-left-width:0; border-radius:6px; height:auto; }

.prrc-loading, .prrc-no-events { color:#cfcfcf; padding:12px; }

#prrc-hover-modal { display:none; position:fixed; left:0; top:0; right:0; bottom:0; z-index:9999; background:rgba(0,0,0,0.55); }
.prrc-hover-modal-inner { width:720px; max-width:calc(100% - 40px); margin:60px auto; background:#0f1724; border-radius:10px; padding:20px; color:#fff; position:relative; box-sizing:border-box; }
.prrc-hover-modal-close { position:absolute; right:12px; top:8px; background:transparent; border:none; color:#fff; font-size:22px; cursor:pointer; }
.prrc-hover-thumb-wrap img { max-width:180px; width: 100% !important; height: auto !important; border-radius:8px; display:block; margin-bottom:12px; }

/* Month view */
.prrc-month-grid { width:100%; box-sizing: border-box; margin-top:12px; color:#fff; }
.prrc-month-grid-header { display:flex; gap:8px; margin-bottom:8px; }
.prrc-month-cell-header { flex:1 1 0; text-align:center; font-weight:700; font-size:13px; color:#c7d2da; padding:6px 4px; box-sizing:border-box; }
.prrc-month-grid-body { display:flex; flex-wrap:wrap; gap:8px; box-sizing:border-box; }
.prrc-month-cell { flex: 0 0 calc((100% / 7) - (8px * (6/7))); box-sizing: border-box; display:flex; flex-direction:column; background: rgba(255,255,255,0.02); border-radius:10px; padding:10px; min-height:110px; border:1px solid rgba(255,255,255,0.03); overflow:hidden; }
.prrc-month-cell--muted { opacity:0.45; }
.prrc-month-cell-inner { display:flex; flex-direction:column; gap:8px; height:100%; overflow:hidden; }
.prrc-month-cell-date { font-weight:700; font-size:14px; color:#ff8c42; align-self:flex-start; }
.prrc-month-events { display:flex; flex-direction:column; gap:6px; overflow:auto; max-height: calc(100% - 28px); }
.prrc-month-event { display:flex; align-items:center; gap:8px; padding:6px; border-radius:6px; color:#fff; font-size:13px; }
.prrc-month-event .prrc-month-event-label { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Responsive tweaks */
@media screen and (max-width:900px) {
  .prrc-hour-label, .prrc-hour-column-header.empty-header { flex:0 0 56px; max-width:56px; text-align:right; }
  .prrc-hour-row { min-height:44px; }
  .prrc-calendar-week-label-centered { font-size:14px; }
  .prrc-month-cell { min-height:88px; padding:8px; }
  .prrc-month-cell-date { font-size:13px; }
}

/* Mobile adjustments */
@media screen and (max-width:768px) {
  .prrc-hourly-grid, .prrc-month-grid, #prrc-calendar-container { padding:0 !important; margin:0 !important; width:100% !important; box-sizing:border-box; }

  /* Reduce hour label width on mobile to give more space to day columns */
  .prrc-hour-label, .prrc-hour-column-header.empty-header { 
    flex:0 0 42px !important; 
    max-width:42px !important; 
    font-size:10px !important;
    padding:4px 2px !important;
  }

  /* Ensure day columns fill remaining space without overflow */
  .prrc-day-cell {
    min-width:0 !important;
  }

  /* Reduce gaps on mobile */
  .prrc-hourly-grid-header { gap:4px !important; padding:0 2px !important; }
  .prrc-hour-row { gap:4px !important; }

  .prrc-month-event .prrc-month-event-label { display:none !important; }
  .prrc-month-event { width:32px !important; height:14px !important; padding:0 !important; }

  /* NEW: Show titles/times in week view on mobile (2-day layout) */
  #prrc-calendar-container.prrc-view-week .prrc-event-block .prrc-event-title,
  #prrc-calendar-container.prrc-view-week .prrc-event-block .prrc-event-time {
    display:block !important; 
    visibility:visible !important; 
    opacity:1 !important; 
    font-size:11px !important; 
    height:auto !important; 
    overflow:visible !important;
    line-height:1.3 !important;
  }

  /* Adjust event block sizing for 2-column week view */
  #prrc-calendar-container.prrc-view-week .prrc-event-block {
    padding: 6px !important;
    font-size: 11px !important;
  }

  #prrc-calendar-container.prrc-view-week .prrc-event-title {
    font-size: 11px !important;
    font-weight: 600 !important;
  }

  #prrc-calendar-container.prrc-view-week .prrc-event-time {
    font-size: 10px !important;
  }

  /* Hide titles/times only in month view on mobile */
  #prrc-calendar-container.prrc-view-month .prrc-event-block .prrc-event-title,
  #prrc-calendar-container.prrc-view-month .prrc-event-block .prrc-event-time {
    display:none !important; visibility:hidden !important; opacity:0 !important; font-size:0 !important; height:0 !important; overflow:hidden !important;
  }

  /* Keep day view text visible as before */
  #prrc-calendar-container.prrc-view-day .prrc-event-block .prrc-event-title,
  #prrc-calendar-container.prrc-view-day .prrc-event-block .prrc-event-time {
    display:block !important; visibility:visible !important; opacity:1 !important; font-size:0.95rem !important; height:auto !important; overflow:visible !important;
  }

  /* Make scroll container use native iOS scroll behavior (momentum) */
  #prrc-calendar-events-container .prrc-hourly-grid,
  #prrc-calendar-events-container,
  #prrc-calendar-events-container .prrc-hourly-grid-body {
    -webkit-overflow-scrolling: touch;
    overflow-x: auto;
  }
}

/* Ensure positioning context */
#prrc-calendar-events-container .prrc-hourly-grid-body { position: relative !important; overflow: visible !important; box-sizing: border-box !important; transform:none !important; }
.prrc-day-column-overlay { position:absolute !important; box-sizing:border-box !important; pointer-events:none !important; }
.prrc-day-column-overlay .prrc-event-block { position:absolute !important; box-sizing:border-box !important; margin:0 !important; padding:8px !important; pointer-events:auto !important; }

/* Small gutter */
@media (max-width:768px) {
  #prrc-calendar-container, .prrc-calendar-wrapper { margin-left:4px !important; margin-right:4px !important; }
  
  /* Force grid to exactly fit container width */
  .prrc-hourly-grid { 
    width:100% !important; 
    max-width:100% !important; 
    overflow-x:hidden !important;
  }
  
  .prrc-hourly-grid-body {
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }
}

/* FIX: Prevent image cropping in hover modal */
.prrc-event-block {
    overflow: visible !important;   /* was: hidden */
}

.prrc-hover-thumb-wrap img {
    object-fit: contain !important;
    max-width: 180px;
    width: 100% !important;
    height: auto !important;
    display: block;
    border-radius: 8px;
    margin-bottom: 12px;
}

h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700 !important;           /* bold */
  font-size: 24px !important;
  color: #ff8c42 !important;
  margin-bottom: 1.25rem;     /* mb-5 → 20px (1.25rem) */
}