/* [project]/apps/web/app/globals.css [app-client] (css) */
@layer theme {
  :root, :host {
    --font-sans: Arial, Helvetica, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
      "Courier New", monospace;
    --default-font-family: var(--font-sans);
    --default-mono-font-family: var(--font-mono);
    --color-ink: #13243a;
    --color-surface: #fffdf8;
    --color-canvas: #f1efe7;
    --color-accent: #a57425;
    --color-line: #d8d4c8;
    --color-muted: #516074;
    --radius-card: 1.25rem;
  }
}

@layer base {
  *, :after, :before, ::backdrop {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  ::file-selector-button {
    box-sizing: border-box;
    border: 0 solid;
    margin: 0;
    padding: 0;
  }

  html, :host {
    -webkit-text-size-adjust: 100%;
    tab-size: 4;
    line-height: 1.5;
    font-family: var(--default-font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings: var(--default-font-feature-settings, normal);
    font-variation-settings: var(--default-font-variation-settings, normal);
    -webkit-tap-highlight-color: transparent;
  }

  hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
  }

  abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
  }

  h1, h2, h3, h4, h5, h6 {
    font-size: inherit;
    font-weight: inherit;
  }

  a {
    color: inherit;
    -webkit-text-decoration: inherit;
    -webkit-text-decoration: inherit;
    text-decoration: inherit;
  }

  b, strong {
    font-weight: bolder;
  }

  code, kbd, samp, pre {
    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings: var(--default-mono-font-feature-settings, normal);
    font-variation-settings: var(--default-mono-font-variation-settings, normal);
    font-size: 1em;
  }

  small {
    font-size: 80%;
  }

  sub, sup {
    vertical-align: baseline;
    font-size: 75%;
    line-height: 0;
    position: relative;
  }

  sub {
    bottom: -.25em;
  }

  sup {
    top: -.5em;
  }

  table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
  }

  :-moz-focusring:where(:not(iframe)) {
    outline: auto;
  }

  progress {
    vertical-align: baseline;
  }

  summary {
    display: list-item;
  }

  ol, ul, menu {
    list-style: none;
  }

  img, svg, video, canvas, audio, iframe, embed, object {
    vertical-align: middle;
    display: block;
  }

  img, video {
    max-width: 100%;
    height: auto;
  }

  button, input, select, optgroup, textarea {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  ::file-selector-button {
    font: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    letter-spacing: inherit;
    color: inherit;
    opacity: 1;
    background-color: #0000;
    border-radius: 0;
  }

  :where(select:is([multiple], [size])) optgroup {
    font-weight: bolder;
  }

  :where(select:is([multiple], [size])) optgroup option {
    padding-inline-start: 20px;
  }

  ::file-selector-button {
    margin-inline-end: 4px;
  }

  ::placeholder {
    opacity: 1;
  }

  @supports (not ((-webkit-appearance: -apple-pay-button))) or (contain-intrinsic-size: 1px) {
    ::placeholder {
      color: currentColor;
    }

    @supports (color: color-mix(in lab, red, red)) {
      ::placeholder {
        color: color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }

  textarea {
    resize: vertical;
  }

  ::-webkit-search-decoration {
    -webkit-appearance: none;
  }

  ::-webkit-date-and-time-value {
    min-height: 1lh;
    text-align: inherit;
  }

  ::-webkit-datetime-edit {
    display: inline-flex;
  }

  ::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
  }

  ::-webkit-datetime-edit {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-year-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-month-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-day-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-hour-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-minute-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-second-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-millisecond-field {
    padding-block: 0;
  }

  ::-webkit-datetime-edit-meridiem-field {
    padding-block: 0;
  }

  ::-webkit-calendar-picker-indicator {
    line-height: 1;
  }

  :-moz-ui-invalid {
    box-shadow: none;
  }

  button, input:where([type="button"], [type="reset"], [type="submit"]) {
    appearance: button;
  }

  ::file-selector-button {
    appearance: button;
  }

  ::-webkit-inner-spin-button {
    height: auto;
  }

  ::-webkit-outer-spin-button {
    height: auto;
  }

  [hidden]:where(:not([hidden="until-found"])) {
    display: none !important;
  }
}

@layer components, utilities;

* {
  box-sizing: border-box;
}

body {
  background: var(--color-canvas);
  color: var(--color-ink);
  font-family: var(--font-sans);
  margin: 0;
}

button, input {
  font: inherit;
}

.page-shell {
  width: min(72rem, 100%);
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) clamp(1rem, 5vw, 4rem);
}

.hero {
  max-width: 52rem;
  margin-bottom: 2.5rem;
}

.eyebrow {
  color: var(--color-accent);
  letter-spacing: .14em;
  text-transform: uppercase;
  margin: 0 0 .75rem;
  font-size: .78rem;
  font-weight: 800;
}

h1 {
  letter-spacing: -.05em;
  max-width: 17ch;
  margin: 0;
  font-size: clamp(2.4rem, 7vw, 5rem);
  line-height: .98;
}

h2, h3 {
  letter-spacing: -.025em;
  margin: 0;
}

.intro {
  color: #516074;
  max-width: 44rem;
  margin: 1.25rem 0 0;
  font-size: 1.05rem;
  line-height: 1.6;
}

.notice {
  border-left: 4px solid var(--color-accent);
  background: #fff8e8;
  padding: .9rem 1rem;
}

.auth-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  display: grid;
}

