/* One screen type scale across the vendor portal. Icon fonts and printed receipts stay intact. */
@media screen {
  html body {font-family:Arial,"Segoe UI",sans-serif!important;font-size:15px!important;line-height:1.55!important}
  html body :is(div,p,a,label,input,select,textarea,button,table,th,td,h1,h2,h3,h4,h5,h6,small,strong,b,li,section,header,footer,main,form,legend) {font-family:Arial,"Segoe UI",sans-serif!important}
  html body span:not([class*="fa"]):not([class*="mdi"]):not([class*="icon"]):not([class*="typcn"]) {font-family:inherit!important}
  html body :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {font-size:15px!important;line-height:1.5!important}
  html body :is(label,button,.btn,[class$="-btn"],.small-btn,.password-toggle) {font-size:14px!important;line-height:1.5!important}
  html body :is(td,.table td,#datatable td) {font-size:14px!important;line-height:1.55!important}
  html body :is(th,.table th,#datatable th) {font-size:13px!important;line-height:1.5!important}
  html body :is(.page-title,.payment-heading,.vp-page-heading h1,.as-hero h3,.ac-hero h3,.af-hero h3,.amp-head h3) {font-size:28px!important;line-height:1.3!important;font-weight:700!important}
  html body :is(.as-kpi .value,.ac-kpi .value,.af-kpi .value,.kpi-value,.vp-metric>strong) {font-size:30px!important;line-height:1.25!important;font-weight:700!important}
  html body :is(.as-card-head h5,.ac-card-head h5,.af-card-head h5,.amp-card-head h5) {font-size:18px!important;line-height:1.4!important}
  html body :is(.as-section-title,.af-section-title,.amp-section-title) {font-size:16px!important}
  html body :is(.as-field label,.ac-field label,.af-field label,.amp-field label) {text-transform:none;letter-spacing:0;font-weight:600}
  html body :is(.permission-item,.permission-grid) {min-width:0}
  html body .permission-item label {overflow-wrap:anywhere}
  html body .permission-item input {flex-shrink:0}
  html body .as-btn.primary {background:#0876a1}
  html body .as-help {color:#526776}
  @media(min-width:992px) {html body #topnav .navigation-menu>li:nth-child(n+6)>.submenu {left:auto;right:0}}
  html body.vp-auth {background:#f7f9fb!important;color:#172b3a}
  .vp-auth .accountbg {background:#f7f9fb!important}
  html body.vp-auth .wrapper-page {width:calc(100% - 32px)!important;max-width:560px;margin:44px auto}
  .vp-auth .card {border:1px solid #dde6ed;border-radius:14px;background:#fff;box-shadow:0 5px 24px #172b3a08!important}
  .vp-auth .card-body {padding:28px}
  html body.vp-auth h5 {font-size:24px!important;color:#172b3a}
  .vp-auth .form-control {min-height:44px;border:1px solid #cbd8e2;border-radius:8px;color:#172b3a;background:#fff}
  .vp-auth .btn-primary {min-height:44px;background:#0876a1;border-color:#0876a1;border-radius:8px;font-weight:600}
  .vp-auth label {font-weight:600;color:#334e60}
  .vp-auth .alert {font-size:14px;line-height:1.5}
  @media(max-width:640px) {
    html body :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {font-size:16px!important}
    .vp-auth .card-body {padding:22px}
    html body .permission-grid {grid-template-columns:1fr}
    html body :is(.as-kpis,.ac-kpis,.af-kpis) {grid-template-columns:1fr}
  }
}

@media screen {
/* Legacy components: readable equivalents of old 8–12px text. */
html body #ph-parking-history-table .pass-pill,
html body #ph-parking-history-table .status-pill,
html body .ac-card-head .meta,
html body .ac-help,
html body .ac-kpi .note,
html body .ac-sub,
html body .af-card-head .meta,
html body .af-help,
html body .af-kpi .note,
html body .af-sub,
html body .amount-badge,
html body .amp-card-head .meta,
html body .amp-note,
html body .amp-sub,
html body .as-card-head .meta,
html body .as-help,
html body .as-kpi .note,
html body .as-sub,
html body .audit-card-sub,
html body .audit-kpi .note,
html body .badge,
html body .bb-badge,
html body .bb-kpi small,
html body .bb-live small,
html body .bb-note,
html body .booking-badge,
html body .card-subtitle,
html body .co-card-head .meta,
html body .co-kpi .note,
html body .co-sub,
html body .contact-sub,
html body .date-badge,
html body .fi-card-head .meta,
html body .fi-kpi .note,
html body .fi-sub,
html body .im-card-head .meta,
html body .im-kpi .note,
html body .im-sub,
html body .issue-badge,
html body .kpi-note,
html body .kpi-section-head .small,
html body .meta,
html body .monthly-card-head .meta,
html body .monthly-kpi .note,
html body .monthly-sub,
html body .pay-pill,
html body .payment-method-badge,
html body .payment-subtitle,
html body .payment-type-badge,
html body .payment-type-pill,
html body .print-meta,
html body .print-title .small,
html body .qa-card-head .meta,
html body .qa-kpi .note,
html body .qa-note,
html body .qa-sub,
html body .qr-sub,
html body .range-badge,
html body .renew-help,
html body .rfid-live small,
html body .rfid-note,
html body .rfid-pill,
html body .rzs-note,
html body .rzs-pill,
html body .rzs-sub,
html body .serial-pill,
html body .small-btn,
html body .spr-card-head .meta,
html body .spr-kpi .note,
html body .spr-staff .meta,
html body .spr-sub,
html body .staff-badge,
html body .staff-card-head .meta,
html body .staff-date-badge,
html body .staff-filter-card .staff-date-badge,
html body .staff-kpi .note,
html body .staff-sub,
html body .staff-table-subtitle,
html body .status-badge,
html body .status-pill,
html body .time-sub,
html body .type-badge,
html body .vehicle-meta,
html body .vehicle-report-page .report-card .badge-success,
html body .vehicle-report-page .report-subtitle,
html body .verification-badge,
html body .verification-subtitle,
html body .verify-badge,
html body .verify-panel .help,
html body .vo-item small,
html body .vp-rzp-note,
html body .vp-tx-pill {font-size:13px!important;line-height:1.5!important}
html body #datatable tbody td,
html body #datatable td,
html body #datatable tfoot th,
html body #datatable th,
html body #datatable thead th,
html body #datatable1 tbody td,
html body #datatable1 thead th,
html body #myTable thead th,
html body #ph-parking-history-table .amount,
html body #ph-parking-history-table .muted,
html body #ph-parking-history-table .ph-staff-vehicle,
html body #ph-parking-history-table .ph-vehicle-number,
html body #ph-parking-history-table .ph-vehicle-type,
html body #ph-parking-history-table tbody td,
html body #ph-parking-history-table tfoot td,
html body #ph-parking-history-table tfoot th,
html body #ph-parking-history-table thead th,
html body #rfid_test_result,
html body .ac-alert,
html body .ac-btn,
html body .ac-field label,
html body .ac-field select,
html body .ac-kpi .label,
html body .ac-mode,
html body .af-alert,
html body .af-btn,
html body .af-field label,
html body .af-field select,
html body .af-kpi .label,
html body .af-mode,
html body .af-section-title,
html body .alert-modern,
html body .amount,
html body .amp-alert,
html body .amp-btn,
html body .amp-field label,
html body .amp-field select,
html body .amp-section-title,
html body .as-alert,
html body .as-btn,
html body .as-field label,
html body .as-field select,
html body .as-kpi .label,
html body .as-mode,
html body .as-section-title,
html body .audit-card-title,
html body .audit-flag,
html body .audit-kpi .label,
html body .audit-kpi .value,
html body .audit-table td,
html body .audit-table th,
html body .balance-item b,
html body .balance-item span,
html body .balance-result,
html body .bb-field label,
html body .bb-hero p,
html body .bb-live span,
html body .bb-table,
html body .btn-modern,
html body .btn.btn-primary,
html body .co-alert,
html body .co-btn,
html body .co-kpi .label,
html body .company-id,
html body .company-name,
html body .contact-main,
html body .customer-mobile,
html body .dataTables_wrapper .dataTables_filter,
html body .dataTables_wrapper .dataTables_filter label,
html body .dataTables_wrapper .dataTables_info,
html body .dataTables_wrapper .dataTables_length,
html body .dataTables_wrapper .dataTables_length label,
html body .dataTables_wrapper .dataTables_length select,
html body .dataTables_wrapper .dataTables_paginate,
html body .dataTables_wrapper .pagination .page-link,
html body .fi-alert,
html body .fi-btn,
html body .fi-kpi .label,
html body .filter-field label,
html body .filter-label,
html body .form-control,
html body .form-group.row > label,
html body .im-alert,
html body .im-btn,
html body .im-errors-head,
html body .im-errors-list div,
html body .im-field label,
html body .im-format,
html body .im-kpi .label,
html body .issue-readonly span,
html body .issue-readonly strong,
html body .kpi-label,
html body .kpi-section-head h5,
html body .limit-value,
html body .login-verifier-box span,
html body .login-verifier-box strong,
html body .mini-stat b,
html body .mini-stat span,
html body .monthly-kpi .label,
html body .mp-btn,
html body .mp-company,
html body .mp-issue,
html body .mp-muted,
html body .mp-status,
html body .mp-type,
html body .mp-vehicle,
html body .muted,
html body .na-btn,
html body .operator,
html body .pass-owner,
html body .pass-status,
html body .pass-table tbody td,
html body .pass-table thead th,
html body .password-toggle,
html body .payment-table tbody td,
html body .payment-table thead th,
html body .permission-item label,
html body .ph-page,
html body .ph-page .vendor_det,
html body .pt-kpi .pt-chip,
html body .qa-alert,
html body .qa-box .label,
html body .qa-box .value,
html body .qa-btn,
html body .qa-field label,
html body .qa-field select,
html body .qa-kpi .label,
html body .qr-btn,
html body .qr-card-title h5,
html body .qr-card-title span,
html body .qr-code-value,
html body .qr-error,
html body .qr-field label,
html body .qr-head p,
html body .qr-kpi .label,
html body .qr-pages a,
html body .qr-pages span,
html body .qr-vehicle,
html body .renew-count,
html body .renew-error,
html body .renew-issue-card .k,
html body .renew-issue-card .n,
html body .renew-msg,
html body .renew-only-head p,
html body .renew-search-card label,
html body .renew-search-row button,
html body .report-table tbody td,
html body .report-table thead th,
html body .rfid-code,
html body .rfid-field label,
html body .rfid-hero p,
html body .rfid-live span,
html body .rfid-status,
html body .rzs-active,
html body .rzs-current,
html body .rzs-field label,
html body .select2-container .select2-selection--single .select2-selection__rendered,
html body .spr-alert,
html body .spr-btn,
html body .spr-field label,
html body .spr-kpi .label,
html body .spr-staff .avatar,
html body .spr-staff .name,
html body .staff-alert,
html body .staff-btn,
html body .staff-filter-card .staff-btn,
html body .staff-id,
html body .staff-kpi .label,
html body .staff-line,
html body .staff-name,
html body .staff-report-table tbody td,
html body .staff-report-table thead th,
html body .status-button,
html body .summary-chip .label,
html body .summary-chip .value,
html body .thumb-link,
html body .transaction-id,
html body .txn,
html body .vehicle-no,
html body .vehicle-report-page .filter-card label,
html body .vehicle-report-page .report-table thead th,
html body .vehicle-report-page .summary-label,
html body .vendor-print,
html body .vendor-strip,
html body .verification-table tbody td,
html body .verification-table thead th,
html body .verify-label,
html body .verify-panel label,
html body .verify-panel textarea,
html body .vo-live,
html body .vp-rzp-label,
html body .vp-rzp-mini,
html body .vp-rzp-status,
html body .vp-rzp-table,
html body .vp-rzp-table th,
html body .vp-tx-id,
html body .vp-tx-table,
html body code,
html body td:before,
html body th {font-size:14px!important;line-height:1.5!important}
}

@media screen {
 html body :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {font-size:15px!important}
 html body :is(label,button,.btn,[class$="-btn"],.small-btn,.password-toggle) {font-size:14px!important}
 html body :is(th,.table th,#datatable th) {font-size:13px!important}
 html body :is(td,.table td,#datatable td) {font-size:14px!important}
 html body :is([class*="-kpi"] .value,[class*="-kpi"]>strong,.kpi-value,.vp-metric>strong) {font-size:30px!important;line-height:1.25!important;font-weight:700!important}
 html body :is([class*="-hero"] h3,[class*="-head"] h3) {font-size:28px!important;line-height:1.3!important;font-weight:700!important}
 html body :is([class*="-card-head"] h5,[class*="-section-head"] h5) {font-size:18px!important;line-height:1.4!important;font-weight:700!important}
 @media(max-width:640px) {html body :is(input:not([type=checkbox]):not([type=radio]),select,textarea) {font-size:16px!important}}
}