/* CANAGRAF Sprint 05.2 — Sistema visual transversal de formularios
   Conserva el lenguaje visual existente; no altera lógica ni estructura. */

:root{
  --form-bg: rgba(255,255,255,.055);
  --form-bg-hover: rgba(255,255,255,.075);
  --form-bg-focus: rgba(255,255,255,.09);
  --form-border: rgba(255,255,255,.14);
  --form-border-hover: rgba(255,255,255,.24);
  --form-focus: var(--cyan, #35c8ff);
  --form-radius: 12px;
  --form-height: 46px;
  --form-shadow: 0 10px 30px rgba(0,0,0,.12);
}

/* Labels */
label{
  display:block;
  color:var(--text, #fff);
  font-size:12px;
  font-weight:750;
  letter-spacing:.025em;
  line-height:1.35;
}
label > input,
label > select,
label > textarea{
  margin-top:7px;
}

/* Inputs universales */
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
select,
textarea{
  width:100%;
  min-width:0;
  box-sizing:border-box;
  border:1px solid var(--form-border);
  border-radius:var(--form-radius);
  background:var(--form-bg);
  color:var(--text, #fff);
  font:inherit;
  font-size:14px;
  line-height:1.35;
  outline:none;
  transition:
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
select{
  min-height:var(--form-height);
  padding:0 13px;
}

textarea{
  min-height:110px;
  padding:12px 13px;
  resize:vertical;
}

input:hover,
select:hover,
textarea:hover{
  border-color:var(--form-border-hover);
  background:var(--form-bg-hover);
}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--form-focus);
  background:var(--form-bg-focus);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--form-focus) 16%, transparent),
    0 12px 28px rgba(0,0,0,.10);
}

input::placeholder,
textarea::placeholder{
  color:var(--muted, #9ca8b5);
  opacity:.72;
}

/* Selects */
select{
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  padding-right:40px;
  background-image:
    linear-gradient(45deg,transparent 50%,currentColor 50%),
    linear-gradient(135deg,currentColor 50%,transparent 50%);
  background-position:
    calc(100% - 18px) 20px,
    calc(100% - 13px) 20px;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
select option{
  background:#121a24;
  color:#fff;
}

/* Date/time */
input[type="date"],
input[type="datetime-local"],
input[type="time"]{
  color-scheme:dark;
}

/* Disabled/read-only */
input:disabled,select:disabled,textarea:disabled,
input[readonly],textarea[readonly]{
  opacity:.58;
  cursor:not-allowed;
  background:rgba(255,255,255,.025);
}

/* Checkboxes/radios */
input[type="checkbox"],
input[type="radio"]{
  width:18px;
  height:18px;
  margin:0;
  accent-color:var(--cyan, #35c8ff);
  cursor:pointer;
  vertical-align:middle;
}
label:has(> input[type="checkbox"]),
label:has(> input[type="radio"]){
  display:inline-flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
}

/* Field grouping */
.form-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.form-grid > *{min-width:0}

.form-help,
.field-help{
  display:block;
  margin-top:6px;
  color:var(--muted, #9ca8b5);
  font-size:11px;
  line-height:1.45;
}

/* Alerts */
.form-alert{
  border-radius:13px;
  padding:11px 13px;
  margin:12px 0;
  border:1px solid var(--form-border);
  backdrop-filter:blur(10px);
}
.form-alert.success{
  border-color:rgba(62,211,153,.30);
  background:rgba(62,211,153,.08);
}
.form-alert.error{
  border-color:rgba(255,94,113,.34);
  background:rgba(255,94,113,.08);
}

/* Administrative filter/bulk bars */
.filter-bar,
.bulk-bar{
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  border:1px solid var(--form-border);
  box-shadow:var(--form-shadow);
}
.filter-bar input,
.filter-bar select,
.bulk-bar select{
  background-color:rgba(4,12,20,.46);
}

/* Forms inside cards */
.system-card form{
  --form-bg:rgba(255,255,255,.045);
}
.system-card form label + label{
  margin-top:2px;
}

/* Buttons adjacent to fields */
form .btn{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.filter-bar .btn,
.bulk-bar .btn{
  min-height:var(--form-height);
}

/* Validation-ready states */
.is-invalid,
input[aria-invalid="true"],
select[aria-invalid="true"],
textarea[aria-invalid="true"]{
  border-color:#ff6577 !important;
  box-shadow:0 0 0 3px rgba(255,101,119,.11) !important;
}
.is-valid{
  border-color:#3ed399 !important;
}

/* Autofill: prevent bright browser background */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus{
  -webkit-text-fill-color:var(--text,#fff);
  -webkit-box-shadow:0 0 0 1000px #17212c inset;
  caret-color:var(--text,#fff);
  transition:background-color 9999s ease-out 0s;
}

/* Login/registration: better visual rhythm without changing markup */
.auth-card form,
.registration-card form{
  display:grid;
  gap:14px;
}

/* File inputs */
input[type="file"]{
  padding:8px !important;
  min-height:var(--form-height);
}
input[type="file"]::file-selector-button{
  border:1px solid var(--form-border);
  border-radius:9px;
  background:rgba(255,255,255,.08);
  color:var(--text,#fff);
  padding:7px 10px;
  margin-right:10px;
  cursor:pointer;
}

/* Search inputs */
input[type="search"]{
  appearance:none;
}

/* Light surfaces, if a page defines them */
.light-surface input:not([type="checkbox"]):not([type="radio"]),
.light-surface select,
.light-surface textarea{
  background:rgba(15,24,34,.045);
  border-color:rgba(15,24,34,.15);
  color:#15202b;
}
.light-surface select option{
  background:#fff;
  color:#15202b;
}

/* Mobile */
@media(max-width:760px){
  :root{--form-height:48px}
  .form-grid{grid-template-columns:1fr}
  .filter-bar,.bulk-bar{
    align-items:stretch;
  }
  .filter-bar > *,
  .bulk-bar > select,
  .bulk-bar > .btn{
    width:100%;
    max-width:none;
  }
  input,select,textarea{
    font-size:16px; /* evita zoom automático en móviles */
  }
}