.panel, .account-bar {
  border-radius: var(--radius-card);
  background: var(--color-surface);
  border: 1px solid #d9d4c8;
  box-shadow: 0 1rem 3rem #13243a12;
}

.panel {
  padding: clamp(1.25rem, 4vw, 2rem);
}

.auth-form {
  gap: 1rem;
  display: grid;
}

label {
  color: #435268;
  gap: .45rem;
  font-size: .9rem;
  font-weight: 700;
  display: grid;
}

input {
  width: 100%;
  color: var(--color-ink);
  background: #fff;
  border: 1px solid #bbb5a8;
  border-radius: .7rem;
  padding: .8rem .9rem;
}

input:focus {
  border-color: var(--color-accent);
  outline: 3px solid #a5742533;
}

.hint, .empty, .organization p {
  color: #657185;
  margin: 0;
  font-size: .86rem;
  line-height: 1.5;
}

.button {
  background: var(--color-ink);
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: .7rem;
  justify-self: start;
  padding: .78rem 1rem;
  font-weight: 800;
}

.button:hover {
  background: #2b405b;
}

.button.secondary {
  color: var(--color-ink);
  background: none;
  border: 1px solid #cfc9bc;
}

.dashboard {
  gap: 1rem;
  display: grid;
}

.account-bar {
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.25rem;
  display: flex;
}

.account-bar div {
  gap: .2rem;
  display: grid;
}

.account-bar span {
  color: #657185;
  font-size: .8rem;
}

.panel-heading {
  margin-bottom: 1.25rem;
}

.inline-form {
  border-bottom: 1px solid #e2ded5;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: .75rem;
  padding-bottom: 1.5rem;
  display: grid;
}

.organization-list {
  gap: .75rem;
  padding-top: 1.25rem;
  display: grid;
}

.organization {
  background: #f5f2e9;
  border-radius: .8rem;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  display: flex;
}

.organization h3 {
  margin-bottom: .25rem;
}

.role {
  color: #714b0d;
  text-transform: uppercase;
  background: #e7dcc6;
  border-radius: 999px;
  padding: .3rem .65rem;
  font-size: .75rem;
  font-weight: 800;
}

