/**
 * DENÚNCIES D'ANUNCIS — estils del frontal.
 *
 * Només es carrega a les fitxes d'anunci (vegeu ldv_denuncies_assets() a
 * inc/denuncies.php), de manera que aquí no cal anar amb compte de no trepitjar
 * estils globals del tema.
 *
 * COM ES MODIFICA
 * ---------------
 * Els colors surten de variables CSS declarades a :root. Per canviar l'aspecte
 * de tot el bloc n'hi ha prou tocant-les aquí, sense buscar per les regles.
 *
 * Els colors del tema es poden personalitzar des de l'instal·lador i es desen a
 * --ldv-color-primary / --ldv-color-secondary. Aquí es fan servir com a primera
 * opció i, si no hi són (per exemple en una pàgina on el tema no les ha pintat),
 * es recorre als valors per defecte gràcies a la sintaxi de fallback de var().
 */

:root {
    --ldv-denuncia-vermell: #dc2626;
    --ldv-denuncia-vermell-fosc: #b91c1c;
    --ldv-denuncia-ambre: #d97706;
    --ldv-denuncia-fons: rgba(15, 23, 42, .55);
    --ldv-denuncia-radi: 14px;
}

/* ---------------------------------------------------------------------
   Botó de denúncia
   --------------------------------------------------------------------- */

/* El botó viu dins de .anunci-accions, al costat de «Imprimir». Es pinta com a
   enllaç discret i no com a botó principal: denunciar és una acció secundària i
   si cridés més que «Contacta amb el propietari» el web semblaria hostil. */
.ldv-boto-denuncia {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 9px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 40px;
    background: #fff;
    color: #64748b;
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease, background .15s ease;
}

.ldv-boto-denuncia:hover,
.ldv-boto-denuncia:focus-visible {
    border-color: var(--ldv-denuncia-vermell);
    color: var(--ldv-denuncia-vermell);
    background: #fef2f2;
    outline: none;
}

.ldv-boto-denuncia-ico {
    font-size: 1rem;
}

/* Avís que només veu qui pot moderar. Es distingeix del botó perquè no és una
   acció del visitant sinó una informació interna. */
.ldv-denuncia-obertes {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 8px;
    padding: 7px 14px;
    border-radius: 40px;
    background: #fff7ed;
    border: 1px solid #fdba74;
    color: var(--ldv-denuncia-ambre);
    font-size: .8rem;
    font-weight: 700;
    text-decoration: none;
}

.ldv-denuncia-obertes:hover {
    background: #ffedd5;
    color: var(--ldv-denuncia-vermell-fosc);
}

/* ---------------------------------------------------------------------
   Finestra de denúncia
   --------------------------------------------------------------------- */
.ldv-denuncia-fons {
    position: fixed;
    inset: 0;
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: var(--ldv-denuncia-fons);
    backdrop-filter: blur(3px);
    /* El fons no s'ha de poder desplaçar amb la roda mentre la finestra és
       oberta: si no, la pàgina es mou per sota i en tancar-la l'usuari es troba
       en un altre lloc de la fitxa. */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* L'atribut hidden de l'HTML ja amaga la finestra, però alguns navegadors amb
   un reset CSS agressiu li tornen el display. Aquesta regla ho garanteix. */
.ldv-denuncia-fons[hidden] {
    display: none !important;
}

.ldv-denuncia-finestra {
    position: relative;
    width: 100%;
    max-width: 560px;
    max-height: calc(100vh - 32px);
    overflow-y: auto;
    padding: 26px 26px 22px;
    border-radius: var(--ldv-denuncia-radi);
    background: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .28);
}

.ldv-denuncia-tanca {
    position: absolute;
    top: 10px;
    right: 12px;
    width: 34px;
    height: 34px;
    border: none;
    border-radius: 50%;
    background: #f1f5f9;
    color: #475569;
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
}

.ldv-denuncia-tanca:hover {
    background: #e2e8f0;
    color: #0f172a;
}

.ldv-denuncia-titol {
    margin: 0 32px 4px 0;
    font-size: 1.2rem;
    font-weight: 800;
    color: #0f172a;
}

.ldv-denuncia-subtitol {
    margin: 0 0 18px;
    color: #64748b;
    font-size: .9rem;
    line-height: 1.5;
}

/* Camp esquer: existeix al DOM perquè els bots l'emplenin, però cap persona
   l'ha de veure mai. Es tapa amb les tres tècniques alhora (posició fora de
   pantalla, opacitat i mida) perquè alguns lectors de correu i navegadors
   n'ignoren alguna. */
