:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) { color: #17233c; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) * { box-sizing: border-box; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-hero { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 28px; margin-bottom: 16px; border-radius: 20px; color: white; background: linear-gradient(115deg, #17233c, #101721); }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-eyebrow { color: #b54500; font-size: 10px; font-weight: 850; letter-spacing: .09em; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-hero .svcadpay-eyebrow { color: #ffb380; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) h2 { margin: 5px 0 8px; font-size: clamp(25px, 3vw, 32px); font-weight: 850; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) h3 { margin: 4px 0 7px; font-size: 21px; font-weight: 800; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) p { margin: 5px 0 10px; line-height: 1.6; font-size: 13px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-hero p { color: #e3e9f1; margin: 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 40px; border: 1px solid #dce3ed; border-radius: 10px; padding: 8px 12px; background: white; color: #17233c; font-size: 12px; line-height: 1.3; font-weight: 750; cursor: pointer; text-decoration: none; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-button.is-primary { background: #bd4700; border-color: #bd4700; color: white; min-height: 46px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-button:disabled { opacity: .55; cursor: default; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) button[aria-current="page"] { opacity: 1; background: #17233c; border-color: #17233c; color: white; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) :is(button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid #2274c9; outline-offset: 3px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-month { display: flex; align-items: center; gap: 20px; margin-bottom: 14px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) label { display: grid; gap: 7px; font-size: 12px; font-weight: 700; color: #20304b; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) :is(input:not([type="checkbox"]), select, textarea) { display: block; width: 100%; min-height: 44px; border: 1px solid #ccd6e2; border-radius: 10px; padding: 10px 12px; background: #fff; font: inherit; color: #17233c; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) textarea { resize: vertical; min-height: 78px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-month label { flex: 0 0 215px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-month p { max-width: 600px; color: #54647b; font-size: 12px; margin: 17px 0 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric { display: grid; gap: 7px; align-content: start; padding: 18px; border: 1px solid #dce4ed; border-radius: 16px; background: white; min-width: 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric > span { font-size: 12px; font-weight: 700; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric > strong { font-size: clamp(22px, 2.3vw, 30px); font-weight: 850; line-height: 1.2; overflow-wrap: anywhere; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) small { display: block; font-size: 11px; font-weight: 400; line-height: 1.6; color: #54647b; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric.is-green { border-color: #b5dacc; background: #eff8f4; color: #125d44; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric.is-orange { border-color: #ecd2b9; background: #fff8f1; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-notice { display: flex; gap: 10px; border: 1px solid #e3d3b6; background: #fffbf1; color: #62431d; padding: 14px 16px; border-radius: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) :is(.svcadpay-chart, .svcadpay-list, .svcadpay-editor, .svcadpay-history) { padding: 22px; border: 1px solid #dce4ed; border-radius: 18px; background: #fff; margin-bottom: 16px; min-width: 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-heading { display: flex; align-items: start; justify-content: space-between; gap: 18px; margin-bottom: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-heading p { color: #54647b; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart .svcadpay-heading > strong { color: #125d44; font-size: 29px; white-space: nowrap; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-scroll { overflow-x: auto; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-bars { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(20px, 1fr); gap: 5px; min-width: 680px; padding-top: 10px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-column { text-align: center; font-size: 10px; color: #52617a; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-track { display: flex; justify-content: center; align-items: end; height: 110px; border-bottom: 1px solid #dce4ed; margin-bottom: 6px; background: repeating-linear-gradient(to top, #fff 0, #fff 35px, #eef2f5 36px, #fff 37px); }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-bar { display: block; width: 75%; min-height: 2px; border-radius: 5px 5px 0 0; background: linear-gradient(#35b787, #147956); }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-bar.is-zero { background: #dce4ed; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-data { margin-top: 14px; color: #52617a; font-size: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-data summary { cursor: pointer; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-data table { margin-top: 10px; width: min(100%, 500px); }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-chart-data :is(th, td) { border-bottom: 1px solid #e5eaf0; padding: 6px 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-filters { display: flex; align-items: end; flex-wrap: wrap; gap: 12px; margin-bottom: 16px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-filters label:first-child { flex: 1 1 250px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-filters label:nth-child(2) { flex: 0 1 215px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table-scroll { max-width: 100%; overflow-x: auto; border: 1px solid #e0e6ef; border-radius: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table { width: 100%; min-width: 960px; border-collapse: collapse; font-size: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table :is(th, td) { padding: 13px 12px; border-bottom: 1px solid #e3e9f1; vertical-align: middle; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table thead th { text-align: left; color: #52617a; background: #f6f8fb; font-size: 10px; text-transform: uppercase; letter-spacing: .02em; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table td { max-width: 260px; overflow-wrap: anywhere; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table td:nth-child(3),
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table td:nth-child(4),
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table td:nth-child(5) { white-space: nowrap; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-list .svcadpay-table-scroll::before { display: none; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table tr:last-child td { border-bottom: 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-table td > strong { display: block; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-row-actions { display: flex; gap: 6px; flex-wrap: wrap; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-badge { display: inline-block; border-radius: 8px; padding: 5px 8px; font-size: 10px; font-weight: 750; color: #795b18; background: #fff3d4; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-badge:is(.is-paid, .is-free) { background: #e1f4eb; color: #166148; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-badge.is-partial { background: #e7f0ff; color: #204d8e; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-badge.is-cancelled { background: #f0f1f4; color: #536072; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-pagination { display: flex; align-items: center; justify-content: space-between; gap: 15px; flex-wrap: wrap; margin-top: 16px; font-size: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-pagination nav { display: flex; gap: 5px; flex-wrap: wrap; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-state, :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-empty { padding: 26px; border: 1px solid #dce4ed; border-radius: 14px; background: #fff; margin-bottom: 16px; font-size: 14px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-empty > i { font-size: 25px; margin-right: 12px; color: #66758b; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-empty-note { color: #52617a; font-size: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-state.is-error, :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-error { color: #a42e3d; background: #fff5f5; padding: 14px; border-radius: 10px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-success { color: #125d44; background: #e8f5ed; padding: 14px; border-radius: 10px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-editor { border-color: #94cdb9; background: #f4faf7; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement { padding: 12px 16px; border: 1px solid #e0e6ef; border-radius: 12px; margin-bottom: 15px; background: #f7f9fc; overflow-wrap: anywhere; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement p { margin: 5px 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement-share { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 14px; border: 1px solid #b5dacc; border-radius: 12px; background: #eaf6ef; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement-share > div { display: grid; gap: 4px; font-size: 12px; color: #125d44; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement-share strong { font-size: 22px; overflow-wrap: anywhere; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-agreement-share > p { grid-column: 1 / -1; margin: 0; font-size: 11px; color: #476556; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 15px 0; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-full { grid-column: 1 / -1; margin-bottom: 12px; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-confirm { display: flex; align-items: center; gap: 10px; margin: 18px 0; line-height: 1.5; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-confirm input { width: 20px; height: 20px; flex-shrink: 0; accent-color: #157954; }
:is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-uncertain { padding: 16px; border: 1px solid #ddbe78; border-radius: 12px; background: #fffaed; color: #66451b; }
@media (max-width: 1050px) {
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-list .svcadpay-table-scroll::before { content: 'Desliza la tabla para ver saldos y registrar pagos →'; display: block; position: sticky; left: 0; width: 100%; padding: 10px 12px; font-size: 11px; line-height: 1.5; color: #52617a; background: #f6f8fb; }
}
@media (max-width: 600px) {
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) :is(.svcadpay-hero, .svcadpay-heading, .svcadpay-month) { flex-direction: column; align-items: stretch; gap: 12px; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) :is(.svcadpay-hero, .svcadpay-chart, .svcadpay-list, .svcadpay-editor, .svcadpay-history) { padding: 16px; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-month label { flex: auto; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-month p { margin-top: 0; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric { padding: 13px; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-metric > strong { font-size: 23px; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-form-grid { grid-template-columns: 1fr; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-filters > label { flex: 1 1 100% !important; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-pagination nav { gap: 4px; }
  :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) .svcadpay-pagination .svcadpay-button { padding: 8px 9px; min-height: 42px; }
}
@media (prefers-reduced-motion: reduce) { :is(#view-service-advertising-payments, #service-advertising-payments-root, [data-collections-report="provider-advertising"]) * { scroll-behavior: auto !important; } }