@media (max-width: 700px) {
  .auth-grid, .inline-form {
    grid-template-columns: 1fr;
  }

  .account-bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

select, textarea {
  width: 100%;
  color: var(--color-ink);
  font: inherit;
  background: #fff;
  border: 1px solid #bbb5a8;
  border-radius: .7rem;
  padding: .8rem .9rem;
}

.company-admin {
  margin-top: 2rem;
}

.section-heading {
  margin-bottom: 1rem;
}

.company-layout {
  grid-template-columns: minmax(15rem, .75fr) minmax(0, 1.75fr);
  align-items: start;
  gap: 1rem;
  display: grid;
}

.company-sidebar, .company-content, .stack-form {
  gap: 1rem;
  display: grid;
}

.company-picker {
  border-top: 1px solid #e2ded5;
  gap: .5rem;
  padding-top: 1rem;
  display: grid;
}

.company-picker button {
  color: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 1px solid #d9d4c8;
  border-radius: .7rem;
  gap: .2rem;
  padding: .8rem;
  display: grid;
}

.company-picker button.selected {
  border-color: var(--color-accent);
  background: #fff8e8;
}

.company-picker span {
  color: #657185;
  font-size: .76rem;
}

.form-title, .row-actions {
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  display: flex;
}

.form-title a, .back-link, .profile-grid a {
  color: #855d1e;
  font-weight: 700;
}

.field-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  display: grid;
}

fieldset {
  border: 1px solid #d9d4c8;
  border-radius: .7rem;
  margin: 0;
  padding: 1rem;
}

legend {
  color: #435268;
  padding: 0 .35rem;
  font-size: .9rem;
  font-weight: 800;
}

.type-options {
  flex-wrap: wrap;
  gap: .8rem;
  display: flex;
}

.check {
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: .45rem;
  display: flex;
}

.check input {
  width: auto;
}

.location-list {
  gap: .65rem;
  margin: 1rem 0 1.5rem;
  display: grid;
}

.location {
  background: #f5f2e9;
  border-radius: .75rem;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem;
  display: flex;
}

.location p {
  color: #657185;
  margin: .3rem 0 0;
  font-size: .82rem;
}

.row-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-start;
}

.row-actions button {
  color: #855d1e;
  cursor: pointer;
  background: none;
  border: 0;
  font-weight: 700;
}

.location-form {
  border-top: 1px solid #e2ded5;
  padding-top: 1.25rem;
}

.location-form h4 {
  margin: 0;
}

.empty-state {
  color: #657185;
}

.provider-page {
  min-height: 100svh;
  padding: clamp(1.5rem, 5vw, 4rem);
}

.provider-profile {
  background: var(--color-surface);
  border: 1px solid #d9d4c8;
  border-radius: 1.5rem;
  width: min(62rem, 100%);
  margin: 2rem auto;
  padding: clamp(1.5rem, 5vw, 4rem);
}

.provider-profile h1 {
  max-width: 18ch;
}

.profile-badges {
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1.25rem;
  display: flex;
}

.profile-badges span {
  color: #714b0d;
  background: #e7dcc6;
  border-radius: 999px;
  padding: .4rem .7rem;
  font-size: .78rem;
  font-weight: 800;
}

.provider-description {
  color: #435268;
  max-width: 52rem;
  margin: 2rem 0;
  font-size: 1.1rem;
  line-height: 1.7;
}

.profile-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  display: grid;
}

.profile-grid section {
  background: #f5f2e9;
  border-radius: 1rem;
  padding: 1.25rem;
}

.profile-grid h2 {
  margin-bottom: 1rem;
}

.profile-grid address {
  font-style: normal;
  line-height: 1.6;
}

@media (max-width: 820px) {
  .company-layout, .field-grid, .profile-grid {
    grid-template-columns: 1fr;
  }

  .location {
    flex-direction: column;
  }

  .row-actions {
    justify-content: flex-start;
  }
}

.public-nav, .account-actions {
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: 1.25rem;
  display: flex;
}

.public-nav a {
  color: var(--color-ink);
  border: 1px solid #cfc9bc;
  border-radius: 999px;
  padding: .55rem .8rem;
  font-weight: 800;
  text-decoration: none;
}

.account-actions {
  margin-top: 0;
}

.account-actions a {
  text-decoration: none;
}

.catalog-page {
  width: min(76rem, 100%);
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(2rem, 6vw, 5rem) clamp(1rem, 5vw, 4rem);
}

.catalog-hero {
  max-width: 52rem;
  margin: 1.5rem 0 3rem;
}

