/* The partner portal as a working screen: a side menu and a light page,
   like the tools a partner uses every day. Loaded after pages.css, and
   only on the portal and its demo (body.ap-app). */

.ap-app{background:#f3f5f8;color:#14171a;color-scheme:light}
.ap-app .pa-side{position:fixed;inset:0 auto 0 0;width:248px;display:flex;flex-direction:column;gap:22px;padding:22px 16px;background:#0f1b2d;color:#c9d3e0;overflow-y:auto;z-index:30}
.ap-app .pa-brand{display:block;padding:0 8px}
.ap-app .pa-brand img{width:112px;height:auto;display:block}
.ap-app .pa-brand span{display:block;margin-top:8px;font:600 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8fa0b6}
.ap-app .pa-nav{display:grid;gap:2px}
.ap-app .pa-nav a{display:block;padding:10px 12px;border-radius:6px;font:500 14.5px/1.3 Arial,Helvetica,sans-serif;color:#d5dde8}
.ap-app .pa-nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.ap-app .pa-nav a:first-child{background:#1f4f8f;color:#fff}
.ap-app .pa-apply{min-height:42px;font-size:14px;box-shadow:none}
.ap-app .pa-help{margin-top:auto;padding:0 8px;font-size:12.5px;line-height:1.6;color:#8fa0b6}
.ap-app .pa-help a{color:#c9d3e0;text-decoration:underline}

.ap-app .ap{margin-left:248px;padding:28px 32px 64px;background:none;min-height:100vh}
.ap-app .pa-main{max-width:1180px}
.ap-app .pa-crumb{margin:0;font:600 11.5px/1 Arial,Helvetica,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#5c6470}
.ap-app .ap h1{margin:8px 0 0;font:600 28px/1.2 Arial,Helvetica,sans-serif;letter-spacing:-.01em;color:#14171a}
.ap-app .ap h2{margin:0;font:600 18px/1.3 Arial,Helvetica,sans-serif;letter-spacing:0;color:#14171a}
.ap-app .ap h3{font:600 15px/1.35 Arial,Helvetica,sans-serif;letter-spacing:0;color:#14171a}
.ap-app .ap-head{max-width:none}
.ap-app .ac-lead{margin-top:6px;max-width:none;font-size:14.5px;line-height:1.55;color:#4a5361}
.ap-app .ap-note{color:#5c6470;font-size:13px}
.ap-app .ap-note a{color:#1a4480}

.ap-app .ap-demo{margin:0 0 20px;padding:12px 16px;border:1px solid #f0d28a;border-left:4px solid #eda83b;border-radius:8px;background:#fff8e6;color:#4a3a10;font-size:14px}
.ap-app .ap-demo b{color:#14171a}
.ap-app .ap-state{border-color:#f1c8bf;background:#fdf1ee;color:#7a2c1b}

.ap-app .ap-share{margin-top:20px;gap:16px}
.ap-app .ac-card,.ap-app .pa-panel{background:#fff;border:1px solid #dfe3e8;border-radius:10px;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.ap-app .ap-share .ac-card{padding:18px 20px}
.ap-app .ap-copy output{min-height:42px;border-color:#cfd5dd;background:#f7f9fb;color:#14171a;font-size:14px}
.ap-app .ap-copy output.big{color:#1a4480;font-size:24px}
.ap-app .ac-btn{min-height:42px;border-radius:6px;font-size:14px}
.ap-app .ac-btn-gold{background:#1a4480;color:#fff;box-shadow:none}
.ap-app .ac-btn-gold:hover{background:#15396b;transform:none;box-shadow:none}
.ap-app .ac-btn-ghost{background:#fff;border-color:#cfd5dd;color:#14171a}
.ap-app .ac-btn-ghost:hover{border-color:#1a4480;color:#1a4480}
.ap-app .pa-side .pa-apply{background:#eda83b;color:#1b1300}
.ap-app .pa-side .pa-apply:hover{background:#f5bb5c}

.ap-app .ap-figs{margin-top:16px;gap:12px;border:0;background:none;grid-template-columns:repeat(6,minmax(0,1fr))}
.ap-app .ap-figs>div{padding:16px;border:1px solid #dfe3e8;border-radius:10px;background:#fff;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.ap-app .ap-figs>div:first-child{border-left:1px solid #dfe3e8}
.ap-app .ap-figs b{font:700 26px/1 Arial,Helvetica,sans-serif;color:#14171a}
.ap-app .ap-figs .is-gold b{color:#1a4480}
.ap-app .ap-figs .is-gold{border-top:3px solid #1a4480}
.ap-app .ap-figs span{font:600 11px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.06em;color:#5c6470}

.ap-app .ap-section{margin-top:20px}
.ap-app .pa-panel{padding:20px 22px}
.ap-app .ap-track{margin-top:14px;gap:10px}
.ap-app .ap-track li{padding:14px;border-color:#dfe3e8;background:#f7f9fb}
.ap-app .ap-track li>b{width:26px;height:26px;background:#1a4480;color:#fff;font:700 13px/1 Arial,Helvetica,sans-serif}
.ap-app .ap-track h3{margin-top:10px;font-size:14.5px}
.ap-app .ap-track p{font-size:13px;color:#4a5361}

.ap-app .ap-table{margin-top:12px;font-size:14px}
.ap-app .ap-table th{font:600 11px/1.3 Arial,Helvetica,sans-serif;letter-spacing:.06em;color:#5c6470;border-bottom:1px solid #dfe3e8;padding-bottom:8px}
.ap-app .ap-table td{padding:11px 12px 11px 0;border-bottom:1px solid #eceff3;color:#14171a}
.ap-app .ap-table td small{color:#5c6470}
.ap-app .ap-table tbody tr:hover td{background:#f7f9fb}
.ap-app .ap-pill{border:0;padding:3px 9px;background:#eceff3;color:#3c444e}
.ap-app .ap-pill.is-pending{background:#fff3d6;color:#7a5200}
.ap-app .ap-pill.is-approved{background:#e3eefb;color:#1a4480}
.ap-app .ap-pill.is-paid{background:#e2f4e7;color:#1c6b35}
.ap-app .ap-empty{border-color:#cfd5dd;color:#5c6470}

.ap-app .ap-two{gap:28px}
.ap-app .ap-two .ac-card{padding:0;border:0;box-shadow:none}
.ap-app .ac-field label{color:#14171a;font-size:13px}
.ap-app .ac-field label span{color:#5c6470;font-weight:400}
.ap-app .ac-field input,.ap-app .ac-field textarea{min-height:42px;padding:9px 12px;border-color:#cfd5dd;background:#fff;color:#14171a;font-size:15px}
.ap-app .ac-field input:focus,.ap-app .ac-field textarea:focus{border-color:#1a4480;box-shadow:0 0 0 3px rgba(26,68,128,.15)}
.ap-app .ac-status{color:#5c6470}
.ap-app .ac-status.is-good{color:#1c6b35}
.ap-app .ac-status.is-bad{color:#b3261e}
.ap-app .ap-demo-end{margin-top:20px;padding:24px;border:1px solid #dfe3e8;border-radius:10px;background:#fff}
.ap-app .ap-actions{margin-top:16px}
.ap-app .skip:focus{left:260px}

@media (max-width:1060px){.ap-app .ap-figs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){
  .ap-app .pa-side{position:static;width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:12px 16px}
  .ap-app .pa-brand{padding:0;display:flex;align-items:center;gap:10px}
  .ap-app .pa-brand img{width:84px}
  .ap-app .pa-brand span{margin-top:0}
  .ap-app .pa-nav{order:3;flex-basis:100%;display:flex;gap:6px;overflow-x:auto;padding-bottom:2px}
  .ap-app .pa-nav a{white-space:nowrap;padding:8px 12px;background:rgba(255,255,255,.08)}
  .ap-app .pa-apply{margin-left:auto}
  .ap-app .pa-help{display:none}
  .ap-app .ap{margin-left:0;padding:18px 16px 48px}
  .ap-app .ap-figs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ap-app .ap-share,.ap-app .ap-two{grid-template-columns:minmax(0,1fr)}
  .ap-app .ap-table th:first-child,.ap-app .ap-table td:first-child{padding-left:0}
}
@media print{.ap-app .pa-side{display:none}.ap-app .ap{margin-left:0}}
