/* ============================================================
   DANGOFE OS LIQUID V2 — portal_tecnico.css
   PORTAL TÉCNICO MÓVIL (DANGOFE-TECNICO-044 · v1.0.44)
   Diseño MÓVIL PRIMERO (mobile-first): tarjetas grandes, botones
   amplios aptos para el teléfono. Estética Liquid Glass (prefijo pt-).
   ============================================================ */

.pt-wrap { display: flex; flex-direction: column; gap: 16px; max-width: 680px; margin: 0 auto; }

/* ---------- encabezado ---------- */
.pt-head h2 { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 1.4rem; }
.pt-sub { margin: 4px 0 0; opacity: .75; font-size: .92rem; }
.pt-tecnico {
  display: flex; align-items: center; gap: 8px; font-weight: 600; font-size: 1rem;
  padding: 8px 12px; border-radius: 12px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
}

/* ---------- resumen (KPIs) ---------- */
.pt-resumen { display: flex; gap: 12px; flex-wrap: wrap; }
.pt-kpi {
  flex: 1 1 140px; display: flex; flex-direction: column; gap: 3px;
  padding: 16px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-kpi--main { background: rgba(74,222,128,.16); border-color: rgba(74,222,128,.4); }
.pt-kpi--taller { background: rgba(56,189,248,.14); border-color: rgba(56,189,248,.4); }
.pt-kpi__lbl { font-size: .8rem; opacity: .78; }
.pt-kpi__val { font-size: 1.6rem; font-weight: 800; line-height: 1.1; }
.pt-kpi__sub { font-size: .78rem; opacity: .7; }

/* ---------- filtros ---------- */
.pt-filtros { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; }
.pt-filtros label { display: flex; flex-direction: column; gap: 3px; font-size: .78rem; opacity: .8; flex: 1 1 120px; }
.pt-filtros input {
  padding: 10px 12px; border-radius: 12px; border: 1px solid var(--glass-border);
  background: var(--glass-bg-input); color: inherit; font: inherit; font-size: .9rem; width: 100%; box-sizing: border-box;
}

/* ---------- botones ---------- */
.pt-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 11px 16px; border-radius: 14px; border: 1px solid var(--glass-border);
  background: var(--glass-bg-input); color: inherit; cursor: pointer;
  font: inherit; font-size: .92rem; transition: all .18s ease;
}
.pt-btn:hover { background: var(--glass-bg-active); }
.pt-btn--primary { background: rgba(99,132,255,.3); border-color: rgba(99,132,255,.55); font-weight: 600; }
.pt-btn--primary:hover { background: rgba(99,132,255,.42); }
.pt-btn--block { width: 100%; margin-top: 10px; padding: 13px; font-size: 1rem; }

