/* REQ-CLIENTPORTAL-005: scoped customer shell; shared app.css supplies M3 tokens. */
.feedback-portal { background:var(--md-sys-color-surface); color:var(--md-sys-color-on-surface); font-family:var(--md-sys-typescale-font); }
.pt-app { max-width:none; margin:0; padding:0; display:block; color:var(--md-sys-color-on-surface); font-size:var(--md-sys-typescale-body-large-size); line-height:var(--md-sys-typescale-body-large-line-height); }
.pt-app *, .pt-lightbox * { box-sizing:border-box; }
.pt-app.pt-signed-in { display:grid; grid-template-columns:256px minmax(0,1fr); grid-template-rows:64px 1fr auto; min-height:100dvh; }
.pt-header { grid-column:1 / -1; grid-row:1; height:64px; padding:8px 16px; gap:12px; background:var(--md-sys-color-surface-container); border-color:var(--md-sys-color-outline-variant); }
.pt-header-title { margin:0; font-size:var(--md-sys-typescale-title-large-size); line-height:var(--md-sys-typescale-title-large-line-height); font-weight:400; letter-spacing:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pt-btn-icon { width:48px; height:48px; min-height:48px; flex-shrink:0; border-radius:var(--md-sys-shape-corner-full); color:var(--md-sys-color-on-surface-variant); }
.pt-avatar { width:48px; background:var(--md-sys-color-primary-container); color:var(--md-sys-color-on-primary-container); font:500 var(--md-sys-typescale-title-medium-size) var(--md-sys-typescale-font); }
.pt-navigation { grid-column:1; grid-row:2 / 4; padding:16px 12px; background:var(--md-sys-color-surface-container-low); }
.pt-navigation nav { display:flex; flex-direction:column; gap:4px; }
.pt-nav-item { width:100%; min-height:48px; padding:12px 16px; display:flex; flex-direction:row; align-items:center; gap:12px; text-align:left; border-radius:var(--md-sys-shape-corner-full); background:transparent; color:var(--md-sys-color-on-surface-variant); font:500 var(--md-sys-typescale-label-large-size) var(--md-sys-typescale-font); }
.pt-nav-item.active { background:var(--md-sys-color-secondary-container); color:var(--md-sys-color-on-secondary-container); }
.pt-nav-item svg { flex-shrink:0; }
.pt-nav-badge { position:static; margin-left:auto; border-radius:var(--md-sys-shape-corner-full); background:var(--md-sys-color-error); color:var(--md-sys-color-on-error); }
#pt-content { grid-column:2; grid-row:2; width:100%; max-width:1080px; min-width:0; padding:24px; }
.pt-footer-region { grid-column:2; grid-row:3; }
.pt-account { position:fixed; z-index:102; top:72px; right:16px; width:min(400px,calc(100vw - 32px)); padding:16px; display:flex; flex-direction:column; gap:12px; max-height:calc(100dvh - 88px); overflow:auto; background:var(--md-sys-color-surface-container-high); color:var(--md-sys-color-on-surface); border-radius:var(--md-sys-shape-corner-extra-large); box-shadow:var(--md-sys-elevation-level3); }
.pt-account-close { align-self:flex-end; }
.pt-account-company { font-size:var(--md-sys-typescale-title-medium-size); line-height:var(--md-sys-typescale-title-medium-line-height); overflow-wrap:anywhere; }
.pt-scrim { position:fixed; inset:0; z-index:100; border:0; padding:0; background:color-mix(in srgb,var(--md-sys-color-scrim) 32%,transparent); }
.pt-account[hidden], .pt-scrim[hidden] { display:none; }
.pt-navigation[data-open="true"] { display:block; position:fixed; z-index:102; top:0; bottom:0; left:0; width:min(320px,calc(100vw - 48px)); padding:24px 12px; overflow:auto; border-radius:0 var(--md-sys-shape-corner-large) var(--md-sys-shape-corner-large) 0; }
.pt-navigation[data-open="true"] .pt-nav-item { flex-direction:row; justify-content:flex-start; }
.pt-navigation[data-open="true"] .pt-nav-item span { font-size:var(--md-sys-typescale-label-large-size); }
.pt-card, .pt-job-card, .pt-approval, .pt-status-card, .pt-login-card { background:var(--md-sys-color-surface-container-low); border:1px solid var(--md-sys-color-outline-variant); border-radius:var(--md-sys-shape-corner-large); padding:16px; box-shadow:none; overflow-wrap:anywhere; }
.pt-job-card { display:block; width:100%; min-height:48px; text-align:left; font-family:inherit; }
.pt-job-card.needs-approval { border-left:4px solid var(--md-sys-color-primary); }
.pt-job-name, .pt-job-status { display:block; color:var(--md-sys-color-on-surface); font-size:var(--md-sys-typescale-title-medium-size); line-height:var(--md-sys-typescale-title-medium-line-height); font-weight:500; }
.pt-job-status { font-size:var(--md-sys-typescale-body-medium-size); line-height:var(--md-sys-typescale-body-medium-line-height); }
.pt-job-meta, .pt-meta, .pt-approval .meta, .pt-empty, .pt-login-sub, .pt-confirmation p, .pt-consent-check { color:var(--md-sys-color-on-surface-variant); font-size:var(--md-sys-typescale-body-medium-size); line-height:var(--md-sys-typescale-body-medium-line-height); }
.pt-job-meta { display:flex; flex-wrap:wrap; }
.pt-section-title { text-transform:none; letter-spacing:0; color:var(--md-sys-color-on-surface); font-size:var(--md-sys-typescale-title-medium-size); line-height:var(--md-sys-typescale-title-medium-line-height); font-weight:500; }
.pt-btn, .pt-btn-small, .pt-back, .pt-tab { min-height:48px; border-radius:var(--md-sys-shape-corner-full); font:500 var(--md-sys-typescale-label-large-size) var(--md-sys-typescale-font); color:var(--md-sys-color-primary); background:transparent; border-color:var(--md-sys-color-outline); }
.pt-btn-primary { background:var(--md-sys-color-primary); color:var(--md-sys-color-on-primary); border-color:transparent; box-shadow:none; }
.pt-btn-outline:hover, .pt-btn-icon:hover, .pt-nav-item:hover, .pt-job-card:hover { background:var(--md-sys-color-surface-container-highest); color:var(--md-sys-color-on-surface); }
.pt-btn:disabled { opacity:var(--md-sys-state-disabled-opacity); }
.pt-input, .pt-textarea { color:var(--md-sys-color-on-surface); background:var(--md-sys-color-surface-container-highest); border-color:var(--md-sys-color-outline); border-radius:var(--md-sys-shape-corner-small); font-family:inherit; font-size:var(--md-sys-typescale-body-large-size); line-height:var(--md-sys-typescale-body-large-line-height); }
.pt-input::placeholder, .pt-textarea::placeholder { color:var(--md-sys-color-on-surface-variant); }
.pt-input:focus, .pt-textarea:focus { border-color:var(--md-sys-color-primary); box-shadow:none; }
.pt-input-wrap label { display:block; margin-bottom:4px; font-size:var(--md-sys-typescale-body-medium-size); }
.pt-app :is(button,a,input,textarea,select):focus-visible, .pt-lightbox :is(button,video):focus-visible { outline:3px solid var(--md-sys-color-primary); outline-offset:3px; }
.pt-login { max-width:480px; min-height:100dvh; }
.pt-login-title { color:var(--md-sys-color-on-surface); font-size:var(--md-sys-typescale-headline-small-size); line-height:var(--md-sys-typescale-headline-small-line-height); font-weight:400; }
.pt-tabs { background:var(--md-sys-color-surface-container); border-radius:var(--md-sys-shape-corner-full); }
.pt-tab.active { background:var(--md-sys-color-secondary-container); color:var(--md-sys-color-on-secondary-container); }
.pt-consent-check { min-height:48px; align-items:center; }
.pt-consent-check input[type="checkbox"] { width:24px; height:24px; accent-color:var(--md-sys-color-primary); }
.pt-legal-footer, .pt-company-login { text-align:center; color:var(--md-sys-color-on-surface-variant); font-size:var(--md-sys-typescale-body-small-size); line-height:var(--md-sys-typescale-body-small-line-height); }
.pt-legal-footer a, .pt-company-login a { min-height:48px; padding:8px; display:inline-flex; align-items:center; color:var(--md-sys-color-primary); }
.pt-form-error { color:var(--md-sys-color-error); font-size:var(--md-sys-typescale-body-medium-size); line-height:var(--md-sys-typescale-body-medium-line-height); }
.pt-banner { min-height:48px; background:var(--md-sys-color-primary-container); color:var(--md-sys-color-on-primary-container); border-radius:var(--md-sys-shape-corner-large); }
.pt-banner-badge { background:var(--md-sys-color-primary); color:var(--md-sys-color-on-primary); border-radius:var(--md-sys-shape-corner-full); }
.pt-lifecycle-chip, .pt-chip { color:var(--md-sys-color-on-secondary-container); background:var(--md-sys-color-secondary-container); border-radius:var(--md-sys-shape-corner-small); font-size:var(--md-sys-typescale-label-medium-size); line-height:var(--md-sys-typescale-label-medium-line-height); text-transform:none; letter-spacing:0; }
.pt-status-label, .pt-billing-amount { font-size:var(--md-sys-typescale-headline-small-size); line-height:var(--md-sys-typescale-headline-small-line-height); }
.pt-job-status.gold, .pt-billing-amount, .pt-decision-done { color:var(--md-sys-color-primary); }
.pt-approval h4, .pt-doc-name, .pt-billing-label { color:var(--md-sys-color-on-surface); font-size:var(--md-sys-typescale-title-medium-size); line-height:var(--md-sys-typescale-title-medium-line-height); }
.pt-timeline::before { background:var(--md-sys-color-outline-variant); }
.pt-sk-row { background:var(--md-sys-color-surface-container-highest); border-radius:var(--md-sys-shape-corner-medium); }
.pt-loading { display:block; margin-bottom:16px; }
.pt-media-grid { grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:8px; }
.pt-media-tile { min-height:48px; border-color:var(--md-sys-color-outline-variant); border-radius:var(--md-sys-shape-corner-small); background:var(--md-sys-color-surface-container-high); }
.pt-media-slot.pt-media-failed { color:var(--md-sys-color-on-surface-variant); }
.pt-media-kind { color:var(--md-sys-color-inverse-on-surface); background:var(--md-sys-color-inverse-surface); border-radius:var(--md-sys-shape-corner-extra-small); font-size:var(--md-sys-typescale-label-medium-size); text-transform:none; }
.pt-media-play { color:var(--md-sys-color-inverse-on-surface); }
.pt-lightbox { background:var(--md-sys-color-inverse-surface); color:var(--md-sys-color-inverse-on-surface); }
.pt-lightbox-media { border-radius:var(--md-sys-shape-corner-small); }
.pt-lightbox-close, .pt-lightbox-nav { min-width:48px; min-height:48px; color:var(--md-sys-color-on-primary-container); background:var(--md-sys-color-primary-container); border-radius:var(--md-sys-shape-corner-full); }
.pt-lightbox-cap { color:var(--md-sys-color-inverse-on-surface); font-size:var(--md-sys-typescale-body-medium-size); }
.feedback-portal .pt-toast { background:var(--md-sys-color-inverse-surface); color:var(--md-sys-color-inverse-on-surface); border-color:var(--md-sys-color-outline); border-radius:var(--md-sys-shape-corner-small); font:400 var(--md-sys-typescale-body-medium-size) var(--md-sys-typescale-font); }
@media (min-width:600px) and (max-width:839px) {
  .pt-app.pt-signed-in { grid-template-columns:84px minmax(0,1fr); }
  .pt-navigation { padding:12px 4px; }
  .pt-nav-item { flex-direction:column; gap:4px; padding:8px 2px; text-align:center; }
  .pt-nav-item span { font-size:var(--md-sys-typescale-label-medium-size); }
  .pt-nav-badge { margin-left:0; }
}
@media (max-width:599px) {
  .pt-app.pt-signed-in { grid-template-columns:minmax(0,1fr); }
  .pt-header { padding:8px; }
  .pt-navigation { display:none; }
  #pt-content { grid-column:1; padding:16px; }
  .pt-footer-region { grid-column:1; }
  .pt-account { top:auto; bottom:0; left:0; right:0; width:100%; max-height:90dvh; border-radius:var(--md-sys-shape-corner-extra-large) var(--md-sys-shape-corner-extra-large) 0 0; padding-bottom:calc(16px + env(safe-area-inset-bottom)); }
}