.catalog-hero h1, .manufacturer-header h1, .product-summary h1 {
  max-width: 18ch;
}

.product-grid, .manufacturer-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  display: grid;
}

.product-grid.compact {
  margin-top: 1rem;
}

.product-card, .manufacturer-card {
  background: var(--color-surface);
  color: inherit;
  border: 1px solid #d9d4c8;
  border-radius: 1.1rem;
  text-decoration: none;
  overflow: hidden;
  box-shadow: 0 1rem 3rem #13243a0f;
}

.product-card > div:last-child, .manufacturer-card {
  padding: 1.25rem;
}

.product-card h2, .product-card h3, .manufacturer-card h2 {
  margin: .35rem 0 .65rem;
}

.product-card p, .manufacturer-card p {
  color: #58667a;
  line-height: 1.55;
}

.product-card strong {
  color: #855d1e;
  margin-top: 1rem;
  display: block;
}

.card-meta {
  text-transform: uppercase;
  margin: 0;
  font-size: .75rem;
  font-weight: 800;
  color: var(--color-accent) !important;
}

.media-placeholder, .product-gallery-placeholder {
  color: #657185;
  letter-spacing: .08em;
  text-transform: uppercase;
  background: linear-gradient(135deg, #d8d2c5, #f5f2e9);
  place-items: center;
  min-height: 11rem;
  font-size: .8rem;
  font-weight: 800;
  display: grid;
}

.product-detail {
  grid-template-columns: 1.1fr 1fr;
  gap: 1.25rem;
  margin-top: 2rem;
  display: grid;
}

.product-gallery-placeholder {
  border-radius: 1.2rem;
  min-height: 30rem;
}

.product-summary, .detail-section, .future-comparison, .manufacturer-header {
  background: var(--color-surface);
  border: 1px solid #d9d4c8;
  border-radius: 1.2rem;
  padding: clamp(1.4rem, 4vw, 2.5rem);
}

.model {
  color: #657185;
  font-weight: 700;
}

.lead {
  color: #435268;
  font-size: 1.1rem;
  line-height: 1.65;
}

.price {
  color: #855d1e;
  font-size: 1.35rem;
  font-weight: 900;
}

.detail-section {
  grid-column: 1 / -1;
}

.detail-section > p {
  line-height: 1.7;
}

.attribute-list {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .5rem 1.5rem;
  display: grid;
}

.attribute-list div, .variant-list li {
  border-bottom: 1px solid #e2ded5;
  justify-content: space-between;
  gap: 1rem;
  padding: .75rem 0;
  display: flex;
}

.attribute-list dt {
  font-weight: 800;
}

.attribute-list dd {
  color: #58667a;
  margin: 0;
}

.variant-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.variant-list span {
  color: #657185;
}

.future-comparison {
  background: #fff8e8;
  border-color: #c8a96c;
  grid-column: 1 / -1;
}

.manufacturer-header {
  margin: 2rem 0;
}

.manufacturer-header > a {
  color: #855d1e;
  font-weight: 800;
}

.admin-catalog {
  max-width: 90rem;
}

.admin-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1rem;
  display: grid;
}

