/* Scoped directory styling adapted from the supplied supplier-contact reference. */
#contactDirectorySurface { container-type:inline-size; background:#f5f6f3; color:#152521; padding:18px; font:14px system-ui,-apple-system,sans-serif; }
#contactDirectorySurface * { box-sizing:border-box; }
#contactDirectorySurface button,#contactDirectorySurface a { transition:background .12s,border-color .12s; }
#contactDirectorySurface button { font:600 12px system-ui,sans-serif; background:#fff; color:#263d34; border:1px solid #dee3dc; border-radius:8px; box-shadow:none; min-height:38px; padding:8px 12px; cursor:pointer; }
#contactDirectorySurface button:hover { border-color:#1b6b5a; background:#eef4ef; }
#contactDirectorySurface :focus-visible { outline:2px solid #1b6b5a; outline-offset:2px; }
#contactDirectorySurface h2,#contactDirectorySurface h3 { font-family:system-ui,sans-serif; }
.acd-searchbar { display:flex; align-items:center; flex-wrap:wrap; gap:18px; padding:12px 14px; background:white; border:1px solid #dee3dc; border-radius:12px; margin-bottom:16px; }
.acd-search { flex:1; min-width:200px; display:flex; align-items:center; gap:10px; background:#fafbf8; border:1px solid #dee3dc; border-radius:10px; padding:0 12px; }
.acd-search:focus-within { border-color:#1b6b5a; box-shadow:0 0 0 3px #e4efea; }
.acd-search input { width:100%; min-width:0; height:48px; background:transparent; border:0; outline:none!important; box-shadow:none!important; font-size:16px; }
#contactDirectorySurface .acd-search button { border:0; background:transparent; font-size:20px; padding:4px; min-width:32px; }
.acd-searchbar>span { font-size:12px; color:#5c6b64; }
.acd-book { display:grid; grid-template-columns:clamp(320px,28%,480px) minmax(0,1fr) 285px; border:1px solid #dee3dc; border-radius:12px; overflow:hidden; background:#fff; min-height:550px; }
.acd-left { background:#fafbf8; border-right:1px solid #dee3dc; min-width:0; }
.acd-pane-title { display:flex; justify-content:space-between; padding:18px 16px 10px; text-transform:uppercase; font-size:10px; letter-spacing:.1em; color:#819087; font-weight:700; }
.acd-companies { max-height:65vh; overflow:auto; padding:5px 8px 12px; }
#contactDirectorySurface .acd-companies button { display:flex; align-items:center; gap:9px; width:100%; text-align:left; padding:10px 8px; border-color:transparent; background:transparent; margin:3px 0; }
#contactDirectorySurface .acd-companies button[aria-pressed=true] { background:#fff; border-color:#1b6b5a; box-shadow:0 0 0 2px #e4efea; }
.acd-avatar { width:38px; height:38px; border-radius:11px; display:inline-grid; place-items:center; flex:none; font-weight:700; font-size:13px; background:#1b6b5a; color:#fff; }
.acd-avatar.acd-large { width:60px; height:60px; font-size:21px; border-radius:16px; }
.acd-tone-1 { background:#446e88; }.acd-tone-2 { background:#7a608b; }.acd-tone-3 { background:#778544; }.acd-tone-4 { background:#a57845; }
.acd-company-text { min-width:0; flex:1; }
.acd-company-text strong { display:block; font-size:12px; white-space:normal; overflow-wrap:anywhere; line-height:1.35; }
.acd-company-text small { display:block; font-size:10px; font-weight:400; color:#829087; margin-top:3px; }
.acd-count { background:#eef1ec; border-radius:20px; padding:3px 6px; font-size:10px; }
.acd-middle { min-width:0; }
.acd-banner { display:flex; align-items:center; flex-wrap:wrap; gap:14px; padding:20px; color:#fff; background:radial-gradient(ellipse at top right,#79633344,transparent 65%),repeating-linear-gradient(135deg,#ffffff06 0 2px,transparent 2px 14px),linear-gradient(120deg,#0e2622,#18463c); }
.acd-banner>div:not(.acd-banner-actions) { flex:1; min-width:160px; }
.acd-banner h2 { margin:0; font-size:20px; color:#fff; overflow-wrap:anywhere; line-height:1.25; }
.acd-banner p { margin:9px 0 0; font-size:11px; color:#c3d4ca; line-height:1.8; }
.acd-banner p span { background:#ffffff21; color:#fff; padding:3px 6px; border-radius:5px; margin-right:8px; }
.acd-banner-actions { display:flex; gap:6px; flex-wrap:wrap; }
#contactDirectorySurface .acd-banner-actions button { color:#fff; background:#ffffff15; border-color:#ffffff44; }
#contactDirectorySurface .acd-banner-actions .acd-add { background:#fff; color:#164336; }
.acd-toolbar { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; padding:12px; border-bottom:1px solid #eaede6; }
.acd-filters,.acd-layout { display:flex; flex-wrap:wrap; gap:5px; }
#contactDirectorySurface .acd-filters button { border-radius:20px; font-size:11px; min-height:32px; padding:5px 10px; }
.acd-filters small { opacity:.7; margin-left:3px; }
#contactDirectorySurface .acd-filters button[aria-pressed=true] { color:#fff; background:#0e2622; border-color:#0e2622; }
#contactDirectorySurface .acd-filters .acd-warning { color:#a26821; background:#f5e9d6; }
#contactDirectorySurface .acd-filters .acd-warning[aria-pressed=true] { color:#fff; background:#a26821; border-color:#a26821; }
.acd-layout { background:#eef1ec; padding:3px; border-radius:9px; }
#contactDirectorySurface .acd-layout button { background:transparent; border:0; min-height:28px; padding:4px 8px; }
#contactDirectorySurface .acd-layout button[aria-pressed=true] { background:#fff; box-shadow:0 1px 3px #163c221a; }
.acd-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; padding:16px; align-content:start; max-height:65vh; overflow:auto; }
.acd-card { border:1px solid #dee3dc; border-radius:13px; padding:14px; min-width:0; background:#fff; }
.acd-card.acd-selected { border-color:#1b6b5a; box-shadow:0 0 0 2px #e4efea; }
#contactDirectorySurface .acd-person-heading { display:flex; gap:10px; align-items:center; padding:0; border:0; background:transparent; width:100%; text-align:left; }
.acd-person-heading>span:last-child { min-width:0; }
.acd-person-heading strong { display:block; font-size:14px; overflow-wrap:anywhere; }
.acd-person-heading small { display:block; color:#748078; font-weight:400; font-size:11px; margin-top:4px; }
.acd-card dl { margin:14px 0; }.acd-card dl>div,.acd-detail dl>div { display:grid; grid-template-columns:62px minmax(0,1fr); gap:8px; margin:9px 0; }
.acd-card dt,.acd-detail dt { color:#8c978f; font-size:10px; }.acd-card dd,.acd-detail dd { margin:0; overflow-wrap:anywhere; font-size:12px; }
.acd-card footer { display:flex; align-items:center; justify-content:space-between; gap:6px; padding-top:11px; border-top:1px solid #eaede6; }
.acd-quick,.acd-detail-quick { display:flex; gap:7px; }
#contactDirectorySurface .acd-icon { display:inline-grid; place-items:center; width:34px; height:34px; min-height:34px; padding:0; border-radius:50%; border:0; color:#5c6b64; background:#eef1ec; text-decoration:none; }
#contactDirectorySurface .acd-icon.acd-call { background:#e4efea; color:#1b6b5a; }#contactDirectorySurface .acd-icon.acd-mail { background:#e4edf3; color:#3f6b86; }
.acd-no-details { display:block; background:#f5e9d6; color:#a26821; border-radius:8px; padding:9px; font-size:12px; }
.acd-detail { min-width:0; background:#fafbf8; border-left:1px solid #dee3dc; }
.acd-detail-hero { text-align:center; padding:26px 15px 16px; }.acd-detail-hero h2 { font-size:20px; margin:14px 0 5px; overflow-wrap:anywhere; }.acd-detail-hero p { color:#748078; font-size:12px; margin:4px 0 12px; }
.acd-badge { background:#e4efea; color:#1b6b5a; padding:5px 10px; font-size:11px; border-radius:20px; }
.acd-detail-quick { justify-content:center; padding:10px; }.acd-detail-body { padding:15px 20px; }.acd-detail-body h3 { text-transform:uppercase; letter-spacing:.07em; color:#8c978f; font-size:10px; margin:16px 0; }.acd-detail-body p { font-size:13px; overflow-wrap:anywhere; }
.acd-detail footer { border-top:1px solid #dee3dc; padding:14px; display:flex; flex-wrap:wrap; gap:6px; }
#contactDirectorySurface .acd-danger { color:#aa4634; }
#contactDirectorySurface .acd-detail-close { display:none; }
.acd-empty { text-align:center; padding:35px 18px; color:#748078; }
.acd-status { margin:8px 0 0; font-size:12px; color:#1b6b5a; }
.acd-cards.acd-list { grid-template-columns:minmax(0,1fr); }.acd-list .acd-card { display:grid; grid-template-columns:minmax(120px,1fr) minmax(130px,1fr); column-gap:12px; }.acd-list .acd-card footer { grid-column:1/-1; }.acd-list .acd-card dl { margin:0 0 10px; }
@container (max-width:1050px) {
 .acd-book { grid-template-columns:minmax(260px,35%) minmax(0,1fr); }
 .acd-detail { display:none; }
 .acd-detail-open .acd-detail { display:block; grid-column:2; grid-row:1; z-index:2; }
 .acd-detail-open .acd-middle { display:none; }
 #contactDirectorySurface .acd-detail-close { display:block; margin:12px 12px 0 auto; }
}
@container (max-width:620px) {
 .acd-book { display:flex; flex-direction:column; }
 .acd-companies { max-height:190px; }.acd-left { border-right:0; border-bottom:1px solid #dee3dc; }
 .acd-search { min-width:0; width:100%; flex-basis:100%; }.acd-searchbar { gap:10px; }
 .acd-cards { grid-template-columns:minmax(0,1fr); max-height:none; padding:12px; }.acd-banner { padding:16px; }
 .acd-banner .acd-large { width:44px; height:44px; font-size:16px; }.acd-banner>div:not(.acd-banner-actions) { min-width:130px; }
 .acd-list .acd-card { display:block; }
 #contactDirectorySurface button,#contactDirectorySurface .acd-icon,#contactDirectorySurface .acd-filters button,#contactDirectorySurface .acd-layout button { min-height:44px; }
 #contactDirectorySurface .acd-icon { width:44px; }
}
/* The directory has its own counts; omit the two redundant record bars. */
main:has(.contact-book-mode) > #summaryStrip,
.contact-book-mode .list-panel > .panel-head { display:none !important; }
.acd-within-search { display:flex; align-items:center; flex-wrap:wrap; gap:8px 12px; padding:10px 14px; border-bottom:1px solid #eaede6; background:#fafbf8; }
.acd-within-search>label { font-size:11px; font-weight:600; color:#526c60; }
.acd-within-search>div { display:flex; flex:1; min-width:180px; background:#fff; border:1px solid #dee3dc; border-radius:8px; overflow:hidden; }
.acd-within-search input { width:100%; min-width:0; border:0; background:transparent; box-shadow:none; padding:8px 10px; font-size:14px; min-height:40px; }
#contactDirectorySurface .acd-within-search button { border:0; background:transparent; min-width:36px; padding:5px; font-size:18px; }
.acd-within-search>span { font-size:11px; color:#748078; white-space:nowrap; }
@container(max-width:620px) { .acd-within-search>div { flex-basis:100%; } .acd-within-search input { font-size:16px; min-height:44px; } }

/* Company cards grow with wrapped names instead of inheriting toolbar height. */
#contactDirectorySurface .acd-companies button {
  height:auto;min-height:60px;flex-shrink:0;padding:10px;
  gap:10px;white-space:normal;line-height:1.4;
}
#contactDirectorySurface .acd-company-text {display:grid;gap:4px;align-content:center;}
#contactDirectorySurface .acd-company-text strong {margin:0;line-height:1.4;}
#contactDirectorySurface .acd-company-text small {margin:0;line-height:1.4;}
#contactDirectorySurface .acd-count {flex:none;align-self:center;line-height:1.4;}

/* Contact identities are flexible card headings, not fixed-height toolbar buttons. */
#contactDirectorySurface .acd-card {
  display:flex;flex-direction:column;gap:0;padding:16px;
}
#contactDirectorySurface .acd-person-heading {
  --th-btn-bg:transparent;--th-btn-border:transparent;
  display:grid;grid-template-columns:38px minmax(0,1fr);gap:12px;
  height:auto;min-height:64px;max-height:none;padding:4px 0;
  align-items:start;white-space:normal;line-height:1.4;
  border:0!important;box-shadow:none!important;border-radius:0!important;
}
#contactDirectorySurface .acd-person-heading:hover {
  background:transparent!important;box-shadow:none!important;
}
#contactDirectorySurface .acd-person-heading>span:last-child {min-width:0;align-self:center;}
#contactDirectorySurface .acd-person-heading strong {margin:0;line-height:1.4;white-space:normal;overflow-wrap:anywhere;}
#contactDirectorySurface .acd-person-heading small {margin:4px 0 0;line-height:1.4;}
#contactDirectorySurface .acd-card dl {flex:1;margin:12px 0 16px;}
#contactDirectorySurface .acd-card dl>div {margin:0 0 10px;align-items:baseline;line-height:1.5;}
#contactDirectorySurface .acd-card dl>div:last-child {margin-bottom:0;}
#contactDirectorySurface .acd-card footer {margin-top:auto;flex-wrap:wrap;min-height:56px;}
#contactDirectorySurface .acd-card footer>button {margin-left:auto;}
#contactDirectorySurface .acd-quick {flex-wrap:wrap;}
#contactDirectorySurface .acd-list .acd-card {display:grid;grid-template-columns:minmax(120px,1fr) minmax(130px,1fr);gap:12px;}
@container(max-width:620px) {
 #contactDirectorySurface .acd-list .acd-card {display:flex;}
}