/* Workshop Diary customer portal refresh — Phase 3 account, finance and communication pages. */

/* Shared Phase 3 page rhythm. */
body[data-help-route="invoices"] .portal-list-root,
body[data-help-route="invoice"]>.shell,
body[data-help-route="statements"]>.shell,
body[data-help-route="approvals"] .approval-page,
body[data-help-route="approval"]>.shell,
body[data-help-route="messages"] .cm-page,
body[data-help-route="document_vault"] .document-vault-shell,
body[data-help-route="fleet_dashboard"]>.shell,
body[data-help-route="fleet_access"]>.shell,
body[data-help-route="portal_users"]>.shell,
body[data-help-route="vin_lookup"]>.shell,
body[data-help-route="feedback"] .feedback-shell,
body[data-help-route="account_settings"] .account-support-shell{display:grid;gap:18px}

body[data-portal-account-id] .invoice-detail-card,
body[data-portal-account-id] .approval-summary-card,
body[data-portal-account-id] .cm-page-head,
body[data-portal-account-id] .document-vault-shell>.portal-page-head,
body[data-help-route="fleet_dashboard"] .booking-request-hero,
body[data-help-route="fleet_access"] .booking-request-hero,
body[data-help-route="portal_users"] .job-request-hero,
body[data-help-route="vin_lookup"] .vin-lookup-hero,
body[data-help-route="feedback"] .portal-page-head,
body[data-help-route="account_settings"] .portal-page-head{
  padding:25px;
  border:1px solid var(--wdcp-refresh-border);
  border-radius:var(--wdcp-refresh-radius);
  background:var(--wdcp-refresh-panel);
  box-shadow:none;
}
body[data-portal-account-id] .invoice-detail-card h1,
body[data-portal-account-id] .approval-summary-card h1,
body[data-portal-account-id] .cm-page-head h1,
body[data-help-route="fleet_dashboard"] .booking-request-hero h1,
body[data-help-route="fleet_access"] .booking-request-hero h1,
body[data-help-route="portal_users"] .job-request-hero h1,
body[data-help-route="vin_lookup"] .vin-lookup-hero h1{
  margin:.35rem 0 .55rem;
  font-size:clamp(1.75rem,3vw,2.35rem);
  letter-spacing:-.04em;
}