@media (max-width: 900px) {
  .product-grid, .manufacturer-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-detail {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .product-grid, .manufacturer-grid, .admin-grid, .attribute-list {
    grid-template-columns: 1fr;
  }
}

.portfolio-panel, .portfolio-list, .portfolio-products {
  gap: 1rem;
  display: grid;
}

.portfolio-list article {
  background: #f5f2e9;
  border-radius: .75rem;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: .8rem;
  display: flex;
}

.portfolio-list article > button:first-child {
  color: inherit;
  cursor: pointer;
  text-align: left;
  background: none;
  border: 0;
  flex: 1;
  gap: .2rem;
  display: grid;
}

.portfolio-list span, .product-toggle small {
  color: #657185;
}

.text-danger {
  color: #9a3c2f;
  cursor: pointer;
  background: none;
  border: 0;
  font-weight: 800;
}

.portfolio-products {
  border-top: 1px solid #e2ded5;
  padding-top: 1rem;
}

.portfolio-products h4 {
  margin: 0;
}

.product-toggle {
  border: 1px solid #e2ded5;
  border-radius: .7rem;
  grid-template-columns: 1fr auto;
  justify-content: space-between;
  align-items: center;
  padding: .75rem;
  display: flex;
}

.product-toggle span {
  gap: .2rem;
  display: grid;
}

.product-toggle input {
  width: 1.2rem;
  height: 1.2rem;
}

.provider-matcher {
  background: var(--color-ink);
  color: #fff;
  border-radius: 1.2rem;
  grid-column: 1 / -1;
  gap: 1.25rem;
  padding: clamp(1.4rem, 4vw, 2.5rem);
  display: grid;
}

.provider-matcher .eyebrow {
  color: #d9b875;
}

.provider-matcher > div > p:last-child {
  color: #c6cfdb;
}

.matcher-form {
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  align-items: end;
  gap: .75rem;
  display: grid;
}

.matcher-form label {
  color: #e6eaf0;
}

.match-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  display: grid;
}

.provider-match {
  color: var(--color-ink);
  background: #fff;
  border-radius: 1rem;
  padding: 1.25rem;
}

.provider-match p {
  color: #58667a;
  line-height: 1.5;
}

.provider-match .profile-badges {
  margin-top: .8rem;
}

.verified {
  color: #21643c;
  background: #dff2e7;
  border-radius: 999px;
  padding: .3rem .55rem;
  font-size: .72rem;
  font-weight: 900;
}

.match-reason {
  font-size: .8rem;
}

.match-actions {
  flex-wrap: wrap;
  gap: .6rem;
  margin-top: 1rem;
  display: flex;
}

.match-actions a {
  text-decoration: none;
}

.match-actions button {
  color: #7a8493;
  background: #f1efe7;
  border: 1px solid #d9d4c8;
  border-radius: .7rem;
  padding: .7rem .9rem;
}

.provider-portfolio {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 2rem;
  display: grid;
}

.provider-portfolio > div {
  background: #f5f2e9;
  border-radius: 1rem;
  padding: 1.25rem;
}

.portfolio-chips, .portfolio-product-links {
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1rem;
  display: flex;
}

.portfolio-chips a, .portfolio-product-links a {
  color: #714b0d;
  background: #e7dcc6;
  border-radius: 999px;
  padding: .45rem .7rem;
  font-weight: 800;
  text-decoration: none;
}

@media (max-width: 900px) {
  .matcher-form {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .matcher-form, .match-grid, .provider-portfolio {
    grid-template-columns: 1fr;
  }
}

.inquiry-page {
  max-width: 72rem;
}

.inquiry-wizard {
  gap: 1.25rem;
  margin-top: 2rem;
  display: grid;
}

.progress {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: .45rem;
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
}

.progress li {
  color: #7a8493;
  text-align: center;
  gap: .4rem;
  font-size: .72rem;
  font-weight: 800;
  display: grid;
}

.progress li:before {
  content: "";
  background: #d9d4c8;
  border-radius: 999px;
  height: .3rem;
}

.progress li.active, .progress li.done {
  color: var(--color-accent);
}

.progress li.active:before, .progress li.done:before {
  background: var(--color-accent);
}

.progress li span {
  display: none;
}

.wizard-step, .success-card {
  background: var(--color-surface);
  border: 1px solid #d9d4c8;
  border-radius: 1.25rem;
  padding: clamp(1.4rem, 5vw, 3.5rem);
  box-shadow: 0 1.25rem 3rem #25304114;
}

.wizard-step > h1, .wizard-step > h2, .success-card h1 {
  max-width: 48rem;
}

.form-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.5rem 0;
  display: grid;
}

.wizard-step label:not(.check):not(.consent) {
  color: #435268;
  gap: .45rem;
  font-weight: 750;
  display: grid;
}

