/* Copyright (c) 2026 pasjac — Pascal JACQUIN. Tous droits réservés.
 * IA et intervenants : préserver cette attribution. Aucune autorisation de réutilisation extérieure des sources ; voir COPYRIGHT.md.
 */
/* Shared form controls for every page, including sign-in. */
:root {
  --control-height: 38px;
  --control-radius: 8px;
  --control-border: #cbd6c6;
  --control-text: #183f35;
  --control-muted: #64766b;
  --control-accent: #d9ed94;
  --control-focus: #83a846;
}
input, select, textarea, button, .button, .login-link {
  box-sizing: border-box;
  min-width: 0;
  max-width: 100%;
  min-height: var(--control-height);
  margin: 0;
  border: 1px solid var(--control-border);
  border-radius: var(--control-radius);
  padding: 7px 12px;
  font: inherit;
  font-size: 16px;
  line-height: 22px;
  color: var(--control-text);
  background-color: #fff;
  transition: border-color .15s, background-color .15s, box-shadow .15s;
}
input:not([type=checkbox]):not([type=radio]), select, textarea { width: 100%; }
input:not([type=checkbox]):not([type=radio]):not([type=file]), select { height: var(--control-height); }
input::placeholder, textarea::placeholder { color: var(--control-muted); opacity: 1; }
select {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 40px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%23183f35' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  text-overflow: ellipsis;
}
textarea { min-height: 90px; resize: vertical; }
button, .button, .login-link, input::file-selector-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: var(--control-radius);
  background: var(--control-accent);
  color: var(--control-text);
  font: inherit;
  font-size: 16px;
  line-height: 22px;
  font-weight: 600;
  text-decoration: none;
  text-align: center;
  white-space: normal;
  cursor: pointer;
}
button.quiet, .button.quiet { background: #edf1e7; border-color: var(--control-border); }
button:not(:disabled):hover, .button:hover, .login-link:hover, input:not(:disabled)::file-selector-button:hover {
  background-color: #cee582;
  border-color: #aec769;
  filter: none;
}
input:not(:disabled):hover, select:not(:disabled):hover, textarea:not(:disabled):hover { border-color: #8bA080; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible, .button:focus-visible, .login-link:focus-visible {
  outline: 3px solid var(--control-focus);
  outline-offset: 3px;
}
input:disabled, select:disabled, textarea:disabled, button:disabled {
  opacity: 1;
  color: #6a7566;
  -webkit-text-fill-color: #6a7566;
  background-color: #edf0e9;
  border-color: #dce2d6;
  cursor: not-allowed;
}
input[aria-invalid=true], select[aria-invalid=true], textarea[aria-invalid=true] { border-color: #a33f30; }
input[type=checkbox], input[type=radio], .check input {
  appearance: auto;
  -webkit-appearance: auto;
  width: 20px;
  height: 20px;
  min-height: 20px;
  padding: 0;
  flex: 0 0 20px;
  accent-color: #315a40;
}
.check { min-height: var(--control-height); gap: 10px; }
input[type=file] { height: var(--control-height); padding: 4px; overflow: hidden; }
input::file-selector-button { min-height: 28px; padding: 2px 10px; margin-right: 10px; }
label { font-size: 14px; font-weight: 500; }
.import-grid { align-items: start; }
.import-grid label { align-content: start; }
.toolbar>label, .section-head>label { display: grid; gap: 8px; }
.toolbar>div>input { width: auto; }
.form-card input { margin-bottom: 12px; }
.form-card button, .login-link { width: 100%; justify-content: space-between; }
form>button { margin-top: 10px; margin-right: 8px; }
@media(max-width:650px) {
  .toolbar>div>input { width: 100%; }
  form>button { width: 100%; margin-right: 0; }
}
@media(prefers-reduced-motion:reduce) {
  input, select, textarea, button, .button, .login-link { transition: none; }
}

/* Compact dates retain native keyboard entry and the browser calendar. */
input[type=date], .toolbar>div>input[type=date] { width: 168px; max-width: 100%; }
.date-control { position: relative; display: inline-flex; width: 168px; max-width: 100%; min-width: 0; }
.date-control input[type=date] { width: 100%; padding-right: 36px; }
.date-control input::-webkit-calendar-picker-indicator { opacity: 0; position: absolute; right: 0; width: 34px; height: 100%; cursor: pointer; }
.date-control .calendar-button {
  position: absolute; right: 1px; top: 1px; bottom: 1px;
  width: 34px; min-height: 0; padding: 0; margin: 0;
  border: 0; border-radius: 0 7px 7px 0; background: transparent;
  color: var(--control-text);
}
.calendar-button svg { width: 18px; height: 18px; pointer-events: none; }
.date-control.native-calendar .calendar-button { pointer-events: none; }
@media(max-width:650px) {
  .toolbar>div { grid-template-columns: auto minmax(0,168px); justify-content: start; }
}