/* ===========================================================================
   Atlas — CSS Mobile-First (Capa 1: Acción Rápida)
   Optimizado para celular en obra
   =========================================================================== */

/* ───────── Home mobile (Capa 1) ───────── */
.home-mobile {
  display: flex; flex-direction: column;
  gap: 16px;
  max-width: 600px; margin: 0 auto;
}

/* Saludo */
.greeting {
  padding: 8px 0 0;
}
.greeting-time {
  font-size: 0.85rem;
  color: var(--atl-fg-mute);
}
.greeting-name {
  font-family: var(--atl-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 2px;
}

/* CTA primario: Escanear QR */
.cta-escanear {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 12px;
  padding: 32px 16px;
  background: linear-gradient(135deg, var(--atl-primary) 0%, #1d4ed8 100%);
  border-radius: var(--atl-radius-lg);
  color: white;
  font-weight: 700; font-size: 1.15rem;
  min-height: 140px;
  width: 100%;
  box-shadow: var(--atl-shadow-md);
  transition: transform .1s, box-shadow .15s;
}
.cta-escanear:active {
  transform: scale(.98);
  box-shadow: var(--atl-shadow-sm);
}
.cta-escanear svg { width: 48px; height: 48px; }
.cta-escanear-sub {
  font-size: 0.8rem;
  font-weight: 500;
  opacity: 0.85;
}

/* Grid de quick actions (2x2) */
.quick-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.quick-action {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px;
  padding: 20px 12px;
  background: var(--atl-bg-elev);
  border: 1px solid var(--atl-border);
  border-radius: var(--atl-radius-md);
  color: var(--atl-fg);
  min-height: 100px;
  text-align: center;
  font-weight: 600; font-size: 0.85rem;
  transition: transform .1s, border-color .15s;
}
.quick-action:active {
  transform: scale(.97);
  border-color: var(--atl-primary);
}
.quick-action-icon { font-size: 1.8rem; line-height: 1; }
.quick-action-label { line-height: 1.2; }

.quick-action.qa-despacho   { color: var(--atl-info); }
.quick-action.qa-retorno    { color: var(--atl-success); }
.quick-action.qa-inspeccion { color: var(--atl-warning); }
.quick-action.qa-dano       { color: var(--atl-danger); }

/* Sección "Hoy" — alertas accionables (NO KPIs vacíos) */
.section-hoy {
  display: flex; flex-direction: column;
  gap: 8px;
}
.section-title {
  font-family: var(--atl-font-display);
  font-size: 1rem; font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--atl-fg-mute);
  margin: 16px 0 4px;
}

.alert-card {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 16px;
  background: var(--atl-bg-elev);
  border: 1px solid var(--atl-border);
  border-left-width: 4px;
  border-radius: var(--atl-radius-md);
  min-height: var(--atl-touch-min);
  transition: transform .1s;
}
.alert-card:active { transform: scale(.99); }

.alert-card.alert-warn { border-left-color: var(--atl-warning); }
.alert-card.alert-info { border-left-color: var(--atl-info); }
.alert-card.alert-ok   { border-left-color: var(--atl-success); }
.alert-card.alert-danger { border-left-color: var(--atl-danger); }

.alert-icon  { font-size: 1.5rem; flex-shrink: 0; }
.alert-body  { flex: 1; min-width: 0; }
.alert-title { font-weight: 600; font-size: 0.95rem; }
.alert-desc  { font-size: 0.8rem; color: var(--atl-fg-mute); margin-top: 2px; }
.alert-arrow { color: var(--atl-fg-mute); }

/* Estado "Todo al día" */
.alert-empty {
  display: flex; flex-direction: column; align-items: center;
  padding: 32px 16px;
  text-align: center;
  color: var(--atl-fg-mute);
}
.alert-empty-icon { font-size: 3rem; margin-bottom: 8px; opacity: 0.5; }

/* Footer del home */
.home-footer {
  margin-top: 24px;
  padding: 16px;
  text-align: center;
}
.home-footer a {
  color: var(--atl-fg-mute);
  font-size: 0.85rem;
}

/* Selector de organización (modal inline cuando hay >1) */
.org-list {
  display: flex; flex-direction: column; gap: 8px;
  padding: 8px 0;
}
.org-item {
  display: flex; align-items: center; gap: 12px;
  padding: 16px;
  background: var(--atl-bg-elev);
  border: 1px solid var(--atl-border);
  border-radius: var(--atl-radius-md);
  cursor: pointer;
  min-height: 64px;
  transition: border-color .15s;
}
.org-item:hover  { border-color: var(--atl-primary); }
.org-item:active { transform: scale(.99); }
.org-item.active { border-color: var(--atl-primary); background: rgba(59,130,246,.08); }

.org-avatar {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-weight: 700;
  flex-shrink: 0;
}
.org-info { flex: 1; min-width: 0; }
.org-name { font-weight: 600; font-size: 0.95rem; }
.org-type {
  font-size: 0.75rem;
  color: var(--atl-fg-mute);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-top: 2px;
}
.org-type-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--atl-radius-pill);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}
.org-type-interna       { background: rgba(59,130,246,.2);  color: var(--atl-primary); }
.org-type-alquiler      { background: rgba(16,185,129,.2);  color: var(--atl-success); }
.org-type-entrenamiento { background: rgba(245,158,11,.2);  color: var(--atl-warning); }

/* ───────── Desktop: hide drawer trigger, show sidebar permanente ───────── */
@media (min-width: 1024px) {
  .topbar-icon#btn-drawer { display: none; }

  .drawer {
    transform: translateX(0);
    box-shadow: none;
  }
  .drawer-overlay { display: none !important; }

  /* Botón cerrar drawer oculto en desktop (siempre abierto) */
  #btn-drawer-close { display: none; }

  .app {
    margin-left: var(--atl-drawer-w);
  }

  .topbar {
    padding-left: calc(var(--atl-drawer-w) + 16px);
  }
}

/* Tablet medium */
@media (min-width: 768px) and (max-width: 1023px) {
  .home-mobile { max-width: 720px; }
  .quick-actions {
    grid-template-columns: repeat(4, 1fr);
  }
}