/* ============================================================
   Core by Uncles&Co — Print Styles
   print.css — Optimized for roles de pago and contracts
   ============================================================ */

@media print {

  /* ---- hide non-print elements -------------------------------- */
  .topnav,
  .sidebar,
  .app-footer,
  .toast-container,
  .modal-backdrop,
  .flash-messages,
  .btn,
  .dropdown,
  .table-toolbar,
  .pagination,
  .quick-actions,
  .no-print {
    display: none !important;
  }

  /* ---- reset layout ------------------------------------------- */
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
  }

  html {
    font-size: 11pt;
  }

  body {
    background: #FFFFFF !important;
    color: #000000 !important;
    font-family: 'IBM Plex Sans', 'Segoe UI', Arial, sans-serif;
    line-height: 1.4;
    margin: 0;
    padding: 0;
  }

  .app-layout {
    display: block;
  }

  .app-main {
    margin: 0 !important;
    padding: 0 !important;
    max-width: 100% !important;
  }

  /* ---- page setup --------------------------------------------- */
  @page {
    size: A4;
    margin: 15mm 18mm 20mm 18mm;
  }

  @page :first {
    margin-top: 10mm;
  }

  /* ---- typography for print ----------------------------------- */
  h1, h2, h3, h4, h5, h6 {
    color: #000000 !important;
    page-break-after: avoid;
    break-after: avoid;
    font-family: 'Sora', 'Segoe UI', Arial, sans-serif;
  }

  h1 { font-size: 18pt; }
  h2 { font-size: 14pt; }
  h3 { font-size: 12pt; }

  p, li, td, th {
    orphans: 3;
    widows: 3;
    color: #000000 !important;
  }

  a {
    color: #000000 !important;
    text-decoration: none !important;
  }

  /* ---- links show URL in print -------------------------------- */
  a[href^="http"]::after {
    content: " (" attr(href) ")";
    font-size: 9pt;
    color: #555555;
    word-break: break-all;
  }

  /* ---- tables ------------------------------------------------- */
  .data-table,
  table {
    width: 100% !important;
    border-collapse: collapse !important;
    page-break-inside: auto;
  }

  .data-table thead,
  table thead {
    display: table-header-group;
    background: none !important;
  }

  .data-table th,
  table th {
    background: #F0F0F0 !important;
    color: #000000 !important;
    border: 1px solid #CCCCCC !important;
    padding: 6pt 8pt !important;
    font-size: 9pt;
    text-transform: uppercase;
    letter-spacing: 0.03em;
  }

  .data-table td,
  table td {
    border: 1px solid #CCCCCC !important;
    padding: 5pt 8pt !important;
    font-size: 10pt;
    vertical-align: top;
    color: #000000 !important;
    background: #FFFFFF !important;
  }

  .data-table tbody tr:nth-child(even) td,
  table tbody tr:nth-child(even) td {
    background: #F9F9F9 !important;
  }

  .data-table tr,
  table tr {
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* hide sorting indicators in print */
  .data-table th::after,
  .sort-icon {
    display: none !important;
  }

  /* ---- cards -------------------------------------------------- */
  .card,
  .kpi-card {
    border: 1px solid #CCCCCC !important;
    box-shadow: none !important;
    background: #FFFFFF !important;
    page-break-inside: avoid;
    break-inside: avoid;
    margin-bottom: 10pt;
  }

  .kpi-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10pt;
  }

  .kpi-card {
    flex: 1 1 22%;
    animation: none !important;
  }

  .kpi-card__value {
    color: #000000 !important;
    font-size: 16pt;
  }

  /* ---- pills / badges ---------------------------------------- */
  .pill,
  .badge {
    border: 1px solid #CCCCCC !important;
    background: #F5F5F5 !important;
    color: #000000 !important;
  }

  .pill--aprobado,
  .pill--green {
    border-color: #16A34A !important;
    background: #E6F4EA !important;
  }

  .pill--amber,
  .pill--pendiente {
    border-color: #D97706 !important;
    background: #FFF7E6 !important;
  }

  .pill--red,
  .pill--rechazado {
    border-color: #DC2626 !important;
    background: #FEE2E2 !important;
  }

  /* ---- mono/numbers ------------------------------------------ */
  .mono,
  code {
    font-family: 'JetBrains Mono', 'Consolas', monospace !important;
  }

  code {
    background: #F0F0F0 !important;
    border: 1px solid #DDDDDD !important;
    color: #000000 !important;
  }

  /* ============================================================
     ROL DE PAGO (payroll slip)
     ============================================================ */

  .rol-de-pago {
    page-break-after: always;
    break-after: page;
    padding: 0;
    margin: 0;
  }

  .rol-de-pago:last-child {
    page-break-after: auto;
    break-after: auto;
  }

  .rol-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 2pt solid #000000;
    padding-bottom: 8pt;
    margin-bottom: 12pt;
  }

  .rol-header__company {
    font-size: 14pt;
    font-weight: bold;
    font-family: 'Sora', Arial, sans-serif;
  }

  .rol-header__ruc {
    font-size: 9pt;
    color: #555555;
  }

  .rol-header__title {
    text-align: right;
    font-size: 12pt;
    font-weight: bold;
    text-transform: uppercase;
  }

  .rol-header__period {
    text-align: right;
    font-size: 9pt;
    color: #555555;
    font-family: 'JetBrains Mono', monospace;
  }

  .rol-employee-info {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4pt 16pt;
    margin-bottom: 12pt;
    font-size: 9pt;
  }

  .rol-employee-info dt {
    font-weight: bold;
    color: #555555;
    text-transform: uppercase;
    font-size: 8pt;
  }

  .rol-employee-info dd {
    margin: 0 0 4pt 0;
    font-size: 10pt;
  }

  .rol-section {
    margin-bottom: 10pt;
  }

  .rol-section__title {
    font-size: 9pt;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #555555;
    border-bottom: 1pt solid #CCCCCC;
    padding-bottom: 3pt;
    margin-bottom: 6pt;
  }

  .rol-total-row {
    font-weight: bold;
    border-top: 2pt solid #000000;
  }

  .rol-total-row td {
    padding-top: 8pt !important;
    font-size: 11pt !important;
  }

  .rol-net-pay {
    text-align: center;
    margin-top: 16pt;
    padding: 10pt;
    border: 2pt solid #000000;
    font-size: 14pt;
    font-weight: bold;
    font-family: 'JetBrains Mono', monospace;
  }

  .rol-net-pay__label {
    display: block;
    font-size: 9pt;
    font-weight: normal;
    text-transform: uppercase;
    color: #555555;
    margin-bottom: 4pt;
    font-family: 'IBM Plex Sans', Arial, sans-serif;
  }

  .rol-signatures {
    display: flex;
    justify-content: space-between;
    margin-top: 40pt;
    padding-top: 40pt;
  }

  .rol-signature {
    text-align: center;
    width: 40%;
  }

  .rol-signature__line {
    border-top: 1pt solid #000000;
    padding-top: 4pt;
    font-size: 9pt;
    color: #555555;
  }

  .rol-footer {
    margin-top: 20pt;
    padding-top: 8pt;
    border-top: 1pt solid #CCCCCC;
    font-size: 8pt;
    color: #888888;
    text-align: center;
  }

  /* ============================================================
     CONTRACT PRINT STYLES
     ============================================================ */

  .contract {
    page-break-after: always;
    break-after: page;
    font-size: 11pt;
    line-height: 1.6;
  }

  .contract:last-child {
    page-break-after: auto;
  }

  .contract__header {
    text-align: center;
    margin-bottom: 20pt;
    padding-bottom: 10pt;
    border-bottom: 2pt solid #000000;
  }

  .contract__title {
    font-size: 16pt;
    font-weight: bold;
    text-transform: uppercase;
    font-family: 'Sora', Arial, sans-serif;
    margin-bottom: 4pt;
  }

  .contract__subtitle {
    font-size: 10pt;
    color: #555555;
  }

  .contract__clause {
    margin-bottom: 14pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .contract__clause-number {
    font-weight: bold;
    font-family: 'JetBrains Mono', monospace;
  }

  .contract__clause-title {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 10pt;
    margin-bottom: 4pt;
  }

  .contract__parties {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8pt 20pt;
    margin-bottom: 16pt;
    font-size: 10pt;
  }

  .contract__signatures {
    display: flex;
    justify-content: space-between;
    margin-top: 50pt;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .contract__signature-block {
    width: 42%;
    text-align: center;
  }

  .contract__signature-line {
    border-top: 1pt solid #000000;
    margin-top: 50pt;
    padding-top: 6pt;
    font-size: 9pt;
  }

  .contract__signature-name {
    font-weight: bold;
    font-size: 10pt;
    margin-bottom: 2pt;
  }

  .contract__signature-role {
    color: #555555;
    font-size: 9pt;
  }

  .contract__signature-ci {
    font-family: 'JetBrains Mono', monospace;
    font-size: 9pt;
    color: #555555;
  }

}
