/* _comunes.css — lo que era <style> y style= de los includes compartidos del panel
   (modales, widgets). header.php la carga siempre, junto con ps_panel.css. */

/* ═══════════ ticket_modal_include.php ═══════════ */
/* ── de la linea 27 ── */
    @keyframes psTkSpin { to { transform: rotate(360deg); } }
    .ps-tk-spinner {
      display:inline-block;
      width:13px;
      height:13px;
      margin-right:7px;
      border:2px solid rgba(255,255,255,.45);
      border-top-color:#fff;
      border-radius:999px;
      vertical-align:-2px;
      animation:psTkSpin .75s linear infinite;
    }
  

/* ── Lo que iba en linea y no es una utilidad comun ──
   Con :is() y un id que no existe: peso de id SIN !important, que es exactamente
   la fuerza que tenia el atributo style (le gana a cualquier regla normal y
   pierde con las !important, como el tema oscuro). ── */
:is(#ps-pos-prioridad, .tk-l1) { align-items:center; backdrop-filter:blur(2px); background:rgba(15,23,42,.55); display:none; inset:0; justify-content:center; padding:12px; position:fixed; z-index:99990; }
:is(#ps-pos-prioridad, .tk-l2) { background:#fff; border-radius:14px; box-shadow:0 18px 50px rgba(0,0,0,.35); display:flex; flex-direction:column; height:min(86vh, 760px); overflow:hidden; width:min(480px, 96vw); }
/* Documentos A4 (factura SENIAT): el modal ancho. Lo pone ticket_modal_include.php al abrir. */
:is(#ps-pos-prioridad, .tk-l2.tk-ancho) { width:min(920px, 96vw); height:min(92vh, 1100px); }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .tk-l2) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .tk-l3) { align-items:center; background:#f8f9fa; border-bottom:1px solid #e9ecef; display:flex; gap:8px; padding:10px 14px; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .tk-l3) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .tk-l4) { flex:1; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
:is(#ps-pos-prioridad, .tk-l5) { background:#eef0f3; flex:1; position:relative; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .tk-l5) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .tk-l6) { align-items:center; color:#6c757d; display:flex; font-size:13px; inset:0; justify-content:center; position:absolute; }
:is(#ps-pos-prioridad, .tk-l7) { background:transparent; border:0; height:100%; inset:0; position:absolute; width:100%; }
:is(#ps-pos-prioridad, .tk-l8) { align-items:center; backdrop-filter:blur(3px); background:rgba(15,23,42,.42); display:none; inset:0; justify-content:center; padding:14px; position:fixed; z-index:99995; }
:is(#ps-pos-prioridad, .tk-l9) { background:#fff; border-radius:16px; box-shadow:0 20px 55px rgba(15,23,42,.35); overflow:hidden; width:min(390px,94vw); }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .tk-l9) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .tk-l10) { background:#005234; color:#fff; font-size:15px; font-weight:800; padding:14px 16px; }
:is(#ps-pos-prioridad, .tk-l11) { padding:16px; }
:is(#ps-pos-prioridad, .tk-l12) { color:#334155; display:block; font-size:12px; font-weight:800; margin-bottom:6px; }
:is(#ps-pos-prioridad, .tk-l13) { border-radius:12px; border:1px solid #d7dee8; font-size:14px; outline:none; padding:12px 13px; width:100%; }
:is(#ps-pos-prioridad, .tk-l14) { color:#64748b; font-size:11px; line-height:1.35; margin-top:8px; }
:is(#ps-pos-prioridad, .tk-l15) { border-radius:12px; display:none; font-size:12px; line-height:1.35; margin-top:12px; padding:10px 12px; }
:is(#ps-pos-prioridad, .tk-l16) { display:flex; gap:8px; margin-top:14px; }
:is(#ps-pos-prioridad, .tk-l17) { border-radius:10px; flex:1; }
:is(#ps-pos-prioridad, .tk-l18) { background:#e94e1a; border-radius:10px; color:#fff; flex:1; font-weight:800; }

/* ═══════════ medida_modal.php ═══════════ */

/* ── Lo que iba en linea y no es una utilidad comun ──
   Con :is() y un id que no existe: peso de id SIN !important, que es exactamente
   la fuerza que tenia el atributo style (le gana a cualquier regla normal y
   pierde con las !important, como el tema oscuro). ── */
:is(#ps-pos-prioridad, .med-l1) { align-items:center; background:rgba(15,23,42,.55); display:none; inset:0; justify-content:center; padding:16px; position:fixed; z-index:20050; }
:is(#ps-pos-prioridad, .med-l2) { background:#fff; border-radius:16px; box-shadow:0 24px 70px rgba(0,0,0,.35); max-width:430px; padding:22px; width:100%; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .med-l2) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .med-l3) { align-items:center; display:flex; gap:8px; margin-bottom:2px; }
:is(#ps-pos-prioridad, .med-l4) { color:#111827; flex:1; font-size:18px; font-weight:800; margin:0; }
:is(#ps-pos-prioridad, .med-l5) { color:#6f42c1; font-size:13px; font-weight:700; margin-bottom:14px; }
:is(#ps-pos-prioridad, .med-l6) { display:none; margin-bottom:12px; }
:is(#ps-pos-prioridad, .med-l7) { color:#6b7280; font-size:12px; font-weight:700; margin-bottom:5px; }
:is(#ps-pos-prioridad, .med-l8) { display:flex; flex-wrap:wrap; gap:6px; }
:is(#ps-pos-prioridad, .med-l9) { color:#374151; display:block; font-size:13px; font-weight:700; margin-bottom:6px; }
:is(#ps-pos-prioridad, .med-l10) { align-items:center; display:flex; gap:8px; margin-bottom:6px; }
:is(#ps-pos-prioridad, .med-l11) { border-radius:10px; border:1px solid #d1d5db; flex:1; font-size:17px; padding:11px; text-align:center; }
:is(#ps-pos-prioridad, .med-l12) { background:#fff; border-radius:10px; border:1px solid #d1d5db; color:#6f42c1; font-size:15px; font-weight:800; padding:10px 8px; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .med-l12) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .med-l13) { color:#6b7280; font-size:12px; margin-bottom:12px; text-align:center; }
:is(#ps-pos-prioridad, .med-l14) { background:#f0fdf4; border-radius:12px; border:1px solid #bbf7d0; margin-bottom:16px; padding:10px 14px; text-align:center; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .med-l14) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .med-l15) { color:#166534; font-size:12px; font-weight:700; }
:is(#ps-pos-prioridad, .med-l16) { color:#16a34a; font-size:24px; font-weight:800; }
:is(#ps-pos-prioridad, .med-l17) { color:#6b7280; font-size:11px; margin-top:2px; }
:is(#ps-pos-prioridad, .med-l18) { background:#fff; border-radius:10px; border:1px solid #d1d5db; cursor:pointer; flex:1; font-size:14px; font-weight:700; padding:12px; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .med-l18) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .med-l19) { background:#22d989; border-radius:10px; border:none; color:#fff; cursor:pointer; flex:2; font-size:15px; font-weight:800; padding:12px; }

/* ═══════════ delivery_decision_include.php ═══════════ */

/* ── Lo que iba en linea y no es una utilidad comun ──
   Con :is() y un id que no existe: peso de id SIN !important, que es exactamente
   la fuerza que tenia el atributo style (le gana a cualquier regla normal y
   pierde con las !important, como el tema oscuro). ── */
:is(#ps-pos-prioridad, .ddi-l1) { align-items:center; background:rgba(0,0,0,.55); display:none; inset:0; justify-content:center; padding:16px; position:fixed; z-index:20050; }
:is(#ps-pos-prioridad, .ddi-l2) { background:#ffffff; border-radius:16px; box-shadow:0 14px 44px rgba(0,0,0,.35); color:#111827; max-width:430px; padding:22px 22px 18px; width:100%; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ddi-l2) { background: #192535; border-color: #33445c; color: #e6ebf2; }
:is(#ps-pos-prioridad, .ddi-l3) { font-size:34px; line-height:1; text-align:center; }
:is(#ps-pos-prioridad, .ddi-l4) { color:#111827; font-weight:800; margin:8px 0 4px; text-align:center; }
:is(#ps-pos-prioridad, .ddi-l5) { color:#475569; font-size:14px; line-height:1.45; margin:0 0 16px; text-align:center; }
:is(#ps-pos-prioridad, .ddi-l6) { display:flex; flex-direction:column; gap:8px; }
:is(#ps-pos-prioridad, .ddi-l7) { color:#94a3b8; margin-top:2px; text-decoration:none; }

/* ═══════════ comunicados_widget.php ═══════════ */
/* ── de la linea 34 ── */
  /* El botón se apoya en el borde inferior derecho. Si hay barra de
     impersonación abajo, el JS sube este valor. */
  :root { --ps-com-abajo: 18px; }

  #psComBtn {
    position: fixed;
    right: 18px;
    bottom: var(--ps-com-abajo);
    z-index: 19500;              /* debajo de los toasts (20000) y del confirm (20500) */
    width: 46px; height: 46px;
    border: none; border-radius: 999px;
    background: #ffffff;
    color: #475569;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .18), 0 0 0 1px rgba(15, 23, 42, .06);
    cursor: pointer;
    display: none;               /* aparece recién cuando hay algo que decir */
    align-items: center; justify-content: center;
    font-size: 20px; line-height: 1;
    transition: transform .16s ease, box-shadow .16s ease, background .16s ease, color .16s ease;
  }
  #psComBtn.ps-com-hay { display: inline-flex; }
  #psComBtn:hover { transform: translateY(-2px); box-shadow: 0 14px 32px rgba(15, 23, 42, .24); }
  #psComBtn.ps-com-nuevo { background: var(--ps-com-tono, #0d6efd); color: #fff; }
  /* Late una sola vez al aparecer: llama la atención sin quedar parpadeando. */
  @keyframes psComLatido {
    0%   { box-shadow: 0 8px 24px rgba(15,23,42,.18), 0 0 0 0 var(--ps-com-halo, rgba(13,110,253,.55)); }
    70% { box-shadow: 0 8px 24px rgba(15,23,42,.18), 0 0 0 14px rgba(0,0,0,0); }
    100% { box-shadow: 0 8px 24px rgba(15,23,42,.18), 0 0 0 0 rgba(0,0,0,0); }
  }
  #psComBtn.ps-com-latir { animation: psComLatido 1.6s ease-out 3; }
  #psComBtn .ps-com-badge {
    position: absolute; top: -3px; right: -3px;
    min-width: 19px; height: 19px; padding: 0 5px;
    border-radius: 999px; background: #dc2626; color: #fff;
    font-size: 11px; font-weight: 800; line-height: 19px; text-align: center;
    box-shadow: 0 0 0 2px #fff;
  }

  #psComCapa {
    display: none; position: fixed; inset: 0; z-index: 19600;
    background: rgba(15, 23, 42, .48);
    align-items: center; justify-content: center; padding: 16px;
  }
  #psComCapa.ps-com-abierta { display: flex; }
  .ps-com-caja {
    background: #fff; color: #0f172a;
    width: min(560px, 96vw); max-height: min(84vh, 720px);
    border-radius: 18px; overflow: hidden;
    display: flex; flex-direction: column;
    box-shadow: 0 24px 70px rgba(0, 0, 0, .3);
    /* Sin font-family propia: hereda la del panel (Outfit). Fijarla aquí hacía
       que el aviso se leyera con otra tipografía que el resto de la app. */
  }
  .ps-com-cab {
    display: flex; align-items: center; gap: 10px;
    padding: 14px 16px; border-bottom: 1px solid #eef2f7;
  }
  .ps-com-cab i:first-child { font-size: 20px; color: var(--ps-com-tono, #0d6efd); }
  .ps-com-cab b { font-size: 15px; font-weight: 800; flex: 1 1 auto; }
  .ps-com-x {
    background: transparent; border: none; color: #64748b;
    font-size: 22px; line-height: 1; cursor: pointer; padding: 2px 6px; border-radius: 8px;
  }
  .ps-com-x:hover { background: #f1f5f9; color: #0f172a; }

  .ps-com-cuerpo { overflow: auto; padding: 4px 0; }

  .ps-com-item { border-bottom: 1px solid #f1f5f9; }
  .ps-com-item:last-child { border-bottom: none; }
  .ps-com-item__cab {
    display: flex; align-items: flex-start; gap: 10px;
    width: 100%; text-align: left; background: transparent; border: none;
    padding: 13px 16px; cursor: pointer; font: inherit; color: inherit;
  }
  .ps-com-item__cab:hover { background: #f8fafc; }
  .ps-com-item__ico {
    width: 30px; height: 30px; border-radius: 999px; flex: 0 0 30px;
    display: grid; place-items: center; font-size: 15px;
    /* El gris va primero como respaldo: color-mix no existe en navegadores
       viejos y sin él el círculo quedaría sin fondo. */
    background: #f1f5f9;
    background: color-mix(in srgb, var(--tono) 14%, #fff);
    color: var(--tono);
  }
    /* Los tres van en su propio renglón: como <span> en línea salían pegados
     («GRACIASGracias por trabajar…hace 2 min»). */
  .ps-com-item__txt { display: block; min-width: 0; flex: 1 1 auto; }
  .ps-com-item__tipo { display: block; font-size: 10.5px; font-weight: 800; letter-spacing: .06em;
    text-transform: uppercase; color: var(--tono); margin-bottom: 3px; }
  .ps-com-item__tit { display: block; font-size: 14.5px; font-weight: 700; line-height: 1.35; }
  .ps-com-item__pie { display: block; font-size: 11.5px; color: #94a3b8; margin-top: 5px; }
  .ps-com-punto {
    width: 8px; height: 8px; border-radius: 999px; background: #dc2626;
    flex: 0 0 8px; margin-top: 12px;
  }
  .ps-com-item__texto {
    padding: 0 16px 15px 56px; font-size: 13.5px; line-height: 1.55; color: #334155;
    white-space: pre-wrap; overflow-wrap: anywhere;
  }
  .ps-com-item__acciones { padding: 0 16px 15px 56px; display: flex; gap: 8px; flex-wrap: wrap; }
  .ps-com-cta, .ps-com-ok {
    border: none; border-radius: 9px; padding: 9px 15px; cursor: pointer;
    font-family: inherit; font-size: 13px; font-weight: 700; line-height: 1;
    text-decoration: none; display: inline-flex; align-items: center; gap: 6px;
  }
  .ps-com-cta { background: var(--tono); color: #fff; }
  .ps-com-ok  { background: #f1f5f9; color: #334155; }
  .ps-com-ok:hover { background: #e2e8f0; }
  .ps-com-ok[disabled] { opacity: .6; cursor: default; }
  .ps-com-vacio { padding: 34px 20px; text-align: center; color: #94a3b8; font-size: 13.5px; }
  .ps-com-pie {
    padding: 10px 16px; border-top: 1px solid #eef2f7;
    font-size: 11.5px; color: #94a3b8; text-align: center;
  }

  /* ── En la barra de arriba, al lado del 🌙 ──
     Flotando abajo a la derecha tapaba botones de las pantallas de venta
     ("Comprobar", "Comanda cocina"). Arriba está siempre visible y no se le
     pone encima a nada. Las medidas copian a #psThemeToggle (ver
     admin_theme_include.php) para que los dos se lean como un par. */
  .ps-com-slot { display: inline-flex; align-items: center; flex: 0 0 auto; }
  #psComBtn.ps-com-enheader {
    /* relative y no static: el contador va absolute y necesita anclarse a este
       botón. Hay que anular el right/bottom de la versión flotante, que sobre
       un relative correrían el botón fuera de la barra. */
    position: relative;
    right: auto; bottom: auto;
    width: 34px; height: 34px;
    border-radius: 10px;
    font-size: 16px;
    background: #fff;
    color: #334155;
    border: 1px solid #e5e7eb;
    box-shadow: none;
  }
  #psComBtn.ps-com-enheader:hover { transform: none; background: #f8fafc; color: #0f172a; box-shadow: none; }
  #psComBtn.ps-com-enheader.ps-com-nuevo {
    background: var(--ps-com-tono, #0d6efd); color: #fff; border-color: transparent;
  }
  #psComBtn.ps-com-enheader .ps-com-badge { top: -5px; right: -5px; }
  /* El latido de la versión flotante lleva la sombra grande: aquí molesta. */
  @keyframes psComLatidoHeader {
    0%   { box-shadow: 0 0 0 0 var(--ps-com-halo, rgba(13,110,253,.55)); }
    70% { box-shadow: 0 0 0 10px rgba(0,0,0,0); }
    100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); }
  }
  #psComBtn.ps-com-enheader.ps-com-latir { animation: psComLatidoHeader 1.6s ease-out 3; }

  @media (max-width: 575.98px) {
    #psComBtn { right: 12px; width: 44px; height: 44px; }
    #psComBtn.ps-com-enheader { width: 30px; height: 30px; font-size: 14px; }
    .ps-com-item__texto, .ps-com-item__acciones { padding-left: 16px; }
  }

  /* Tema oscuro: mismos tonos que el resto del panel. */
  html[data-ps-theme="dark"] #psComBtn { background: #1e293b; color: #cbd5e1;
    box-shadow: 0 8px 24px rgba(0,0,0,.4), 0 0 0 1px #334155; }
  html[data-ps-theme="dark"] #psComBtn.ps-com-enheader { background: #1e293b;
    color: #cbd5e1; border-color: #334155; box-shadow: none; }
  html[data-ps-theme="dark"] #psComBtn.ps-com-enheader:hover { background: #223247; color: #f1f5f9; }
  html[data-ps-theme="dark"] #psComBtn.ps-com-enheader.ps-com-nuevo { border-color: transparent; }
  html[data-ps-theme="dark"] #psComBtn.ps-com-nuevo { color: #fff; }
  html[data-ps-theme="dark"] #psComBtn .ps-com-badge { box-shadow: 0 0 0 2px #1e293b; }
  html[data-ps-theme="dark"] .ps-com-caja { background: #1e293b; color: #e2e8f0; }
  html[data-ps-theme="dark"] .ps-com-cab,
  html[data-ps-theme="dark"] .ps-com-pie { border-color: #334155; }
  html[data-ps-theme="dark"] .ps-com-item { border-color: #334155; }
  html[data-ps-theme="dark"] .ps-com-item__cab:hover { background: #223247; }
  html[data-ps-theme="dark"] .ps-com-item__tit { color: #f1f5f9; }
  html[data-ps-theme="dark"] .ps-com-item__texto { color: #cbd5e1; }
  html[data-ps-theme="dark"] .ps-com-item__ico { background: #223247; }
  html[data-ps-theme="dark"] .ps-com-ok { background: #334155; color: #e2e8f0; }
  html[data-ps-theme="dark"] .ps-com-ok:hover { background: #3f4f66; }
  html[data-ps-theme="dark"] .ps-com-x:hover { background: #334155; color: #f1f5f9; }

/* ── Lo que iba en linea y no es una utilidad comun ──
   Con :is() y un id que no existe: peso de id SIN !important, que es exactamente
   la fuerza que tenia el atributo style (le gana a cualquier regla normal y
   pierde con las !important, como el tema oscuro). ── */

/* ═══════════ menu_modulos.php ═══════════ */

/* ═══════════ admin_gate_include.php ═══════════ */

/* ═══════════ rotiseria_common.php ═══════════ */

/* ═══════════ ps_cliente_doc.js: aviso de deuda / cliente conocido bajo el documento ═══════════ */
/* El aviso de deuda bajo el documento: una tarjeta a todo el ancho del formulario,
   con el texto a la izquierda y los botones Cobrar / Enviar a la derecha. Antes era
   una píldora de ancho variable y en formularios angostos (agenda) se amontonaba. */
.ps-deuda-hint { min-height: 1.1rem; margin-top: .35rem; }
.ps-deuda-hint.deuda-ok, .ps-deuda-hint.deuda-debe, .ps-deuda-hint.deuda-loading { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .55rem; width: 100%; box-sizing: border-box; border-radius: 12px; padding: .5rem .75rem; font-weight: 700; line-height: 1.3; }
.ps-deuda-hint.deuda-ok { color: #166534; background: #dcfce7; border-left: 3px solid #16a34a; }
.ps-deuda-hint.deuda-debe { color: #991b1b; background: #fee2e2; border-left: 3px solid #dc2626; }
.ps-deuda-hint.deuda-loading { color: #475569; background: #f1f5f9; }
.ps-deuda-hint .ps-deuda-acciones { display: inline-flex; gap: 6px; margin-left: auto; }
.ps-deuda-hint:empty { display: none; }
.ps-autollenado { box-shadow: 0 0 0 .2rem rgba(34, 217, 137, .35) !important; transition: box-shadow .4s ease; }
html[data-ps-theme="dark"] .ps-deuda-hint.deuda-ok { color: #86efac; background: #14532d; }
html[data-ps-theme="dark"] .ps-deuda-hint.deuda-debe { color: #fecaca; background: #7f1d1d; }
html[data-ps-theme="dark"] .ps-deuda-hint.deuda-loading { color: #cbd5e1; background: #334155; }

/* ═══════════ Deuda del cliente: botones en el aviso y el modal compartido (ps_deuda_modal.js) ═══════════ */
.ps-deuda-btn { appearance: none; border: 1px solid currentColor; background: rgba(255, 255, 255, .55); color: inherit; border-radius: 999px; padding: 3px 10px; margin-left: 0; font-size: 11px; font-weight: 800; cursor: pointer; white-space: nowrap; line-height: 1.5; vertical-align: middle; }
.ps-deuda-btn:hover { background: rgba(255, 255, 255, .5); }
html[data-ps-theme="dark"] .ps-deuda-btn:hover { background: rgba(0, 0, 0, .25); }
.psdm { position: fixed; inset: 0; z-index: 1080; display: none; }
.psdm.is-on { display: block; }
body.psdm-abierto { overflow: hidden; }
.psdm__bg { position: absolute; inset: 0; background: rgba(15, 23, 42, .5); }
.psdm__box { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(560px, calc(100vw - 24px)); max-height: calc(100vh - 24px); overflow: auto; background: #fff; color: #0f172a; border-radius: 18px; box-shadow: 0 24px 64px rgba(15, 23, 42, .3); }
.psdm__head { display: flex; align-items: center; gap: 10px; padding: 16px 18px 12px; border-bottom: 1px solid #e2e8f0; position: sticky; top: 0; background: inherit; z-index: 1; }
.psdm__head > div { flex: 1 1 auto; min-width: 0; }
.psdm__head h3 { margin: 0; font-size: 1.05rem; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.psdm__sub { font-size: .8rem; color: #64748b; }
.psdm__total { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; font-size: .8rem; font-weight: 800; background: #fee2e2; color: #991b1b; white-space: nowrap; }
.psdm__total.is-ok { background: #dcfce7; color: #166534; }
.psdm__x { appearance: none; border: 0; width: 34px; height: 34px; border-radius: 50%; background: #f1f5f9; color: #334155; cursor: pointer; display: grid; place-items: center; }
.psdm__body { padding: 14px 18px 18px; display: grid; gap: 14px; }
.psdm__sec { border: 1px solid #e2e8f0; border-radius: 14px; padding: 12px 14px; display: grid; gap: 10px; }
.psdm__sec h4 { margin: 0; font-size: .92rem; font-weight: 800; display: flex; align-items: center; gap: 6px; }
.psdm__creds { display: grid; gap: 6px; max-height: 190px; overflow: auto; }
.psdm__cred { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0; cursor: pointer; margin: 0; }
.psdm__cred-txt { flex: 1 1 auto; min-width: 0; display: grid; font-size: .86rem; }
.psdm__cred-txt small { color: #64748b; font-size: .74rem; }
.psdm__cred-saldo { font-weight: 800; color: #991b1b; font-size: .86rem; white-space: nowrap; }
.psdm__hist-btn { appearance: none; border: 0; background: transparent; color: #64748b; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; flex: 0 0 auto; }
.psdm__hist-btn:hover { background: #e2e8f0; color: #0f172a; }
.psdm__hist { margin: 4px 0 2px 32px; padding: 8px 10px; border-left: 2px solid #e2e8f0; font-size: .8rem; color: #334155; }
.psdm__hist-top { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 4px; color: #64748b; }
.psdm__hist-ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.psdm__hist-ul li { display: flex; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.psdm__hist-ul li span { color: #64748b; }
.psdm__hist-cargando { color: #64748b; }
html[data-ps-theme="dark"] .psdm__hist { border-color: #334155; color: #cbd5e1; }
html[data-ps-theme="dark"] .psdm__hist-btn:hover { background: #334155; color: #f1f5f9; }
.psdm__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.psdm__grid label { display: grid; gap: 3px; margin: 0; }
.psdm__grid label span { font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; color: #64748b; }
.psdm__grid .form-control, .psdm__grid .form-select, .psdm__mail .form-control { border-radius: 10px; }
.psdm__ayuda { font-size: .78rem; color: #475569; min-height: 1rem; }
.psdm__tasa { grid-column: 1 / -1; }
.psdm__tasa .input-group-text { font-size: .78rem; font-weight: 700; }
.psdm__acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.psdm__acts .btn, .psdm__mail .btn, .psdm__foot .btn { border-radius: 999px; font-weight: 700; }
.psdm__mail { display: flex; gap: 8px; }
.psdm__mail .form-control { flex: 1 1 auto; }
.psdm__msg { font-size: .82rem; color: #64748b; }
.psdm__msg.is-err { color: #991b1b; font-weight: 700; }
.psdm__msg.is-ok { color: #166534; font-weight: 700; }
.psdm__aviso { background: #fef3c7; color: #92400e; border-radius: 10px; padding: 8px 12px; font-size: .84rem; font-weight: 700; }
.psdm__ok { display: flex; gap: 10px; align-items: center; background: #dcfce7; color: #166534; border-radius: 12px; padding: 12px 14px; }
.psdm__ok i { font-size: 22px; }
.psdm__listo { background: #dcfce7; color: #166534; border-radius: 12px; padding: 10px 14px; font-size: .9rem; }
.psdm__cargando { padding: 24px; text-align: center; color: #64748b; }
.psdm__foot { display: flex; justify-content: flex-end; }
html[data-ps-theme="dark"] .psdm__box { background: #1e293b; color: #e2e8f0; }
html[data-ps-theme="dark"] .psdm__head { border-color: #334155; }
html[data-ps-theme="dark"] .psdm__sub, html[data-ps-theme="dark"] .psdm__ayuda, html[data-ps-theme="dark"] .psdm__msg, html[data-ps-theme="dark"] .psdm__cred-txt small, html[data-ps-theme="dark"] .psdm__grid label span { color: #94a3b8; }
html[data-ps-theme="dark"] .psdm__x { background: #334155; color: #e2e8f0; }
html[data-ps-theme="dark"] .psdm__sec { border-color: #334155; }
html[data-ps-theme="dark"] .psdm__cred { background: #0f172a; border-color: #334155; }
html[data-ps-theme="dark"] .psdm__total { background: #7f1d1d; color: #fecaca; }
html[data-ps-theme="dark"] .psdm__total.is-ok, html[data-ps-theme="dark"] .psdm__ok, html[data-ps-theme="dark"] .psdm__listo { background: #14532d; color: #86efac; }
html[data-ps-theme="dark"] .psdm__cred-saldo { color: #fecaca; }
html[data-ps-theme="dark"] .psdm__aviso { background: #78350f; color: #fde68a; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .psdm) .btn-dark, html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .psdm) .btn-dark :is(span, i) { background: #e2e8f0 !important; border-color: #e2e8f0 !important; color: #0f172a !important; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .psdm) .btn-outline-dark { color: #e2e8f0 !important; border-color: #64748b !important; }
@media (max-width: 575.98px) { .psdm__grid { grid-template-columns: 1fr; } .psdm__mail { flex-direction: column; } }

/* ═══════════ Tooltips de Bootstrap en oscuro: el tema general pintaba el texto claro sobre el fondo claro ═══════════ */
html[data-ps-theme="dark"] .tooltip { --bs-tooltip-bg: #0f172a; --bs-tooltip-color: #f8fafc; --bs-tooltip-opacity: 1; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .tooltip) .tooltip-inner { background: #0f172a !important; color: #f8fafc !important; -webkit-text-fill-color: #f8fafc !important; border: 1px solid #334155; box-shadow: 0 10px 26px rgba(0, 0, 0, .45); }
html[data-ps-theme="dark"] .tooltip .tooltip-arrow::before { border-top-color: #0f172a; border-bottom-color: #0f172a; border-left-color: #0f172a; border-right-color: #0f172a; }
html[data-ps-theme="dark"] .bs-tooltip-top .tooltip-arrow::before, html[data-ps-theme="dark"] .bs-tooltip-auto[data-popper-placement^="top"] .tooltip-arrow::before { border-top-color: #0f172a; }
html[data-ps-theme="dark"] .bs-tooltip-bottom .tooltip-arrow::before, html[data-ps-theme="dark"] .bs-tooltip-auto[data-popper-placement^="bottom"] .tooltip-arrow::before { border-bottom-color: #0f172a; }
html[data-ps-theme="dark"] .bs-tooltip-start .tooltip-arrow::before, html[data-ps-theme="dark"] .bs-tooltip-auto[data-popper-placement^="left"] .tooltip-arrow::before { border-left-color: #0f172a; }
html[data-ps-theme="dark"] .bs-tooltip-end .tooltip-arrow::before, html[data-ps-theme="dark"] .bs-tooltip-auto[data-popper-placement^="right"] .tooltip-arrow::before { border-right-color: #0f172a; }

/* ── El cliente de cada venta (cliente_bloque_helpers.php): mostrador, mesas cerradas,
   agenda, rotisería y pedidos web usan el mismo bloque ── */
.ps-cli { border: 1px solid #e5e7eb; border-radius: 12px; padding: 8px 10px; margin: 0 0 8px; background: #f8fafc; font-size: .86rem; }
.ps-cli.is-ficha { border-left: 3px solid #e94e1a; }
.ps-cli__head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ps-cli__head > i { color: #e94e1a; font-size: 1rem; }
.ps-cli__nombre { font-weight: 800; color: #0f172a; }
.ps-cli__nombre--final { color: #64748b; font-weight: 600; }
.ps-cli__ficha { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 700; color: #e94e1a; text-decoration: none; border: 1px solid #fcd5c5; background: #fff; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.ps-cli__ficha:hover { background: #e94e1a; color: #fff; border-color: #e94e1a; }
.ps-cli__datos { display: flex; flex-wrap: wrap; gap: 4px 6px; margin-top: 6px; }
.ps-cli__dato { display: inline-flex; align-items: center; gap: 4px; font-size: .76rem; color: #334155; background: #fff; border: 1px solid #e2e8f0; border-radius: 999px; padding: 2px 8px; max-width: 100%; text-decoration: none; }
a.ps-cli__dato:hover { border-color: #e94e1a; color: #e94e1a; }
.ps-cli__dato i { color: #64748b; font-size: .8rem; }
.ps-cli__dato--nota { color: #92400e; background: #fffbeb; border-color: #fde68a; }
.ps-cli__dato--nota i { color: #b45309; }
/* Compacto: para celdas de tabla y filas; sin caja, solo nombre + chips. */
.ps-cli--compacto { border: 0; background: transparent; padding: 0; margin: 0; }
.ps-cli--compacto.is-ficha { border-left: 0; }
.ps-cli--compacto .ps-cli__ficha { margin-left: 4px; }
.ps-cli--compacto .ps-cli__datos { margin-top: 3px; }
.ps-cli--compacto .ps-cli__dato { font-size: .72rem; padding: 1px 7px; }
html[data-ps-theme="dark"] .ps-cli { background: #131c29; border-color: #2b3b50; }
html[data-ps-theme="dark"] .ps-cli--compacto { background: transparent; }
html[data-ps-theme="dark"] .ps-cli__nombre { color: #f1f5f9; }
html[data-ps-theme="dark"] .ps-cli__nombre--final { color: #94a3b8; }
html[data-ps-theme="dark"] .ps-cli__ficha { background: #192535; border-color: #5b2d1b; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ps-cli) .ps-cli__dato { background: #192535 !important; border-color: #33445c !important; color: #cbd5e1 !important; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ps-cli) .ps-cli__dato i { color: #94a3b8 !important; background: transparent !important; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ps-cli) .ps-cli__dato--nota { background: #2b2415 !important; border-color: #7c5b1b !important; color: #fcd34d !important; }

/* ── "Sin control de stock": la etiqueta del producto que no se cuenta (control_stock_helpers.php) ── */
.ps-nostock { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; font-weight: 700; color: #075985; background: #e0f2fe; border: 1px solid #7dd3fc; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.ps-nostock i { font-size: .85rem; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ps-nostock) { background: #0c2a3a !important; border-color: #155e75 !important; color: #7dd3fc !important; }
html[data-ps-theme="dark"] :is(#ps-pos-prioridad, .ps-nostock) i { color: #7dd3fc !important; background: transparent !important; }