/* ==========================================================================
   IDENTITAT CORPORATIVA I ESTILS GLOBALS - NÚRIA 1940
   ========================================================================== */
:root {
  /* Paleta Corporativa extreta del logo */
  --nuria-navy: #1F336E;       /* Blau marí principal */
  --nuria-navy-hover: #162552; /* Blau marí fosc per a hover */
  --nuria-cyan: #149CE2;       /* Blau cel d'accent */
  --nuria-cyan-hover: #0D82C2; /* Blau cel enfosquit */
  --nuria-bg-light: #F8FAFC;   /* Fons de pàgina/panells */
  --nuria-border: #E2E8F0;     /* Separadors i vores */
  --nuria-text-dark: #0F172A;  /* Text principal fosc */
  --nuria-text-muted: #64748B; /* Text secundari/etiquetes */
  --nuria-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

/* --- Títol Principal (H1) amb Accent Corporatiu --- */
h1 {
  font-family: var(--nuria-font) !important;
  font-size: 1.6rem !important;
  font-weight: 600 !important;
  color: var(--nuria-text-dark) !important;
  letter-spacing: -0.01em !important;
  background-image: none !important;
  margin-top: 5px !important;
  margin-bottom: 0px !important;
  padding-bottom: 10px !important;
  border-bottom: 2px solid var(--nuria-border) !important;
  position: relative !important;
}

/*
h1::after {
  content: '' !important;
  position: absolute !important;
  bottom: -2px !important;
  left: 0 !important;
  width: 60px !important;
  height: 2px !important;
  background-color: var(--nuria-cyan) !important;
  border-radius: 2px !important;
}
*/

/* --- Botons Generals (.button) --- */
.button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--nuria-navy) !important;
  color: #ffffff !important;
  font-family: var(--nuria-font) !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  padding: 7px 14px !important;
  border-radius: 6px !important;
  border: 1px solid transparent !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) !important;
  transition: background-color 0.15s ease, box-shadow 0.15s ease, transform 0.1s ease !important;
  cursor: pointer !important;
}

.button:hover {
  background-color: var(--nuria-navy-hover) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.12) !important;
  transform: translateY(-1px) !important;
}

.button:active {
  background-color: #101c3d !important;
  transform: translateY(0) !important;
}




/* ==========================================================================
   ESTILS COMPLETS PER AL FORMULARI DE LOGIN (#login)
   Identitat Corporativa Núria 1940 - Centrat i Ampliat
   ========================================================================== */

/* 1. Targeta contenidora principal */
form#login {
  display: block !important;
  background-color: var(--nuria-bg-light, #f8fafc) !important;
  border: 1px solid var(--nuria-border, #cbd5e1) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.08), 0 8px 10px -6px rgba(15, 23, 42, 0.08) !important;
  padding: 32px 32px 36px 32px !important; /* Espaiat inferior per no tallar el botó */
  max-width: 480px !important;            /* Ample més generós */
  width: 90% !important;                  /* Responsive per a mòbils */
  margin: 50px auto !important;           /* Centra el formulari a la pàgina */
  box-sizing: border-box !important;
  font-family: var(--nuria-font, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif) !important;
  overflow: visible !important;           /* Evita retallades de contingut inferior */
}

/* 2. Ocultar camps d'informació no visual */
form#login input[type="hidden"] {
  display: none !important;
}

/* 3. Estructura de la taula interna */
form#login table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: none !important;
  margin: 0 !important;
}

form#login tr.form-element {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  width: 100% !important;
  margin-bottom: 18px !important;
  box-sizing: border-box !important;
  background: transparent !important;
  border: none !important;
}

/* Etiquetes dels camps (Correu / Contrasenya) */
form#login td.form-label {
  background-color: transparent !important;
  text-align: left !important;
  padding: 0 !important;
  color: var(--nuria-text-muted, #64748B) !important;
  font-weight: 600 !important;
  font-size: 0.825rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.4px !important;
  border: none !important;
}

form#login td.form-widget {
  padding: 0 !important;
  width: 100% !important;
  border: none !important;
  background: transparent !important;
}

/* Neteja d'etiquetes antics <font> de l'HTML */
form#login td.form-widget font {
  font-family: inherit !important;
  font-size: 100% !important;
  display: block !important;
  width: 100% !important;
}

/* 4. Estils per als inputs de text i contrasenya */
form#login input[type="email"],
form#login input[type="password"] {
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 14px !important;
  border: 1px solid var(--nuria-border, #cbd5e1) !important;
  border-radius: 6px !important;
  background-color: #ffffff !important;
  color: var(--nuria-text-dark, #0f172a) !important;
  font-size: 0.95rem !important;
  transition: all 0.2s ease !important;
  outline: none !important;
  height: 42px !important;
  box-shadow: none !important;
}

/* Efecte focus (Blau Cel Núria) */
form#login input[type="email"]:focus,
form#login input[type="password"]:focus {
  border-color: var(--nuria-cyan, #149CE2) !important;
  box-shadow: 0 0 0 3px rgba(20, 156, 226, 0.2) !important;
}

/* 5. Secció del Checkbox ("Recordar la meua contrasenya") */
form#login tr.form-element:has(input[type="checkbox"]) {
  flex-direction: row !important;
  align-items: center !important;
  margin-bottom: 22px !important;
}

form#login tr.form-element:has(input[type="checkbox"]) td.form-widget table {
  width: auto !important;
}

form#login tr.form-element:has(input[type="checkbox"]) td.form-widget td {
  padding: 0 !important;
  vertical-align: middle !important;
}

form#login input[type="checkbox"] {
  cursor: pointer !important;
  accent-color: var(--nuria-cyan, #149CE2) !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 8px 0 0 !important;
  display: inline-block !important;
}

form#login label {
  font-size: 0.85rem !important;
  color: var(--nuria-text-dark, #0f172a) !important;
  cursor: pointer !important;
  font-weight: 500 !important;
}

/* 6. Botó d'acció "Entra" (Blau Marí Corporatiu) */
form#login tr.form-element:has(input[type="submit"]) {
  margin-bottom: 0 !important;
  margin-top: 10px !important;
  display: block !important;
  width: 100% !important;
}

form#login tr.form-element:has(input[type="submit"]) td {
  padding: 0 !important;
  display: block !important;
  width: 100% !important;
}

form#login input[type="submit"] {
  width: 100% !important;
  height: 46px !important;
  background-color: var(--nuria-navy, #1F336E) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 0 20px !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  margin: 0 !important;
}

form#login input[type="submit"]:hover {
  background-color: var(--nuria-navy-hover, #162552) !important;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.12) !important;
  transform: translateY(-1px) !important;
}

form#login input[type="submit"]:active {
  background-color: #101c3d !important;
  transform: translateY(0) !important;
}



.ui-datepicker {
    z-index: 9999 !important; /* Posa el valor que necessitis */
}