/* Tip Calculator 1.10 — compact hospitality ledger */
body.runtime {
  --tip-ink: #17313A;
  --tip-muted: #52666D;
  --tip-teal: #0C5B59;
  --tip-teal-hover: #084A49;
  --tip-accent: #C87934;
  --tip-canvas: #F6F4EE;
  --tip-surface: #FFFFFF;
  --tip-subtle: #F0F5F3;
  --tip-border: #C9D6D2;
  --tip-focus: #9A4B12;
  --tip-error: #B42318;
  --tip-success: #177245;
  --tip-space-1: 4px;
  --tip-space-2: 8px;
  --tip-space-3: 12px;
  --tip-space-4: 16px;
  --tip-space-5: 24px;
  --tip-space-6: 32px;
  --tip-radius: 10px;
  --tip-shadow: 0 14px 38px rgba(23,49,58,.08);
  background: var(--tip-canvas);
  color: var(--tip-ink);
  font: 15px/1.5 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
}
body.runtime #content-body { background: var(--tip-canvas); padding: 48px 20px 72px; }
body.runtime #Home { max-width: 680px; margin: 0 auto; }
body.runtime #Home > .row { margin: 0; }
body.runtime #Home > .row > .row { margin: 0 auto; max-width: 680px; display: flex; flex-wrap: wrap; }
body.runtime #Home > .row > .row > .pagos-control-container { float: none; padding: 0; }
body.runtime #Home > .row > .row > .pagos-control-container:not(:has(.pagos-control-input, .pagos-control-button, .pagos-control-outputgrid)) { display: none; }
body.runtime #Home > .row > .row > .pagos-control-container:has(.pagos-control-input, .pagos-control-outputgrid) { width: 100%; }
body.runtime #Home > .row > .row > .pagos-control-container:has(.pagos-control-button) { width: 50%; padding: 0 6px; }
body.runtime #Home > .row > .row > .clearfix { display: none; }
body.runtime #Home .pagos-control-input,
body.runtime #Home .pagos-control-outputgrid { margin: 0; padding: 0; }
body.runtime #Home .pagos-control-input { display: block; background: var(--tip-surface); border: 1px solid var(--tip-border); border-top: 4px solid var(--tip-accent); border-radius: var(--tip-radius) var(--tip-radius) 0 0; box-shadow: var(--tip-shadow); padding: var(--tip-space-6); }
body.runtime #Home .pagos-control-input .pgc-block { float: none; width: 100%; padding: 0; }
body.runtime #Home .pagos-control-input label { display: block; float: none; width: 100%; margin: 0 0 var(--tip-space-2); color: var(--tip-ink); font-size: 17px; font-weight: 700; letter-spacing: .01em; }
body.runtime #Home .pagos-control-input .form-control { height: 52px; width: 100%; border: 1.5px solid #879D98; border-radius: 8px; background: #fff; color: var(--tip-ink); font-size: 22px; font-weight: 650; font-variant-numeric: tabular-nums; box-shadow: none; padding: 10px 16px; transition: border-color .15s ease, box-shadow .15s ease; }
body.runtime #Home .pagos-control-input .form-control:hover { border-color: var(--tip-teal); }
body.runtime #Home .pagos-control-input .form-control:focus { border-color: var(--tip-teal); box-shadow: 0 0 0 3px rgba(12,91,89,.18); outline: 2px solid var(--tip-focus); outline-offset: 2px; }
body.runtime #Home .form-control[disabled], body.runtime #Home .form-control[readonly] { background: #E9EDEB; color: var(--tip-muted); cursor: not-allowed; }
body.runtime #Home .has-error .form-control, body.runtime #Home .form-control.parsley-error { border-color: var(--tip-error); }
body.runtime #Home .parsley-errors-list { color: var(--tip-error); font-size: 13px; margin: 6px 0 0; }
body.runtime #Home > .row > .row:has(.pagos-control-button) { background: var(--tip-surface); border: 1px solid var(--tip-border); border-top: 0; border-radius: 0 0 var(--tip-radius) var(--tip-radius); box-shadow: var(--tip-shadow); padding: 0 26px 30px; margin-bottom: var(--tip-space-5); }
body.runtime #Home .pagos-control-button { margin: 0; padding: 0; }
body.runtime #Home .pagos-control-button .btn { display: flex; align-items: center; justify-content: center; min-height: 48px; margin: 0; border-radius: 8px; font-size: 15px; font-weight: 700; letter-spacing: .01em; text-decoration: none; transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease; }
body.runtime #Home .pagos-control-button .btn:hover { transform: translateY(-1px); }
body.runtime #Home .pagos-control-button .btn:active { transform: translateY(0); }
body.runtime #Home .pagos-control-button .btn:focus-visible { outline: 3px solid var(--tip-focus); outline-offset: 3px; }
body.runtime #Home .pagos-control-button:first-of-type .btn { background: var(--tip-teal); border: 1px solid var(--tip-teal); color: #fff; }
body.runtime #Home .pagos-control-button:first-of-type .btn:hover { background: var(--tip-teal-hover); }
body.runtime #Home .pagos-control-button:last-of-type .btn { background: var(--tip-subtle); border: 1px solid var(--tip-border); color: var(--tip-ink); }
body.runtime #Home .pagos-control-button:last-of-type .btn:hover { background: #E4EEEA; border-color: var(--tip-teal); }
body.runtime #Home .pagos-control-button .btn[disabled], body.runtime #Home .pagos-control-button .btn.disabled { opacity: .55; cursor: not-allowed; transform: none; }
body.runtime #Home .pagos-control-outputgrid { background: var(--tip-surface); border: 1px solid var(--tip-border); border-radius: var(--tip-radius); box-shadow: var(--tip-shadow); padding: 16px; overflow-x: auto; }
body.runtime #Home .dataTables_wrapper { width: 100%; }
body.runtime #Home table.dataTable { width: 100% !important; margin: 0 !important; border: 0; border-collapse: separate; border-spacing: 0; color: var(--tip-ink); font-variant-numeric: tabular-nums; }
body.runtime #Home table.dataTable thead th { background: var(--tip-teal); color: #fff; border: 0; padding: 13px 14px; font-size: 13px; font-weight: 700; text-align: right; }
body.runtime #Home table.dataTable thead th:first-child { text-align: left; border-radius: 6px 0 0 0; }
body.runtime #Home table.dataTable thead th:last-child { border-radius: 0 6px 0 0; }
body.runtime #Home table.dataTable tbody td { border: 0; border-bottom: 1px solid #DDE6E2; padding: 9px 14px; background: #fff; text-align: right; color: var(--tip-ink); }
body.runtime #Home table.dataTable tbody td:first-child { text-align: left; font-weight: 700; color: var(--tip-teal); }
body.runtime #Home table.dataTable tbody tr:nth-child(even) td { background: #F5F8F6; }
body.runtime #Home table.dataTable tbody tr:hover td { background: #E7F2EE; }
body.runtime #Home table.dataTable tbody tr:last-child td { border-bottom: 0; }
body.runtime #Home .dataTables_empty { color: var(--tip-muted); text-align: center !important; padding: 28px 12px !important; }
body.runtime #Home .dataTables_wrapper .dataTables_paginate a,
body.runtime #Home .dataTables_wrapper .dataTables_length select,
body.runtime #Home .dataTables_wrapper .dataTables_filter input { border-radius: 6px; border: 1px solid var(--tip-border); color: var(--tip-ink); }
body.runtime #Home .dataTables_wrapper :is(a, input, select):focus-visible { outline: 3px solid var(--tip-focus); outline-offset: 2px; }
@media (max-width: 640px) {
 body.runtime #content-body { padding: 20px 12px 48px; }
 body.runtime #Home .pagos-control-input { padding: 22px 18px; }
 body.runtime #Home > .row > .row:has(.pagos-control-button) { padding: 0 12px 20px; }
 body.runtime #Home .pagos-control-outputgrid { padding: 8px; }
 body.runtime #Home table.dataTable thead th, body.runtime #Home table.dataTable tbody td { padding: 9px 7px; font-size: 12px; }
}
@media (max-width: 380px) {
 body.runtime #Home > .row > .row > .pagos-control-container:has(.pagos-control-button) { width: 100%; padding: 4px 6px; }
}
@media (prefers-reduced-motion: reduce) {
 body.runtime #Home .form-control, body.runtime #Home .btn { transition: none; }
 body.runtime #Home .btn:hover { transform: none; }
}
/* QA refinement: secondary action and unified input card */
body.runtime #Home .pagos-control-input { border-radius: var(--tip-radius); }
body.runtime #Home > .row > .row:has(.pagos-control-button) { border-top: 1px solid var(--tip-border); border-radius: var(--tip-radius); }
body.runtime #Home > .row > .row > .pagos-control-container:nth-child(3) .btn { background: var(--tip-subtle); border: 1px solid var(--tip-border); color: var(--tip-ink); }
body.runtime #Home > .row > .row > .pagos-control-container:nth-child(3) .btn:hover { background: #E4EEEA; border-color: var(--tip-teal); }

/* Alignment refinement */
body.runtime #Home > .row > .row:not(:has(.pagos-control-button)) { padding: 0; }
body.runtime #Home > .row > .row:has(.pagos-control-button) { padding-top: 24px; padding-bottom: 24px; }