.ldv-denuncia-esquer {
    position: absolute !important;
    left: -9999px !important;
    top: -9999px !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

/* ---------------------------------------------------------------------
   Motius
   --------------------------------------------------------------------- */
.ldv-denuncia-motius {
    margin: 0 0 16px;
    padding: 0;
    border: none;
}

.ldv-denuncia-motius legend {
    padding: 0;
    margin-bottom: 8px;
    font-size: .8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: #94a3b8;
}

.ldv-denuncia-motiu {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 11px 13px;
    margin-bottom: 7px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}

.ldv-denuncia-motiu:hover {
    border-color: #cbd5e1;
    background: #f8fafc;
}

.ldv-denuncia-motiu input[type="radio"] {
    margin: 3px 0 0;
    accent-color: var(--ldv-denuncia-vermell);
    flex: 0 0 auto;
}

/* Estat marcat: es fa servir :has() i no pas JavaScript perquè així funciona
   encara que l'script falli. Els navegadors que no suporten :has() simplement
   no mostren el resaltat, que és cosmètic: la selecció continua funcionant. */
.ldv-denuncia-motiu:has(input:checked) {
    border-color: var(--ldv-denuncia-vermell);
    background: #fef2f2;
}

.ldv-denuncia-motiu-ico {
    font-size: 1.1rem;
    line-height: 1.3;
}

.ldv-denuncia-motiu-text {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ldv-denuncia-motiu-text strong {
    font-size: .92rem;
    color: #0f172a;
    line-height: 1.35;
}

.ldv-denuncia-motiu-text small {
    font-size: .8rem;
    color: #64748b;
    line-height: 1.4;
}

/* Els motius greus porten una franja a l'esquerra: és el senyal visual que
   aquesta denúncia s'atendrà abans, i coincideix amb l'ordre del llistat
   d'administració. */
.ldv-denuncia-motiu.greu {
    border-left: 3px solid var(--ldv-denuncia-vermell);
}

/* ---------------------------------------------------------------------
   Camps de text
   --------------------------------------------------------------------- */
.ldv-denuncia-camp {
    display: block;
    margin-bottom: 13px;
}

.ldv-denuncia-camp > span {
    display: block;
    margin-bottom: 5px;
    font-size: .82rem;
    font-weight: 700;
    color: #475569;
}

.ldv-denuncia-camp input,
.ldv-denuncia-camp textarea {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
    color: #0f172a;
    font-family: inherit;
    font-size: .92rem;
    line-height: 1.5;
    box-sizing: border-box;
}

.ldv-denuncia-camp textarea {
    resize: vertical;
    min-height: 84px;
}

.ldv-denuncia-camp input:focus,
.ldv-denuncia-camp textarea:focus {
    border-color: var(--ldv-color-primary, var(--ldv-denuncia-vermell));
    outline: none;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, .12);
}

.ldv-denuncia-dos {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.ldv-denuncia-nota {
    margin: -4px 0 14px;
    font-size: .78rem;
    color: #94a3b8;
    line-height: 1.5;
}

/* ---------------------------------------------------------------------
   Missatge de resultat i peu
   --------------------------------------------------------------------- */
.ldv-denuncia-resultat {
    margin: 0;
    padding: 0;
    font-size: .88rem;
    line-height: 1.5;
    /* Es reserva una línia d'alçada encara que estigui buit: si no, quan surt
       el missatge la finestra fa un salt i el botó es mou de sota del dit. */
    min-height: 1.3em;
}

.ldv-denuncia-resultat.ok {
    color: #15803d;
    font-weight: 600;
}

.ldv-denuncia-resultat.ko {
    color: var(--ldv-denuncia-vermell-fosc);
    font-weight: 600;
}

.ldv-denuncia-peu {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #f1f5f9;
}

.ldv-denuncia-boto {
    padding: 11px 20px;
    border-radius: 40px;
    border: 1px solid transparent;
    font-size: .9rem;
    font-weight: 700;
    cursor: pointer;
    transition: transform .12s ease, background .15s ease, opacity .15s ease;
}

.ldv-denuncia-boto.secundari {
    background: #f1f5f9;
    color: #475569;
    border-color: #e2e8f0;
}

.ldv-denuncia-boto.secundari:hover {
    background: #e2e8f0;
}

.ldv-denuncia-boto.principal {
    background: var(--ldv-denuncia-vermell);
    color: #fff;
}

.ldv-denuncia-boto.principal:hover {
    background: var(--ldv-denuncia-vermell-fosc);
    transform: translateY(-1px);
}

/* Mentre s'envia es desactiven tots dos botons: si no, un segon clic envia una
   altra denúncia i el servidor la descarta com a repetida, que es veu com un
   error encara que no ho sigui. */
.ldv-denuncia-formulari.enviant .ldv-denuncia-boto {
    opacity: .6;
    cursor: progress;
    pointer-events: none;
}

/* ---------------------------------------------------------------------
   Etiqueta «Venut / Llogat»

   Els estils de .ldv-etiqueta-venut NO són aquí: són a assets/css/main.css.
   Aquest full només es carrega a les fitxes d'anunci (is_singular('anunci'))
   i l'etiqueta també surt a les targetes dels llistats, que no el carreguen.
   Tornar-la aquí faria que als llistats es veiés sense estil.
   --------------------------------------------------------------------- */

/* ---------------------------------------------------------------------
   Mòbils
   --------------------------------------------------------------------- */
@media (max-width: 600px) {
    .ldv-denuncia-finestra {
        padding: 20px 18px 18px;
        border-radius: 14px 14px 0 0;
        max-height: 92vh;
        /* A la pantalla petita la finestra s'enganxa a baix, que és on ja hi ha
           el dit: estalvia haver d'arrossegar amunt per arribar al botó. */
        align-self: flex-end;
    }

    .ldv-denuncia-dos {
        grid-template-columns: 1fr;
        gap: 0;
    }

    .ldv-denuncia-peu {
        flex-direction: column-reverse;
    }

    .ldv-denuncia-boto {
        width: 100%;
    }

    .ldv-denuncia-obertes {
        margin-left: 0;
        margin-top: 8px;
    }
}