@charset "UTF-8";

/* ==========================================================================
   PIAȚA STOMATOLOGICĂ — PAGINI PUBLICE DIVERSE
   --------------------------------------------------------------------------
   Contact, idei, „Scoate de la Spam”, dezabonare, conversația pe un anunț,
   ecranele de cont nou (creare, identificare, rezultate, alegerea canalului
   pentru PIN, mulțumiri) și bun venit.

   Blocurile comune (panou, confirmare, stare goală, antet de pagină) vin din
   components/pagina.css; ecranele de cont nou folosesc cardul din auth.css.
   ========================================================================== */


/* ==========================================================================
   1. ELEMENTE COMUNE
   ========================================================================== */

/* --- listă de date de contact (contact, laborator, conversație) --------- */
.ps-lista-contact { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }

.ps-lista-contact > li {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  color: var(--ps-text);
  font: var(--ps-fw-medium) 14px/1.45 var(--ps-font-sans);
  overflow-wrap: anywhere;
}
.ps-lista-contact > li > .ps-icon-glyph {
  display: grid;
  place-items: center;
  inline-size: 36px;
  block-size: 36px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-surface);
  box-shadow: var(--ps-shadow-xs);
  color: var(--ps-green-action);
  font-size: 20px;
}
.ps-lista-contact > li > :not(.ps-icon-glyph) { align-self: center; }
.ps-lista-contact a { color: var(--ps-text); text-decoration: none; }
.ps-lista-contact a:hover { color: var(--ps-green-dark); text-decoration: underline; }

.ps-lista-contact a.ps-lista-contact__link {
  display: inline-flex;
  margin-inline-start: 4px;
  color: var(--ps-green-dark);
  font-weight: var(--ps-fw-semibold);
}
.ps-lista-contact__adresa { display: grid; gap: 2px; font-style: normal; }
.ps-lista-contact__adresa a.ps-lista-contact__link { margin-inline-start: 0; }

/* --- contor de caractere ---------------------------------------------------- */
.ps-numarator { display: block; text-align: end; font-variant-numeric: tabular-nums; }
.ps-numarator[data-ps-aproape] { color: var(--ps-warning); font-weight: var(--ps-fw-semibold); }

/* --- sugestie (bandă cu bec + acțiune) --------------------------------------- */
.ps-sugestie {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}
.ps-sugestie__pictograma,
.ps-thank-you__pictograma,
.ps-feedback__pictograma,
.ps-spam__sfat-pictograma {
  display: grid;
  place-items: center;
  inline-size: 44px;
  block-size: 44px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-primary);
  box-shadow: var(--ps-shadow-card-green);
  color: var(--ps-c-white);
  font-size: 24px;
}
.ps-sugestie__text { margin: 0; color: var(--ps-text); font: var(--ps-fw-medium) 15px/1.45 var(--ps-font-sans); }
@media (max-width: 767.98px) {
  .ps-sugestie { grid-template-columns: auto minmax(0, 1fr); }
  .ps-sugestie .ps-btn { grid-column: 1 / -1; white-space: normal; }
}


/* ==========================================================================
   2. CONTACT ȘI IDEI
   ========================================================================== */

.ps-contact__lateral { display: grid; gap: 20px; }

