:root { --rec-green: #123b2d; --rec-border: #dbe7dc; --rec-muted: #687a6e; }
.recibos-page { background: #f3f6f2; color: #183b2b; }
.recibos-main { max-width: 1500px; margin: 0 auto; padding: 38px 28px 80px; }
.recibos-hero { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 25px; border-radius: 26px; padding: 32px 40px; background: linear-gradient(115deg, #0f3027, #1a5640); color: #fff; }
.recibos-eyebrow, .recibos-step { display: block; font-size: 10px; font-weight: 800; letter-spacing: .17em; }
.recibos-eyebrow { color: #bbddac; }
.recibos-hero h1 { margin: 7px 0 8px; font-size: clamp(28px, 3vw, 46px); letter-spacing: -.04em; }
.recibos-hero p:last-child { max-width: 670px; margin: 0; color: #d5e8d6; line-height: 1.5; }
.recibos-hero-mark { display: flex; align-items: center; justify-content: center; gap: 12px; width: 180px; height: 96px; flex: 0 0 auto; border: 1px solid #ffffff63; border-radius: 20px; color: #d9ecb8; font-size: 55px; font-weight: 900; }
.recibos-hero-mark span { max-width: 60px; color: #fff; font-size: 12px; line-height: 1.2; letter-spacing: .12em; }
.recibos-alert { padding: 14px 18px; margin: 0 0 22px; border-radius: 12px; background: #fff0ee; color: #973326; font-weight: 700; }
.recibos-alert.ok { background: #e7f6e9; color: #17683b; }
.recibos-alert[hidden] { display: none; }
.recibos-layout { display: grid; grid-template-columns: minmax(390px, .95fr) minmax(500px, 1.05fr); gap: 22px; align-items: start; }
.recibos-panel { min-width: 0; border: 1px solid var(--rec-border); border-radius: 22px; background: #fff; box-shadow: 0 12px 30px #183b2b0d; }
.recibos-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 22px 25px; border-bottom: 1px solid var(--rec-border); }
.recibos-step { color: #50825d; }
.recibos-panel-head h2 { margin: 5px 0 0; font-size: 21px; letter-spacing: -.025em; }
.recibos-form-panel form { padding: 24px 25px 27px; }
#recibo-fields { display: grid; gap: 15px; min-width: 0; margin: 0; padding: 0; border: 0; }
#recibo-fields:disabled { opacity: .68; }
.recibos-section-title { margin-top: 9px; border-top: 1px solid #e6eee7; padding-top: 19px; color: #1e5237; font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.recibos-section-title:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.recibos-section-title small { color: var(--rec-muted); font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; }
#recibo-fields label, .recibos-search { display: grid; gap: 6px; color: #375744; font-size: 12px; font-weight: 700; }
#recibo-fields :is(input, select, textarea), .recibos-search input, .recibos-inline input { width: 100%; min-width: 0; border: 1px solid #d4e2d6; border-radius: 10px; padding: 10px 12px; background: #fbfdfb; color: #173529; font: inherit; font-size: 13px; }
#recibo-fields textarea { resize: vertical; }
#recibo-fields :is(input, select, textarea):focus, .recibos-search input:focus { outline: 2px solid #81bb86; outline-offset: 1px; }
.recibos-filter-status { color: var(--rec-muted); font-size: 11px; font-weight: 500; }
#recibo-numero { font-weight: 800; background: #edf4ed !important; }
.recibos-grid { display: grid; gap: 12px; }
.recibos-grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.recibos-grid.three { grid-template-columns: .75fr 1fr 1.05fr; }
.recibos-calculated-total { display: flex; align-items: center; justify-content: space-between; gap: 15px; border: 1px solid #c5ddc9; border-radius: 12px; padding: 14px 16px; background: #eff8ef; color: #194b32; font-size: 13px; font-weight: 800; }
.recibos-calculated-total strong { font-size: 22px; white-space: nowrap; }
.recibos-settings { border: 1px solid #dbe7dc; border-radius: 12px; padding: 13px 15px; background: #f8fbf7; }
.recibos-settings summary { cursor: pointer; color: #22563b; font-size: 12px; font-weight: 800; }
.recibos-settings p { margin: 12px 0; color: var(--rec-muted); font-size: 12px; line-height: 1.45; }
.recibos-settings label { margin: 11px 0; }
.recibos-inline { display: flex; align-items: center; gap: 8px; }
.recibos-inline input { max-width: 140px; }
.recibos-button { display: inline-flex; align-items: center; justify-content: center; min-height: 41px; border: 0; border-radius: 10px; padding: 10px 15px; background: #eaf1eb; color: #244a31; font-size: 12px; font-weight: 800; cursor: pointer; white-space: nowrap; }
.recibos-button:hover { background: #dceade; }
.recibos-button.primary { background: #167d4b; color: #fff; }
.recibos-button.primary:hover { background: #0e6c3e; }
.recibos-button.ghost { background: #f2f7f1; color: #24563a; }
.recibos-button:disabled { opacity: .45; cursor: not-allowed; }
.recibos-payment-list { display: grid; gap: 8px; }
.recibos-payment-row { display: grid; grid-template-columns: 1.2fr 1fr .8fr auto; gap: 7px; align-items: end; }
.recibos-payment-row label { min-width: 0; }
.recibos-payment-row .recibos-button { min-height: 39px; }
.recibos-preview-wrap { display: flex; justify-content: center; padding: 24px; overflow: auto; background: #ecf1ec; }
.recibos-status { border-radius: 99px; padding: 7px 11px; background: #eef3ed; color: #56755b; font-size: 11px; font-weight: 800; }
.recibos-status.saved { background: #def3e3; color: #156e40; }
.recibos-print-controls { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 19px 25px 0; }
.recibos-print-controls label { display: flex; align-items: center; gap: 7px; font-size: 12px; color: #355642; }
.recibos-hint { margin: 9px 25px 22px; color: var(--rec-muted); font-size: 11px; line-height: 1.45; }
.recibos-form-panel .recibos-hint { margin: -8px 0 0; }
.recibos-history { margin-top: 25px; }
.recibos-search { min-width: min(300px, 100%); }
.recibos-history-list { display: grid; gap: 0; padding: 7px 22px 20px; }
.recibos-history-item { display: grid; grid-template-columns: 130px minmax(150px, 1fr) 110px 105px 68px; align-items: center; gap: 12px; width: 100%; border: 0; border-bottom: 1px solid #e7eee6; padding: 15px 7px; background: #fff; color: #244430; text-align: left; cursor: pointer; }
.recibos-history-item:hover { background: #f5faf5; }
.recibos-history-item strong { color: #164c34; }
.recibos-history-item small { color: var(--rec-muted); }
.recibos-empty { margin: 8px; padding: 20px; color: var(--rec-muted); text-align: center; font-size: 13px; }
#recibo-print-area { display: none; }

.recibo-paper { box-sizing: border-box; display: grid; grid-template-rows: 20% 10% 6% 7% 12% 30% 12% 3%; width: min(100%, 480px); aspect-ratio: 210 / 297; overflow: hidden; border: 2px solid #232323; border-radius: 4px; background: #fff; color: #121212; font-family: Arial, Helvetica, sans-serif; font-size: 10px; box-shadow: 0 14px 30px #1c382522; }
.recibo-paper * { box-sizing: border-box; }
.recibo-paper > div { min-height: 0; }
.recibo-top { display: grid; grid-template-columns: 50% 50%; border-bottom: 2px solid #222; }
.recibo-company { display: grid; grid-template-columns: 43% 57%; border-right: 2px solid #222; }
.recibo-company img { align-self: center; width: 100%; max-height: 130px; padding: 7px; object-fit: contain; filter: grayscale(1) contrast(1.4); }
.recibo-company-data { align-self: center; padding: 6px 7px; line-height: 1.3; overflow-wrap: anywhere; }
.recibo-company-data strong { display: block; margin-bottom: 4px; font-size: 1.1em; }
.recibo-number-panel { position: relative; padding: 14px 10px; }
.recibo-x { position: absolute; top: 0; left: 0; border-right: 2px solid #222; border-bottom: 2px solid #222; padding: 5px 9px; font-family: Georgia, serif; font-size: 26px; line-height: 1; }
.recibo-number { margin-left: 45px; text-align: right; font-size: 1.45em; font-weight: 800; }
.recibo-number-panel h2 { margin: 22px 0 0; font-family: Georgia, serif; font-size: 2.4em; line-height: 1; letter-spacing: .04em; }
.recibo-date { position: absolute; right: 9px; bottom: 13px; display: grid; gap: 6px; text-align: center; font-weight: 700; }
.recibo-date-boxes { display: flex; gap: 3px; justify-content: end; }
.recibo-date-boxes span { display: grid; place-items: center; min-width: 26px; min-height: 24px; border: 1.5px solid #222; border-radius: 5px; }
.recibo-client { display: flex; flex-direction: column; justify-content: space-evenly; gap: 3px; padding: 7px; border-bottom: 1.5px solid #222; font-size: 1.15em; }
.recibo-line { display: flex; align-items: baseline; min-height: 1.5em; gap: 5px; }
.recibo-line-label { flex: none; font-weight: 700; }
.recibo-line-value { flex: 1; min-width: 0; border-bottom: 1px dotted #555; overflow-wrap: anywhere; }
.recibo-tax { display: grid; grid-template-columns: 1fr 40%; border-bottom: 1.5px solid #222; }
.recibo-tax-options { display: flex; align-items: center; justify-content: space-around; gap: 2px; padding: 4px; }
.recibo-tax-option { display: inline-flex; align-items: center; gap: 3px; font-size: .84em; }
.recibo-check { display: inline-grid; place-items: center; width: 11px; height: 11px; border: 1px solid #222; font-size: 9px; font-weight: 900; }
.recibo-tax-cuit { display: flex; align-items: center; gap: 3px; border-left: 1.5px solid #222; padding: 4px; font-size: 1.1em; }
.recibo-tax-cuit strong { flex: none; }
.recibo-sum { padding: 9px; font-size: 1.2em; line-height: 1.6; overflow-wrap: anywhere; }
.recibo-concept { padding: 9px; font-size: 1.2em; line-height: 1.65; overflow-wrap: anywhere; }
.recibo-concept strong { margin-right: 4px; }
.recibo-payments { display: grid; grid-template-rows: minmax(0, 4fr) minmax(0, 6fr) auto; gap: 2px; padding: 5px 9px; }
.recibo-bank-rows, .recibo-breakdown { display: grid; min-height: 0; }
.recibo-bank-rows { grid-template-rows: repeat(4, minmax(0, 1fr)); }
.recibo-breakdown { grid-template-rows: repeat(7, minmax(0, 1fr)); border-top: 1px solid #777; padding-top: 3px; }
.recibo-payment { display: grid; grid-template-columns: 1.5fr .9fr .7fr; gap: 8px; align-items: baseline; min-height: 1.7em; }
.recibo-payment span { border-bottom: 1px dotted #555; overflow-wrap: anywhere; }
.recibo-payment b { font-weight: 600; }
.recibo-breakdown-line { display: flex; align-items: end; justify-content: space-between; gap: 8px; border-bottom: 1px dotted #777; min-height: 0; }
.recibo-breakdown-line strong { min-width: 28%; text-align: right; font-weight: 600; }
.recibo-payment-method { font-size: .95em; }
.recibo-signature { display: grid; grid-template-columns: 56% 44%; align-items: end; gap: 4px; padding: 5px 9px 8px; }
.recibo-sign-lines { display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 2px; min-height: 0; height: 100%; }
.recibo-sign-mark { position: relative; min-height: 0; border-bottom: 1px solid #222; }
.recibo-sign-mark img { position: absolute; bottom: 1px; left: 1px; width: 70%; height: 100%; object-fit: contain; object-position: left bottom; }
.recibo-sign-mark span { position: absolute; right: 2px; bottom: 2px; }
.recibo-sign-name { border-bottom: 1px solid #222; padding-bottom: 2px; }
.recibo-signature-total { display: flex; justify-content: flex-end; align-items: end; gap: 5px; font-size: 1.4em; font-weight: 800; white-space: nowrap; }
.recibo-footer { display: flex; align-items: center; justify-content: flex-end; border-top: 1.5px solid #222; padding: 2px 10px; font-size: 1.05em; font-weight: 900; letter-spacing: .03em; }

@media (max-width: 1080px) { .recibos-layout { grid-template-columns: 1fr; } .recibos-preview-wrap { justify-content: center; } .recibo-paper { width: min(100%, 650px); } }
@media (max-width: 650px) { .recibos-main { padding: 20px 12px 55px; } .recibos-hero { padding: 25px 22px; } .recibos-hero-mark { display: none; } .recibos-panel-head { padding: 18px; } .recibos-form-panel form { padding: 18px; } .recibos-grid.three { grid-template-columns: 1fr 1fr; } .recibos-grid.three label:last-child { grid-column: 1 / -1; } .recibos-payment-row { grid-template-columns: 1fr 1fr; } .recibos-history-item { grid-template-columns: 1fr auto; gap: 5px; } .recibos-history-item small:nth-of-type(2), .recibos-history-item span:last-child { display: none; } .recibos-preview-wrap { padding: 12px; } .recibo-paper { font-size: 7px; } .recibo-number-panel h2 { margin-top: 14px; } }

@page { size: A4 portrait; margin: 7mm; }
@media print {
    html, body { width: auto; height: auto; margin: 0; padding: 0; background: #fff; }
    body > :not(#recibo-print-area) { display: none !important; }
    #recibo-print-area { display: block !important; position: static; width: 196mm; margin: 0; }
    #recibo-print-area .recibo-paper { width: 196mm; height: 265mm; min-height: 0; aspect-ratio: auto; margin: 0; border: 1.5pt solid #111; border-radius: 0; box-shadow: none; font-size: 10pt; break-inside: avoid; page-break-inside: avoid; }
    #recibo-print-area .recibo-paper + .recibo-paper { break-before: page; page-break-before: always; }
    body.recibos-single #recibo-print-area .recibo-paper + .recibo-paper { display: none !important; }
}
