/* Etapa 8 — catálogo, perfil, localização e leitura no telemóvel.
   Carregado depois das folhas de cada área (head.php e cxc_css_link()). Só apresentação: não muda regras. */

/* ---------- Início do cliente: slide → pesquisa → «Ver todos os serviços» (destaque) → 8 atalhos ---------- */
.cxc-home .cxc-search { margin: .2rem 0 .7rem; }
.cxc-all-btn { display: flex; align-items: center; gap: .6rem; min-height: 52px; padding: .7rem 1rem; border-radius: var(--cx-r, 14px);
  background: var(--cx-green, #1A8F3C); color: #fff !important; font-weight: 700; font-size: 1.02rem; text-decoration: none; box-shadow: 0 2px 8px rgba(26, 143, 60, .25); margin-bottom: 1rem; }
.cxc-all-btn:hover, .cxc-all-btn:focus-visible { background: var(--cx-green-600, #157532); color: #fff; }
.cxc-all-btn > span { flex: 1 1 auto; }
.cxc-all-btn:focus-visible { outline: 3px solid #0C3B4C; outline-offset: 2px; }
.cxc-home .cxc-q { margin-top: .2rem; }
.cxc-cats.cxc-cats--8 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.cxc-cats--8 .cxc-cat { min-height: 104px; padding: .55rem .2rem .5rem; justify-content: flex-start; text-align: center; }
.cxc-cats--8 .cxc-cat-ico .cx-ic { width: 52px; height: 52px; }
.cxc-cats--8 .cxc-cat-name { font-size: .76rem; line-height: 1.18; hyphens: manual; overflow-wrap: normal; word-break: normal; }
@media (max-width: 359.98px) {
  .cxc-cats--8 .cxc-cat-ico .cx-ic { width: 44px; height: 44px; }
  .cxc-cats--8 .cxc-cat-name { font-size: .7rem; }
  .cxc-cats.cxc-cats--8 { gap: .35rem; }
}
@media (min-width: 768px) { .cxc-cats.cxc-cats--8 { grid-template-columns: repeat(8, minmax(0, 1fr)); } }

/* ---------- Barra de baixo: «Mais» ---------- */
.cx-bottom-nav .cx-tab-more { position: relative; }
.cx-bottom-nav .cx-tab-more.active { color: var(--cx-green, #1A8F3C); }

/* ---------- Toques e contraste ---------- */
.form-control::placeholder, .form-select::placeholder, textarea::placeholder, input::placeholder { color: #66737F; opacity: 1; }
.cxc-plain-in::placeholder { color: #66737F; }
.cx-loc-opt, .cx-loc-manual, .cx-geo-btn, .cxc-link-btn, .cxc-edit { min-height: 44px; }
.cxc-link-btn { padding: .5rem .4rem; }
details.cx-catalog-service-select > summary { min-height: 44px; } /* «Escolher um serviço» no assistente: toque ≥ 44 px */

/* ---------- Assistente do pedido ---------- */
.cxc-stepper.cxc-stepper--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* 3 passos: áudio e fotos lado a lado (opcionais, compactos) para o passo «Detalhes e local» não ficar comprido */
.cxc-media-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; margin-top: .8rem; }
.cxc-media-row .cxc-wz-h3 { font-size: .92rem; margin: 0 0 .35rem; }
.cxc-media-row .cxc-wz-h3 span { display: block; font-weight: 400; font-size: .8rem; }
.cxc-media-row .cxc-voice { grid-template-columns: 1fr; justify-items: center; text-align: center; padding: .6rem .5rem; min-height: 112px; align-content: center; }
.cxc-media-row .cxc-voice .cxc-mic { width: 48px; height: 48px; font-size: 1.3rem; }
.cxc-media-row .cxc-voice-txt { font-size: .85rem; }
.cxc-media-row .cxc-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cxc-media-row .cxc-photo-grid:not(:has(.cx-file)) { grid-template-columns: 1fr; }
.cxc-media-row .cxc-add-photo { aspect-ratio: auto; min-height: 112px; }
.cxc-media-row .cxc-photos > .cx-meta { font-size: .72rem; line-height: 1.25; margin-top: .3rem; }
.cxc-media-row .cxc-voice.has-audio, .cxc-media-row .cxc-voice.is-recording { grid-column: 1 / -1; }
.cxc-wz--3 [data-wz-block="onde"] { border-top: 1px solid var(--cx-border, #E4E9EE); margin-top: 1.1rem; padding-top: .2rem; }
.cxc-wz .cx-field-error { margin-top: .35rem; }
.cx-loc-field.is-invalid { border-color: #C62828 !important; box-shadow: 0 0 0 3px rgba(198, 40, 40, .15); }
/* o campo com foco nunca fica por trás da barra de botões fixa (teclado aberto) */
body.cxc-wz-page { scroll-padding-bottom: calc(110px + env(safe-area-inset-bottom, 0px)); }
body.cxc-wz-page .cx-main { padding-bottom: calc(120px + env(safe-area-inset-bottom, 0px)); }

/* ---------- Bairro: pesquisa primeiro, resultados limitados, estado da localização ---------- */
.cx-loc-more { width: 100%; border: 0; border-top: 1px solid #EEF2F5; background: #F7FAFB; color: var(--cx-link, #0E6E8F); font-weight: 600; min-height: 46px; padding: .6rem .9rem; text-align: left; }
.cx-loc-status { margin: 0; padding: .3rem .9rem; font-size: .8rem; color: #4A5965; background: #fff; }
.cx-loc-status:empty { display: none; }
.cx-loc-panel { max-height: min(420px, 60vh); }
.cx-geo-status { font-size: .88rem; margin: .4rem 0 0; padding: .5rem .7rem; border-radius: 10px; background: #F2F6F8; color: #24343F; }
.cx-geo-status[hidden], .cx-geo-status:empty { display: none; }
.cx-geo-status[data-state=sugerido] { background: var(--cx-green-50, #EAF6EE); color: #0f5a29; }
.cx-geo-status[data-state=recusada], .cx-geo-status[data-state=indisponivel], .cx-geo-status[data-state=longe] { background: #FFF6E5; color: #6B4A00; }

/* ---------- Avatar: quadrado, sem deformar; iniciais legíveis ---------- */
.cx-avatar { aspect-ratio: 1 / 1; object-fit: cover; object-position: center 30%; }
.cx-avatar-initials { overflow: hidden; line-height: 1; font-size: .95rem; text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; }
.cx-avatar-lg.cx-avatar-initials { font-size: 1.6rem; }
.cx-avatar-xs.cx-avatar-initials { font-size: .75rem; }

/* ---------- Perfil público: preços, sem avaliações, explicação do selo ---------- */
.cxc-prices { display: grid; gap: .45rem; margin-bottom: .2rem; }
.cxc-price-row { display: flex; justify-content: space-between; align-items: flex-start; gap: .8rem; padding: .7rem .8rem; background: #fff; border: 1px solid var(--cx-border, #E4E9EE); border-radius: 12px; }
.cxc-price-row .min-w-0 { overflow-wrap: anywhere; }
.cxc-no-reviews { padding: .8rem .9rem; border: 1px dashed #C9D4DB; border-radius: 12px; background: #fff; margin: .2rem 0 .6rem; }
.cxc-verified-why { margin: -.2rem 0 .8rem; }
.cxc-pp-h { margin-top: 1.2rem; }

/* ---------- Currículo do profissional em secções curtas ---------- */
.cxp-cv-h { font-size: 1.25rem; margin-top: .4rem; }
.cxp-cv-progress { background: #fff; border: 1px solid var(--cx-border, #E4E9EE); border-radius: 14px; padding: .7rem .8rem; margin-bottom: 1rem; }
.cxp-cv-progress .cx-progress { height: 6px; border-radius: 6px; background: #E8EEF1; overflow: hidden; margin-bottom: .5rem; }
.cxp-cv-progress .cx-progress span { display: block; height: 100%; background: var(--cx-green, #1A8F3C); }
.cxp-cv-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.cxp-cv-chips a { display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; padding: .35rem .65rem; border-radius: 999px; border: 1px solid #D6DEE5; color: #24343F; text-decoration: none; font-size: .85rem; background: #fff; }
.cxp-cv-chips a.is-ok { border-color: var(--cx-green, #1A8F3C); color: #0f5a29; background: var(--cx-green-50, #EAF6EE); }
.cxp-cv-sec { display: grid; gap: .9rem; background: #fff; border: 1px solid var(--cx-border, #E4E9EE); border-radius: 16px; padding: 1rem .9rem; scroll-margin-top: 80px; min-width: 0; }
.cxp-cv-sh { display: flex; align-items: center; gap: .55rem; font-size: 1.05rem; font-weight: 700; color: var(--cx-navy, #0C3B4C); margin: 0; }
.cxp-cv-sh > span:first-child { width: 28px; height: 28px; border-radius: 50%; background: var(--cx-green-50, #EAF6EE); color: #0f5a29; display: grid; place-items: center; font-size: .85rem; flex-shrink: 0; }
.cxp-cv-actions { display: grid; gap: .5rem; }
.cxp-del-btn { display: inline-flex; align-items: center; gap: .3rem; min-height: 44px; padding: .35rem .7rem; border-radius: 10px; border: 1px solid #F1C3C3; background: #fff; color: #A61B1B; font-weight: 600; font-size: .85rem; }
.cxp-cv [data-price-amount][hidden] { display: none !important; }
.cxp-cv .cxp-zone-add { display: block; }

/* ---------- Mensagens de sistema: claramente do Consertix, não de uma pessoa ---------- */
.cx-msg-system-who { display: block; font-size: .68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #4A5965; margin-bottom: .1rem; }
.cx-points-rules { list-style: none; padding: 0; margin: 0 0 .6rem; display: grid; gap: .35rem; }
.cx-points-rules li { display: flex; justify-content: space-between; gap: .8rem; padding: .5rem .7rem; background: #F6F8FA; border-radius: 10px; }
.cx-points-rules strong { color: #0f5a29; white-space: nowrap; }

/* ---------- Propostas: nomes longos legíveis, mesma ação = mesmo estilo ---------- */
.cxc-prop-name { white-space: normal; overflow-wrap: anywhere; }
.cxc-props-bar .cx-btn, .cxc-pp-cta .cx-btn { white-space: normal; overflow-wrap: anywhere; line-height: 1.2; min-height: 52px; height: auto; }
/* Cancelar: ação destrutiva com estilo próprio (contorno vermelho + ícone), não só cor */
.cx-btn--danger-outline, .btn-cancel-confirm { background: #fff !important; color: #A61B1B !important; border: 2px solid #C62828 !important; font-weight: 700; }

/* ---------- Registo e títulos: título e subtítulo separados (V5); telemóvel com erro consistente (C11) ---------- */
h1 + p, .cx-auth-card h1 + p, .cx-page-title h1 + p, .cx-page-title h1 + .cx-meta { margin-top: .4rem; }
.cx-phone-field .form-control.is-invalid { border-color: transparent; background-image: none; box-shadow: none; }

/* ---------- Revisão das capturas a 390 px (fecho da Etapa 8) ---------- */
/* palavras longas nas sugestões («intercomunicadores») não saem da caixa: hifenização em português e, se faltar, quebra */
.cxc-prob > span { min-width: 0; }
.cxc-prob > span > span:last-child { min-width: 0; overflow-wrap: break-word; word-break: break-word; hyphens: auto; -webkit-hyphens: auto; }
/* 3 passos: com fotos escolhidas, as fotos ocupam a linha inteira (miniaturas, «Adicionar mais» e «Remover» sem cortes) */
.cxc-media-row .cxc-media-cell:has(.cxc-photos.has-files) { grid-column: 1 / -1; }
.cxc-media-row .cxc-photos.has-files .cxc-photo-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cxc-media-row .cxc-photos.has-files .cxc-add-photo { min-height: 96px; }
.cxc-media-row .cx-upload-ctl { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.cxc-media-row .cx-upload-ctl .btn { min-height: 44px; display: inline-flex; align-items: center; gap: .3rem; }
/* perfil público, Preços: o título do serviço nunca fica espremido letra a letra («instalaçã/o») por causa do valor */
.cxc-price-row > .min-w-0 { flex: 1 1 45%; min-width: 7.5rem; overflow-wrap: break-word; }
.cxc-price-row > .text-end { flex: 0 1 auto !important; max-width: 55%; }
.cxc-price-row [data-price-main] { white-space: nowrap; }
/* título do pedido nas propostas: até 2 linhas em vez de cortar com «…» */
.cxc-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: break-word; }
/* perfil público: «Guardar» e «Enviar mensagem» nunca partem palavras; sem espaço, ficam um por linha */
.cxc-pp-cta .cx-btn-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.cxc-pp-cta .cx-btn-row > .cx-btn { flex: 1 1 9rem; min-width: 0; overflow-wrap: normal; word-break: keep-all; hyphens: none; white-space: normal; }