.ps-contact__legal { gap: 10px; }
.ps-contact__legal-titlu {
  margin: 0;
  color: var(--ps-text-faint-aa);
  font: var(--ps-fw-semibold) 12px/1.2 var(--ps-font-sans);
  letter-spacing: var(--ps-ls-caps);
  text-transform: uppercase;
}
.ps-contact__legal-lista { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.ps-contact__legal-lista a {
  color: var(--ps-text-ui);
  font: var(--ps-fw-medium) 14px/1.4 var(--ps-font-sans);
  text-decoration: none;
}
.ps-contact__legal-lista a:hover { color: var(--ps-green-dark); text-decoration: underline; }

.ps-feedback { display: grid; gap: 20px; }
.ps-feedback__antet { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 16px; }
.ps-feedback__antet > div { display: grid; gap: 6px; }


/* ==========================================================================
   3. „SCOATE DE LA SPAM”
   ========================================================================== */

.ps-spam {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
@media (max-width: 767.98px) { .ps-spam { grid-template-columns: 1fr; } }

.ps-spam__pasi {
  display: grid;
  gap: 12px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: ps-spam-pas;
}
.ps-spam__pasi > li {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  color: var(--ps-text);
  font: var(--ps-type-body);
  line-height: 1.5;
  counter-increment: ps-spam-pas;
}
.ps-spam__pasi > li::before {
  content: counter(ps-spam-pas);
  display: grid;
  place-items: center;
  inline-size: 32px;
  block-size: 32px;
  border-radius: 50%;
  background: var(--ps-primary-soft);
  color: var(--ps-green-dark);
  font: var(--ps-fw-bold) 14px/1 var(--ps-font-sans);
}

.ps-spam__sfat {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
}
.ps-spam__sfat p { margin: 0; font: var(--ps-fw-medium) 15px/1.5 var(--ps-font-sans); }


/* ==========================================================================
   4. DEZABONARE
   ========================================================================== */

.ps-dezabonare { display: grid; gap: 12px; margin-block-end: clamp(40px, 6vw, 80px); text-align: center; }

.ps-dezabonare__detaliu {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  margin: 0;
  padding: 12px 16px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-surface-tint);
  color: var(--ps-text);
  font: var(--ps-type-body);
  text-align: start;
}
.ps-dezabonare__detaliu .ps-icon-glyph { color: var(--ps-green-action); font-size: 20px; }
.ps-dezabonare__nota { margin: 0; color: var(--ps-text-ui); font: var(--ps-type-small); }


/* ==========================================================================
   5. CONVERSAȚIA PE UN ANUNȚ
   ========================================================================== */

.ps-conversatie__inapoi { margin: 0 0 12px; }
.ps-conversatie__principal { display: grid; gap: 20px; min-inline-size: 0; }

.ps-conversatie__anunt { gap: 10px; }
.ps-conversatie__anunt-titlu {
  margin: 0;
  font: var(--ps-type-h2);
  letter-spacing: var(--ps-ls-tight);
  overflow-wrap: anywhere;
}
.ps-conversatie__anunt-titlu a { color: var(--ps-text); text-decoration: none; }
.ps-conversatie__anunt-titlu a:hover { color: var(--ps-green-dark); }
.ps-conversatie__anunt-descriere {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  line-clamp: 4;
  overflow: hidden;
  margin: 0;
  color: var(--ps-text-ui);
  font: var(--ps-type-body);
  line-height: 1.55;
  white-space: pre-line;
}
.ps-conversatie__anunt-subsol { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ps-conversatie__pret {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-inline-end: auto;
  color: var(--ps-text);
  font: var(--ps-fw-bold) 18px/1.2 var(--ps-font-sans);
}

.ps-conversatie__gol { margin: 0; color: var(--ps-text-ui); font: var(--ps-type-body); }

.ps-conversatie__mesaje {
  display: grid;
  gap: 14px;
  max-block-size: min(70vh, 640px);
  margin: 0;
  padding: 4px 4px 4px 0;
  list-style: none;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.ps-mesaj {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  align-items: end;
  gap: 10px;
  max-inline-size: 85%;
}
.ps-mesaj[data-autor="eu"] {
  grid-template-columns: minmax(0, 1fr) 36px;
  justify-self: end;
}
.ps-mesaj[data-autor="eu"] .ps-mesaj__avatar { order: 2; }

.ps-mesaj__avatar {
  inline-size: 36px;
  block-size: 36px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--ps-surface-muted);
}

.ps-mesaj__bula {
  display: grid;
  gap: 4px;
  padding: 10px 14px;
  border-radius: var(--ps-radius-card) var(--ps-radius-card) var(--ps-radius-card) 6px;
  background: var(--ps-surface-muted);
  color: var(--ps-text);
}
.ps-mesaj[data-autor="eu"] .ps-mesaj__bula {
  border-radius: var(--ps-radius-card) var(--ps-radius-card) 6px var(--ps-radius-card);
  background: var(--ps-primary-soft);
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ps-green-action) 18%, transparent);
}
.ps-mesaj__text {
  margin: 0;
  font: var(--ps-type-body);
  line-height: 1.55;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
.ps-mesaj__data {
  justify-self: end;
  color: var(--ps-text-faint-aa);
  font: var(--ps-fw-medium) 11.5px/1.2 var(--ps-font-sans);
}
@media (max-width: 575.98px) { .ps-mesaj { max-inline-size: 100%; } }

.ps-conversatie__raspuns {
  padding-block-start: 16px;
  border-block-start: 1px solid var(--ps-border-soft);
}

.ps-conversatie__actiuni { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; }
.ps-conversatie__actiuni form { margin: 0; }

.ps-conversatie__urmatorul { display: flex; flex-wrap: wrap; gap: 10px; }

.ps-conversatie__subtitlu,
.ps-thank-you__subtitlu,
.ps-bun-venit__subtitlu {
  margin: 0 0 16px;
  font: var(--ps-type-h2);
  letter-spacing: var(--ps-ls-tight);
}

.ps-conversatie__corespondent { gap: 16px; }
.ps-conversatie__identitate { display: grid; justify-items: center; gap: 10px; text-align: center; }
.ps-conversatie__logo {
  inline-size: 72px;
  block-size: 72px;
  border-radius: var(--ps-radius-card);
  object-fit: contain;
  background: var(--ps-surface-alt);
  box-shadow: var(--ps-shadow-card);
}
.ps-conversatie__nume { margin: 0; font: var(--ps-fw-semibold) 18px/1.3 var(--ps-font-sans); overflow-wrap: anywhere; }

.ps-conversatie__telefon > summary {
  inline-size: fit-content;
  color: var(--ps-green-dark);
  font-weight: var(--ps-fw-semibold);
  cursor: pointer;
}
.ps-conversatie__telefon[open] > summary { display: none; }


/* ==========================================================================
   6. CONT NOU (ecrane în cardul de autentificare)
   ========================================================================== */

.ps-cont-nou__card { --ps-auth-card-w: 460px; }

.ps-cont-nou__pictograma {
  display: grid;
  place-items: center;
  inline-size: 72px;
  block-size: 72px;
  border-radius: 50%;
  background: var(--ps-primary-soft);
  box-shadow: 0 0 0 10px color-mix(in srgb, var(--ps-primary-soft) 50%, transparent);
  color: var(--ps-green-action);
  font-size: 36px;
}

.ps-cont-nou__accent {
  margin: 0;
  color: var(--ps-text);
  font: var(--ps-fw-semibold) 15px/1.45 var(--ps-font-sans);
  text-align: center;
}

.ps-cont-nou__tipuri { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }

.ps-cont-nou__ocupatie { display: grid; gap: 8px; }
.ps-cont-nou__specializari {
  margin-inline-start: 30px;
  padding: 10px 14px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-surface-alt);
}
@supports selector(:has(*)) {
  .ps-cont-nou__ocupatie:not(:has(> .ps-choice input:checked)) > .ps-cont-nou__specializari { display: none; }
}

