/* Calculadora de recibos — estilos acotados a .rc-calc para no interferir con el tema */
.rc-calc {
  --rc-acento: #1d5fa7;
  --rc-acento-osc: #164a83;
  --rc-texto: #1f2933;
  --rc-suave: #5f6b7a;
  --rc-borde: #dde3ea;
  --rc-fondo: #ffffff;
  --rc-fondo-2: #f5f7fa;
  --rc-haber: #1e7a46;
  --rc-norem: #1d5fa7;
  --rc-desc: #b42318;
  --rc-radio: 10px;
  color: var(--rc-texto);
  font-size: 16px;
  line-height: 1.45;
  max-width: 1100px;
  margin: 2rem auto;
  padding: 0 16px;
  box-sizing: border-box;
}
.rc-calc *, .rc-calc *::before, .rc-calc *::after { box-sizing: border-box; }
.rc-calc [hidden] { display: none !important; }

.rc-card {
  background: var(--rc-fondo);
  border: 1px solid var(--rc-borde);
  border-radius: var(--rc-radio);
  box-shadow: 0 6px 24px rgba(16, 24, 40, .08);
  padding: 28px;
  margin-bottom: 24px;
}

/* Encabezado */
.rc-hero { display: flex; gap: 32px; align-items: center; }
.rc-hero-texto { flex: 1 1 auto; min-width: 0; }
.rc-hero-img { flex: 0 0 auto; max-width: 340px; }
.rc-hero-img img { display: block; width: 100%; height: auto; border-radius: var(--rc-radio); }
.rc-calc .rc-titulo { font-size: 1.9rem; line-height: 1.15; font-weight: 700; margin: 0 0 .5rem; color: var(--rc-texto); }
.rc-lead { color: var(--rc-suave); font-size: 1.1rem; margin: 0 0 1.25rem; }
.rc-convenio-desc { color: var(--rc-suave); font-size: .85rem; margin: .75rem 0 0; }

/* Campos */
.rc-calc fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.rc-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 24px; }
.rc-grid-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 16px; }
.rc-campo { display: flex; flex-direction: column; gap: 6px; margin: 0; }
.rc-label { font-weight: 600; font-size: .92rem; }
.rc-sublabel { font-size: .85rem; color: var(--rc-suave); }
.rc-calc select, .rc-calc input[type=number] {
  width: 100%;
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid #c9d2dc;
  border-radius: 8px;
  background-color: #fff;
  color: var(--rc-texto);
  font: inherit;
  margin: 0;
}
.rc-calc select:focus, .rc-calc input:focus { outline: 2px solid var(--rc-acento); outline-offset: 1px; border-color: var(--rc-acento); }
.rc-calc select:disabled, .rc-calc input:disabled { background: var(--rc-fondo-2); color: #9aa5b1; cursor: not-allowed; }
.rc-calc option:disabled { color: #b0b8c1; }
.rc-link { background: none; border: 0; padding: 0; color: var(--rc-acento); font: inherit; font-weight: 400; cursor: pointer; text-decoration: underline; }

.rc-extras { margin-top: 24px !important; padding-top: 20px !important; border-top: 1px solid var(--rc-borde) !important; }
.rc-extras legend { float: left; width: 100%; padding: 0; margin-bottom: 10px; }
.rc-extras .rc-grid { clear: both; }

.rc-switches { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 24px; }
.rc-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; margin: 0; }
.rc-switch input { appearance: none; -webkit-appearance: none; width: 42px; height: 24px; border-radius: 12px; background: #c9d2dc; position: relative; cursor: pointer; transition: background .15s; margin: 0; flex: 0 0 auto; }
.rc-switch input::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0,0,0,.2); }
.rc-switch input:checked { background: var(--rc-acento); }
.rc-switch input:checked::after { transform: translateX(18px); }
.rc-switch input:focus-visible { outline: 2px solid var(--rc-acento); outline-offset: 2px; }

