/* -----------------------------------------------------------
 * GT Interactive Calendar – Frontend Styles (v0.6.2 BEST)
 * ----------------------------------------------------------- */

/* -----------------------------------------------------------
 * Section 1.0 - Wrapper
 * ----------------------------------------------------------- */
.gtic-wrap{
  display:inline-block;
  padding:.5rem;
  border-radius:14px;
  background:transparent;
  border:0;
  position:relative;           /* Needed to anchor the Clear link */
}

/* -----------------------------------------------------------
 * Section 2.0 - Window Info (first/last available)
 * ----------------------------------------------------------- */
.gtic-window-info{
  font-size:12px;
  color:#6B7280;
  margin-bottom:.5rem;
  padding-right:90px;          /* leaves room for the Clear link */
}

/* -----------------------------------------------------------
 * Section 3.0 - Info Line for Selection Summary
 * ----------------------------------------------------------- */
.gtic-info{
  font-size:.9rem;
  color:#374151;
  margin:.5rem 0;
}

/* 3.1 - Holiday Note */
.gtic-holiday-note{
  font-size:.85rem;
  color:#6B7280;
  margin:.25rem 0 .5rem 0;
  font-style:italic;
}

/* -----------------------------------------------------------
 * Section 4.0 - Action Buttons (stacked)
 * ----------------------------------------------------------- */
.gtic-actions{
  display:flex;
  flex-direction:column;
  gap:.5rem;
  align-items:flex-start;
}

/* List blocks containing total + button */
.gtic-list-block{display:flex;flex-direction:column;gap:.25rem;}
.gtic-list-block + .gtic-list-block{margin-top:1rem;}
.gtic-total{font-size:.9rem;color:#374151;font-weight:700;}

/* 4.1 - Primary Buttons */
.gtic-select-btn{
  display:inline-block;
  text-decoration:none;
  background-color:#F976DE;
  color:#fff;
  font-weight:bold;
  padding:2px 6px;
  border-radius:6px;
  transition:opacity .15s ease, transform .05s ease;
}
.gtic-select-btn:active{ transform: translateY(1px); }
.gtic-select-btn.gtic-disabled{ opacity:.5; pointer-events:none; }

/* 4.2 - Clear link (TOP-RIGHT, touch friendly) */
.gtic-clear{
  position:absolute;
  top:6px;
  right:10px;
  font-size:13px;
  color:#007BFF;
  font-weight:600;
  text-decoration:none;
  cursor:pointer;
  line-height:1.2;

  /* New: enlarge tap target */
  padding:6px 10px;            /* increases clickable area */
  border-radius:6px;           /* round the hit box */
}

.gtic-clear:hover{
  text-decoration:underline;
  color:#0056b3;
  background-color:rgba(0,0,0,0.05);  /* subtle hover feedback */
}

/* -----------------------------------------------------------
 * Section 5.0 - Calendar visuals (Flatpickr overrides)
 * ----------------------------------------------------------- */
.flatpickr-calendar{
  box-shadow:none;
  border:1px solid #f4c9e6;
  border-radius:12px;
}
.flatpickr-innerContainer{ border-radius:12px; }
.flatpickr-calendar .flatpickr-day{
  font-weight:700;
  position:relative;
}

/* 5.1 - Ineligible — grey + light X */
.flatpickr-calendar .flatpickr-day.disabled,
.flatpickr-calendar .flatpickr-day.disabled:hover,
.flatpickr-calendar .flatpickr-day.notAllowed{
  color:#9CA3AF !important;
  opacity:.65;
}
.flatpickr-calendar .flatpickr-day.disabled::after,
.flatpickr-calendar .flatpickr-day.notAllowed::after{
  content:"✕";
  position:absolute; inset:0;
  display:flex; align-items:center; justify-content:center;
  color:rgba(249,118,222,.35);
  font-weight:700;
  pointer-events:none;
}

/* 5.2 - Selectable colors */
.flatpickr-calendar .flatpickr-day:not(.disabled):not(.prevMonthDay):not(.nextMonthDay){ color:#F976DE; }
.flatpickr-calendar .flatpickr-day:not(.disabled).prevMonthDay,
.flatpickr-calendar .flatpickr-day:not(.disabled).nextMonthDay{ color:#F8B7E7; }

/* 5.3 - Underline eligible end dates */
.flatpickr-calendar .flatpickr-day.gtic-eligible-end{
  text-decoration:underline;
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}

/* 5.4 - Selection visuals */
.flatpickr-calendar .flatpickr-day.selected,
.flatpickr-calendar .flatpickr-day.startRange,
.flatpickr-calendar .flatpickr-day.endRange{
  background:#111827 !important;
  color:#fff !important;
}
.flatpickr-calendar .flatpickr-day.inRange{
  background:rgba(17,24,39,.12) !important;
  border-color:transparent;
}

/* 5.5 - Headers */
.flatpickr-weekdays span{ font-weight:700; color:#111827; }
.flatpickr-current-month .cur-month,
.flatpickr-current-month .cur-year{ font-weight:700; }