.ps-cont-nou__destinatar { display: block; color: var(--ps-text); font-weight: var(--ps-fw-semibold); overflow-wrap: anywhere; }

.ps-cont-nou__corectura {
  padding: 12px 14px;
  border: 1px solid var(--ps-border);
  border-radius: var(--ps-radius-control);
}
.ps-cont-nou__corectura > summary {
  color: var(--ps-green-dark);
  font: var(--ps-fw-semibold) 14px/1.3 var(--ps-font-sans);
  cursor: pointer;
}
.ps-cont-nou__corectura[open] > summary { margin-block-end: 12px; }
.ps-cont-nou__corectura .ps-form { display: grid; gap: 12px; }

.ps-cont-nou__nota {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 10px;
  margin: 0;
  color: var(--ps-text-ui);
  font: var(--ps-type-small);
  line-height: 1.5;
}
.ps-cont-nou__nota > .ps-icon-glyph { color: var(--ps-green-action); font-size: 22px; }

/* --- rezultatele identificării ------------------------------------------------- */
.ps-rezultate-conturi { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ps-rezultate-conturi__cont {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--ps-border);
  border-radius: var(--ps-radius-control);
  background: var(--ps-surface-alt);
}
.ps-rezultate-conturi__pictograma {
  display: grid;
  place-items: center;
  inline-size: 40px;
  block-size: 40px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-primary-soft);
  color: var(--ps-green-action);
  font-size: 22px;
}
.ps-rezultate-conturi__date { display: grid; gap: 6px; min-inline-size: 0; }
.ps-rezultate-conturi__nume { font: var(--ps-fw-semibold) 15px/1.3 var(--ps-font-sans); overflow-wrap: anywhere; }
.ps-rezultate-conturi__contact {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  align-items: center;
  gap: 4px 8px;
  margin: 0;
  color: var(--ps-text-ui);
  font: var(--ps-type-small);
}
.ps-rezultate-conturi__contact dt .ps-icon-glyph { font-size: 18px; color: var(--ps-icon); }
.ps-rezultate-conturi__contact dd { margin: 0; overflow-wrap: anywhere; }


