/* Business accounts and one item to several addresses (includes/companies.php, includes/shipments.php): the job page's
   company line, a line's shipments and "Share with your team"; My account > Company. Built from job.css's and hub.css's
   pieces. Mobile first: one column, targets at least 44 px, nothing wider than the screen. */

.hp-jobpage__company { margin: 0.75rem 0 0; font-size: 0.9375rem; line-height: 1.5; color: var(--j-quiet, #6E6E73); overflow-wrap: anywhere; }

/* A line shipped to several addresses: each part, how many, where, where it stands. */
.hp-line__shipments { list-style: none; margin: 0.75rem 0 0; padding: 0; display: grid; gap: 0.6rem; }
.hp-shipment { display: grid; gap: 0.15rem; padding-left: 0.85rem; border-left: 2px solid var(--j-line-strong, #D2D2D7); font-size: 0.9375rem; line-height: 1.45; min-width: 0; }
.hp-shipment__head { color: var(--j-body, #3A3A3E); overflow-wrap: anywhere; }
.hp-shipment__qty { font-weight: 600; color: var(--j-ink, #1D1D1F); font-variant-numeric: tabular-nums; }
.hp-shipment__status { color: var(--j-quiet, #6E6E73); overflow-wrap: anywhere; }
.hp-shipment__status a { display: inline-flex; align-items: center; min-height: 44px; color: var(--j-brand, #5B46C7); font-weight: 500; text-decoration: none; }
.hp-shipment__status a:hover { text-decoration: underline; text-underline-offset: 0.2em; }

/* Share with your team. */
.hp-share__lede { margin: 0.35rem 0 0.75rem; line-height: 1.5; color: var(--j-quiet, #6E6E73); }
.hp-share__rows { list-style: none; margin: 0; padding: 0; }
.hp-share__row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1rem; padding: 0.25rem 0; min-width: 0; }
.hp-share__row + .hp-share__row { border-top: 1px solid var(--j-line, #E8E8ED); }
.hp-share__who { min-width: 0; overflow-wrap: anywhere; color: var(--j-ink, #1D1D1F); }
.hp-share__on, .hp-company__tag { display: inline-block; margin-left: 0.35rem; padding: 0.1rem 0.55rem; border-radius: 999px; font-size: 0.8125rem; font-weight: 500; color: var(--j-brand, #5B46C7); background: var(--j-soft, #EDE9FC); }
.hp-share__form { margin: 0; }
.hp-share__button { display: inline-flex; align-items: center; min-height: 44px; padding: 0; background: none; border: 0; font: inherit; font-weight: 500; color: var(--j-brand, #5B46C7); cursor: pointer; }
.hp-share__button:hover { text-decoration: underline; text-underline-offset: 0.2em; }
.hp-share__note { margin: 0 0 0.5rem; color: var(--j-ink, #1D1D1F); }
.hp-share__empty { margin: 0; color: var(--j-quiet, #6E6E73); }
/* Under "Ships to" on an order split across addresses (address-change.php, review M82). */
.hp-addr__split { margin: 0.5rem 0 0; font-size: 0.9375rem; line-height: 1.5; color: var(--j-quiet, #6E6E73); overflow-wrap: anywhere; }

/* My account > Company. */
.hp-company__note { margin: 0; padding: 1rem 1.25rem; border-radius: 16px; background: var(--h-soft, #EDE9FC); color: var(--h-ink, #1D1D1F); line-height: 1.5; }
.hp-company__note--error { background: #FDECEC; }
/* The Company page's sections are h2 under the band's h1 (review M60), drawn as the hub's tile headings (hub.css, hub2.css). */
.hp-company .hp-hub__tile > h2 { margin: 0 0 0.75rem; font-size: 1.25rem; font-weight: 700; line-height: 1.2; letter-spacing: normal; color: var(--h-ink, #1D1D1F); }
.hp-shell__body .hp-company .hp-hub__tile > h2 { font-size: 19px; }
/* Words read aloud only (review M52): the person or company a button acts on. */
.hp-share .hp-sr, .hp-company .hp-sr, .hp-company__invite .hp-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.hp-company__facts { margin: 0; display: grid; }
.hp-company__facts > div { display: grid; gap: 0.1rem; padding: 0.6rem 0; }
.hp-company__facts > div + div { border-top: 1px solid var(--h-line, #E8E8ED); }
.hp-company__facts dt { margin: 0; color: var(--h-quiet, #6E6E73); }
.hp-company__facts dd { margin: 0; color: var(--h-ink, #1D1D1F); font-weight: 500; }
@media (min-width: 560px) {
  .hp-company__facts > div { grid-template-columns: minmax(0, 1fr) auto; column-gap: 1rem; }
  .hp-company__facts dd { text-align: right; }
}
.hp-company__line { margin: 0 0 1rem; line-height: 1.5; }
.hp-company__certs, .hp-company__people { list-style: none; margin: 0 0 1rem; padding: 0; }
.hp-company__certs li { display: grid; gap: 0.1rem; padding: 0.5rem 0; }
.hp-company__certs li + li, .hp-company__people li + li { border-top: 1px solid var(--h-line, #E8E8ED); }
.hp-company__certs a { display: inline-flex; align-items: center; min-height: 44px; color: var(--h-brand, #5B46C7); font-weight: 500; text-decoration: none; overflow-wrap: anywhere; }
.hp-company__meta { display: block; margin: 0; font-size: 0.9375rem; color: var(--h-quiet, #6E6E73); }
.hp-company__people li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0 1rem; min-height: 44px; padding: 0.25rem 0; }
.hp-company__people form { margin: 0; }
.hp-company__who { min-width: 0; overflow-wrap: anywhere; color: var(--h-ink, #1D1D1F); }
.hp-company__form { display: grid; gap: 0.5rem; max-width: 28rem; }
.hp-company__form label { font-weight: 500; color: var(--h-ink, #1D1D1F); margin-top: 0.25rem; }
.hp-company__form input[type="email"], .hp-company__form input[type="date"], .hp-company__form select, .hp-company__form input[type="file"] {
  box-sizing: border-box; width: 100%; min-height: 48px; padding: 0.7rem 1rem; font: inherit; color: var(--h-ink, #1D1D1F);
  background: var(--wp--preset--color--surface, #fff); border: 1px solid var(--wp--preset--color--line-strong, #D2D2D7); border-radius: 12px;
}
.hp-company__form input:focus, .hp-company__form select:focus { outline: none; border-color: var(--h-ink, #1D1D1F); box-shadow: 0 0 0 3px var(--h-soft, #EDE9FC); }
.hp-company__add { margin-top: 0.5rem; }
/* The certificate's file: the site's pill, not the browser's grey button. */
.hp-company__form input[type="file"] { min-height: 48px; padding: 0; border: 0; border-radius: 0; background: none; color: var(--h-quiet, #6E6E73); font-size: 0.9375rem; cursor: pointer; }
.hp-company__form input[type="file"]::file-selector-button { min-height: 44px; margin: 0 0.75rem 0 0; padding: 0.6rem 1.25rem; border: 1px solid var(--wp--preset--color--line-strong, #D2D2D7); border-radius: 999px; font: inherit; font-weight: 500; color: var(--h-ink, #1D1D1F); background: var(--wp--preset--color--surface, #fff); cursor: pointer; transition: border-color 160ms ease, background-color 160ms ease; }
.hp-company__form input[type="file"]:hover::file-selector-button { border-color: var(--h-ink, #1D1D1F); background: var(--h-soft, #EDE9FC); }
.hp-company__form input[type="file"]:focus-visible { outline: none; }
.hp-company__form input[type="file"]:focus-visible::file-selector-button { box-shadow: 0 0 0 3px var(--h-soft, #EDE9FC); border-color: var(--h-ink, #1D1D1F); }

/* An invitation on the account's front page: Join, or No thanks. */
.hp-company__invites { margin-bottom: 1rem; }
.hp-company__invite h3 { margin: 0 0 0.5rem; }
.hp-company__answer { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 1.25rem; }
.hp-company__answer form { margin: 0; }
.hp-company__answer .hp-signin__button { margin-top: 0; }
.hp-hub > .hp-company__note, .woocommerce-MyAccount-content > .hp-company__note { margin-bottom: 1rem; }

/* Ship to more than one address, under the cart (includes/shipments.php): closed until asked for. */
.hp-split { --s-ink: var(--wp--preset--color--ink, #1D1D1F); --s-quiet: var(--wp--preset--color--quiet, #6E6E73); --s-line: var(--wp--preset--color--line-strong, #D2D2D7); --s-brand: var(--wp--preset--color--brand-deep, #5B46C7); --s-soft: var(--wp--preset--color--brand-soft, #EDE9FC);
  margin: var(--wp--preset--spacing--50, 2.5rem) 0 0; padding: 1.25rem; background: var(--wp--preset--color--tile, #F5F5F7); border-radius: 24px; color: var(--wp--preset--color--body, #3A3A3E); min-width: 0; }
.hp-split h2 { margin: 0 0 0.5rem; font-size: 1.25rem; font-weight: 700; color: var(--s-ink); }
.hp-split p { margin: 0; line-height: 1.5; }
.hp-split summary { display: flex; align-items: center; min-height: 44px; font-size: 1.0625rem; font-weight: 600; color: var(--s-ink); cursor: pointer; list-style: none; }
.hp-split summary::-webkit-details-marker { display: none; }
.hp-split summary::after { content: " \203A"; margin-left: 0.35em; color: var(--s-brand); transition: transform 160ms ease; }
.hp-split details[open] summary::after { transform: rotate(90deg); }
.hp-split__lede { margin: 0.25rem 0 1rem !important; color: var(--s-quiet); }
.hp-split__error { margin: 0 0 1rem !important; padding: 0.75rem 1rem; border-radius: 12px; background: #FDECEC; color: var(--s-ink); }
.hp-split__form { display: grid; gap: 0.5rem; max-width: 36rem; }
.hp-split__trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.hp-split fieldset { margin: 0 0 0.75rem; padding: 1rem; border: 0; border-radius: 16px; background: var(--wp--preset--color--surface, #fff); display: grid; gap: 0.4rem; min-width: 0; }
.hp-split fieldset[hidden] { display: none; }
.hp-split legend { float: left; width: 100%; margin: 0 0 0.25rem; padding: 0; font-weight: 700; color: var(--s-ink); }
.hp-split label { font-weight: 500; color: var(--s-ink); margin-top: 0.25rem; }
.hp-split input, .hp-split select, .hp-split textarea { box-sizing: border-box; width: 100%; min-height: 48px; padding: 0.7rem 1rem; font: inherit; color: var(--s-ink); background: var(--wp--preset--color--surface, #fff); border: 1px solid var(--s-line); border-radius: 12px; }
.hp-split input:focus, .hp-split select:focus, .hp-split textarea:focus { outline: none; border-color: var(--s-ink); box-shadow: 0 0 0 3px var(--s-soft); }
/* A field the error is about (review S32). */
.hp-split [aria-invalid="true"] { border-color: #C9302C; border-width: 2px; }
.hp-split__row { display: grid; gap: 0.4rem; }
.hp-split__row > span { display: grid; gap: 0.4rem; min-width: 0; }
.hp-split__count { display: grid; gap: 0.4rem; }
.hp-split__more { justify-self: start; display: inline-flex; align-items: center; min-height: 44px; padding: 0; background: none; border: 0; font: inherit; font-weight: 500; color: var(--s-brand); cursor: pointer; }
.hp-split__more[hidden] { display: none; }
.hp-split__send { justify-self: start; display: inline-flex; align-items: center; justify-content: center; min-height: 48px; margin-top: 0.75rem; padding: 0.75rem 1.5rem; border: 0; border-radius: 999px; font: inherit; font-weight: 500; color: #fff; background: var(--s-ink); cursor: pointer; transition: background-color 160ms ease; }
.hp-split__send:hover, .hp-split__send:focus-visible { background: var(--s-brand); }
@media (min-width: 640px) {
  .hp-split { padding: 1.75rem; }
  .hp-split__row { grid-template-columns: minmax(0, 2fr) minmax(0, 1.4fr) minmax(0, 1fr); gap: 0.75rem; }
}