/*!
 * consultacliente.css — Vista pública de seguimiento de pedidos BK.
 * Modo claro con acentos dark (#212529) + warning (#ffc107).
 * Usado por consultacliente.php (shell) y el fragmento de consultacliente_buscar.php.
 */
:root{
  --dark:#212529; --dark-2:#2b3035; --dark-3:#343a40;
  --warn:#ffc107; --warn-d:#e0a800; --warn-soft:rgba(255,193,7,.16);
  --warn-text:#8a6100;           /* ámbar legible sobre fondo claro */
  --wsp:#25d366; --wsp-d:#1da851;
  --bg:#eef0f3; --surface:#ffffff;
  --ink:#1f2937; --muted:#6b7280; --line:#e5e7eb;
  --r:16px; --sh:0 10px 30px rgba(17,24,39,.10);
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink); min-height:100vh;
  font-family:'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}

/* Header de marca (barra oscura + marca en ámbar) */
.rm-header{
  background:linear-gradient(135deg,#2b3035,var(--dark));
  color:#fff; padding:18px 16px; text-align:center;
  border-bottom:3px solid var(--warn); box-shadow:0 4px 18px rgba(0,0,0,.18);
}
.rm-brand{margin:0; font-size:1.25rem; font-weight:700; letter-spacing:.3px;
  display:inline-flex; align-items:center; gap:.5rem; color:var(--warn)}
.rm-sub{margin:.15rem 0 0; font-size:.8rem; color:#c7ccd1}

.rm-wrap{max-width:500px; margin:0 auto; padding:22px 14px 44px}

/* Tarjeta de búsqueda */
.rm-search{background:var(--surface); border-radius:var(--r); box-shadow:var(--sh);
  border:2px solid var(--warn); padding:26px 22px}
.rm-search-title{font-size:1.05rem; font-weight:700; margin:0 0 3px; color:var(--dark)}
.rm-search-lead{font-size:.85rem; color:var(--muted); margin:0 0 18px}
.rm-field{margin-bottom:15px}
.rm-field > label{font-size:.74rem; font-weight:700; color:var(--muted);
  text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; display:block}
.form-control,.form-select{background:#fff; color:var(--ink);
  border-radius:12px; border:1.5px solid var(--line); padding:.72rem .9rem; font-size:1rem}
.form-control::placeholder{color:#9aa1a9}
.form-control:focus,.form-select:focus{background:#fff; color:var(--ink);
  border-color:var(--warn); box-shadow:0 0 0 .2rem var(--warn-soft)}
.rm-recaptcha{display:flex; justify-content:center; margin-bottom:18px; overflow:hidden}
.rm-legal{font-size:.7rem; color:var(--muted); text-align:center; margin:12px 0 0; line-height:1.4}
.rm-legal a{color:var(--muted); text-decoration:underline}

/* CTA oscuro con texto ámbar = combinación dark + warning */
.btn-rm{background:var(--dark); border:none; color:var(--warn); font-weight:700;
  border-radius:12px; padding:.8rem 1rem; width:100%; transition:.15s;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem}
.btn-rm:hover,.btn-rm:focus{background:#000; color:var(--warn)}
.btn-rm:disabled{opacity:.92; cursor:progress}
.btn-rm .spinner-border{vertical-align:-.125em}

/* Temporizador de la consulta (se cierra a los 2 min) */
.rm-timer{display:flex; align-items:center; justify-content:center; gap:.5rem;
  background:var(--dark); color:var(--warn); font-weight:600; font-size:.85rem;
  padding:10px 14px; border-radius:12px; margin-bottom:14px}
.rm-timer strong{color:#fff; font-variant-numeric:tabular-nums; letter-spacing:.5px}
.rm-timer.is-soon{background:#7b1d1d}
.rm-timer.is-soon, .rm-timer.is-soon strong{color:#ffe08a}

/* Tarjeta de resultado */
.rm-card{background:var(--surface); border-radius:var(--r); box-shadow:var(--sh);
  border:2px solid var(--warn); overflow:hidden}
.rm-card-head{background:linear-gradient(135deg,#2b3035,var(--dark)); color:#fff;
  padding:18px 20px; border-bottom:3px solid var(--warn)}
.rm-cli{margin:0; font-size:1.05rem; font-weight:700; line-height:1.25; color:var(--warn)}
.rm-dir{margin:.25rem 0 0; font-size:.83rem; color:#c7ccd1; display:flex; gap:.45rem; align-items:flex-start}

.nav.rm-tabs{display:flex; gap:6px; padding:12px 14px 0; background:#f7f8fa;
  border-bottom:1px solid var(--line); flex-wrap:nowrap}
.rm-tabs .nav-link{border:none; border-radius:10px 10px 0 0; font-weight:600;
  font-size:.85rem; color:var(--muted); padding:.55rem .95rem}
.rm-tabs .nav-link:hover{color:var(--dark)}
.rm-tabs .nav-link.active{color:var(--dark); background:var(--surface); box-shadow:inset 0 -3px 0 var(--warn)}

.rm-body{padding:18px 20px}

/* Lista de datos */
.rm-info{display:flex; flex-direction:column}
.rm-info-row{display:flex; justify-content:space-between; align-items:center; gap:14px;
  padding:12px 0; border-bottom:1px dashed var(--line)}
.rm-info-row:last-child{border-bottom:none}
.rm-info-label{font-size:.82rem; color:var(--muted); font-weight:600;
  display:flex; align-items:center; gap:.55rem; white-space:nowrap}
.rm-info-label i{color:var(--warn-d); width:18px; text-align:center}
.rm-info-value{font-size:.92rem; font-weight:600; text-align:right; line-height:1.35; color:var(--ink)}
.rm-badge-time{display:inline-block; background:var(--warn-soft); color:var(--warn-text);
  font-weight:700; padding:.28rem .55rem; border-radius:8px; font-size:.85rem}
.rm-call{display:inline-flex; align-items:center; gap:.35rem; margin-top:3px;
  background:#e8f6ee; color:var(--wsp-d); font-weight:700; padding:.26rem .55rem;
  border-radius:8px; text-decoration:none; font-size:.8rem}
.rm-call:hover{background:#d6f0e0; color:var(--wsp-d)}

.rm-sec{font-size:.72rem; text-transform:uppercase; letter-spacing:.6px;
  color:var(--muted); font-weight:700; margin:20px 0 14px}

/* Timeline de seguimiento */
.rm-timeline{list-style:none; margin:0; padding:0}
.rm-tl-item{position:relative; padding:0 0 18px 28px}
.rm-tl-item::before{content:""; position:absolute; left:6px; top:16px; bottom:-2px;
  width:2px; background:var(--line)}
.rm-tl-item:last-child::before{display:none}
.rm-tl-dot{position:absolute; left:0; top:2px; width:14px; height:14px; border-radius:50%;
  background:#cbd0d6; border:3px solid var(--surface); box-shadow:0 0 0 2px #cbd0d6}
.rm-tl-done .rm-tl-dot{background:#22a06b; box-shadow:0 0 0 2px #22a06b}
.rm-tl-pending .rm-tl-dot{background:var(--warn); box-shadow:0 0 0 2px var(--warn)}
.rm-tl-bad .rm-tl-dot{background:#dc3545; box-shadow:0 0 0 2px #dc3545}
.rm-tl-title{display:block; font-weight:700; font-size:.9rem; color:var(--ink)}
.rm-tl-done .rm-tl-title{color:#1f8a5b}
.rm-tl-pending .rm-tl-title{color:var(--warn-text)}
.rm-tl-bad .rm-tl-title{color:#c0392b}
.rm-tl-meta{display:block; font-size:.78rem; color:var(--muted); margin-top:1px}

/* Mensajes vacíos / alertas */
.rm-empty{text-align:center; color:var(--warn-text); font-weight:600;
  background:var(--warn-soft); border:1px solid rgba(255,193,7,.4);
  border-left:4px solid var(--warn); border-radius:10px; padding:14px; font-size:.88rem}
.alert{border-radius:12px; border:none}

/* Detalle / tabla */
.rm-amount{font-weight:700; color:var(--dark); font-size:.98rem; margin:4px 0 12px}
.table{font-size:.82rem; color:var(--ink)}
.table thead th{background:#f7f8fa; color:var(--muted); text-transform:uppercase;
  font-size:.7rem; letter-spacing:.4px; border-color:var(--line)}
.table td,.table th{border-color:var(--line)}

/* Acciones */
.rm-actions{display:flex; gap:10px; padding:16px 20px; border-top:1px solid var(--line); background:#f7f8fa}
.btn-wsp{background:var(--wsp); border:none; color:#0b3d1f; font-weight:700; border-radius:12px;
  padding:.72rem 1rem; flex:1; display:inline-flex; align-items:center; justify-content:center; gap:.5rem}
.btn-wsp:hover,.btn-wsp:focus{background:var(--wsp-d); color:#0b3d1f}
.btn-close-rm{background:var(--dark); border:none; color:#fff;
  font-weight:600; border-radius:12px; padding:.72rem 1rem; display:inline-flex; align-items:center; gap:.4rem}
.btn-close-rm:hover{background:#000; color:#fff}

/* Modal de estrellas */
.modal-content{border:none; border-radius:var(--r); overflow:hidden}
.clasificacion{direction:rtl; unicode-bidi:bidi-override; font-size:2.3rem;
  text-align:center; margin:.3rem 0 0}
input[type="radio"]{display:none}
.clasificacion label{color:#d8dade; cursor:pointer; transition:.1s; padding:0 .04em}
.clasificacion label:hover,
.clasificacion label:hover ~ label{color:var(--warn)}
input[type="radio"]:checked ~ label{color:var(--warn)}