/* ==========================================================================
   7. MULȚUMIRI (după mesaj / aplicare)
   ========================================================================== */

.ps-thank-you { display: grid; gap: 16px; margin-block-end: clamp(32px, 5vw, 64px); }

.ps-thank-you__indemn {
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
}
.ps-thank-you__text { display: grid; gap: 4px; }
@media (max-width: 767.98px) {
  .ps-thank-you__indemn { grid-template-columns: auto minmax(0, 1fr); }
  .ps-thank-you__indemn .ps-btn { grid-column: 1 / -1; }
}

.ps-thank-you__sfaturi { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.ps-thank-you__sfaturi > li { grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 14px; }
.ps-thank-you__sfaturi p { margin: 0; color: var(--ps-text); font: var(--ps-type-body); line-height: 1.55; }
.ps-thank-you__sfaturi a { color: var(--ps-green-dark); font-weight: var(--ps-fw-semibold); }


/* ==========================================================================
   8. BUN VENIT
   ========================================================================== */

.ps-bun-venit__revenire {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
}
.ps-bun-venit__revenire > div { display: grid; gap: 6px; }
.ps-bun-venit__revenire .ps-btn { white-space: normal; }
@media (max-width: 767.98px) { .ps-bun-venit__revenire { grid-template-columns: 1fr; } }

.ps-bun-venit__actiuni { --ps-grila-min: 240px; }

.ps-bun-venit__linkuri { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
.ps-bun-venit__linkuri .ps-chip { min-height: 36px; padding-inline: 14px; text-decoration: none; }

/* --- card de acțiune (pictogramă + titlu clicabil) -------------------------- */
.ps-card-actiune {
  position: relative;
  display: grid;
  align-content: start;
  gap: 10px;
  block-size: 100%;
  padding: 22px 20px 48px;
  border: 1px solid var(--ps-border-soft);
  border-radius: var(--ps-radius-card);
  background: var(--ps-surface);
  box-shadow: var(--ps-shadow-card);
  transition: box-shadow var(--ps-duration-slow) var(--ps-ease),
              transform var(--ps-duration-slow) var(--ps-ease-spring);
}
.ps-card-actiune:hover,
.ps-card-actiune:focus-within { box-shadow: var(--ps-shadow-hover); transform: translateY(-3px); }

.ps-card-actiune__pictograma {
  display: grid;
  place-items: center;
  inline-size: 48px;
  block-size: 48px;
  border-radius: var(--ps-radius-control);
  background: var(--ps-primary-soft);
  color: var(--ps-green-action);
  font-size: 26px;
}
.ps-card-actiune__titlu { margin: 4px 0 0; font: var(--ps-fw-semibold) 17px/1.3 var(--ps-font-sans); }
.ps-card-actiune__titlu a { color: var(--ps-text); text-decoration: none; }
.ps-card-actiune__titlu a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.ps-card-actiune__text { margin: 0; color: var(--ps-text-ui); font: var(--ps-type-body); line-height: 1.5; }
.ps-card-actiune__sageata {
  position: absolute;
  inset-block-end: 16px;
  inset-inline-end: 18px;
  color: var(--ps-green-action);
  transition: transform var(--ps-duration) var(--ps-ease);
}
.ps-card-actiune:hover .ps-card-actiune__sageata { transform: translateX(4px); }