/* Compact, generated section navigation for long records. */
.wdcp-phase3-section-nav{
  position:sticky;
  top:12px;
  z-index:70;
  display:flex;
  gap:5px;
  padding:6px;
  overflow-x:auto;
  border:1px solid var(--wdcp-refresh-border);
  border-radius:10px;
  background:color-mix(in srgb,var(--wdcp-refresh-panel) 95%,transparent);
  box-shadow:0 12px 28px rgba(0,0,0,.15);
  backdrop-filter:blur(12px);
  scrollbar-width:thin;
}
.wdcp-phase3-section-nav a{
  flex:0 0 auto;
  padding:8px 11px;
  border-radius:7px;
  color:var(--wdcp-refresh-muted);
  font-size:.67rem;
  font-weight:750;
  text-decoration:none;
}
.wdcp-phase3-section-nav a:hover,.wdcp-phase3-section-nav a.is-current{background:#102a42;color:#6dc2fb}
html[data-wdcp-theme="light"] .wdcp-phase3-section-nav a:hover,
html[data-wdcp-theme="light"] .wdcp-phase3-section-nav a.is-current{background:#eaf5fd;color:#0871bc}

/* Invoices, statement, payments and receipts. */
body[data-help-route="invoices"] #invoiceResults{padding:0;overflow:hidden}
body[data-help-route="invoices"] #invoiceResults .table-wrap{border:0;border-radius:0}
body[data-help-route="invoices"] #invoiceResults tbody tr{transition:background .16s ease}
body[data-help-route="invoices"] #invoiceResults tbody tr:hover{background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="invoices"] .invoice-table-actions{gap:6px}
body[data-help-route="invoice"] .invoice-detail-card{overflow:hidden}
body[data-help-route="invoice"] .invoice-detail-card .stat-grid{margin-top:20px}
body[data-help-route="invoice"] .invoice-detail-card .stat-grid>div{min-height:92px}
body[data-help-route="invoice"] .invoice-detail-card .stat-grid>div:last-child{border-color:#70442c;background:#35241d}
html[data-wdcp-theme="light"] body[data-help-route="invoice"] .invoice-detail-card .stat-grid>div:last-child{background:#fff4ec}
body[data-help-route="invoice"] .invoice-context-grid{grid-template-columns:minmax(0,1.55fr) minmax(270px,.55fr);gap:18px}
body[data-help-route="invoice"] .invoice-context-grid>.card,
body[data-help-route="invoice"] #invoiceMessages,
body[data-help-route="invoice"] #invoiceBreakdown,
body[data-help-route="invoice"] #invoicePayments{padding:22px}
body[data-help-route="invoice"] .detail-list>div,
body[data-help-route="invoice"] .invoice-job-description,
body[data-help-route="invoice"] .invoice-row{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="invoice"] .invoice-list{gap:8px}
body[data-help-route="statements"]>.shell>.card{padding:22px}
body[data-help-route="statements"]>.shell>.card:first-child{padding:25px}
body[data-help-route="statements"] .filter-row{margin-top:18px;padding:14px;border:1px solid var(--wdcp-refresh-border);border-radius:10px;background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="statements"]>.shell>.card:nth-child(2){overflow:hidden}
.payment-card{padding:27px!important;border-color:#24577b!important;box-shadow:var(--wdcp-refresh-shadow)!important}
.payment-card .pay-amount{margin:22px 0;color:var(--wdcp-refresh-text);background:none;-webkit-background-clip:initial;font-variant-numeric:tabular-nums}
.payment-card .provider-choice-grid{gap:12px}
.payment-card .provider-choice-card,.payment-card .bank-box>div{border:1px solid var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft);box-shadow:none}
.payment-card .provider-choice-card.is-primary{border-color:#24577b;background:#0d2840}
html[data-wdcp-theme="light"] .payment-card .provider-choice-card.is-primary{background:#edf8ff}
.payment-card .portal-collapse{border:1px solid var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
.wdcp-phase3-copy{margin-left:8px;padding:4px 7px;border:1px solid var(--wdcp-refresh-border);border-radius:6px;background:var(--wdcp-refresh-panel);color:var(--wdcp-refresh-muted);font-size:.6rem;cursor:pointer}
.receipt-card{padding:30px!important;border-top:3px solid var(--wdcp-refresh-blue)!important}
.receipt-card h1{font-size:clamp(1.8rem,4vw,2.6rem);letter-spacing:-.04em}
.receipt-card .receipt-line{padding:15px 0;border-color:var(--wdcp-refresh-border)}

/* Work approvals. */
body[data-help-route="approvals"] .approval-heading{padding:25px;border:1px solid var(--wdcp-refresh-border);border-radius:var(--wdcp-refresh-radius);background:var(--wdcp-refresh-panel)}
body[data-help-route="approvals"] .approval-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
body[data-help-route="approvals"] .approval-list-card{position:relative;margin:0;padding:19px;overflow:hidden;background:var(--wdcp-refresh-panel-soft);transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease}
body[data-help-route="approvals"] .approval-list-card:before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--wdcp-refresh-orange)}
body[data-help-route="approvals"] .approval-list-card:hover{border-color:#41617f;transform:translateY(-2px);box-shadow:var(--wdcp-refresh-shadow)}
body[data-help-route="approval"] .approval-context-grid>div,
body[data-help-route="approval"] .approval-pricing-grid>div,
body[data-help-route="approval"] .approval-evidence,
body[data-help-route="approval"] .approval-evidence-link{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="approval"] .approval-item{padding:21px;border-left:3px solid var(--wdcp-refresh-blue);background:var(--wdcp-refresh-panel)}
body[data-help-route="approval"] .approval-workshop-note{border:1px solid #24577b;border-left:3px solid var(--wdcp-refresh-blue);border-radius:8px;background:#0d2840}
html[data-wdcp-theme="light"] body[data-help-route="approval"] .approval-workshop-note{background:#edf8ff}
body[data-help-route="approval"] .approval-choice span{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="approval"] .approval-choice input:checked+span{border-color:var(--wdcp-refresh-blue);background:#102a42;color:#6dc2fb}
html[data-wdcp-theme="light"] body[data-help-route="approval"] .approval-choice input:checked+span{background:#eaf5fd;color:#0871bc}
body[data-help-route="approval"] .approval-decision-panel{bottom:16px;border-color:#24577b;background:var(--wdcp-refresh-panel);box-shadow:0 20px 45px rgba(0,0,0,.28)}

/* Secure messages — desktop master/detail and a focused mobile conversation. */
body[data-help-route="messages"] .cm-page-head{align-items:center}
body[data-help-route="messages"] .cm-layout{grid-template-columns:minmax(270px,350px) minmax(0,1fr);gap:14px}
body[data-help-route="messages"] .cm-thread-panel,body[data-help-route="messages"] .cm-conversation-panel{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel)}
body[data-help-route="messages"] .cm-thread-panel-head,body[data-help-route="messages"] .cm-conversation-head,body[data-help-route="messages"] .cm-compose{border-color:var(--wdcp-refresh-border)}
body[data-help-route="messages"] .cm-thread-panel-head span{background:#102a42;color:#6dc2fb}
html[data-wdcp-theme="light"] body[data-help-route="messages"] .cm-thread-panel-head span{background:#eaf5fd;color:#0871bc}
body[data-help-route="messages"] .cm-thread{border-color:var(--wdcp-refresh-border);background:transparent}
body[data-help-route="messages"] .cm-thread:hover{background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="messages"] .cm-thread.is-active{background:#0d2840;box-shadow:inset 3px 0 var(--wdcp-refresh-blue)}
html[data-wdcp-theme="light"] body[data-help-route="messages"] .cm-thread.is-active{background:#edf8ff}
body[data-help-route="messages"] .cm-message-stream{min-height:310px;background:#070f19}
html[data-wdcp-theme="light"] body[data-help-route="messages"] .cm-message-stream{background:#f1f5f9}
body[data-help-route="messages"] .cm-message{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft);box-shadow:none}
body[data-help-route="messages"] .cm-message-portal_user{border-color:#24577b;background:#102a42}
html[data-wdcp-theme="light"] body[data-help-route="messages"] .cm-message-portal_user{background:#eaf5fd}
body[data-help-route="messages"] .cm-attachments a{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel)}
.wdcp-phase3-thread-back{display:none;align-items:center;gap:6px;margin:0 0 10px;padding:8px 10px;border:1px solid var(--wdcp-refresh-border);border-radius:7px;background:var(--wdcp-refresh-panel-soft);color:var(--wdcp-refresh-text);font-weight:750;cursor:pointer}

/* Documents and account settings. */
body[data-help-route="document_vault"] .document-vault-shell>.portal-page-head{display:flex;align-items:center;justify-content:space-between;gap:18px}
body[data-help-route="document_vault"] .vault-list{padding:0;border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel);box-shadow:none}
body[data-help-route="document_vault"] .vault-head{background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="document_vault"] .vault-row{min-height:62px;border-color:var(--wdcp-refresh-border)}
body[data-help-route="document_vault"] .vault-row:hover{background:#0d2840}
html[data-wdcp-theme="light"] body[data-help-route="document_vault"] .vault-row:hover{background:#edf8ff}
body[data-help-route="account_settings"] .account-support-grid{gap:18px;margin:0}
body[data-help-route="account_settings"] .account-support-grid>.card{padding:22px;align-content:start}
body[data-help-route="account_settings"] .account-notification-row,
body[data-help-route="account_settings"] .account-toggle,
body[data-help-route="account_settings"] .collection-person,
body[data-help-route="account_settings"] .privacy-history>div{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="account_settings"] .collection-person{padding:16px;border:1px solid var(--wdcp-refresh-border);border-radius:10px}
body[data-help-route="account_settings"] .collection-person.is-new{border-color:#24577b}

/* Fleet, users and VIN tools. */
body[data-help-route="fleet_dashboard"] .stat-grid{gap:12px}
body[data-help-route="fleet_dashboard"] .stat-grid>div{min-height:102px;padding:18px;border:1px solid var(--wdcp-refresh-border);border-radius:10px;background:var(--wdcp-refresh-panel)}
body[data-help-route="fleet_dashboard"] .fleet-table-wrap,
body[data-help-route="fleet_access"] .fleet-table-wrap{border:1px solid var(--wdcp-refresh-border);border-radius:10px;background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="fleet_dashboard"] .fleet-table td,body[data-help-route="fleet_dashboard"] .fleet-table th,
body[data-help-route="fleet_access"] .fleet-table td,body[data-help-route="fleet_access"] .fleet-table th{border-color:var(--wdcp-refresh-border)}
body[data-help-route="fleet_dashboard"] .fleet-month-row>div{height:10px;background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="fleet_dashboard"] .fleet-month-row i{background:var(--wdcp-refresh-blue)}
body[data-help-route="fleet_access"] .portal-check{border-color:#24577b;background:#0d2840}
html[data-wdcp-theme="light"] body[data-help-route="fleet_access"] .portal-check{background:#edf8ff}
body[data-help-route="portal_users"] .portal-users-grid{gap:18px}
body[data-help-route="portal_users"] .portal-users-grid>.card,
body[data-help-route="portal_users"] .portal-user-management-card{padding:22px}
body[data-help-route="portal_users"] .portal-user-accordion{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft);box-shadow:none}
body[data-help-route="portal_users"] .portal-user-accordion.is-open{border-color:#365a79;background:var(--wdcp-refresh-panel)}
body[data-help-route="portal_users"] .portal-permission-note,
body[data-help-route="portal_users"] .portal-permission-check{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="vin_lookup"] .vin-lookup-grid{grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:18px}
body[data-help-route="vin_lookup"] .vin-lookup-grid>.card,body[data-help-route="vin_lookup"] .vin-lookup-grid>div>.card{padding:22px}
body[data-help-route="vin_lookup"] .vin-lookup-form input[name="vrm"]{min-height:54px;font-size:1.15rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
body[data-help-route="vin_lookup"] .vin-result-grid>div,
body[data-help-route="vin_lookup"] .vin-history-row,
body[data-help-route="vin_lookup"] .compact-stats>div{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}

/* Feedback. */
body[data-help-route="feedback"] .feedback-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
body[data-help-route="feedback"] .feedback-card{margin:0;padding:21px;border-top:3px solid var(--wdcp-refresh-orange);background:var(--wdcp-refresh-panel)}
body[data-help-route="feedback"] .rating-row span{border-color:var(--wdcp-refresh-border);background:var(--wdcp-refresh-panel-soft)}
body[data-help-route="feedback"] .rating-row input:checked+span{border-color:var(--wdcp-refresh-orange);background:#35241d;color:#ffc09b}
html[data-wdcp-theme="light"] body[data-help-route="feedback"] .rating-row input:checked+span{background:#fff4ec;color:#8e4b23}
body[data-help-route="feedback"] .engagement-card{padding:22px}
body[data-help-route="feedback"] .loyalty-balance strong{color:#65bdf8}

/* Accessibility and responsive completion pass. */
body[data-portal-account-id] :where(a,button,input,select,textarea,summary):focus-visible{outline:3px solid rgb(var(--diary-primary-rgb) / .48);outline-offset:3px}
body[data-portal-account-id] :where(button,.btn,input,select,textarea){font:inherit}
body[data-portal-account-id] :where(input[type="checkbox"],input[type="radio"]){accent-color:var(--wdcp-refresh-blue)}
body[data-portal-account-id] [hidden]{display:none!important}

@media(max-width:980px){
  body[data-help-route="approvals"] .approval-list,body[data-help-route="feedback"] .feedback-list{grid-template-columns:1fr}
  body[data-help-route="invoice"] .invoice-context-grid,body[data-help-route="vin_lookup"] .vin-lookup-grid{grid-template-columns:1fr}
  body[data-help-route="messages"] .cm-layout{grid-template-columns:minmax(230px,300px) minmax(0,1fr)}
}
@media(max-width:860px){
  .wdcp-phase3-section-nav{top:70px}
  body[data-help-route="messages"] .cm-layout{grid-template-columns:1fr}
  body[data-help-route="messages"] .cm-layout.wdcp-phase3-has-thread .cm-thread-panel{display:none}
  body[data-help-route="messages"] .cm-layout:not(.wdcp-phase3-has-thread) .cm-conversation-panel{display:none}
  body[data-help-route="messages"] .wdcp-phase3-thread-back{display:inline-flex}
  body[data-help-route="messages"] .cm-thread-list{max-height:none}
}
@media(max-width:700px){
  body[data-portal-account-id] .invoice-detail-card,
  body[data-portal-account-id] .approval-summary-card,
  body[data-portal-account-id] .cm-page-head,
  body[data-portal-account-id] .document-vault-shell>.portal-page-head,
  body[data-help-route="fleet_dashboard"] .booking-request-hero,
  body[data-help-route="fleet_access"] .booking-request-hero,
  body[data-help-route="portal_users"] .job-request-hero,
  body[data-help-route="vin_lookup"] .vin-lookup-hero,
  body[data-help-route="feedback"] .portal-page-head,
  body[data-help-route="account_settings"] .portal-page-head{padding:20px}
  body[data-help-route="document_vault"] .document-vault-shell>.portal-page-head{align-items:stretch;flex-direction:column}
  body[data-help-route="document_vault"] .portal-actions{display:grid}
  body[data-help-route="document_vault"] .portal-actions .btn{width:100%}
  body[data-help-route="fleet_dashboard"] .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-help-route="portal_users"] .portal-users-grid{grid-template-columns:1fr}
  .payment-card{padding:21px!important}
  .receipt-card{padding:22px!important}
}
@media(max-width:560px){
  body[data-help-route="fleet_dashboard"] .stat-grid{grid-template-columns:1fr}
  body[data-help-route="invoice"] .invoice-detail-card .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  body[data-help-route="approval"] .approval-quick-actions,body[data-help-route="approval"] .approval-choice{display:grid}
  body[data-help-route="approval"] .approval-quick-actions .btn,body[data-help-route="approval"] .approval-choice label,body[data-help-route="approval"] .approval-choice span{width:100%}
  body[data-help-route="messages"] .cm-message{max-width:94%}
}
@media(prefers-reduced-motion:reduce){
  .approval-list-card,.feedback-card,body[data-help-route="invoices"] #invoiceResults tbody tr{transition:none!important}
  .wdcp-phase3-section-nav{scroll-behavior:auto}
}
@media print{
  body{padding:0!important;background:#fff!important;color:#111!important}
  body>.topbar,.portal-help-launcher,.portal-theme-switch,.portal-help-drawer,.portal-help-backdrop,.wdcp-phase3-section-nav{display:none!important}
  body>.shell{width:100%!important;margin:0!important;padding:0!important}
  .receipt-card{max-width:none!important;border:0!important;box-shadow:none!important;color:#111!important;background:#fff!important}
  .receipt-card .button-row{display:none!important}
}
