/*
 * Global form focus — loaded after DaisyUI (see partials/daisyui_styles.html).
 * Thicker, darker border only; no ring or offset outline.
 */

.input.input-bordered,
.select.select-bordered,
.textarea.textarea-bordered {
  border-color: #d1d5db; /* gray-300 */
  border-width: 1px;
}

/* Textareas use height:auto, so a 1px→2px focus border grows the box and
   shifts the page. Reserve 1px vertical margin and drop it on focus. */
.textarea.textarea-bordered {
  margin-top: 1px;
  margin-bottom: 1px;
}

.input.input-bordered:focus,
.input.input-bordered:focus-within,
.select.select-bordered:focus,
.textarea.textarea-bordered:focus {
  outline: none !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  --tw-ring-shadow: 0 0 #0000 !important;
  --tw-ring-offset-shadow: 0 0 #0000 !important;
  border-width: 2px !important;
  border-color: #9ca3af !important; /* gray-400 */
}

.textarea.textarea-bordered:focus {
  margin-top: 0;
  margin-bottom: 0;
}

/* Tailwind preflight adds a ring on native controls; strip it for DaisyUI fields. */
input.input:focus,
select.select:focus,
textarea.textarea:focus {
  outline: none !important;
  box-shadow: none !important;
  --tw-ring-shadow: 0 0 #0000 !important;
  --tw-ring-offset-shadow: 0 0 #0000 !important;
}

.cell-detail-panel:focus {
  outline: none !important;
  box-shadow: none !important;
  border-width: 2px !important;
  border-color: #9ca3af !important; /* gray-400 */
}

/* Loaded after DaisyUI — white cancel buttons need a thin black border (see .cursor/skills/cancel-button-border/) */
.btn.btn-ghost.timetable-modal-btn-cancel,
.btn.timetable-modal-btn-cancel,
.timetable-modal-btn-cancel,
.timetable-app-modal .timetable-modal-btn-cancel,
#timetableAppConfirmModalCancel,
#timetableAppPromptModalCancel {
  background-color: #fff !important;
  color: rgb(17 24 39) !important;
  border-width: 1px !important;
  border-style: solid !important;
  border-color: #000 !important;
  box-shadow: none !important;
}

.btn.btn-ghost.timetable-modal-btn-cancel:hover,
.btn.btn-ghost.timetable-modal-btn-cancel:focus-visible,
.btn.timetable-modal-btn-cancel:hover,
.btn.timetable-modal-btn-cancel:focus-visible,
.timetable-modal-btn-cancel:hover,
.timetable-modal-btn-cancel:focus-visible,
.timetable-app-modal .timetable-modal-btn-cancel:hover,
.timetable-app-modal .timetable-modal-btn-cancel:focus-visible,
#timetableAppConfirmModalCancel:hover,
#timetableAppConfirmModalCancel:focus-visible,
#timetableAppPromptModalCancel:hover,
#timetableAppPromptModalCancel:focus-visible {
  background-color: rgb(249 250 251) !important;
  color: rgb(17 24 39) !important;
  border-color: #000 !important;
}