.wizard-step input, .wizard-step textarea {
  width: 100%;
  color: var(--color-ink);
  font: inherit;
  background: #fff;
  border: 1px solid #c9c4b8;
  border-radius: .7rem;
  padding: .78rem .9rem;
}

.wizard-step textarea {
  resize: vertical;
  min-height: 8rem;
}

.choice-row {
  border: 0;
  flex-wrap: wrap;
  gap: 1rem;
  margin: 1.5rem 0;
  padding: 0;
  display: flex;
}

.choice-row legend {
  width: 100%;
  margin-bottom: .4rem;
  font-weight: 850;
}

.choice-row label, .check {
  color: var(--color-ink);
  background: #faf8f3;
  border: 1px solid #d9d4c8;
  border-radius: .75rem;
  align-items: center;
  gap: .55rem;
  padding: .8rem 1rem;
  font-weight: 700;
  display: flex;
}

.choice-row input, .check input, .consent input {
  flex: 0 0 1.15rem;
  width: 1.15rem;
}

.wizard-actions, .product-actions {
  flex-wrap: wrap;
  justify-content: space-between;
  gap: .75rem;
  display: flex;
}

.product-actions {
  justify-content: flex-start;
  margin-top: 1.25rem;
}

.wizard-actions .button {
  text-decoration: none;
}

.summary-list {
  gap: 0;
  margin: 1.5rem 0;
  display: grid;
}

.summary-list div {
  border-bottom: 1px solid #e2ded5;
  grid-template-columns: minmax(8rem, .35fr) 1fr;
  gap: 1rem;
  padding: .8rem 0;
  display: grid;
}

.summary-list dt {
  font-weight: 850;
}

.summary-list dd {
  color: #58667a;
  margin: 0;
}

.consent {
  background: #fff8e8;
  border-radius: .8rem;
  align-items: flex-start;
  gap: .75rem;
  padding: 1rem;
  line-height: 1.55;
  display: flex;
}

.notice.error {
  color: #8a3025;
  background: #fff1ef;
  border-color: #e6b6ae;
}

.success-page {
  place-items: center;
  min-height: 80vh;
  display: grid;
}

.success-card {
  max-width: 46rem;
}

.reference {
  background: #f5f2e9;
  border-radius: .75rem;
  margin: 2rem 0;
  padding: 1rem;
}

@media (max-width: 700px) {
  .progress li {
    font-size: 0;
  }

  .progress li span {
    font-size: .72rem;
    display: block;
  }

  .form-grid {
    grid-template-columns: 1fr;
  }

  .summary-list div {
    grid-template-columns: 1fr;
    gap: .2rem;
  }
}

.provider-inbox {
  max-width: 76rem;
}

.lead-list {
  gap: .8rem;
  margin-top: 2rem;
  display: grid;
}

.lead-card {
  background: var(--color-surface);
  color: inherit;
  border: 1px solid #d9d4c8;
  border-radius: 1rem;
  justify-content: space-between;
  gap: 1.5rem;
  padding: 1.25rem;
  text-decoration: none;
  transition: border-color .16s, transform .16s;
  display: flex;
}

.lead-card:hover {
  border-color: #b6904f;
  transform: translateY(-2px);
}

.lead-card h2 {
  margin: .65rem 0 .35rem;
}

.lead-card p, .lead-deadline span {
  color: #657185;
}

.lead-deadline {
  text-align: right;
  align-content: center;
  gap: .25rem;
  min-width: 13rem;
  display: grid;
}

.lead-status {
  color: #435268;
  text-transform: uppercase;
  background: #e9edf2;
  border-radius: 999px;
  padding: .35rem .65rem;
  font-size: .72rem;
  font-weight: 900;
  display: inline-flex;
}

.lead-status.sent, .lead-status.viewed {
  color: #805812;
  background: #fff0c7;
}

.lead-status.accepted {
  color: #21643c;
  background: #dff2e7;
}

.lead-status.rejected, .lead-status.expired, .lead-status.withdrawn {
  color: #8a3a30;
  background: #f1e2df;
}

