/* =========================================================
   UNIVERSAL FORM INPUT CONTRAST (public + admin)
   Ensures every input / select / textarea / option is clearly
   readable against the dark background — no more white-on-white.
   Applied to every form across the site via <link rel="stylesheet">
   ========================================================= */

/* ---------------------------------------------------------
   <select> dropdown OPTIONS — this was the big one that was
   still missing on public forms. Native <option> defaults to
   the OS theme which on light-themed OSes renders as white-on-
   white against our dark UI. Force explicit colors.
   --------------------------------------------------------- */
option,
select option {
  background-color: #0f1b2d !important;
  color: #ffffff !important;
  padding: 8px 12px !important;
  font-family: inherit !important;
}

option:hover,
option:focus,
option:checked,
select option:checked {
  background: linear-gradient(135deg, #f4a261, #e76f51) !important;
  color: #0f1b2d !important;
  font-weight: 700 !important;
}

option:disabled {
  color: rgba(148, 184, 212, 0.4) !important;
  background-color: rgba(15, 27, 45, 0.5) !important;
}

/* Closed select — force dark color scheme so the dropdown arrow
   and the selected value render correctly on dark UI. */
select {
  color: #ffffff !important;
  color-scheme: dark;
}

select:focus-visible {
  outline: 2px solid #f4a261 !important;
  outline-offset: 2px;
}

/* ---------------------------------------------------------
   Text-like inputs — visible background + border so each
   field pops against the dark form card.
   --------------------------------------------------------- */
form input[type="text"],
form input[type="email"],
form input[type="tel"],
form input[type="number"],
form input[type="date"],
form input[type="time"],
form input[type="password"],
form input[type="search"],
form input[type="url"],
form input:not([type]),
form textarea,
form select,
.modal input[type="text"],
.modal input[type="email"],
.modal input[type="tel"],
.modal input[type="number"],
.modal input[type="date"],
.modal input[type="password"],
.modal input:not([type]),
.modal textarea,
.modal select,
.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="tel"],
.form-group input[type="number"],
.form-group input[type="date"],
.form-group input[type="password"],
.form-group input:not([type]),
.form-group textarea,
.form-group select,
.generate-form input[type="text"],
.generate-form input[type="email"],
.generate-form input[type="tel"],
.generate-form input[type="number"],
.generate-form input[type="date"],
.generate-form input:not([type]),
.generate-form textarea,
.generate-form select,
#editBecaModal input[type="text"],
#editBecaModal input[type="email"],
#editBecaModal input[type="tel"],
#editBecaModal input[type="date"],
#editBecaModal textarea,
#editBecaModal select,
.fields input[type="text"],
.fields input[type="email"],
.fields input[type="tel"],
.fields input[type="number"],
.fields input[type="date"],
.fields input[type="password"],
.fields textarea,
.fields select {
  background-color: rgba(255, 255, 255, 0.055) !important;
  color: #ffffff !important;
  border: 1px solid rgba(148, 184, 212, 0.35) !important;
  border-radius: 8px !important;
  transition: background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}

/* Hover */
form input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):hover,
form textarea:hover,
form select:hover,
.modal input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):hover,
.modal textarea:hover,
.modal select:hover,
.form-group input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):hover,
.form-group textarea:hover,
.form-group select:hover,
#editBecaModal input:hover,
#editBecaModal textarea:hover,
#editBecaModal select:hover,
.fields input:hover,
.fields textarea:hover,
.fields select:hover {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(148, 184, 212, 0.55) !important;
}

/* Focus */
form input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):focus,
form textarea:focus,
form select:focus,
.modal input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):focus,
.modal textarea:focus,
.modal select:focus,
.form-group input:not([type="hidden"]):not([type="file"]):not([type="checkbox"]):not([type="radio"]):focus,
.form-group textarea:focus,
.form-group select:focus,
#editBecaModal input:focus,
#editBecaModal textarea:focus,
#editBecaModal select:focus,
.fields input:focus,
.fields textarea:focus,
.fields select:focus {
  background-color: rgba(255, 255, 255, 0.09) !important;
  border-color: rgba(244, 162, 97, 0.85) !important;
  box-shadow: 0 0 0 3px rgba(244, 162, 97, 0.15) !important;
  outline: none !important;
}

/* Error state */
.form-group.has-error input,
.form-group.has-error select,
.form-group.has-error textarea {
  border-color: rgba(239, 68, 68, 0.7) !important;
  background-color: rgba(239, 68, 68, 0.06) !important;
}

/* Readonly */
input[readonly],
textarea[readonly] {
  background-color: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(148, 184, 212, 0.2) !important;
  cursor: default;
}

/* Disabled */
input:disabled,
select:disabled,
textarea:disabled {
  background-color: rgba(255, 255, 255, 0.02) !important;
  border-color: rgba(148, 184, 212, 0.15) !important;
  opacity: 0.55;
  cursor: not-allowed;
}

/* Placeholder */
input::placeholder,
textarea::placeholder {
  color: rgba(148, 184, 212, 0.55) !important;
  opacity: 1 !important;
}

/* Autofill (Chrome) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
select:-webkit-autofill {
  -webkit-text-fill-color: #ffffff !important;
  -webkit-box-shadow: 0 0 0 1000px rgba(15, 27, 45, 0.95) inset !important;
  caret-color: #ffffff !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

/* Date picker icon for dark theme */
input[type="date"]::-webkit-calendar-picker-indicator,
input[type="time"]::-webkit-calendar-picker-indicator {
  filter: invert(0.8) brightness(1.1);
  cursor: pointer;
}

/* Labels */
.form-group label {
  margin-bottom: 6px;
  display: inline-block;
}

/* Beca code field wrapper */
#codigoBecaInput {
  background: transparent !important;
  border: 0 !important;
}
.fn-wrap input {
  border-color: rgba(148, 184, 212, 0.25) !important;
}

/* Search bars */
.search-bar input[type="text"],
.toolbar input[type="text"] {
  background-color: rgba(255, 255, 255, 0.055) !important;
  color: #ffffff !important;
  border: 1px solid rgba(148, 184, 212, 0.35) !important;
  border-radius: 8px !important;
}
.search-bar input[type="text"]:focus,
.toolbar input[type="text"]:focus {
  border-color: rgba(244, 162, 97, 0.85) !important;
  box-shadow: 0 0 0 3px rgba(244, 162, 97, 0.15) !important;
  outline: none !important;
}

/* Admin table hover */
table tbody tr:hover td {
  background-color: rgba(244, 162, 97, 0.05);
}

/* <datalist> suggestions */
datalist { color-scheme: dark; }