#yates-portal{color-scheme:light dark}#yates-portal *{box-sizing:border-box}body#yates-portal{margin:0;font:16px Arial,sans-serif;background:light-dark(#f2f5f8,#101820);color:light-dark(#172638,#e9eff7)}#yates-portal main{max-width:1100px;margin:32px auto;padding:24px}#yates-portal section{background:light-dark(white,#1c2935);border:1px solid #9babb34d;border-radius:12px;padding:28px;margin:20px 0}#yates-portal h1{font-size:28px}#yates-portal main label{display:block;margin:16px 0 6px}#yates-portal main input,#yates-portal main select,#yates-portal main button{font:inherit;padding:10px 13px;border:1px solid #8094a4;border-radius:6px}#yates-portal main button{cursor:pointer;background:#153b60;color:white}#yates-portal main input{max-width:100%}#yates-portal .tools{display:flex;gap:12px;flex-wrap:wrap;align-items:center}#yates-portal main table{width:100%;border-collapse:collapse;font-size:14px}#yates-portal main th,#yates-portal main td{text-align:left;padding:12px 8px;border-bottom:1px solid #9babb34d}#yates-portal main td.amount,#yates-portal main th.amount{text-align:right;white-space:nowrap}#yates-portal .scroll{overflow:auto}#yates-portal #message{padding:12px;white-space:pre-line}#yates-portal #code{width:220px;letter-spacing:8px;font-size:26px}#yates-portal .small{font-size:13px;opacity:.8}#yates-portal [hidden]{display:none!important}#yates-portal img.logo{max-width:290px;height:auto;background:white;padding:8px;border-radius:5px}
#yates-portal h1{font-family:Arial,sans-serif;line-height:1.25;margin:0 0 12px}#yates-portal main p{margin:8px 0 16px}#yates-portal main input,#yates-portal main select{background:light-dark(#fff,#14212c);color:inherit}#yates-portal main button{line-height:1.35}#yates-portal a{color:light-dark(#154c7a,#9ed0ff);text-decoration:underline}html.dark #yates-portal{color-scheme:dark}html:not(.dark) #yates-portal{color-scheme:light}

#yates-portal main{max-width:680px;margin:40px auto;padding:24px;text-align:center}
#yates-portal main.portal-wide{max-width:1200px}
#yates-portal section{text-align:left}
#yates-portal #login,#yates-portal #verify{max-width:480px;margin:28px auto}
#yates-portal img.logo{display:block;margin:0 auto 24px;padding:0;background:transparent;border-radius:0;max-width:320px;width:100%}
#yates-portal .login-modes,#yates-portal .login-actions{display:flex;flex-wrap:wrap;gap:12px}
#yates-portal .login-modes{margin:0 0 24px}
#yates-portal .login-modes button{flex:1}
#yates-portal .login-modes button[aria-pressed=false]{background:transparent;color:inherit}
#yates-portal #account{width:100%;max-width:none}
#yates-portal .login-actions{margin-top:18px}
#yates-portal #loginhint{margin:22px 0 0;line-height:1.6}
#yates-portal main td button{margin:5px 8px 5px 0}
html.dark #yates-portal img.logo{filter:invert(1) hue-rotate(180deg)}

body#yates-portal{display:flex;flex-direction:column;min-height:100dvh}
#yates-portal main{width:100%;margin:20px auto 24px;flex:1 0 auto}
#yates-portal img.logo{display:block;margin-left:auto;margin-right:auto;align-self:center}
#yates-portal #login{margin:22px auto 12px}
#yates-portal [data-global-footer-slot]{flex:0 0 auto;background:light-dark(#e8eef4,#18232f);color:light-dark(#203449,#e6eef7)}
#yates-portal [data-global-footer-slot] a{color:light-dark(#123f65,#c5e1ff);text-decoration:underline}


#yates-portal [data-global-footer-slot]{background:#080808;color:#f1f5f9}#yates-portal [data-global-footer-slot] a{color:#dceafe}#yates-portal [data-global-footer-slot] p,#yates-portal [data-global-footer-slot] span{color:#f1f5f9}

/* Centre visible artwork: source alpha bounds are x=16..632 on an 800px canvas. */
#yates-portal img.logo{transform:translateX(9.5%)}