.rc-acciones { display: flex; align-items: center; gap: 16px; margin-top: 28px; flex-wrap: wrap; }
.rc-calc .rc-boton {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; min-width: 220px; padding: 10px 28px;
  border: 0; border-radius: 8px;
  background: var(--rc-acento); color: #fff;
  font: inherit; font-weight: 700; letter-spacing: .01em;
  cursor: pointer; transition: background .15s;
}
.rc-calc .rc-boton:hover { background: var(--rc-acento-osc); }
.rc-calc .rc-boton:disabled { opacity: .5; cursor: not-allowed; }
.rc-calc .rc-boton-sec { background: #fff; color: var(--rc-acento); border: 1px solid var(--rc-acento); margin-top: 16px; }
.rc-calc .rc-boton-sec:hover { background: var(--rc-fondo-2); }
.rc-estado { color: var(--rc-suave); }
.rc-estado.rc-error { color: var(--rc-desc); font-weight: 600; }
.rc-nota { font-size: .85rem; color: var(--rc-suave); margin: 12px 0 0; }

/* Recibo */
.rc-recibo-cab { display: flex; flex-direction: column; gap: 2px; margin-bottom: 16px; }
.rc-recibo-cab strong { font-size: 1.15rem; }
.rc-recibo-cab span { color: var(--rc-suave); font-size: .92rem; }
.rc-tabla-wrap { overflow-x: auto; border: 1px solid var(--rc-borde); border-radius: 8px; }
.rc-calc .rc-tabla { width: 100%; border-collapse: collapse; margin: 0; font-size: .95rem; min-width: 560px; }
.rc-calc .rc-tabla th, .rc-calc .rc-tabla td { padding: 9px 14px; border: 0; border-bottom: 1px solid var(--rc-borde); text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; background: transparent; }
.rc-calc .rc-tabla th:first-child { text-align: left; white-space: normal; font-weight: 400; }
.rc-calc .rc-tabla thead th { background: var(--rc-fondo-2); font-weight: 700; font-size: .85rem; text-transform: uppercase; letter-spacing: .03em; color: var(--rc-suave); }
.rc-calc .rc-tabla thead th:first-child { font-weight: 700; }
.rc-calc .rc-tabla tr.rc-haber td:nth-child(2) { color: var(--rc-haber); }
.rc-calc .rc-tabla tr.rc-no_remunerativo td:nth-child(3) { color: var(--rc-norem); }
.rc-calc .rc-tabla tr.rc-descuento td:nth-child(4) { color: var(--rc-desc); }
.rc-calc .rc-tabla tr.rc-separador td, .rc-calc .rc-tabla tr.rc-separador { height: 6px; padding: 0; background: var(--rc-fondo-2); }
.rc-calc .rc-tabla tfoot th, .rc-calc .rc-tabla tfoot td { font-weight: 700; background: var(--rc-fondo-2); }
.rc-calc .rc-tabla tr.rc-subtotal th:first-child { font-weight: 700; }
.rc-calc .rc-tabla tr.rc-neto th, .rc-calc .rc-tabla tr.rc-neto td { font-size: 1.15rem; background: var(--rc-acento); color: #fff; border-bottom: 0; }
.rc-calc .rc-tabla tr.rc-neto th { text-align: right; font-weight: 700; }
.rc-aviso { background: #fff7e6; border: 1px solid #f5d38a; border-radius: 8px; padding: 10px 14px; margin: 12px 0 0; font-size: .92rem; }

/* Diálogo de funciones */
.rc-dialog { border: 0; border-radius: var(--rc-radio); padding: 0; width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 64px); color: var(--rc-texto); box-shadow: 0 20px 60px rgba(16,24,40,.3); }
.rc-dialog::backdrop { background: rgba(16, 24, 40, .45); }
.rc-dialog-cab { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--rc-borde); position: sticky; top: 0; background: #fff; }
.rc-dialog-cab h3 { margin: 0; font-size: 1.15rem; }
.rc-cerrar { background: none; border: 0; font-size: 1.8rem; line-height: 1; cursor: pointer; color: var(--rc-suave); padding: 0 4px; }
.rc-dialog-cuerpo { padding: 8px 20px 20px; overflow-y: auto; }
.rc-funciones dt { font-weight: 700; margin-top: 14px; }
.rc-funciones dd { margin: 4px 0 0; color: var(--rc-suave); font-size: .92rem; }

@media (max-width: 782px) {
  .rc-card { padding: 20px 16px; }
  .rc-hero { flex-direction: column-reverse; align-items: stretch; gap: 16px; }
  .rc-hero-img { max-width: 100%; }
  .rc-calc .rc-titulo { font-size: 1.5rem; }
  .rc-grid, .rc-grid-4 { grid-template-columns: minmax(0, 1fr); }
  .rc-grid-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rc-calc .rc-boton { width: 100%; }
}

/* Marca de agua y pie: sólo en la impresión */
.rc-recibo { position: relative; }
.rc-marca, .rc-origen { display: none; }
/* Mientras está abierto el diálogo de impresión se ve sólo el recibo */
.rc-hoja-impresion { display: none; }
body.rc-imprimiendo .rc-hoja-impresion { display: block; max-width: 800px; margin: 24px auto; }

/* Impresión: se imprime sólo la copia del recibo que el JS agrega en <body> */
@media print {
  @page { margin: 15mm; }
  body.rc-imprimiendo > *:not(.rc-hoja-impresion) { display: none !important; }
  body.rc-imprimiendo { margin: 0 !important; padding: 0 !important; background: #fff !important; }
  body.rc-imprimiendo .rc-hoja-impresion { display: block; max-width: none; margin: 0; padding: 0; }
  .rc-hoja-impresion .rc-recibo { padding-top: 4mm; }
  .rc-hoja-impresion .rc-marca {
    display: block !important; /* el HTML la trae oculta (style="display:none") */
    position: absolute;
    top: 50%;
    left: 50%;
    width: 65%;
    max-width: 120mm;
    height: auto;
    transform: translate(-50%, -50%);
    opacity: .09;
    z-index: 5; /* por encima de la tabla: sale aunque no se impriman los fondos */
    pointer-events: none;
  }
  .rc-hoja-impresion .rc-origen { display: block; font-size: 9pt; color: #555; margin: 4mm 0 0; }
  .rc-hoja-impresion .rc-tabla-wrap { overflow: visible; border-color: #999; }
  .rc-hoja-impresion .rc-tabla { min-width: 0; font-size: 10.5pt; }
  .rc-hoja-impresion .rc-tabla th, .rc-hoja-impresion .rc-tabla td { padding: 6px 10px; }
  .rc-hoja-impresion .rc-tabla tr.rc-neto th, .rc-hoja-impresion .rc-tabla tr.rc-neto td { color: #000; background: none; border-top: 2px solid #000; }
  .rc-hoja-impresion .rc-tabla tr { break-inside: avoid; }
}