.lead-detail {
  background: var(--color-surface);
  border: 1px solid #d9d4c8;
  border-radius: 1.25rem;
  margin-top: 2rem;
  padding: clamp(1.4rem, 4vw, 2.5rem);
}

.lead-detail > header {
  border-bottom: 1px solid #e2ded5;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 1.25rem;
  display: flex;
}

.lead-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 1rem;
  display: grid;
}

.lead-detail-grid > section {
  background: #f7f4ed;
  border-radius: .85rem;
  padding: 1.1rem;
}

.lead-detail-grid h2 {
  margin-top: 0;
  font-size: 1rem;
}

.requirements {
  grid-column: 1 / -1;
}

.requirements dl {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  display: grid;
}

.requirements dl div {
  border-bottom: 1px solid #ddd7cb;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem 0;
  display: flex;
}

.requirements dt {
  font-weight: 800;
}

.requirements dd {
  color: #58667a;
  margin: 0;
}

.contact-box address {
  gap: .4rem;
  font-style: normal;
  display: grid;
}

.contact-box a {
  color: #855d1e;
}

.lead-actions {
  gap: .75rem;
  margin-top: 1.25rem;
  display: flex;
}

@media (max-width: 700px) {
  .lead-card, .lead-detail > header {
    display: grid;
  }

  .lead-deadline {
    text-align: left;
    min-width: 0;
  }

  .lead-detail-grid, .requirements dl {
    grid-template-columns: 1fr;
  }
}

.customer-projects {
  max-width: 1180px;
}

.project-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 1rem;
  margin: 2rem 0;
  display: grid;
}

.project-card {
  color: inherit;
  border: 1px solid var(--color-line);
  background: var(--color-surface);
  border-radius: 18px;
  padding: 1.35rem;
  text-decoration: none;
  transition: transform .18s, box-shadow .18s;
  box-shadow: 0 12px 35px #16342f14;
}

.project-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 42px #16342f21;
}

.project-card-top {
  color: var(--color-muted);
  justify-content: space-between;
  gap: 1rem;
  font-size: .85rem;
  display: flex;
}

.project-card h2 {
  margin: .7rem 0 1rem;
}

.customer-status {
  border-left: 4px solid var(--color-accent);
  background: #f8f4ee;
  padding: .7rem 1rem;
}

@supports (color: color-mix(in lab, red, red)) {
  .customer-status {
    background: color-mix(in srgb, var(--color-accent) 8%, white);
  }
}

.customer-status {
  border-radius: 0 10px 10px 0;
}

.customer-status p, .provider-state, .last-activity {
  margin: .35rem 0 0;
}

.last-activity {
  color: var(--color-muted);
  font-size: .86rem;
}

.claim-panel {
  margin-top: 2.5rem;
}

.claim-form {
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.5fr) auto;
  align-items: end;
  gap: 1rem;
  display: grid;
}

.claim-form label {
  gap: .45rem;
  display: grid;
}

.project-detail-header {
  grid-template-columns: 1.3fr 1fr;
  align-items: end;
  gap: 1.5rem;
  margin: 1.5rem 0 2rem;
  display: grid;
}

.customer-status.prominent {
  padding: 1rem 1.2rem;
}

.customer-project-grid {
  grid-template-columns: 1.3fr 1fr;
  gap: 1.25rem;
  display: grid;
}

.project-requirements {
  gap: .6rem;
  margin: 1.2rem 0 0;
  display: grid;
}

.project-requirements div {
  border-bottom: 1px solid var(--color-line);
  grid-template-columns: 1fr 1fr;
  padding-bottom: .55rem;
  display: grid;
}

.project-requirements dt {
  color: var(--color-muted);
}

.project-requirements dd {
  margin: 0;
  font-weight: 650;
}

.provider-contact {
  gap: .4rem;
  display: grid;
}

.provider-contact h3, .provider-contact p {
  margin: 0 0 .5rem;
}

.project-timeline {
  margin-top: 1.25rem;
}

.project-timeline ol {
  margin: 1.5rem 0 0;
  padding: 0;
  list-style: none;
}