/* ---------- órdenes (tarjetas) ---------- */
.pt-ordenes { display: flex; flex-direction: column; gap: 12px; }
.pt-orden {
  display: flex; flex-direction: column; gap: 7px;
  padding: 16px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-orden__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pt-num { font-weight: 700; font-size: 1.05rem; }
.pt-orden__equipo, .pt-orden__cli, .pt-orden__fac, .pt-orden__fecha {
  display: flex; align-items: center; gap: 6px; font-size: .86rem; opacity: .82;
}
.pt-orden__fecha { opacity: .6; font-size: .8rem; }

/* ---------- estado ---------- */
.pt-estado {
  display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 999px;
  font-size: .78rem; font-weight: 600; white-space: nowrap;
  border: 1px solid var(--glass-border); background: var(--glass-bg-strong);
}
.pt-estado--pend   { background: rgba(148,163,184,.22); border-color: rgba(148,163,184,.5); }
.pt-estado--proc   { background: rgba(99,132,255,.22);  border-color: rgba(99,132,255,.5); }
.pt-estado--porfac { background: rgba(56,189,248,.22);  border-color: rgba(56,189,248,.5); }
.pt-estado--fact   { background: rgba(74,222,128,.22);  border-color: rgba(74,222,128,.5); }
.pt-estado--canc   { background: rgba(255,99,99,.22);   border-color: rgba(255,99,99,.5); }

/* ---------- generado ---------- */
.pt-gen {
  display: flex; flex-direction: column; gap: 2px;
  padding: 10px 12px; border-radius: 12px; margin-top: 3px;
}
.pt-gen--ok { background: rgba(74,222,128,.14); border: 1px solid rgba(74,222,128,.35); }
.pt-gen--pend { background: var(--glass-bg-soft); border: 1px dashed var(--glass-border); font-size: .84rem; opacity: .8; }
.pt-gen__lbl { font-size: .76rem; opacity: .78; }
.pt-gen__val { font-size: 1.25rem; font-weight: 800; }
.pt-gen__det { font-size: .76rem; opacity: .72; }

/* ---------- gasto rápido ---------- */
.pt-gcard {
  display: flex; flex-direction: column; gap: 10px; margin-top: 10px;
  padding: 14px; border-radius: 14px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
}
.pt-field { display: flex; flex-direction: column; gap: 5px; }
.pt-field span { font-size: .8rem; opacity: .78; }
.pt-field input {
  padding: 11px 12px; border-radius: 12px; border: 1px solid var(--glass-border);
  background: var(--glass-bg-input); color: inherit; font: inherit; font-size: .95rem;
  width: 100%; box-sizing: border-box;
}
.pt-gcard__actions { display: flex; gap: 8px; flex-wrap: wrap; }
.pt-gcard__actions .pt-btn { flex: 1 1 auto; }

/* ---------- estados de carga / vacío ---------- */
.pt-cargando, .pt-vacio, .pt-aviso {
  padding: 26px 16px; border-radius: 16px; text-align: center; opacity: .85;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap;
}
.pt-aviso { background: rgba(255,193,7,.12); border-color: rgba(255,193,7,.35); }
.pt-error { color: #ff8f8f; font-size: .92rem; display: flex; align-items: center; gap: 6px; padding: 14px; }

/* ---------- ajuste fino en pantallas anchas ---------- */
@media (min-width: 640px) {
  .pt-ordenes { display: grid; grid-template-columns: repeat(2, 1fr); }
}



/* ============================================================
   AGENDA DE TRABAJO — móvil primero (v1.0.48)
   Órdenes abiertas con acciones inmediatas (llamar / WhatsApp /
   cómo llegar). Objetivos táctiles grandes (min 44px).
   ============================================================ */
.pt-agenda {
  display: flex; flex-direction: column; gap: 12px;
  padding: 14px; border-radius: 18px;
  background: var(--bg-elevated, rgba(255,255,255,.05));
  border: 1px solid var(--border-soft, rgba(255,255,255,.1));
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-agenda__head {
  display: flex; align-items: center; gap: 8px; font-size: 1.05rem;
}
.pt-agenda__n {
  margin-left: auto; font-size: .78rem; font-weight: 600; padding: 3px 10px;
  border-radius: 999px;
  background: var(--bg-input, rgba(255,255,255,.08));
  border: 1px solid var(--border-soft, rgba(255,255,255,.16));
}
.pt-agenda__vacio {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 18px; opacity: .8; font-size: .9rem;
}
.pt-agenda__list { display: flex; flex-direction: column; gap: 12px; }

.pt-ag {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px; border-radius: 16px;
  background: var(--bg-input, rgba(255,255,255,.04));
  border: 1px solid var(--border-soft, rgba(255,255,255,.1));
}
.pt-ag__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pt-ag__cli { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: .98rem; }
.pt-ag__equipo, .pt-ag__dir { display: flex; align-items: center; gap: 6px; font-size: .85rem; opacity: .82; }
.pt-ag__prob { font-size: .85rem; opacity: .78; }
.pt-prio {
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px;
  font-size: .74rem; font-weight: 700;
}
.pt-prio--alta { background: rgba(255,99,99,.18); border: 1px solid rgba(255,99,99,.5); color: #ff8f8f; }

/* Acciones de contacto rápidas: fila táctil grande, se envuelve en móvil. */
.pt-acciones { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.pt-act {
  flex: 1 1 30%; min-width: 96px; min-height: 46px;
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 10px 12px; border-radius: 14px; text-decoration: none; cursor: pointer;
  font-size: .9rem; font-weight: 600;
  color: var(--action-primary-text, inherit);
  background: var(--action-primary-bg, rgba(99,132,255,.28));
  border: 1px solid var(--action-primary-border, rgba(99,132,255,.5));
  transition: filter .18s ease;
}
.pt-act:hover { filter: brightness(1.08); }
.pt-act--wa { background: rgba(37,211,102,.22); border-color: rgba(37,211,102,.55); color: inherit; }
.pt-act span { white-space: nowrap; }



/* ============================================================
   CARTERA DEL TÉCNICO — móvil primero (DANGOFE-taller-072 · v1.0.72)
   Solo datos propios: comisiones, producción y servicios entregados.
   Nunca costos ni márgenes. Estética Liquid Glass (prefijo pt-).
   ============================================================ */

/* ---------- pestañas (órdenes / cartera) ---------- */
.pt-tabs { display: flex; gap: 8px; }
.pt-tab {
  flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 11px 14px; border-radius: 14px; cursor: pointer;
  font: inherit; font-size: .92rem; font-weight: 600; color: inherit;
  background: var(--glass-bg-input); border: 1px solid var(--glass-border);
  transition: all .18s ease;
}
.pt-tab:hover { background: var(--glass-bg-active); }
.pt-tab.is-on {
  background: rgba(99,132,255,.3); border-color: rgba(99,132,255,.55);
}

/* ---------- producción (hoy / semana / mes) ---------- */
.pt-prod-head { display: flex; align-items: center; gap: 8px; font-size: 1rem; margin-top: 2px; }
.pt-prods { display: flex; gap: 12px; flex-wrap: wrap; }
.pt-prod {
  flex: 1 1 140px; display: flex; flex-direction: column; gap: 3px;
  padding: 14px; border-radius: 16px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-prod__lbl { font-size: .8rem; opacity: .78; }
.pt-prod__val { font-size: 1.4rem; font-weight: 800; line-height: 1.1; }
.pt-prod__sub { font-size: .76rem; opacity: .7; }

/* ---------- lista de servicios entregados (drill-down) ---------- */
.pt-cart-lista { display: flex; flex-direction: column; gap: 12px; }
.pt-cart {
  display: flex; flex-direction: column;
  padding: 14px 16px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-cart__top { display: flex; align-items: center; gap: 10px; cursor: pointer; }
.pt-cart__com { margin-left: auto; font-size: 1.1rem; font-weight: 800; }
.pt-cart__pago {
  display: inline-flex; align-items: center; padding: 4px 12px; border-radius: 999px;
  font-size: .76rem; font-weight: 600; white-space: nowrap;
  border: 1px solid var(--glass-border); background: var(--glass-bg-strong);
}
.pt-cart__pago--ok   { background: rgba(74,222,128,.2);  border-color: rgba(74,222,128,.5); }
.pt-cart__pago--pend { background: rgba(148,163,184,.22); border-color: rgba(148,163,184,.5); }
.pt-cart__det {
  display: flex; flex-direction: column; gap: 6px;
  margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--glass-border);
}
.pt-cart__row { display: flex; align-items: center; gap: 6px; font-size: .86rem; opacity: .85; }


/* ==========================================================
   SOLICITUDES DE PIEZAS (v1.0.74)
   Pedir piezas NO toca el inventario: el stock sube solo cuando
   la administración confirma lo comprado. Estilo Liquid Glass,
   mobile-first, en línea con el resto del portal.
   ========================================================== */
.pt-sol-top { margin-top: 4px; }
.pt-sol-top .pt-btn { width: 100%; }

/* Chips de filtro por estado */
.pt-sol-filtros { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.pt-chip {
  padding: 7px 14px; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: .82rem; font-weight: 600; color: inherit;
  background: var(--glass-bg-input); border: 1px solid var(--glass-border);
  transition: all .18s ease;
}
.pt-chip:hover { background: var(--glass-bg-active); }
.pt-chip.is-on { background: rgba(99,132,255,.3); border-color: rgba(99,132,255,.55); }

/* Lista de solicitudes */
.pt-sol-lista { display: flex; flex-direction: column; gap: 12px; }
.pt-sol-card {
  display: flex; flex-direction: column; gap: 8px;
  padding: 14px 16px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-sol-card__top { display: flex; align-items: center; gap: 10px; }
.pt-sol-card__fecha,
.pt-sol-card__obs,
.pt-sol-card__proc { display: flex; align-items: center; gap: 6px; font-size: .82rem; opacity: .82; }

/* Insignia de estado (cabecera y línea) */
.pt-sol-badge {
  display: inline-flex; align-items: center; margin-left: auto;
  padding: 4px 12px; border-radius: 999px; white-space: nowrap;
  font-size: .74rem; font-weight: 700;
  border: 1px solid var(--glass-border); background: var(--glass-bg-strong);
}
.pt-sol-linea__cant .pt-sol-badge { margin-left: 0; }
.pt-sol-badge--pend { background: rgba(148,163,184,.22); border-color: rgba(148,163,184,.5); }
.pt-sol-badge--proc { background: rgba(99,132,255,.22);  border-color: rgba(99,132,255,.5); }
.pt-sol-badge--parc { background: rgba(251,191,36,.22);  border-color: rgba(251,191,36,.55); }
.pt-sol-badge--ok   { background: rgba(74,222,128,.22);  border-color: rgba(74,222,128,.5); }
.pt-sol-badge--no   { background: rgba(255,99,99,.22);   border-color: rgba(255,99,99,.5); }
.pt-sol-badge--cerr { background: rgba(100,116,139,.28); border-color: rgba(100,116,139,.55); }

/* Líneas de la solicitud */
.pt-sol-lineas { display: flex; flex-direction: column; gap: 8px; }
.pt-sol-linea {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; border-radius: 12px;
  background: var(--glass-bg-soft); border: 1px solid var(--glass-border);
}
.pt-sol-linea__nom { font-weight: 600; font-size: .9rem; }
.pt-sol-linea__nom em { opacity: .7; font-style: italic; font-weight: 500; }
.pt-sol-linea__cant { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: .8rem; opacity: .9; }
.pt-sol-linea__obs { display: flex; align-items: center; gap: 5px; font-size: .78rem; opacity: .78; }

/* Formulario «Nueva solicitud» */
.pt-sol-form {
  display: flex; flex-direction: column; gap: 12px; margin: 12px 0;
  padding: 16px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
}
.pt-sol-form .pt-field input,
.pt-sol-form .pt-field textarea {
  padding: 11px 12px; border-radius: 12px; border: 1px solid var(--glass-border);
  background: var(--glass-bg-input); color: inherit; font: inherit; font-size: .95rem;
  width: 100%; box-sizing: border-box; resize: vertical;
}
.pt-sol-busca { display: flex; gap: 8px; }
.pt-sol-busca input { flex: 1 1 auto; }
.pt-sol-busca .pt-btn { white-space: nowrap; }

/* Resultados del buscador */
.pt-sol-result { display: flex; flex-direction: column; gap: 6px; max-height: 220px; overflow: auto; }
.pt-sol-opt {
  text-align: left; padding: 10px 12px; border-radius: 12px; cursor: pointer;
  font: inherit; font-size: .86rem; color: inherit;
  background: var(--glass-bg-input); border: 1px solid var(--glass-border);
}
.pt-sol-opt:hover { background: var(--glass-bg-active); }
.pt-sol-opt.is-on { background: rgba(99,132,255,.3); border-color: rgba(99,132,255,.55); }
.pt-sol-opt small { opacity: .7; }
.pt-sol-pick { display: flex; align-items: center; gap: 6px; font-size: .85rem; }

/* Botón/enlace de texto (quitar) */
.pt-linkbtn {
  background: none; border: none; color: inherit; cursor: pointer;
  font: inherit; font-size: .82rem; opacity: .75; text-decoration: underline;
  display: inline-flex; align-items: center; gap: 4px; padding: 2px 4px;
}
.pt-linkbtn:hover { opacity: 1; }

/* Líneas ya agregadas a la solicitud en construcción */
.pt-sol-added { display: flex; flex-direction: column; gap: 6px; }
.pt-sol-added__row {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 12px; border-radius: 12px;
  background: var(--glass-bg-soft); border: 1px solid var(--glass-border); font-size: .86rem;
}
.pt-sol-added__row em { opacity: .7; font-style: italic; }
.pt-sol-nota { display: flex; align-items: flex-start; gap: 6px; font-size: .78rem; opacity: .72; margin: 4px 0 0; }


/* ============================================================
   DANGOFE-taller-079: cola de trabajo del taller, tarjetas de
   equipo, recepción y desglose de comisión.
   Efectos 3D SOLO con transform/opacity (respeta prefers-reduced-motion).
   ============================================================ */

/* Cola de trabajo (equipos de taller activos) */
.pt-cola {
  display: flex; flex-direction: column; gap: 12px;
  padding: 14px; border-radius: 18px; margin-bottom: 16px;
  background: var(--bg-elevated, rgba(255,255,255,.05));
  border: 1px solid var(--border-soft, rgba(255,255,255,.1));
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-cola__head {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
}
.pt-cola__title { display: flex; align-items: center; gap: 8px; font-size: 1.05rem; }
.pt-cola__n {
  font-size: .78rem; font-weight: 600; padding: 3px 10px; border-radius: 999px;
  background: var(--glass-bg-input, rgba(255,255,255,.08));
  border: 1px solid var(--glass-border, rgba(255,255,255,.16));
}
.pt-cola__head .pt-btn { margin-left: auto; }
.pt-cola__vacio {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 18px; opacity: .8; font-size: .9rem;
}
.pt-cola__list { display: flex; flex-direction: column; gap: 12px; }

/* Formulario de recepción (se despliega bajo la cabecera) */
.pt-recepform { display: block; }
.pt-recepform:empty { display: none; }

/* Tarjeta de equipo en taller */
.pt-tal {
  display: flex; flex-direction: column; gap: 6px;
  padding: 14px; border-radius: 16px;
  background: var(--glass-bg-input, rgba(255,255,255,.04));
  border: 1px solid var(--glass-border, rgba(255,255,255,.1));
  border-left: 3px solid var(--glass-border, rgba(255,255,255,.16));
  will-change: transform;
  transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.pt-tal:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
}
.pt-tal--pend   { border-left-color: rgba(148,163,184,.7); }
.pt-tal--proc   { border-left-color: rgba(99,132,255,.7); }
.pt-tal--porfac { border-left-color: rgba(56,189,248,.7); }
.pt-tal--fact   { border-left-color: rgba(74,222,128,.7); }
.pt-tal--canc   { border-left-color: rgba(255,99,99,.7); opacity: .82; }
.pt-tal__top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.pt-tal__equipo { display: flex; align-items: center; gap: 6px; font-weight: 600; font-size: .98rem; }
.pt-tal__cli { display: flex; align-items: center; gap: 6px; font-size: .88rem; opacity: .85; }
.pt-tal__diag { font-size: .85rem; opacity: .78; }
.pt-tal__meta {
  display: flex; align-items: center; gap: 6px; font-size: .78rem; opacity: .7;
}
.pt-tal__com {
  display: flex; align-items: center; gap: 6px; font-size: .86rem;
  padding: 7px 10px; border-radius: 12px; margin-top: 2px;
}
.pt-tal__com strong { font-weight: 700; }
.pt-tal__com--est { background: rgba(56,189,248,.14); border: 1px solid rgba(56,189,248,.4); }
.pt-tal__com--ok  { background: rgba(74,222,128,.14); border: 1px solid rgba(74,222,128,.4); }
.pt-tal__com--no  { background: rgba(255,99,99,.14);  border: 1px solid rgba(255,99,99,.4); opacity: .9; }
.pt-tal__wait {
  display: flex; align-items: center; gap: 6px; font-size: .82rem; opacity: .7;
  padding: 9px 12px; border-radius: 12px; margin-top: 6px;
  background: var(--glass-bg-soft, rgba(255,255,255,.05));
  border: 1px dashed var(--glass-border, rgba(255,255,255,.16));
}

/* Desglose de comisión de taller (pestaña Cartera) */
.pt-desglose {
  display: flex; flex-direction: column; gap: 10px;
  padding: 14px; border-radius: 16px; margin-bottom: 14px;
  background: var(--glass-bg, rgba(255,255,255,.05));
  border: 1px solid var(--glass-border, rgba(255,255,255,.1));
}
.pt-desglose__head { display: flex; align-items: center; gap: 8px; font-size: .98rem; }
.pt-desglose__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.pt-dchip {
  display: inline-flex; flex-direction: column; gap: 2px;
  padding: 8px 14px; border-radius: 12px; font-size: .95rem; font-weight: 700;
  background: var(--glass-bg-input, rgba(255,255,255,.08));
  border: 1px solid var(--glass-border, rgba(255,255,255,.16));
}
.pt-dchip em { font-size: .72rem; font-weight: 600; font-style: normal; opacity: .7; }
.pt-dchip--est { background: rgba(56,189,248,.14); border-color: rgba(56,189,248,.4); }
.pt-dchip--ok  { background: rgba(74,222,128,.14); border-color: rgba(74,222,128,.4); }
.pt-dchip--pag { background: rgba(99,132,255,.14); border-color: rgba(99,132,255,.4); }
.pt-dchip--no  { background: rgba(255,99,99,.12);  border-color: rgba(255,99,99,.35); opacity: .85; }

@media (prefers-reduced-motion: reduce) {
  .pt-tal { transition: none; will-change: auto; }
  .pt-tal:hover { transform: none; box-shadow: none; }
}



/* ============================================================
   DANGOFE-taller-085: rediseño del resumen del Portal Técnico.
   Jerarquía clara — las COMISIONES (hero) y la COLA de taller
   dominan; cifras grandes con contexto; skeleton Liquid Glass.
   Mobile-first. Animaciones SOLO transform/opacity/background
   (respeta prefers-reduced-motion).
   ============================================================ */

/* ---------- hero de comisiones (dos cifras dominantes) ---------- */
.pt-hero { display: flex; gap: 12px; flex-wrap: wrap; }
.pt-hero__card {
  flex: 1 1 200px; display: flex; flex-direction: column; gap: 6px;
  padding: 18px 20px; border-radius: 20px; position: relative; overflow: hidden;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  transition: transform .2s ease, box-shadow .2s ease;
}
.pt-hero__card:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,.22); }
/* Reflejo Liquid Glass (decorativo, no captura clics). */
.pt-hero__card::after {
  content: ''; position: absolute; top: -45%; right: -18%;
  width: 170px; height: 170px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(255,255,255,.16), rgba(255,255,255,0) 70%);
}
.pt-hero__card--est { background: linear-gradient(135deg, rgba(56,189,248,.24), rgba(56,189,248,.07)); border-color: rgba(56,189,248,.45); }
.pt-hero__card--ok  { background: linear-gradient(135deg, rgba(74,222,128,.24), rgba(74,222,128,.07)); border-color: rgba(74,222,128,.45); }
.pt-hero__lbl { display: flex; align-items: center; gap: 6px; font-size: .84rem; font-weight: 600; opacity: .85; }
.pt-hero__val { font-size: 2.1rem; font-weight: 800; line-height: 1.05; letter-spacing: -.02em; }
.pt-hero__sub { font-size: .78rem; opacity: .72; }

/* ---------- tira de estadísticas secundarias ---------- */
.pt-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.pt-stat {
  flex: 1 1 100px; display: flex; flex-direction: column; align-items: center; gap: 3px;
  padding: 14px 10px; border-radius: 16px; text-align: center;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-stat--focus { background: rgba(99,132,255,.16); border-color: rgba(99,132,255,.42); }
.pt-stat__ic { opacity: .8; line-height: 1; }
.pt-stat__val { font-size: 1.5rem; font-weight: 800; line-height: 1.1; }
.pt-stat__val--sm { font-size: 1.05rem; }
.pt-stat__lbl { font-size: .74rem; opacity: .72; }

/* ---------- escaneabilidad de la cola: tiempo en taller ---------- */
.pt-tal__meta--aviso  { color: #fbbf24; opacity: .95; }
.pt-tal__meta--alerta { color: #ff8f8f; opacity: 1; font-weight: 600; }

/* ---------- skeleton Liquid Glass (carga) ---------- */
.pt-skel { display: flex; flex-direction: column; gap: 16px; }
.pt-sk__hero { display: flex; gap: 12px; flex-wrap: wrap; }
.pt-sk__stats { display: flex; gap: 10px; flex-wrap: wrap; }
.pt-sk__cola { display: flex; flex-direction: column; gap: 12px; }
.pt-sk__tecnico { height: 40px; border-radius: 12px; }
.pt-sk__card {
  flex: 1 1 200px; display: flex; flex-direction: column; gap: 10px;
  padding: 18px; border-radius: 18px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
}
.pt-sk__card--hero { min-height: 96px; }
.pt-sk__pill {
  flex: 1 1 100px; height: 78px; border-radius: 16px;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
}
.pt-sk__line { display: block; height: 12px; border-radius: 8px; }
/* Brillo en movimiento (shimmer) sobre las superficies del skeleton. */
.pt-sk__tecnico, .pt-sk__pill, .pt-sk__line {
  background-image: linear-gradient(100deg,
    rgba(255,255,255,.04) 30%, rgba(255,255,255,.16) 50%, rgba(255,255,255,.04) 70%);
  background-size: 200% 100%;
  animation: pt-sk-shimmer 1.4s ease-in-out infinite;
}
@keyframes pt-sk-shimmer {
  0%   { background-position: 180% 0; }
  100% { background-position: -20% 0; }
}

/* Ajuste fino en pantallas anchas: las tarjetas del skeleton no se estiran. */
@media (min-width: 640px) {
  .pt-sk__card--hero { flex: 1 1 46%; }
}

@media (prefers-reduced-motion: reduce) {
  .pt-hero__card { transition: none; }
  .pt-hero__card:hover { transform: none; box-shadow: none; }
  .pt-sk__tecnico, .pt-sk__pill, .pt-sk__line { animation: none; }
}

/* ============================================================
   DANGOFE-taller-109 · v1.0.109 — PORTAL TÉCNICO «MI TALLER»
   Portal y taller del técnico en uno: saludo, comisión destacada,
   accesos rápidos, tarifas por capacidad, cola con progreso y
   recepción/gasto guiados. Prefijo ptx-. Móvil primero.
   ============================================================ */
.ptx {
  --ptx-acento: 37, 99, 235;      /* azul de marca */
  --ptx-dinero: 5, 150, 105;      /* verde comisión */
  --ptx-oro: 217, 119, 6;         /* ámbar «en camino» */
  --ptx-rojo: 220, 38, 38;
  --ptx-txt-dinero: #047857;
  --ptx-txt-oro: #b45309;
  --ptx-superficie: rgba(255, 255, 255, .62);
  --ptx-linea: rgba(15, 23, 42, .09);
  --ptx-suave: rgba(15, 23, 42, .045);
  max-width: 760px;
}
[data-theme='dark'] .ptx {
  --ptx-txt-dinero: #6ee7b7;
  --ptx-txt-oro: #fcd34d;
  --ptx-superficie: rgba(255, 255, 255, .05);
  --ptx-linea: rgba(255, 255, 255, .1);
  --ptx-suave: rgba(255, 255, 255, .05);
}
.ptx .pt-tabs {
  position: sticky; top: 0; z-index: 3; padding: 4px; border-radius: 18px;
  background: var(--glass-bg-strong, rgba(255, 255, 255, .88));
  -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
}
.ptx .pt-tab { flex: 1 1 0; justify-content: center; min-height: 44px; }

/* ---------- saludo + comisión ---------- */
.ptx-hero {
  position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 16px;
  padding: 20px; border-radius: 24px; color: #fff;
  background:
    radial-gradient(120% 140% at 100% 0%, rgba(16, 185, 129, .55), rgba(16, 185, 129, 0) 55%),
    linear-gradient(135deg, #1e3a8a 0%, #2563eb 55%, #0ea5e9 100%);
  box-shadow: 0 18px 40px rgba(37, 99, 235, .28);
}
.ptx-hero::after {
  content: ''; position: absolute; width: 260px; height: 260px; right: -90px; bottom: -120px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, .18), rgba(255, 255, 255, 0) 70%); pointer-events: none;
}
.ptx-hero__top { display: flex; align-items: center; gap: 14px; position: relative; z-index: 1; }
.ptx-avatar {
  flex: 0 0 auto; width: 52px; height: 52px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 1.15rem; letter-spacing: .02em; color: #1e3a8a;
  background: linear-gradient(135deg, #fff, #dbeafe); box-shadow: 0 6px 16px rgba(0, 0, 0, .18);
}
.ptx-hero__txt { min-width: 0; }
.ptx-hola { margin: 0; font-size: 1.45rem; font-weight: 800; letter-spacing: -.01em; line-height: 1.15; }
.ptx-hola__sub { margin: 4px 0 0; font-size: .92rem; opacity: .92; }
.ptx-hola__sub b { font-weight: 800; }
.ptx-money {
  position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 12px;
}
.ptx-money__main {
  display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: 18px;
  background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .32);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.ptx-money__lbl { display: inline-flex; align-items: center; gap: 6px; font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; opacity: .95; }
.ptx-money__val { font-size: 2.35rem; font-weight: 900; line-height: 1.02; letter-spacing: -.03em; font-variant-numeric: tabular-nums; text-shadow: 0 2px 12px rgba(0, 0, 0, .18); }
.ptx-money__sub { font-size: .8rem; opacity: .9; }
.ptx-money__side { display: flex; flex-direction: column; gap: 8px; }
.ptx-money__mini {
  flex: 1 1 0; display: flex; flex-direction: column; gap: 1px; padding: 10px 14px; border-radius: 14px;
  background: rgba(15, 23, 42, .18); border: 1px solid rgba(255, 255, 255, .18);
}
.ptx-money__mini span { font-size: .72rem; font-weight: 600; opacity: .88; }
.ptx-money__mini b { font-size: 1.15rem; font-weight: 800; font-variant-numeric: tabular-nums; }
.ptx-money__mini small { font-size: .7rem; opacity: .8; }

/* ---------- accesos rápidos ---------- */
.ptx-accs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.ptx-acc {
  display: flex; align-items: center; gap: 10px; min-height: 58px; padding: 12px 14px; border-radius: 18px; cursor: pointer;
  font: inherit; font-weight: 700; font-size: .95rem; color: var(--text-primary); text-align: left;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.ptx-acc:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0, 0, 0, .12); }
.ptx-acc:active { transform: translateY(0); }
.ptx-acc:focus-visible { outline: 2px solid rgba(var(--ptx-acento), .8); outline-offset: 2px; }
.ptx-acc__ic {
  flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(var(--ptx-acento), .12); color: rgb(var(--ptx-acento));
}
.ptx-acc--pri { color: #fff; background: linear-gradient(135deg, #059669, #10b981); border-color: transparent; box-shadow: 0 10px 24px rgba(5, 150, 105, .28); }
.ptx-acc--pri .ptx-acc__ic { background: rgba(255, 255, 255, .22); color: #fff; }
.ptx-acc.is-on { box-shadow: 0 0 0 3px rgba(var(--ptx-acento), .35); }
.ptx-acc--pri.is-on { box-shadow: 0 0 0 3px rgba(var(--ptx-dinero), .35), 0 10px 24px rgba(5, 150, 105, .28); }
#ptx-panel:empty { display: none; }

/* ---------- indicadores ---------- */
.ptx-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.ptx-kpi {
  display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 14px 8px; border-radius: 18px; text-align: center;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
}
.ptx-kpi b { font-size: 1.7rem; font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums; }
.ptx-kpi span { font-size: .74rem; font-weight: 600; opacity: .75; }
.ptx-kpi--cola b { color: rgb(var(--ptx-acento)); }
.ptx-kpi--listo b { color: var(--ptx-txt-dinero); }
[data-theme='dark'] .ptx-kpi--cola b { color: #93c5fd; }

/* ---------- secciones ---------- */
.ptx-sec__tit { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 2px 2px 10px; font-size: 1rem; }
.ptx-sec__tit small { font-size: .78rem; opacity: .65; font-weight: 600; margin-left: auto; }
.ptx-sec__tit--sep { margin-top: 6px; }

/* ---------- tarifas por capacidad ---------- */
.ptx-tarifas { padding: 14px; border-radius: 20px; background: var(--glass-bg); border: 1px solid var(--glass-border); }
.ptx-tarifas .ptx-sec__tit { margin-bottom: 10px; }
.ptx-tarifas__lista { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
.ptx-tarifa {
  flex: 0 0 auto; display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border-radius: 14px; min-width: 112px;
  background: linear-gradient(135deg, rgba(var(--ptx-dinero), .14), rgba(var(--ptx-dinero), .04)); border: 1px solid rgba(var(--ptx-dinero), .3);
}
.ptx-tarifa em { font-style: normal; font-size: .76rem; font-weight: 700; opacity: .8; }
.ptx-tarifa b { font-size: 1.1rem; font-weight: 900; color: var(--ptx-txt-dinero); font-variant-numeric: tabular-nums; }

/* ---------- cola de trabajo ---------- */
.ptx-cola__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.ptx-eq {
  display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 20px; min-width: 0;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
  border-top: 4px solid rgba(var(--ptx-acento), .55);
}
.ptx-eq--pend { border-top-color: rgba(148, 163, 184, .8); }
.ptx-eq--porfac { border-top-color: rgba(14, 165, 233, .8); }
.ptx-eq--fact { border-top-color: rgba(var(--ptx-dinero), .8); }
.ptx-eq__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ptx-eq__num { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; font-weight: 700; opacity: .7; }
.ptx-eq__equipo { display: flex; align-items: center; gap: 8px; font-size: 1.05rem; font-weight: 800; line-height: 1.25; }
.ptx-eq__equipo span { min-width: 0; overflow-wrap: anywhere; }
.ptx-eq__cli { display: flex; align-items: center; gap: 6px; font-size: .86rem; opacity: .8; }
.ptx-prog { height: 6px; border-radius: 999px; background: var(--ptx-suave); overflow: hidden; }
.ptx-prog span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #2563eb, #10b981); transition: width .4s ease; }
.ptx-eq__diag {
  margin: 0; font-size: .84rem; opacity: .8; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ptx-din {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 6px; padding: 9px 12px; border-radius: 12px; font-size: .9rem; font-weight: 600;
}
.ptx-din svg { align-self: center; flex: 0 0 auto; }
.ptx-din b { font-size: 1.12rem; font-weight: 900; font-variant-numeric: tabular-nums; }
.ptx-din small { font-size: .74rem; opacity: .75; font-weight: 600; }
.ptx-din--est { color: var(--ptx-txt-oro); background: rgba(var(--ptx-oro), .12); border: 1px solid rgba(var(--ptx-oro), .3); }
.ptx-din--ok { color: var(--ptx-txt-dinero); background: rgba(var(--ptx-dinero), .12); border: 1px solid rgba(var(--ptx-dinero), .3); }
.ptx-din--pot { color: var(--text-primary); background: var(--ptx-suave); border: 1px dashed var(--ptx-linea); }
.ptx-din--no { color: var(--text-secondary); background: var(--ptx-suave); font-weight: 500; font-size: .82rem; }
.ptx-eq__pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: .8rem; }
.ptx-dias { display: inline-flex; align-items: center; gap: 5px; opacity: .75; }
.ptx-dias.is-aviso { color: var(--ptx-txt-oro); opacity: 1; font-weight: 700; }
.ptx-dias.is-alerta { color: rgb(var(--ptx-rojo)); opacity: 1; font-weight: 700; }
[data-theme='dark'] .ptx-dias.is-alerta { color: #fca5a5; }
.ptx-link {
  display: inline-flex; align-items: center; gap: 5px; padding: 6px 10px; border-radius: 10px; font-weight: 700; text-decoration: none;
  color: rgb(var(--ptx-acento)); background: rgba(var(--ptx-acento), .1);
}
[data-theme='dark'] .ptx-link { color: #93c5fd; }
.ptx-eq__acc { display: flex; }
.ptx-espera { display: inline-flex; align-items: center; gap: 6px; font-size: .84rem; opacity: .75; padding: 8px 0; }
.ptx-vacio {
  display: flex; align-items: center; gap: 12px; padding: 18px; border-radius: 18px;
  background: var(--glass-bg); border: 1px dashed var(--glass-border);
}
.ptx-vacio svg { color: var(--ptx-txt-dinero); flex: 0 0 auto; }
.ptx-vacio div { display: flex; flex-direction: column; gap: 2px; }
.ptx-vacio span { font-size: .84rem; opacity: .75; }

/* ---------- botones ---------- */
.ptx-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; padding: 10px 16px; border-radius: 14px;
  font: inherit; font-weight: 700; font-size: .92rem; cursor: pointer; color: var(--text-primary);
  background: var(--glass-bg-input, var(--glass-bg)); border: 1px solid var(--glass-border);
  transition: transform .12s ease, filter .12s ease;
}
.ptx-btn:active { transform: translateY(1px); }
.ptx-btn:disabled { opacity: .6; cursor: default; }
.ptx-btn:focus-visible { outline: 2px solid rgba(var(--ptx-acento), .8); outline-offset: 2px; }
.ptx-btn--pri { color: #fff; border-color: transparent; background: linear-gradient(135deg, #2563eb, #1d4ed8); box-shadow: 0 8px 18px rgba(37, 99, 235, .25); }
.ptx-btn--pri:hover:not(:disabled) { filter: brightness(1.07); }
.ptx-eq__acc .ptx-btn { width: 100%; }
.ptx-btn--lg { min-height: 50px; padding: 12px 22px; font-size: 1rem; }

/* ---------- tarjetas de formulario (recepción / gasto / éxito) ---------- */
.ptx-card {
  display: flex; flex-direction: column; gap: 12px; padding: 18px; border-radius: 22px;
  background: var(--glass-bg-strong, var(--glass-bg)); border: 1px solid var(--glass-border);
  -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 14px 36px rgba(0, 0, 0, .12);
}
.ptx-card__head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ptx-card__head h3 { margin: 0; display: flex; align-items: center; gap: 8px; font-size: 1.15rem; }
.ptx-x {
  width: 40px; height: 40px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
  color: var(--text-primary); background: var(--ptx-suave); border: 1px solid var(--ptx-linea);
}
.ptx-paso { display: flex; align-items: center; gap: 10px; margin-top: 4px; font-size: .98rem; }
.ptx-paso__n {
  width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem; color: #fff; background: linear-gradient(135deg, #2563eb, #0ea5e9);
}
.ptx-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; position: relative; }
.ptx-field { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.ptx-field--full { grid-column: 1 / -1; }
.ptx-field span { font-size: .8rem; font-weight: 600; opacity: .8; }
.ptx-field input, .ptx-field textarea, .ptx-field select {
  width: 100%; box-sizing: border-box; min-height: 46px; padding: 11px 13px; border-radius: 13px;
  font: inherit; font-size: 1rem; color: var(--text-primary);
  background: var(--glass-bg-input, var(--ptx-superficie)); border: 1px solid var(--ptx-linea);
}
.ptx-field textarea { resize: vertical; min-height: 64px; }
.ptx-field input:focus, .ptx-field textarea:focus, .ptx-field select:focus {
  outline: none; border-color: rgba(var(--ptx-acento), .6); box-shadow: 0 0 0 3px rgba(var(--ptx-acento), .15);
}
.ptx-lbl { font-size: .8rem; font-weight: 600; opacity: .8; margin-bottom: -4px; }
.ptx-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.ptx-chip {
  min-height: 40px; padding: 8px 14px; border-radius: 999px; cursor: pointer; font: inherit; font-size: .88rem; font-weight: 600;
  color: var(--text-primary); background: var(--ptx-suave); border: 1px solid var(--ptx-linea);
  transition: background .12s ease, border-color .12s ease, transform .1s ease;
}
.ptx-chip:active { transform: scale(.97); }
.ptx-chip.is-on { color: #fff; background: rgb(var(--ptx-acento)); border-color: rgb(var(--ptx-acento)); }
.ptx-res {
  grid-column: 1 / -1; display: flex; flex-direction: column; gap: 4px; padding: 6px; border-radius: 14px;
  background: var(--glass-bg-strong, var(--glass-bg)); border: 1px solid var(--ptx-linea);
}
.ptx-res[hidden] { display: none; }
.ptx-res__it {
  display: flex; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 10px; cursor: pointer; text-align: left;
  font: inherit; color: var(--text-primary); background: transparent; border: 0;
}
.ptx-res__it:hover { background: var(--ptx-suave); }
.ptx-res__it span { opacity: .7; font-size: .86rem; }
.ptx-res__vacio { padding: 10px 12px; font-size: .86rem; opacity: .75; }
.ptx-comprev { display: none; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; font-size: .92rem; }
.ptx-comprev.is-ok { display: flex; color: var(--ptx-txt-dinero); background: rgba(var(--ptx-dinero), .12); border: 1px solid rgba(var(--ptx-dinero), .3); }
.ptx-comprev.is-ok b { font-size: 1.1rem; font-weight: 900; }
.ptx-comprev.is-no { display: flex; color: var(--text-secondary); background: var(--ptx-suave); border: 1px dashed var(--ptx-linea); }
.ptx-comprev svg { flex: 0 0 auto; }
.ptx-fotos {
  display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px; border-radius: 16px; cursor: pointer; text-align: center;
  border: 2px dashed rgba(var(--ptx-acento), .35); background: rgba(var(--ptx-acento), .05);
}
.ptx-fotos input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.ptx-fotos:focus-within { outline: 2px solid rgba(var(--ptx-acento), .7); outline-offset: 2px; }
.ptx-fotos__btn { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; color: rgb(var(--ptx-acento)); }
[data-theme='dark'] .ptx-fotos__btn { color: #93c5fd; }
.ptx-fotos__hint { font-size: .78rem; opacity: .7; overflow-wrap: anywhere; }
.ptx-thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.ptx-thumbs:empty { display: none; }
.ptx-thumb { position: relative; width: 72px; height: 72px; border-radius: 12px; overflow: hidden; background: var(--ptx-suave); }
.ptx-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ptx-thumb__x {
  position: absolute; top: 4px; right: 4px; width: 24px; height: 24px; border-radius: 50%; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center; color: #fff; background: rgba(15, 23, 42, .7);
}
.ptx-fila { display: flex; flex-wrap: wrap; gap: 10px; }
.ptx-fila--fin { justify-content: flex-end; margin-top: 4px; }
.ptx-nota { margin: -4px 0 0; font-size: .84rem; opacity: .75; }
.ptx-exito { flex-direction: row; align-items: flex-start; gap: 14px; border-color: rgba(var(--ptx-dinero), .4); }
.ptx-exito > svg { color: var(--ptx-txt-dinero); flex: 0 0 auto; }
.ptx-exito h3 { margin: 0 0 4px; font-size: 1.2rem; }
.ptx-exito p { margin: 0 0 12px; font-size: .92rem; }

@media (prefers-reduced-motion: reduce) {
  .ptx-acc, .ptx-btn, .ptx-chip, .ptx-prog span { transition: none; }
}
@media (max-width: 560px) {
  .ptx-hero { padding: 16px; border-radius: 20px; }
  .ptx-hola { font-size: 1.25rem; }
  .ptx-money { grid-template-columns: 1fr; }
  .ptx-money__val { font-size: 2.1rem; }
  .ptx-money__side { flex-direction: row; }
  .ptx-accs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ptx-acc--pri { grid-column: 1 / -1; }
  .ptx-grid { grid-template-columns: 1fr; }
  .ptx-cola__lista { grid-template-columns: 1fr; }
  .ptx-kpi b { font-size: 1.45rem; }
  .ptx-fila--fin .ptx-btn { flex: 1 1 auto; }
  .ptx .pt-tab { font-size: .82rem; padding: 8px 6px; }
}

/* DANGOFE-taller-109 · separación entre bloques del portal */
.ptx #pt-body { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ptx #pt-body > * { margin-top: 0; margin-bottom: 0; }
.ptx-money__mini b { white-space: nowrap; }
@media (max-width: 560px) { .ptx-money__mini b { font-size: 1rem; } .ptx-money__mini { padding: 9px 11px; } }
@media (max-width: 420px) { .ptx .pt-tab svg { display: none; } .ptx .pt-tab { white-space: nowrap; font-size: .8rem; } }

/* DANGOFE-taller-111 · equipos sin técnico (el técnico los puede tomar) */
.ptx-libres { padding: 14px; border-radius: 20px; background: rgba(var(--ptx-oro), .07); border: 1px solid rgba(var(--ptx-oro), .3); }
.ptx-libres .ptx-sec__tit { color: var(--ptx-txt-oro); }
.ptx-libres .ptx-nota { margin: -4px 2px 10px; }
.ptx-libres__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.ptx-libre {
  display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 16px; min-width: 0;
  background: var(--glass-bg); border: 1px solid var(--glass-border);
}
.ptx-libre .ptx-btn { width: 100%; }
.ptx-libre__din { font-size: .82rem; color: var(--ptx-txt-dinero); font-weight: 600; }
.ptx-libre__din b { font-weight: 900; }
@media (max-width: 560px) { .ptx-libres__lista { grid-template-columns: 1fr; } }

/* DANGOFE-taller-112 · «Te deben» y pagos recibidos */
.ptx-money__mini.is-debe { background: rgba(250, 204, 21, .22); border-color: rgba(253, 224, 71, .55); }
.ptx-pagos { padding: 14px; border-radius: 20px; background: var(--glass-bg); border: 1px solid var(--glass-border); }
.ptx-pagos .ptx-nota { margin: 0 2px; }
.ptx-pagos__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.ptx-pago { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 4px 10px; align-items: center; padding: 10px 2px; border-top: 1px solid var(--ptx-linea); font-size: .88rem; }
.ptx-pago:first-child { border-top: 0; }
.ptx-pago__f { opacity: .7; font-size: .82rem; white-space: nowrap; }
.ptx-pago__d { min-width: 0; overflow-wrap: anywhere; }
.ptx-pago__m { color: var(--ptx-txt-dinero); font-weight: 900; white-space: nowrap; }
@media (max-width: 560px) { .ptx-pago { grid-template-columns: minmax(0, 1fr) auto; } .ptx-pago__f { grid-column: 1 / -1; } }

/* DANGOFE-rutas-113 · «Mi ruta de hoy» */
.ptx-ruta { padding: 14px; border-radius: 20px; background: var(--glass-bg); border: 1px solid rgba(37,99,235,.4); box-shadow: 0 0 0 1px rgba(37,99,235,.08) inset; }
.ptx-ruta .ptx-sec__tit small { font-size: .78rem; opacity: .75; }
.ptx-ruta__prog { margin: -4px 2px 10px; font-size: .82rem; color: #15803d; display: flex; align-items: center; gap: 6px; }
[data-theme='dark'] .ptx-ruta__prog { color: #4ade80; }
.ptx-ruta__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ptx-rpar {
  display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 6px 10px; padding: 10px; border-radius: 14px;
  background: var(--glass-bg-soft, rgba(255,255,255,.04)); border: 1px solid var(--glass-border);
}
.ptx-rpar__n {
  width: 28px; height: 28px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: .85rem; color: #fff; background: #2563eb;
}
.ptx-rpar.is-hecha { opacity: .65; }
.ptx-rpar.is-hecha .ptx-rpar__n { background: #16a34a; }
.ptx-rpar__txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: .9rem; overflow-wrap: anywhere; }
.ptx-rpar__txt small { font-size: .76rem; opacity: .72; }
.ptx-rpar__acc { grid-column: 2; display: flex; flex-wrap: wrap; gap: 8px; }
.ptx-rpar__acc .pt-btn { text-decoration: none; padding: 7px 12px; font-size: .84rem; }
.ptx-ruta__gm {
  margin-top: 12px; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 12px; border-radius: 14px;
  font-weight: 700; text-decoration: none; color: #fff; background: #2563eb;
}
.ptx-ruta__gm:hover { background: #1d4ed8; }
.ptx-rpar__hora { display: inline-flex; align-items: center; gap: 4px; font-size: .78rem; font-weight: 600; color: #1d4ed8; }
[data-theme='dark'] .ptx-rpar__hora { color: #93c5fd; }
/* DANGOFE-rutas-117 · vehículo de hoy */
.ptx-vehhoy { padding: 14px; border-radius: 20px; background: var(--glass-bg); border: 1px solid var(--glass-border); display: flex; flex-direction: column; gap: 8px; }
.ptx-vehhoy .ptx-sec__tit { margin-bottom: 0; }
.ptx-vehhoy__sel { padding: 12px 14px; border-radius: 14px; border: 1px solid var(--glass-border); background: var(--glass-bg-input); color: inherit; font: inherit; font-size: 1rem; font-weight: 600; }
.ptx-vehhoy .ptx-nota { margin: 0; }
.ptx-vehhoy__est { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.ptx-vehhoy__est > div { padding: 10px; border-radius: 14px; background: var(--glass-bg-soft, rgba(255,255,255,.04)); border: 1px solid var(--glass-border); display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.ptx-vehhoy__est span { font-size: .68rem; text-transform: uppercase; letter-spacing: .04em; opacity: .7; }
.ptx-vehhoy__est b { font-size: 1.05rem; white-space: nowrap; }
.ptx-vehhoy__est small { font-size: .7rem; opacity: .7; }
@media (max-width: 420px) {
  .ptx-vehhoy__est { grid-template-columns: 1fr 1fr; }
  .ptx-vehhoy__est > div:last-child { grid-column: 1 / -1; }
}

/* ---------- DANGOFE-rutas-120 · ruta en vivo estilo Waze (arriba del portal) ---------- */
#ptx-waze:empty { display: none; }
.ptx-waze {
  margin: 0 0 14px; padding: 14px; border-radius: 22px; color: #fff;
  background: linear-gradient(135deg, #0b2a3d 0%, #0f4a63 55%, #12657f 100%);
  box-shadow: 0 10px 28px rgba(11, 42, 61, .28); display: flex; flex-direction: column; gap: 10px;
}
.ptx-waze.is-fin { background: linear-gradient(135deg, #0d3b2a 0%, #14613f 60%, #1b7a4f 100%); }
.ptx-waze__top { display: flex; align-items: flex-start; gap: 12px; }
.ptx-waze__flecha {
  flex: 0 0 52px; height: 52px; border-radius: 16px; display: grid; place-items: center;
  background: #33ccff; color: #062030; box-shadow: 0 4px 14px rgba(51, 204, 255, .45);
}
.ptx-waze.is-fin .ptx-waze__flecha { background: #4ade80; color: #06301b; box-shadow: 0 4px 14px rgba(74, 222, 128, .4); }
.ptx-waze__que { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ptx-waze__que small { font-size: .74rem; letter-spacing: .03em; text-transform: uppercase; opacity: .8; }
.ptx-waze__que small em { font-style: normal; color: #ffd166; text-transform: none; letter-spacing: 0; }
.ptx-waze__que b { font-size: 1.25rem; line-height: 1.2; overflow-wrap: anywhere; }
.ptx-waze__que span { font-size: .9rem; opacity: .92; overflow-wrap: anywhere; }
.ptx-waze__que .ptx-waze__det { font-size: .78rem; opacity: .75; }
.ptx-waze__chips { display: flex; flex-wrap: wrap; gap: 6px; }
.ptx-waze__chips span {
  display: inline-flex; align-items: center; gap: 4px; padding: 5px 10px; border-radius: 999px;
  background: rgba(255, 255, 255, .14); font-size: .82rem;
}
.ptx-waze__chips b { font-size: .95rem; }
.ptx-waze__chips .ptx-waze__chip--cita { background: rgba(255, 209, 102, .2); }
.ptx-waze__chips .ptx-waze__chip--tarde { background: rgba(248, 113, 113, .3); }
.ptx-waze__acc { display: flex; flex-wrap: wrap; gap: 8px; }
.ptx-waze__btn {
  flex: 1 1 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px;
  padding: 10px 14px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .12); color: #fff; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
}
.ptx-waze__btn:hover { background: rgba(255, 255, 255, .2); }
.ptx-waze__btn:disabled { opacity: .6; cursor: default; }
.ptx-waze__btn--waze { background: #33ccff; border-color: #33ccff; color: #062030; }
.ptx-waze__btn--waze:hover { background: #5cd6ff; }
.ptx-waze__btn--camino { border-color: rgba(255, 209, 102, .6); color: #ffd166; }
.ptx-waze__btn--hecho { background: #22c55e; border-color: #22c55e; color: #fff; flex-basis: 60%; }
.ptx-waze__btn--hecho:hover { background: #16a34a; }
.ptx-waze__road { position: relative; height: 34px; margin: 4px 10px 0; }
.ptx-waze__linea { position: absolute; left: 0; right: 0; top: 22px; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .22); overflow: hidden; }
.ptx-waze__avance { display: block; height: 100%; background: #33ccff; border-radius: 4px; transition: width .6s ease; }
.ptx-waze.is-fin .ptx-waze__avance { background: #4ade80; }
.ptx-waze__punto, .ptx-waze__base { position: absolute; top: 24px; transform: translate(-50%, -50%); }
.ptx-waze__punto { width: 12px; height: 12px; border-radius: 50%; background: #0b2a3d; border: 2px solid rgba(255, 255, 255, .7); }
.ptx-waze__punto.is-hecho { background: #4ade80; border-color: #4ade80; }
.ptx-waze__punto.is-sig { background: #33ccff; border-color: #fff; animation: ptx-waze-pulso 1.6s ease-in-out infinite; }
.ptx-waze__base { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 6px; background: rgba(255, 255, 255, .9); color: #0b2a3d; }
.ptx-waze__camion { position: absolute; top: 0; transform: translateX(-50%); color: #ffd166; transition: left .6s ease; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .35)); }
@keyframes ptx-waze-pulso { 0%, 100% { box-shadow: 0 0 0 0 rgba(51, 204, 255, .6); } 50% { box-shadow: 0 0 0 7px rgba(51, 204, 255, 0); } }
@media (prefers-reduced-motion: reduce) { .ptx-waze__punto.is-sig { animation: none; } .ptx-waze__avance, .ptx-waze__camion { transition: none; } }
.ptx-waze__pie { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; font-size: .8rem; opacity: .92; }
.ptx-waze__ver { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; border-radius: 10px; border: 0; background: rgba(255, 255, 255, .14); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.ptx-waze__lista { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ptx-waze__lista li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 14px; background: rgba(255, 255, 255, .08); }
.ptx-waze__lista li > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.ptx-waze__lista li small { font-size: .76rem; opacity: .8; overflow-wrap: anywhere; }
.ptx-waze__lista li.is-hecha { opacity: .7; }
.ptx-waze__lista li.is-sig { background: rgba(51, 204, 255, .18); box-shadow: inset 0 0 0 1px rgba(51, 204, 255, .5); }
.ptx-waze__lista li.is-aviso { background: rgba(255, 209, 102, .16); }
.ptx-waze__n { flex: 0 0 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: .8rem; font-weight: 700; background: rgba(255, 255, 255, .18); }
.ptx-waze__lista li.is-hecha .ptx-waze__n { background: #4ade80; color: #06301b; }
.ptx-waze__mini { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: #33ccff; color: #062030; }
.ptx-waze__todo { display: inline-flex; align-items: center; gap: 6px; color: #9be7ff; font-weight: 600; font-size: .85rem; }
@media (max-width: 420px) {
  .ptx-waze { padding: 12px; border-radius: 18px; }
  .ptx-waze__flecha { flex-basis: 44px; height: 44px; border-radius: 14px; }
  .ptx-waze__que b { font-size: 1.1rem; }
  .ptx-waze__acc--2 .ptx-waze__btn { flex-basis: 100%; }
}

/* ---------- DANGOFE-rutas-123 · pasos del servicio y cronómetro ---------- */
.ptx-waze__btn--inicio { background: #0ea5e9; border-color: #0ea5e9; color: #fff; flex-basis: 60%; }
.ptx-waze__btn--inicio:hover { background: #0284c7; }
.ptx-waze__chips .ptx-waze__reloj { background: rgba(51, 204, 255, .22); font-variant-numeric: tabular-nums; }
.ptx-waze__chips .ptx-waze__reloj b { font-size: 1.05rem; letter-spacing: .02em; }
.ptx-waze__chips .ptx-waze__reloj.is-pasado { background: rgba(251, 191, 36, .3); animation: ptx-waze-alerta 1.8s ease-in-out infinite; }
@keyframes ptx-waze-alerta { 0%, 100% { box-shadow: 0 0 0 0 rgba(251, 191, 36, .5); } 50% { box-shadow: 0 0 0 6px rgba(251, 191, 36, 0); } }
@media (prefers-reduced-motion: reduce) { .ptx-waze__chips .ptx-waze__reloj.is-pasado { animation: none; } }
@media (max-width: 420px) { .ptx-waze__acc--2 .ptx-waze__btn--inicio { flex-basis: 100%; } }