[data-account-contact-import] [data-result]{font-weight:600;padding:12px;border-radius:6px}
[data-account-contact-import] [data-state=success]{color:#16803c;border:1px solid currentColor}
[data-account-contact-import] [data-state=error]{color:#d32f2f;border:1px solid currentColor}
[data-theme=dark] [data-account-contact-import] [data-state=success]{color:#75df9b}
[data-theme=dark] [data-account-contact-import] [data-state=error]{color:#ff9393}

#yates-portal .pagination{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin:10px 0;font-size:13px}#yates-portal .pagination[hidden],#yates-portal [hidden]{display:none!important}#yates-portal .pagination button,#yates-portal .pagination select,#back-documents{width:auto;padding:5px 10px;margin:0;font-size:13px}#yates-portal .pagination label{display:flex;align-items:center;gap:5px;margin:0}#yates-portal #contacts{scroll-margin-top:65px}@media(max-width:600px){#yates-portal .pagination{flex-wrap:wrap}}

/* Shared compact action controls across the customer portal. */
#yates-portal main button,#yates-portal .pagination button{font-size:13px;line-height:1.2;padding:4px 9px;min-height:26px;width:auto;border-radius:4px;margin:2px 0;box-shadow:none}
#yates-portal main button:disabled{opacity:.5;cursor:default}
#yates-portal main .tools{gap:7px}
#yates-portal main .tools select,#yates-portal .pagination select{font-size:13px;line-height:1.2;padding:4px 8px;min-height:26px}
#yates-portal main .tools input:not([type=checkbox]){font-size:14px;padding:5px 9px;min-height:28px}
#yates-portal main td button{margin:2px 5px 2px 0}
#yates-portal main input[type=checkbox]{width:15px;height:15px;padding:0;margin:0 7px 0 0;vertical-align:middle}
#yates-portal [data-account-contact-import] button+button{margin-left:7px}

#yates-portal main td.amount,#yates-portal main th.amount{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}

#yates-portal .portal-nav{display:flex;flex-wrap:wrap;align-items:center;gap:7px;position:sticky;top:var(--portal-nav-offset,48px);z-index:15;padding:9px;background:light-dark(#f2f5f8,#101820);border:1px solid #9babb34d;border-radius:6px;margin:12px 0}#yates-portal .portal-nav button[aria-current=page]{background:#067b76;border-color:#067b76}html{scroll-behavior:auto}

#yates-portal main.portal-wide{width:calc(100% - 10px);max-width:none;margin-left:5px;margin-right:5px;padding-left:0;padding-right:0}#yates-portal #documents{padding-left:5px;padding-right:5px}#yates-portal .doc-list th,#yates-portal .doc-list td{padding:5px;white-space:nowrap;vertical-align:middle}#yates-portal .doc-list .select-column{width:24px;min-width:24px;padding-right:0}#yates-portal .doc-list .doc-date,#yates-portal .doc-list .doc-account,#yates-portal .doc-list .doc-number,#yates-portal .doc-list .doc-actions{width:1%}#yates-portal .doc-list .doc-description{max-width:32vw;overflow:hidden;text-overflow:ellipsis}#yates-portal .doc-list .doc-actions select{font-size:12px;padding:3px 5px;min-height:24px;max-width:98px}#yates-portal main .doc-reference{min-height:0;padding:0;margin:0;border:0;border-radius:0;background:transparent;color:light-dark(#154c7a,#9ed0ff);text-decoration:underline;font-size:13px;line-height:1.3}

/* Permanent portal workspace: one shared header, accordion sidebar and centre content. */
#yates-portal main.portal-wide .portal-workspace{display:grid;grid-template-columns:210px minmax(0,1fr);gap:12px;align-items:start}
#yates-portal .portal-content{min-width:0}
#yates-portal .portal-sidebar{position:sticky;top:calc(var(--portal-nav-offset,48px) + 8px);border:1px solid #9babb34d;border-radius:7px;background:light-dark(#fff,#1c2935);padding:8px;margin:20px 0;font-size:14px}
#yates-portal .sidebar-title{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:light-dark(#546577,#aebdcb);margin:4px 8px 12px}
#yates-portal .portal-sidebar details{padding:0;margin:0;border-bottom:1px solid #9babb32b}
#yates-portal .portal-sidebar summary{cursor:pointer;padding:10px 7px;font-weight:600}
#yates-portal .portal-sidebar button{display:block;width:100%;text-align:left;padding:7px 10px;margin:2px 0;border:0;background:transparent;color:inherit;min-height:30px}
#yates-portal .portal-sidebar button:hover{background:light-dark(#edf2f7,#273b4d)}
#yates-portal .portal-sidebar button[aria-current=page]{background:#153b60;color:#fff}
#yates-portal main.portal-wide .logo{max-width:170px}
#yates-portal main.portal-wide h1{font-size:24px;margin-bottom:6px}
#yates-portal .account-editor-grid{display:grid;grid-template-columns:minmax(180px,1fr) minmax(240px,2fr);gap:20px;margin-top:12px}
#yates-portal [data-list] button{display:block;width:100%;text-align:left;margin-bottom:5px}
#yates-portal [data-account-editor] form input,#yates-portal [data-account-editor] textarea{display:block;width:100%;margin-top:5px;padding:6px 9px;font:inherit;color:inherit;background:light-dark(#fff,#142230);border:1px solid #8094a4;border-radius:5px}
#yates-portal [data-account-editor] form label{font-size:14px;margin:10px 0}
@media(max-width:760px){#yates-portal main.portal-wide .portal-workspace{grid-template-columns:1fr;gap:0}#yates-portal .portal-sidebar{position:static;margin-bottom:0}#yates-portal .account-editor-grid{grid-template-columns:1fr}}

/* Application shell fills the viewport; only centre panels and lists scroll. */
body#yates-portal:has(main.portal-wide){height:100dvh;min-height:0;display:flex;flex-direction:column;overflow:hidden}
#yates-portal:has(main.portal-wide)>[data-global-header-slot],#yates-portal:has(main.portal-wide)>[data-global-footer-slot]{flex:0 0 auto}
#yates-portal main.portal-wide{flex:1 1 auto;min-height:0;margin:6px 5px!important;padding:0!important;display:flex;flex-direction:column;overflow:hidden}
#yates-portal main.portal-wide .portal-brandrow{display:flex;align-items:center;gap:18px;flex:0 0 auto;padding:4px 12px}
#yates-portal main.portal-wide .portal-brandrow .logo{width:115px;max-height:48px;object-fit:contain;margin:0!important;padding:0}
#yates-portal main.portal-wide .portal-brandrow h1{font-size:21px;margin:0}
#yates-portal main.portal-wide .portal-brandrow p{display:none}
#yates-portal main.portal-wide #message:empty{display:none}
#yates-portal main.portal-wide .portal-workspace{flex:1 1 auto;min-height:0;overflow:hidden}
#yates-portal main.portal-wide .portal-sidebar{position:static;margin:0;min-height:0;max-height:100%;overflow:auto}
#yates-portal main.portal-wide .portal-content{height:100%;min-height:0;overflow:hidden}
#yates-portal main.portal-wide .portal-content>section{height:100%;margin:0;overflow:auto;min-height:0}
#yates-portal main.portal-wide #documents{display:flex;flex-direction:column}
#yates-portal main.portal-wide #results{flex:1 1 auto;min-height:0;overflow:auto}
#yates-portal main.portal-wide #documents>.tools,#yates-portal main.portal-wide #documents>.pagination{flex:0 0 auto}
#yates-portal main.portal-wide #readonly{font-size:12px;margin:7px 0}
#yates-portal main.portal-wide [data-list]{max-height:calc(100dvh - 280px);overflow:auto}
#yates-portal dialog{width:min(560px,calc(100vw - 24px));max-height:80dvh;overflow:auto;border:1px solid #8094a4;border-radius:9px;padding:20px;color:light-dark(#172638,#e9eff7);background:light-dark(#fff,#1c2935)}
#yates-portal dialog::backdrop{background:#0008}
#yates-portal .account-popup-heading{display:flex;align-items:center;justify-content:space-between;gap:16px}
#yates-portal .account-popup-heading h2{margin:0;font-size:20px}
#yates-portal dialog button{font:inherit;font-size:13px;padding:4px 9px;cursor:pointer}
#yates-portal dialog dl{display:grid;grid-template-columns:90px minmax(0,1fr);gap:9px 14px;margin-bottom:0}
#yates-portal dialog dt{font-weight:600}#yates-portal dialog dd{margin:0;white-space:pre-line;overflow-wrap:anywhere}
@media(max-width:760px){#yates-portal main.portal-wide .portal-workspace{grid-template-rows:auto minmax(0,1fr);gap:6px}#yates-portal main.portal-wide .portal-sidebar{max-height:30dvh}#yates-portal main.portal-wide .portal-brandrow .logo{width:90px}#yates-portal main.portal-wide .portal-brandrow h1{font-size:19px}}

#yates-portal .resource-tokens{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}#yates-portal [data-portal-resources] input,#yates-portal [data-portal-resources] textarea{display:block;width:100%;margin-top:5px;border:1px solid #8094a4;border-radius:5px;padding:7px 9px;color:inherit;background:light-dark(#fff,#142230);font:inherit}#yates-portal [data-portal-resources] textarea{min-height:260px;max-height:50dvh;line-height:1.5;font-size:14px;resize:vertical}#yates-portal [data-portal-resources] [data-notice]{border-left:3px solid #ba7c14;padding:8px 12px;background:light-dark(#fff6df,#3c311c)}

/* Stable navigation and compact viewport controls. */
#yates-portal main.portal-wide .portal-workspace{grid-template-rows:minmax(0,1fr);align-items:stretch}
#yates-portal main.portal-wide .portal-content{min-height:0;display:flex;flex-direction:column}
#yates-portal main.portal-wide .portal-content>section{flex:1 1 0;min-height:0;padding:8px}
#yates-portal main.portal-wide #documents{overflow:hidden}
#yates-portal .document-toolbar{display:flex;align-items:center;gap:7px;flex:0 0 auto;overflow-x:auto;white-space:nowrap;padding-bottom:3px}
#yates-portal .document-toolbar .tools{flex-wrap:nowrap;flex:0 0 auto;gap:5px}
#yates-portal .document-toolbar #search{width:210px}
#yates-portal main .document-toolbar button,#yates-portal main .document-toolbar select{min-height:23px;padding:3px 6px;font-size:12px;margin:0}
#yates-portal main.portal-wide .pagination{flex:0 0 auto;gap:5px;margin:3px 0;min-height:24px;font-size:12px;flex-wrap:nowrap;white-space:nowrap;overflow-x:auto}
#yates-portal main.portal-wide .pagination button,#yates-portal main.portal-wide .pagination select{font-size:12px;min-height:22px;padding:2px 6px;margin:0}
#yates-portal main.portal-wide #readonly{margin:2px 0;font-size:11px}
#yates-portal .doc-list thead,#yates-portal .account-list thead{position:sticky;top:0;background:light-dark(#fff,#1c2935);z-index:1}
#yates-portal .portal-sidebar button{width:100%;margin:0 0 3px;min-height:28px}
#yates-portal main.portal-wide #account-editor{display:flex;flex-direction:column;overflow:hidden}
#yates-portal [data-account-editor]{display:flex;flex:1 1 0;min-height:0;flex-direction:column}
#yates-portal .account-section-menu{flex:0 0 auto;margin-bottom:5px}
#yates-portal .account-section-menu strong{margin-right:auto}
#yates-portal .account-browser{display:flex;flex-direction:column;flex:1 1 0;min-height:0}
#yates-portal main.portal-wide [data-list]{flex:1 1 0;min-height:0;max-height:none;overflow:auto}
#yates-portal .account-list td,#yates-portal .account-list th{padding:5px;white-space:nowrap}
#yates-portal .account-list button{padding:0;min-height:0;background:transparent;color:light-dark(#154c7a,#9ed0ff);border:0;text-decoration:underline}
#yates-portal .account-search{flex-wrap:nowrap;overflow-x:auto;flex:0 0 auto}
#yates-portal main .account-search input{width:240px}
#yates-portal [data-account-editor] form{overflow:auto;min-height:0}
#yates-portal [data-account-editor] [data-status]{flex:0 0 auto;margin:3px 0;font-size:12px}
/* Keep the navigation tree beside its content at narrow widths, rather than
   clipping expanded groups into a 50px horizontal strip. */
@media(max-width:760px){
 #yates-portal main.portal-wide .portal-workspace{grid-template-columns:145px minmax(0,1fr);grid-template-rows:minmax(0,1fr);gap:6px}
 #yates-portal main.portal-wide .portal-sidebar{display:block;max-height:100%;height:100%;overflow-y:auto;overflow-x:hidden;padding:5px;scrollbar-gutter:stable}
 #yates-portal .sidebar-title{display:none}
 #yates-portal .portal-sidebar button,#yates-portal .portal-sidebar>a{white-space:normal;width:100%;margin:0 0 3px;text-align:left;font-size:13px;line-height:1.3;overflow-wrap:anywhere}
 #yates-portal .portal-menu-group>.portal-submenu{padding-left:10px}
}
@media(max-width:480px){#yates-portal main.portal-wide .portal-workspace{grid-template-columns:125px minmax(0,1fr);gap:4px}#yates-portal .portal-sidebar button{padding:6px 5px;font-size:12px}}


/* The lower pager follows the final row inside the scrollable selection. */
#yates-portal .account-scroll{flex:1 1 0;min-height:0;overflow:auto}
#yates-portal main.portal-wide .account-scroll [data-list]{overflow:visible;max-height:none}
#yates-portal main.portal-wide #results>.pagination,#yates-portal .account-scroll>.pagination{margin-top:5px;margin-bottom:5px}
#yates-portal main .doc-account .doc-reference,#yates-portal .account-list button{display:inline-block;text-decoration:none;background:light-dark(#e3edf9,#29405a);color:light-dark(#234264,#d9e9ff);border:1px solid light-dark(#ccddef,#47617d);border-radius:4px;padding:3px 7px;min-height:23px;line-height:1.2}
#yates-portal main .doc-account .doc-reference:hover,#yates-portal .account-list button:hover{background:light-dark(#d2e4f5,#385471)}

/* Fixed data widths; keep source values intact and show full text on hover. */
#yates-portal .account-list{table-layout:fixed;width:100%;min-width:850px}
#yates-portal .account-list th:first-child,#yates-portal .account-list td:first-child{width:calc(6ch + 26px)}
#yates-portal .account-list th:nth-child(2),#yates-portal .account-list td:nth-child(2){width:40ch;max-width:40ch;overflow:hidden;text-overflow:ellipsis}
#yates-portal .account-list th:nth-child(3){width:20ch}
#yates-portal .account-list th:nth-child(5){width:16ch}
#yates-portal .account-list td{overflow:hidden;text-overflow:ellipsis}
#yates-portal .account-list td:first-child button,#yates-portal .doc-account button{font-family:ui-monospace,monospace;max-width:calc(6ch + 16px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle}
#yates-portal .doc-account{max-width:calc(6ch + 26px)}

#yates-portal #account-transactions-bar{flex:0 0 auto;flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;gap:5px;padding-bottom:5px}
#yates-portal #account-transactions-bar button{font-size:12px;min-height:23px;padding:3px 7px;margin:0}
#yates-portal #account-transactions-bar strong{font-size:13px;margin-right:auto}
#yates-portal [data-transaction-kind][aria-pressed=true]{background:#067b76;border-color:#067b76}

/* Six full monospace characters plus padding, border and the sort indicator. */
#yates-portal .account-list th:first-child,#yates-portal .account-list td:first-child{width:96px;min-width:96px;max-width:96px}
#yates-portal .account-list td:first-child button,#yates-portal main .doc-account .doc-reference{box-sizing:content-box;width:6ch;max-width:none;min-width:6ch;padding:3px 7px;overflow:visible;text-overflow:clip;text-align:left}
#yates-portal .account-list th button{font-family:inherit;background:transparent;color:inherit;border:0;padding:0;min-height:23px;text-decoration:none;font-weight:600;white-space:nowrap}
#yates-portal .account-search select{font-size:12px;min-height:26px;padding:3px 6px}

#yates-portal .account-list th:nth-child(2),#yates-portal .account-list td:nth-child(2){width:30ch;max-width:30ch}
#yates-portal .account-list th:nth-child(3),#yates-portal .account-list td:nth-child(3){width:18ch;max-width:18ch}

#yates-portal [data-account-editor] input[name=account_name],#yates-portal [data-account-editor] input[data-address-line]{width:calc(30ch + 20px);max-width:100%}
#yates-portal [data-account-editor] input[name=contact_name]{width:calc(18ch + 20px);max-width:100%}

/* Widths describe visible data space, without imposing shorter stored values. */
#yates-portal .account-list{min-width:1160px}
#yates-portal .account-list th:nth-child(2),#yates-portal .account-list td:nth-child(2),#yates-portal .account-list th:nth-child(3),#yates-portal .account-list td:nth-child(3){width:calc(30ch + 12px);max-width:calc(30ch + 12px)}
#yates-portal [data-account-editor] input[name=contact_name]{box-sizing:content-box;width:30ch;max-width:calc(100% - 20px)}
#yates-portal [data-account-editor] input[name=account_name],#yates-portal [data-account-editor] input[data-address-line]{box-sizing:content-box;width:30ch;max-width:calc(100% - 20px)}
#yates-portal .account-list th,#yates-portal .account-list td,#yates-portal .doc-list th,#yates-portal .doc-list td{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;overflow-wrap:normal;word-break:normal}
#yates-portal .account-scroll,#yates-portal #results{overflow-x:auto}
@media(max-width:760px){#yates-portal .doc-list{min-width:850px}#yates-portal .account-list{min-width:1160px}}

#yates-portal .document-pagebar{display:flex;flex:0 0 auto;align-items:center;gap:8px;overflow-x:auto;white-space:nowrap}
#yates-portal .document-pagebar>.pagination{margin-left:auto}
#yates-portal #balance-filters{flex-wrap:nowrap;gap:4px}
#yates-portal #balance-filters button{font-size:12px;min-height:22px;padding:2px 7px;margin:0}
#yates-portal [data-balance-colour=green]{border-bottom:3px solid #24a75a}
#yates-portal [data-balance-colour=orange]{border-bottom:3px solid #ee921b}
#yates-portal [data-balance-colour=blue]{border-bottom:3px solid #244b9b}
#yates-portal [data-balance-colour=red]{border-bottom:3px solid #d63838}
#yates-portal #balance-filters [aria-pressed=true]{outline:2px solid light-dark(#26394e,#dce8f4);outline-offset:1px}
#yates-portal .doc-list .balance-age,#yates-portal #balance-heading{width:20px;min-width:20px;padding:3px}
#yates-portal .balance-indicator{display:block;width:10px;height:22px;border-radius:2px;border:1px solid #8a98a6}
#yates-portal .age-white{background:#fff}#yates-portal .age-green{background:#24a75a}#yates-portal .age-orange{background:#ee921b}#yates-portal .age-blue{background:#244b9b}#yates-portal .age-red{background:#d63838}#yates-portal .age-unknown{background:repeating-linear-gradient(135deg,#8c98a4 0 2px,transparent 2px 4px)}

#yates-portal main.portal-wide .document-pagebar>.pagination{margin-left:auto}

#yates-portal .account-age-filters{display:flex;gap:4px;margin-right:auto;align-items:center}
#yates-portal main .account-age-filters button{font-size:12px;min-height:22px;padding:2px 7px;margin:0;text-decoration:none}
#yates-portal .account-age-filters [aria-pressed=true]{outline:2px solid light-dark(#26394e,#dce8f4);outline-offset:1px}
#yates-portal .account-list .balance-age{width:20px;min-width:20px;max-width:20px;padding:3px}
#yates-portal [data-account-age]{display:inline-block;vertical-align:middle;margin-left:7px}

#yates-portal .doc-list th button,#yates-portal #selected-review th button{background:transparent;color:inherit;border:0;padding:0;margin:0;font-size:inherit;font-weight:600;text-align:inherit}
#yates-portal th[aria-sort=ascending] button::after{content:' ↑'}#yates-portal th[aria-sort=descending] button::after{content:' ↓'}
#yates-portal .portal-newsletter-link{display:block;text-decoration:none;color:inherit;padding:7px 10px;font-size:13px;border-radius:4px}
#yates-portal .portal-newsletter-link:hover{background:light-dark(#edf2f7,#273b4d)}
#yates-portal #newsletter-prompt{max-width:440px;padding:18px}
#yates-portal #newsletter-prompt>img{display:block;width:100%;height:145px;object-fit:cover;border-radius:5px;margin:12px 0}
#yates-portal #newsletter-prompt h2{font-size:21px;margin:12px 0 6px}
#yates-portal #newsletter-prompt p{line-height:1.5}
#yates-portal #newsletter-prompt-read{display:inline-block;background:#153b60;color:white;padding:5px 10px;border-radius:4px;text-decoration:none;font-size:13px}
#yates-portal #newsletter-prompt-close{float:right}
#yates-portal main:not(.portal-wide){display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:0}
#yates-portal main:not(.portal-wide)>.portal-brandrow{width:100%;text-align:center}
#yates-portal main:not(.portal-wide) .portal-workspace{width:100%}
#yates-portal main:not(.portal-wide) #login,#yates-portal main:not(.portal-wide) #verify{width:100%;max-width:480px;margin-left:auto;margin-right:auto}

#yates-portal #newsletter-prompt>img{height:120px;object-fit:contain;background:#fff;padding:10px}
#yates-portal #newsletter-prompt h2{font-family:Arial,sans-serif}

#yates-portal .portal-newsletter-link{text-align:left}

#yates-portal [data-newsletter-items] textarea{display:block;width:100%;max-width:100%;padding:6px 8px;border:1px solid #8094a4;border-radius:6px;font:inherit;background:light-dark(#fff,#14212c);color:inherit}#yates-portal [data-newsletter-items] input{width:100%}#yates-portal [data-newsletter-items] td button{margin-right:5px}

#yates-portal .portal-submenu{padding-left:14px}#yates-portal main .connector-toggle[data-state="on"]{background:#19743c;color:white;border-color:#125b2e}#yates-portal main .connector-toggle[data-state="off"]{background:#b42b36;color:white;border-color:#89202a}#yates-portal main .connector-toggle[data-state="changing"]{background:#8b6411;color:white}#yates-portal main .connector-toggle[data-state="offline"]{background:#5a6572;color:white}#yates-portal .connector-connection[data-state="on"]{color:light-dark(#147638,#6ce39b);font-weight:700}#yates-portal .connector-connection[data-state="off"]{color:light-dark(#b72131,#ff8c96);font-weight:700}#yates-portal [data-reviews]{width:min(900px,94vw);max-height:85vh;overflow:auto;background:light-dark(#fff,#1c2935);color:inherit;border:1px solid #8094a4;border-radius:8px}#yates-portal [data-reviews] td button{margin-right:5px}

#yates-portal main button.connector-update{background:#d97706;color:#fff;border-color:#a85a03;font-weight:700}

/* Administration follows the compact Portal settings layout. */
#yates-portal [data-portal-administration]{max-width:1100px;margin:0 auto;text-align:left;font-size:14px}
#yates-portal [data-portal-administration]>h2{font-size:20px;margin:4px 0 14px}
#yates-portal [data-portal-administration]>[aria-label="Administration sections"]{gap:0;border-bottom:1px solid #8094a455;padding-bottom:0;margin-bottom:16px;flex-wrap:nowrap}
#yates-portal [data-portal-administration]>[aria-label="Administration sections"] button{border:0;border-radius:0;background:transparent;color:inherit;padding:8px 18px;margin:0;border-bottom:3px solid transparent}
#yates-portal [data-portal-administration]>[aria-label="Administration sections"] button[aria-pressed=true]{border-bottom-color:#168b85;color:light-dark(#145a70,#86d8d2);font-weight:700}
#yates-portal [data-portal-administration]>section{padding:0;margin:0;border:0;background:transparent;border-radius:0}
#yates-portal [data-portal-administration] h3{font-size:16px;margin:0 0 16px;padding-bottom:8px;border-bottom:1px solid #8094a444}
#yates-portal [data-portal-administration] form{max-width:760px;border:1px solid #8094a444;border-radius:7px;padding:18px;margin:16px 0;background:light-dark(#f8fafc,#16232e)}
#yates-portal [data-portal-administration] label{font-size:13px;font-weight:600;margin:12px 0 6px}
#yates-portal [data-portal-administration] label:has(input:not([type=checkbox])),#yates-portal [data-portal-administration] label:has(select){display:grid;grid-template-columns:170px minmax(0,1fr);align-items:center;gap:12px}
#yates-portal [data-portal-administration] input:not([type=checkbox]),#yates-portal [data-portal-administration] select{width:100%;max-width:520px;font-size:14px;padding:6px 9px;min-height:32px}
#yates-portal [data-portal-administration] section>div:not(.tools):not([aria-label])>div{display:flex;gap:12px;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #8094a433}
#yates-portal [data-portal-administration] [aria-label="Menu rights"]{border:1px solid #8094a444;border-radius:6px;margin:16px 0;max-height:48vh;overflow:auto}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] details{border-bottom:1px solid #8094a433}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] summary{cursor:pointer;padding:7px 12px;background:light-dark(#edf2f7,#233544)}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] label{display:inline-flex;align-items:center;gap:6px;margin:0;font-weight:400}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] summary label{font-weight:600}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] button{float:right;background:transparent;color:inherit;border-color:#8094a444;font-size:11px;min-height:22px;padding:2px 7px}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] .portal-submenu>div{padding:7px 12px;border-top:1px solid #8094a422;min-height:34px}
#yates-portal [data-portal-administration] [aria-label="Menu rights"] small{display:block;padding:6px 16px;color:light-dark(#526578,#b9cbd9)}
#yates-portal [data-portal-administration] .tools{padding:10px 0;gap:8px}
#yates-portal [data-portal-administration] p{font-size:13px;line-height:1.5;max-width:85ch}
#yates-portal [data-portal-administration] [role=status]:not(:empty){padding:9px 12px;border-left:3px solid #168b85;background:light-dark(#eef7f6,#193430);margin-top:12px}
@media(max-width:600px){#yates-portal [data-portal-administration] label:has(input:not([type=checkbox])),#yates-portal [data-portal-administration] label:has(select){grid-template-columns:1fr;gap:5px}#yates-portal [data-portal-administration] form{padding:12px}#yates-portal [data-portal-administration]>[aria-label="Administration sections"] button{padding:8px 12px}}

/* One shared menu treatment and centre-panel dismissal. */
#yates-portal .portal-menu-group>button{font-weight:400;display:block;width:100%;text-align:left}
#yates-portal .portal-menu-group>button[aria-expanded=false]+.portal-submenu{display:none}
#yates-portal .portal-menu-group>.portal-submenu{padding-left:14px}
#yates-portal main .portal-panel-close{display:block;align-self:flex-end;margin:0 0 5px auto;background:transparent;color:inherit;border:1px solid #8094a466;font-size:12px;min-height:23px;padding:3px 8px}

/* Standard top-right close icon on each centre panel. */
#yates-portal .portal-content>section{position:relative}
#yates-portal main .portal-panel-close{position:absolute;top:6px;right:6px;z-index:5;display:flex;align-items:center;justify-content:center;width:28px;height:28px;min-height:28px;margin:0;padding:0;border:0;border-radius:4px;background:light-dark(#fff,#1c2935);color:inherit;font-size:24px;font-weight:400;line-height:1}
#yates-portal main .portal-panel-close:hover{background:light-dark(#e8edf2,#354758)}
#yates-portal .portal-content>section:has(>.portal-panel-close){padding-top:38px}

/* Shared centre frame: fixed menu, compact search and pagers, scrollable content. */
#yates-portal main.portal-wide .portal-content>.centre-template{display:flex;flex-direction:column;padding:0;overflow:hidden}
#yates-portal .centre-menu-row{flex:0 0 auto;display:flex;align-items:center;gap:12px;min-height:35px;padding:4px 9px;border-bottom:1px solid #8094a444;background:light-dark(#f7f9fb,#1c2935)}
#yates-portal .centre-menu-row>strong{font-size:14px;font-weight:600}
#yates-portal main .centre-menu-row>.portal-panel-close{position:static;margin:0 0 0 auto;flex-shrink:0}
#yates-portal .centre-content-block{flex:1 1 0;min-height:0;overflow:auto;padding:8px}
#yates-portal #documents>.centre-content-block,#yates-portal #account-editor>.centre-content-block{display:flex;flex-direction:column;overflow:hidden}
#yates-portal #account-editor>.centre-content-block>[data-account-editor]{flex:1 1 0;min-height:0;display:flex;flex-direction:column}
#yates-portal .centre-content-block .pagination{flex-shrink:0;font-size:12px;gap:5px;margin:5px 0}
#yates-portal .centre-content-block .pagination button,#yates-portal .centre-content-block .pagination select{font-size:12px;padding:3px 7px;min-height:24px}
#yates-portal .centre-content-block .tools{gap:6px}
#yates-portal .centre-content-block [data-portal-administration]>h2{display:none}

#yates-portal .centre-menu-row>.tools{margin:0;padding:0;flex:1 1 auto;min-width:0;flex-wrap:nowrap;overflow-x:auto}
#yates-portal .centre-menu-row>.tools button{background:transparent;color:inherit;border:0;border-radius:0;padding:4px 8px;white-space:nowrap}
#yates-portal .centre-menu-row>.tools button[aria-pressed=true]{border-bottom:2px solid #168b85;font-weight:600}
#yates-portal .centre-menu-row:has(>.tools)>strong{display:none}

#yates-portal [data-portal-administration] .pagination label{display:flex;grid-template-columns:none;align-items:center;gap:5px;margin:0;font-weight:400}
#yates-portal [data-portal-administration] .pagination select{width:auto;min-height:24px;max-width:65px;padding:3px 6px;font-size:12px}
#yates-portal [data-portal-administration] .doc-list select{width:auto;max-width:135px;min-height:25px;padding:3px 6px;font-size:12px}
#yates-portal [data-portal-administration] .doc-list td:nth-child(5){min-width:110px}

/* Keep the brand row height while removing its outer vertical/left padding. */
#yates-portal main.portal-wide .portal-brandrow{padding:0 12px 0 0;min-height:48px;gap:12px}
#yates-portal main.portal-wide .portal-brandrow .logo{width:130px;max-height:48px;transform:none;padding:0;margin:0!important}
#yates-portal #portal-security .security-form{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
#yates-portal #portal-security input,#yates-portal #portal-security select,#yates-portal #portal-security button{padding:4px 8px;font-size:13px}
#yates-portal #portal-security label{margin:4px 0;font-size:13px}
#yates-portal #portal-security .security-red{color:#c73535}#yates-portal #portal-security .security-green{color:#278347}

/* Crop only empty pixels in the original transparent logo via its display frame. */
#yates-portal .portal-logo-frame{position:relative;display:block;overflow:hidden;width:320px;max-width:100%;aspect-ratio:616/130;margin:0 auto 12px;flex-shrink:0}
#yates-portal main.portal-wide .portal-logo-frame{width:170px;margin:0}
#yates-portal .portal-logo-frame img.logo,#yates-portal main.portal-wide .portal-brandrow .portal-logo-frame img.logo{position:absolute;left:-2.5974%;top:0;width:129.8701%;max-width:none;max-height:none;height:100%;padding:0;margin:0!important;transform:none;object-fit:fill}
@media(max-width:760px){#yates-portal main.portal-wide .portal-logo-frame{width:140px}}

/* Shared centre list template: search, optional top pager, rows, bottom pager. */
#yates-portal .centre-list-template{display:flex;flex-direction:column;min-height:0;flex:1}
#yates-portal .centre-list-content{min-height:0;overflow:auto;flex:1}
#yates-portal .centre-search-row{flex-shrink:0;margin-bottom:5px}
#yates-portal .centre-search-row input{width:240px;max-width:100%}
#yates-portal #portal-security>.centre-content-block{display:flex;overflow:hidden}
#yates-portal [data-login-security]{display:flex;flex-direction:column;min-height:0;flex:1}
#yates-portal [data-login-security]:has([data-security-form]),#yates-portal [data-login-security]:has(.security-form){overflow:auto}
#yates-portal [data-security-status]:empty{display:none}
#yates-portal .centre-list-template td button+button{margin-left:5px}
#yates-portal .centre-list-template th button{background:transparent;color:inherit;border:0;padding:0;font-weight:600}

#yates-portal main .trusted-ip-status{min-width:30px;min-height:24px;padding:2px 8px;color:white;border:0}
#yates-portal main .trusted-ip-status[data-state="on"]{background:#19743c}
#yates-portal main .trusted-ip-status[data-state="off"]{background:#b42b36}

#yates-portal .centre-list-template table.doc-list{min-width:0;width:100%;table-layout:fixed}
#yates-portal .centre-list-template th,#yates-portal .centre-list-template td{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#yates-portal .centre-list-template th[data-column="enabled"]{width:65px}
#yates-portal .centre-list-template th[data-column="actions"]{width:105px}
#yates-portal .centre-list-template th[data-column="stage"]{width:55px}

/* Logo fills the existing 48px brand row, without outer top/left gutters. */
#yates-portal main.portal-wide{margin:0 0 6px!important}
#yates-portal main.portal-wide .portal-workspace{margin-left:5px;margin-right:5px}
#yates-portal main.portal-wide .portal-brandrow{padding:0;min-height:0}
#yates-portal main.portal-wide .portal-logo-frame{width:min(227.45px,50vw);margin:0}

/* Requested 3px logo breathing room and page-centred title. */
#yates-portal main.portal-wide .portal-brandrow{position:relative}
#yates-portal main.portal-wide .portal-logo-pad{display:block;flex:0 0 auto;padding:3px}
#yates-portal main.portal-wide .portal-logo-frame{width:min(199.02px,calc(50vw - 65px));margin:0}
#yates-portal main.portal-wide .portal-brandrow h1{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;white-space:nowrap;margin:0}

/* Shared slim recipient/printer choice dialog. */
.portal-action-choice{position:fixed;width:min(420px,calc(100vw - 32px));box-sizing:border-box;border:1px solid #aab4c0;border-radius:8px;padding:20px;background:#fff;color:#17212e}
.portal-action-choice::backdrop{background:rgb(0 0 0 / .42)}
.portal-action-choice h2{margin:0 30px 10px 0;font-size:1.1rem}
.portal-action-choice p{font-size:.85rem;margin:0 0 14px}
.portal-action-options{display:flex;flex-wrap:wrap;gap:8px}
.portal-action-choice button{min-height:30px;padding:4px 12px;font-size:.875rem}
.portal-action-choice .portal-action-close{position:absolute;right:5px;top:5px;min-height:26px;padding:0 7px;border:0;background:transparent;color:inherit;font-size:22px}
html.dark .portal-action-choice,html[data-theme="dark"] .portal-action-choice,body.dark .portal-action-choice{background:#18212d;color:#f1f4f8;border-color:#64748b}

.portal-action-options button{background:#153b60;color:#fff;border:1px solid #8094a4;border-radius:5px;cursor:pointer}

#portal-help-frame{display:block;width:100%;height:calc(100vh - 210px);min-height:360px;border:0;background:transparent}

/* The same visible tree hierarchy for every workspace group. */
#yates-portal .portal-sidebar .portal-menu-group>.portal-submenu{margin-left:8px;padding-left:14px;border-left:1px solid light-dark(#bcc9d3,#506575)}
#yates-portal .portal-sidebar .portal-menu-group>button[aria-expanded]{font-weight:600;position:relative;padding-right:20px}
#yates-portal .portal-sidebar .portal-menu-group>button[aria-expanded]::after{content:'›';position:absolute;right:6px;top:5px;font-size:16px}
#yates-portal .portal-sidebar .portal-menu-group>button[aria-expanded=true]::after{content:'⌄'}
#yates-portal .account-browser.centre-list-template .centre-search-row{display:flex;flex-wrap:nowrap;gap:5px;overflow-x:auto}
#yates-portal .account-browser.centre-list-template .centre-search-row input{width:220px;flex:1 0 150px;min-width:150px}
#yates-portal .account-browser.centre-list-template .centre-search-row select,#yates-portal .account-browser.centre-list-template .centre-search-row button{flex:0 0 auto;width:auto;white-space:nowrap}
#yates-portal .account-browser.centre-list-template .account-age-filters{flex:0 0 auto;margin:0 0 4px;gap:4px}
#yates-portal .account-browser.centre-list-template table.account-list{min-width:1020px;table-layout:fixed}
#yates-portal .account-browser.centre-list-template td,#yates-portal .account-browser.centre-list-template th{padding:4px 5px}
#yates-portal .account-browser.centre-list-template td button{margin:0;min-height:24px;line-height:1.2}
#yates-portal .account-browser.centre-list-template th[data-column=balance_colour]{width:45px}

/* Shared label/control columns: never align fields with whitespace. */
#yates-portal{--portal-label-column:170px}
#yates-portal main form:not([data-form])>label:has(>input:not([type=checkbox]):not([type=radio]):not([type=hidden])),
#yates-portal main form:not([data-form])>label:has(>select),
#yates-portal main form:not([data-form])>label:has(>textarea),
#yates-portal main .portal-field-row{display:grid;grid-template-columns:var(--portal-label-column) minmax(0,1fr);align-items:center;column-gap:12px;row-gap:5px;margin:8px 0}
#yates-portal main .portal-form-columns{width:100%;max-width:640px}
#yates-portal main .portal-form-columns input:not([type=checkbox]):not([type=radio]),
#yates-portal main .portal-field-row>input:not([type=checkbox]):not([type=radio]),
#yates-portal main .portal-field-row>select,
#yates-portal main .portal-field-row>textarea{width:100%;min-width:0;box-sizing:border-box;margin:0}
#yates-portal [data-printers]{width:min(620px,calc(100vw - 24px));box-sizing:border-box}
@media(max-width:600px){#yates-portal{--portal-label-column:110px}}
@media(max-width:380px){#yates-portal{--portal-label-column:85px}}

/* Portal-wide control tokens: matching heights and aligned row baselines. */
#yates-portal{--portal-control-height:30px;--portal-control-font:13px;--portal-control-gap:6px}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination){align-items:flex-end;gap:var(--portal-control-gap)}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination)>label{margin:0;display:flex;flex-direction:column;gap:4px;align-items:stretch;line-height:18px}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination) label:has(>input[type=checkbox]),
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination) label:has(>input[type=radio]){flex-direction:row;align-items:center;min-height:var(--portal-control-height)}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination,form) :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file]):not([type=color]),select,button:not(.portal-panel-close):not(.portal-action-close)){box-sizing:border-box!important;height:var(--portal-control-height)!important;min-height:var(--portal-control-height)!important;padding:4px 8px!important;margin-top:0!important;margin-bottom:0!important;font-size:var(--portal-control-font)!important;line-height:20px!important;vertical-align:middle}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination,form) button:not(.portal-panel-close):not(.portal-action-close){display:inline-flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap}
#yates-portal main :is(.tools,.centre-search-row,.centre-menu-row,.pagination,form) button svg{flex:0 0 auto;vertical-align:middle}
#yates-portal main .pagination{--portal-control-height:26px;--portal-control-font:12px;align-items:center}
#yates-portal main .pagination>label{flex-direction:row;align-items:center;gap:5px}
#yates-portal main .centre-menu-row{align-items:center}
#yates-portal main .centre-menu-row>strong{align-self:center}
#yates-portal main form:not([data-form]) label.portal-field-row{display:grid;grid-template-columns:var(--portal-label-column) minmax(0,1fr);align-items:center}

/* Business cards: one header row with equal-height actions, including close. */
#yates-portal main [data-business-cards]>.centre-menu-row{display:flex;flex-wrap:nowrap;align-items:center!important;gap:6px;padding:5px 8px;min-height:40px}
#yates-portal main [data-business-cards]>.centre-menu-row>strong{display:flex;align-items:center;height:30px;margin:0 8px 0 0;font-size:14px;line-height:20px;white-space:nowrap}
#yates-portal main [data-business-cards]>.centre-menu-row>button{display:inline-flex!important;align-items:center;justify-content:center;box-sizing:border-box!important;height:30px!important;min-height:30px!important;max-height:30px!important;padding:4px 8px!important;margin:0!important;line-height:20px!important;font-size:13px!important;flex:0 0 auto;white-space:nowrap}
#yates-portal main [data-business-cards]>.centre-menu-row>.portal-panel-close{position:static!important;inset:auto!important;margin-left:auto!important;width:30px!important;min-width:30px;padding:0!important;font-size:22px!important}
@media(max-width:480px){#yates-portal main [data-business-cards]>.centre-menu-row{gap:3px;padding:5px 3px}#yates-portal main [data-business-cards]>.centre-menu-row>strong{font-size:12px;margin-right:2px}#yates-portal main [data-business-cards]>.centre-menu-row>button{padding:4px 5px!important;font-size:12px!important}}

#yates-portal main [data-business-cards] [data-editor]>.tools>label:has(>[data-include-qr]){display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center;gap:4px;min-width:36px;min-height:0;margin:0;text-align:center}
#yates-portal main [data-business-cards] [data-include-qr]{display:block;width:18px;height:18px;min-height:18px;margin:0 auto!important;align-self:center;flex:0 0 18px}

#yates-portal [data-business-cards] .business-card-previews{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:6px}
#yates-portal [data-business-cards] .business-card-previews>div{padding-left:0;padding-right:0}
@media(max-width:700px){#yates-portal [data-business-cards] .business-card-previews{grid-template-columns:1fr}}

#yates-portal .account-browser.centre-list-template table.account-list{min-width:3000px;table-layout:fixed}
#yates-portal .account-browser.centre-list-template table.account-list th[data-column=account_name]{width:250px}
#yates-portal .account-browser.centre-list-template table.account-list th[data-column=account_code]{width:85px}
#yates-portal .account-browser.centre-list-template table.account-list th[data-column=report_group]{width:150px}
#yates-portal .account-browser.centre-list-template table.account-list th[data-column=fax_number]{width:190px}
#yates-portal .account-browser.centre-list-template .account-scroll{overflow:auto;min-width:0}

#yates-portal .account-browser.centre-list-template table.account-list{min-width:0;table-layout:fixed}
#yates-portal .account-browser.centre-list-template table.account-list th,#yates-portal .account-browser.centre-list-template table.account-list td{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:4px 7px}
#yates-portal .account-browser.centre-list-template table.account-list th button{max-width:100%;white-space:normal;overflow:hidden;line-height:14px!important;padding:2px!important;text-align:left}