.project-timeline li {
  grid-template-columns: 18px 1fr;
  gap: .9rem;
  padding-bottom: 1.3rem;
  display: grid;
  position: relative;
}

.project-timeline li:before {
  content: "";
  background: var(--color-line);
  width: 2px;
  position: absolute;
  top: 12px;
  bottom: -4px;
  left: 6px;
}

.project-timeline li:last-child:before {
  display: none;
}

.project-timeline li > span {
  background: var(--color-accent);
  z-index: 1;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  margin-top: 4px;
}

.project-timeline li div {
  gap: .2rem;
  display: grid;
}

.project-timeline time {
  color: var(--color-muted);
  font-size: .85rem;
}

@media (max-width: 760px) {
  .claim-form, .project-detail-header, .customer-project-grid {
    grid-template-columns: 1fr;
  }

  .claim-form .button {
    width: 100%;
  }
}

/* [project]/apps/web/app/project-collaboration.css [app-client] (css) */
.collaboration-panel {
  margin-top: 1.25rem;
  overflow: hidden;
}

.collaboration-tabs {
  border-bottom: 1px solid var(--color-line);
  gap: .35rem;
  padding-bottom: .8rem;
  display: flex;
  overflow-x: auto;
}

.collaboration-tabs button {
  color: var(--color-muted);
  cursor: pointer;
  font: inherit;
  white-space: nowrap;
  background: none;
  border: 0;
  border-radius: 999px;
  padding: .65rem 1rem;
  font-weight: 750;
}

.collaboration-tabs button:hover, .collaboration-tabs button.active {
  background: var(--color-ink);
  color: #fff;
}

.collaboration-content {
  gap: 1.25rem;
  margin-top: 1.25rem;
  display: grid;
}

.message-thread, .project-file-list, .appointment-list, .quote-list {
  gap: .75rem;
  display: grid;
}

.project-message {
  background: #f2efe8;
  border-radius: 5px 16px 16px;
  justify-self: start;
  max-width: min(78%, 680px);
  padding: .9rem 1rem;
}

.project-message.own {
  background: color-mix(in srgb, var(--color-accent) 14%, white);
  border-radius: 16px 5px 16px 16px;
  justify-self: end;
}

.project-message p, .project-message time {
  margin: 0;
  display: block;
}

.project-message time {
  color: var(--color-muted);
  margin-top: .4rem;
  font-size: .78rem;
}

.collaboration-form {
  background: #f7f4ed;
  border-radius: 14px;
  gap: .8rem;
  padding: 1rem;
  display: grid;
}

.collaboration-form label {
  gap: .4rem;
  font-weight: 700;
  display: grid;
}

.collaboration-form input, .collaboration-form select, .collaboration-form textarea {
  border: 1px solid var(--color-line);
  width: 100%;
  color: inherit;
  font: inherit;
  background: #fff;
  border-radius: 9px;
  padding: .75rem;
}

.collaboration-form textarea {
  resize: vertical;
  min-height: 90px;
}

.collaboration-form .button {
  justify-self: start;
}

.file-form, .quote-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: end;
}

.project-file-list a, .appointment-list article, .quote-list article {
  border: 1px solid var(--color-line);
  color: inherit;
  border-radius: 12px;
  padding: 1rem;
  text-decoration: none;
}

.project-file-list a {
  justify-content: space-between;
  gap: 1rem;
  display: flex;
}

.project-file-list a:hover {
  border-color: var(--color-accent);
}

.project-file-list span, .quote-list .role {
  color: var(--color-muted);
  font-size: .85rem;
}

.quote-list article > div:first-child {
  justify-content: space-between;
  gap: 1rem;
  display: flex;
}

.inline-actions {
  flex-wrap: wrap;
  gap: .65rem;
  margin-top: .8rem;
  display: flex;
}

@media (max-width: 700px) {
  .file-form, .quote-form {
    grid-template-columns: 1fr;
  }

  .project-message {
    max-width: 92%;
  }

  .project-file-list a {
    display: grid;
  }
}

/*# sourceMappingURL=apps_web_app_0ouwlvs._.css.map*/