/* Visual adaptation of the AMAZ mobile design. Scoped to Grancasa mobile only.
   No reference-company assets, endpoints, storage keys or business data. */
#root .mobile-app, #root .mobile-auth {
  --mp: #007bff;
  color: #0f172a;
  background: #eef3f8;
  font-family: Arial, Helvetica, sans-serif;
}
#root .mobile-app *, #root .mobile-auth * { box-sizing: border-box; }
#root .mobile-app .mobile-brand {
  min-height: 64px; height: auto; padding: 8px 12px;
  background: #070b1f; box-shadow: none; gap: 9px;
}
#root .mobile-brand > div { min-width: 0; gap: 10px; }
#root .mobile-brand > div > b, #root .aca-login-mark {
  color: transparent; font-size: 0; flex-shrink: 0;
  background: #fff url('./brand/grancasa-g-blue.png') center / 82% auto no-repeat;
  border: 1px solid #dbe3ef; box-shadow: none;
}
#root .mobile-brand > div > b { width: 42px; height: 42px; border-radius: 14px; }
#root .mobile-brand span strong { font-size: 16px; font-weight: 900; letter-spacing: 0; }
#root .mobile-brand span small { font-size: 11px; color: #b8c4df; opacity: 1; }
#root .mobile-brand button { min-width: 38px; min-height: 38px; border: 1px solid #263960; border-radius: 11px; padding: 8px; }
#root .mobile-content { background: #eef3f8; padding-bottom: calc(90px + env(safe-area-inset-bottom)); }
#root .aca-home { padding: 12px; gap: 14px; max-width: 900px; margin: auto; }
#root .aca-hero {
  background: #091124; border: 1px solid #163a62; border-radius: 18px; padding: 18px;
  box-shadow: 0 10px 18px #0f172a20;
}
#root .aca-hero > small { color: #00a8c8; opacity: 1; letter-spacing: .04em; font-size: 12px; }
#root .aca-hero h1 { font-size: 24px; letter-spacing: 0; margin: 4px 0 12px; font-weight: 900; }
#root .aca-hero p { color: #c4d2ea; font-size: 14px; line-height: 21px; margin-bottom: 16px; }
#root .aca-hero button { border-radius: 999px; min-height: 42px; padding: 0 13px; font-size: 13px; }
#root .aca-hero button:first-child { color: #080a77; background: #fff; }
#root .aca-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
#root .aca-summary article {
  display: flex; flex-direction: column; align-items: flex-start; gap: 3px;
  min-height: 112px; padding: 13px; background: #fff; border: 1px solid #d6e0ee;
  border-top: 4px solid #007bff; border-radius: 14px; box-shadow: none;
}
#root .aca-summary article:nth-child(2) { border-top-color: #f59e0b; }
#root .aca-summary article:nth-child(3) { border-top-color: #ef4444; }
#root .aca-summary article:nth-child(4) { border-top-color: #10b981; }
#root .aca-summary span { width: 32px; height: 32px; border-radius: 10px; margin-bottom: 6px; }
#root .aca-summary b { font-size: 28px; font-weight: 900; }
#root .aca-summary small { color: #64748b; font-size: 12px; font-weight: 700; }
#root .aca-trail, #root .aca-best-tools { padding: 14px; border: 1px solid #d6e0ee; border-radius: 14px; box-shadow: none; }
#root .aca-trail header { margin-bottom: 12px; align-items: center; gap: 10px; }
#root .aca-trail header small { color: #0891b2; font-size: 10px; opacity: 1; }
#root .aca-trail h2, #root .aca-best-tools h2 { font-size: 20px; color: #0f172a; }
#root .aca-trail header button { color: #007bff; min-height: 40px; }
#root .aca-trail > div { grid-template-columns: 1fr; gap: 10px; }
#root .aca-trail article { min-height: 74px; padding: 12px; border: 1px solid #d6e0ee; border-radius: 14px; gap: 10px; }
#root .aca-trail article > b { background: #0f172a; width: 30px; height: 30px; flex-shrink: 0; }
#root .aca-trail article > span strong { font-size: 14px; }
#root .aca-trail article > span small { font-size: 12px; color: #64748b; }
#root .aca-trail article > i { display: none; }
#root .aca-inspection-card { padding: 14px 14px 14px 18px; border-radius: 14px; border-color: #d6e0ee; box-shadow: none; }
#root .aca-inspection-card:before { background: #007bff; width: 4px; }
#root .aca-inspection-card h2 { font-size: 18px; overflow-wrap: anywhere; }
#root .aca-inspection-card dd { font-size: 12px; overflow-wrap: anywhere; }
#root .aca-search { background: #fff; border: 1px solid #d6e0ee; border-radius: 12px; min-height: 48px; box-shadow: none; }
#root .aca-filters { gap: 8px; flex-wrap: wrap; }
#root .aca-filters button { min-height: 40px; border-radius: 999px; }
#root .aca-filters button.active { background: #007bff; color: #fff; border-color: #007bff; }
#root .mobile-app :is(input,select,textarea), #root .mobile-auth input {
  font-family: inherit; font-size: 16px; color: #0f172a; background: #fff;
  border: 1px solid #d6e0ee; border-radius: 12px; min-height: 48px;
}
#root .mobile-app :is(input,select,textarea):focus, #root .mobile-auth input:focus { outline: 2px solid #007bff; outline-offset: 2px; }
#root .mobile-app .mobile-confirm, #root .mobile-auth .mobile-auth-primary {
  min-height: 52px; border-radius: 12px; background: #080a77; color: #fff;
  font-size: 15px; font-weight: 900; border: 0; box-shadow: none;
}
#root .mobile-app .mobile-back { min-height: 48px; border: 1px solid #d6e0ee; border-radius: 12px; background: #fff; color: #0f172a; }
#root .aca-form-card, #root .aca-profile { border: 1px solid #d6e0ee; border-radius: 18px; background: #fff; padding: 18px; box-shadow: none; }
#root .mobile-drawer { background: #070b1f; color: #fff; }
#root .mobile-drawer nav button { min-height: 48px; border-radius: 12px; }
#root .mobile-drawer nav button.active { background: #007bff; color: #fff; }
#root .aca-bottom-nav { height: auto; min-height: 72px; padding: 8px 8px calc(10px + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid #d6e0ee; box-shadow: none; }
#root .aca-bottom-nav button { min-height: 44px; color: #64748b; gap: 4px; font-size: 11px; }
#root .aca-bottom-nav button.active { color: #007bff; }
#root .aca-bottom-nav svg { width: 24px; height: 24px; }
#root .mobile-auth { min-height: 100dvh; }
#root .aca-login-shell { width: min(460px,100%); padding: 22px; }
#root .aca-login-hero { flex-direction: column; text-align: center; gap: 0; margin-bottom: 22px; }
#root .aca-login-mark { width: 86px; height: 86px; border-radius: 26px; margin-bottom: 14px; box-shadow: 0 8px 18px #0f172a1f; }
#root .aca-login-hero h1 { color: #080a77; font-size: 30px; font-weight: 900; letter-spacing: 0; }
#root .aca-login-hero p { font-size: 15px; color: #526179; margin-top: 4px; }
#root .mobile-auth .aca-login-shell form { padding: 18px; border: 1px solid #d6e0ee; border-radius: 18px; box-shadow: 0 10px 20px #0f172a19; }
#root .mobile-auth .aca-login-shell h2 { font-size: 20px; }
#root .aca-login-kicker { color: #0891b2; }
@media (min-width:700px) {
  #root .aca-summary { grid-template-columns: repeat(4,minmax(0,1fr)); }
  #root .aca-trail > div { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
