/* Ally Moving — official identity for the Junk Removal request form (2026-10-18).
   Loaded LAST in <head> of index.php, so it overrides the inline <style> without
   touching markup or logic. Same family as /booknow/ and /getaquotew/:
   Kanit + Manrope from /assets/css/fonts.css, Rojo/Gris/Rosa Ally, and the
   «rojo profesional» background (hub FONDOS/allymoving_fondo_rojo-profesional.css). */
:root {
  --ally-rojo: #A5473B;
  --ally-rojo-50: #FEF4F3;
  --ally-rojo-100: #F9E4E1;
  --ally-rojo-600: #8D3D32;
  --ally-gris: #5D5D5D;
  --ally-rosa: #F0C2BB;
  --ally-neutro-800: #353535;

  /* the names the page already uses */
  --brand-red:    var(--ally-rojo);
  --brand-red-dk: var(--ally-rojo-600);
  --brand-gold:   var(--ally-rosa);
  --brand-light:  #F7F7F7;
}

/* Background «rojo profesional»: soft radial gradient of the same red + ONE official
   emblem in white at 7 % in the bottom-right corner. Fixed layers: the long form
   scrolls over it without stretching it. No repeated patterns. */
html { background: #8D3D32; }
html body { background: transparent; }
body::before, body::after { content: ""; position: fixed; pointer-events: none; z-index: -1; }
body::before {
  inset: 0;
  background: radial-gradient(ellipse 90% 80% at 50% 36%, #A5473B 0%, #A5473B 40%, #9A4337 72%, #8D3D32 100%);
}
body::after {
  right: -10vmax; bottom: -12vmax; width: min(70vmax, 1000px); aspect-ratio: 895 / 683;
  background: url(../images/ally-emblema-blanco.svg?v=1) no-repeat center / contain; opacity: .07;
}
@media (max-width: 767px) {
  body::after { width: 125vw; right: -38vw; bottom: -10vh; }
}

/* Logo above the card (the body was a flex row: stack it) */
body { font-family: 'Manrope', 'Segoe UI', sans-serif; color: var(--ally-neutro-800); flex-direction: column; align-items: center; }
.form-logo { margin: 0 0 22px; text-align: center; }
.form-logo img { height: 52px; width: auto; }   /* 300 px wide: official minimum is 260 */
.form-card { box-shadow: 0 12px 36px rgba(53, 53, 53, .30); }
@media (max-width: 500px) { .form-logo { margin: 22px 0 18px; } }

/* Type */
.form-header h2 { font-family: 'Kanit', 'Segoe UI', sans-serif; font-weight: 700; letter-spacing: .01em; }
.form-header h2 span { color: var(--ally-rosa); }   /* large heading on red: 3.7:1 (large-text AA) */
input, select, textarea, button, .form-control, .form-select, .ui-datepicker { font-family: 'Manrope', 'Segoe UI', sans-serif; }

/* Contrast on white: helper text, placeholders, borders */
.section-hint { color: var(--ally-gris); }                       /* was #777 (4.48:1) -> 6.58:1 */
.form-control::placeholder, textarea::placeholder { color: var(--ally-gris); opacity: 1; }
.form-control, .form-select { border-color: #949494; }           /* input boundary >= 3:1 */
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 3px rgba(165, 71, 59, .18); }
.section-label { border-bottom-color: var(--ally-rojo-100); }
.photo-frame { border-color: var(--ally-rosa); }
.confirm-row { background: var(--ally-rojo-50); border-color: var(--ally-rosa); }
.confirm-row label { color: var(--ally-neutro-800); }
.sub-panel { background: var(--ally-rojo-50); }
.pill-option + label { border-color: #B5B5B5; color: var(--ally-neutro-800); }
.pill-option + label:hover { background: var(--ally-rojo-50); }

/* jQuery UI date picker */
.ui-state-hover { background: var(--ally-rojo-50) !important; }
.ui-datepicker .ui-state-highlight { background: var(--ally-rojo-100); border-color: var(--ally-rosa); color: var(--ally-rojo-600); }

/* "Submit" stays SOLID Rojo Ally on purpose: it is the one conversion action. */
