/* ============================================================
   AIM brand palette - variables centralizadas (manual de identidad 2026)
   Solo aqui se declara la paleta verde corporativa.
   Estados (rojo error, ambar warning, azul info) y grises UI se mantienen
   como literales por ser tokens funcionales, no de marca.
   ============================================================ */
:root {
  --aim-green:       #2E7D32;
  --aim-green-dark:  #1B5E20;
  --aim-green-light: #66BB6A;
  --aim-green-bg:    #E8F5E9;
  --aim-green-soft:  #A5D6A7;
  --aim-green-pale:  #C8E6C9;
}

/* AIM - Firma autorización parental */
#aim-firma-wrap {
  max-width: 640px;
  margin: 8px auto;
  font-family: Arial, sans-serif;
}
#aim-firma-wrap .aim-firma-intro {
  background: #F4FAF4;
  border-left: 4px solid var(--aim-green);
  padding: 14px 16px;
  font-size: 14px;
  color: #2C3E2E;
  margin-bottom: 16px;
}
#aim-firma-wrap .aim-firma-canvas-box {
  position: relative;
  background: #FFF;
  border: 2px dashed #B6C8B6;
  border-radius: 6px;
  padding: 0;
  margin: 12px 0;
}
#aim-firma-wrap #aim-firma-canvas {
  display: block;
  width: 100%;
  height: 220px;
  background: #FFF;
  border-radius: 4px;
  cursor: crosshair;
  touch-action: none;
}
#aim-firma-wrap .aim-firma-hint {
  font-size: 12px;
  color: #777;
  text-align: center;
  margin: 4px 0 12px;
}
#aim-firma-wrap .aim-firma-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
#aim-firma-wrap #aim-firma-clear,
#aim-firma-wrap #aim-firma-submit {
  flex: 1;
  min-width: 160px;
  padding: 12px 18px;
  border-radius: 5px;
  font-size: 15px;
  font-weight: bold;
  cursor: pointer;
  border: none;
}
#aim-firma-wrap #aim-firma-clear {
  background: #FFF;
  color: #555;
  border: 1px solid #CCC;
}
#aim-firma-wrap #aim-firma-clear:hover { background: #F0F0F0; }
#aim-firma-wrap #aim-firma-submit {
  background: var(--aim-green);
  color: #FFF;
}
#aim-firma-wrap #aim-firma-submit:hover { background: var(--aim-green-dark); }
#aim-firma-wrap #aim-firma-submit:disabled {
  background: #9E9E9E;
  cursor: wait;
}
#aim-firma-wrap .aim-firma-decl {
  background: #FFF8E1;
  border: 1px solid #F0D878;
  padding: 12px;
  border-radius: 4px;
  margin-top: 12px;
  font-size: 13px;
  line-height: 1.5;
}
#aim-firma-wrap .aim-firma-decl label {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
}
#aim-firma-wrap .aim-firma-decl input[type="checkbox"] {
  margin-top: 3px;
}
#aim-firma-wrap .aim-firma-msg {
  margin-top: 12px;
  padding: 10px 14px;
  border-radius: 4px;
  font-size: 14px;
}
#aim-firma-wrap .aim-firma-msg-error {
  background: #FFEBEE;
  color: #B71C1C;
  border: 1px solid #EF9A9A;
}
#aim-firma-wrap .aim-firma-msg-info {
  background: #E3F2FD;
  color: #0D47A1;
  border: 1px solid #90CAF9;
}
#aim-firma-wrap #aim-firma-ok {
  display: none;
  background: var(--aim-green-bg);
  border: 1px solid #81C784;
  color: var(--aim-green-dark);
  border-radius: 6px;
  padding: 18px 20px;
  font-size: 14px;
  line-height: 1.6;
}
#aim-firma-wrap #aim-firma-ok h2 {
  font-size: 18px;
  margin: 0 0 8px;
  color: var(--aim-green-dark);
}
#aim-firma-wrap .aim-firma-rgpd {
  margin-top: 16px;
  padding: 12px;
  background: #F8F9FA;
  border-radius: 4px;
  font-size: 12px;
  color: #555;
  line-height: 1.5;
}
@media (max-width: 480px) {
  #aim-firma-wrap #aim-firma-canvas { height: 180px; }
  #aim-firma-wrap .aim-firma-actions { flex-direction: column; }
}
