/* MiProgreso — identidad "fachadas de Cartagena". Se carga DESPUÉS de style.css.
   Redefine las variables de color (todo el sitio, incluidas las insignias que
   pinta app.js) y ajusta los componentes del index. */
:root{
  --tinta:#14263A; --mar:#0B7C7C; --mango:#FFB81C; --buganvilia:#D4256B;
  --coral:#F26B3A; --cielo:#2E6FD8; --pizarra:#0F3B3A;
  --background:#F6F7F2; --cream:#F6F7F2; --paper:#fff; --card:#fff;
  --ink:#14263A; --foreground:#14263A; --ink-soft:#4B5C70; --line:#D3D8CC; --muted:#E8EAE2;
  --brick:#D4256B; --brick-tint:#FADCE8; --primary-foreground:#fff;
  --mustard:#FFB81C; --mustard-tint:#FFF0C4;
  --forest:#0B7C7C; --forest-tint:#D3EEEC;
  --whatsapp:#12803F; --whatsapp-tint:#D9F2E3;
}
body{background-image:none}
body .wrap{max-width:64rem}
:focus-visible{outline:3px solid var(--cielo);outline-offset:3px}
::selection{background:var(--mango);color:var(--tinta)}

/* ---- Cabecera ---- */
body .site-header{background:var(--background);border-bottom:3px solid var(--tinta)}
body .brand-logo{background:var(--mango);color:var(--tinta);border:2.5px solid var(--tinta);
  box-shadow:3px 3px 0 var(--brick)}
body .brand-logo::after{display:none}
body .brand-name{font-size:1.2rem}
body .brand-sub svg{color:var(--mar)}
body .nav-links{gap:.4rem 1.2rem}
body .pill-link{background:none;border:0;border-radius:0;padding:.2rem 0;font-weight:600;
  text-decoration:underline;text-decoration-color:var(--mango);text-decoration-thickness:3px;text-underline-offset:5px}
body .pill-link:hover{color:var(--tinta);border:0;text-decoration-color:var(--brick)}
body .pill-link.pill-cta{background:var(--brick);color:#fff;padding:.5rem .95rem;border-radius:6px;
  text-decoration:none;box-shadow:3px 3px 0 var(--tinta)}
body .pill-link.pill-cta:hover{color:#fff;opacity:1;transform:translate(1px,1px);box-shadow:2px 2px 0 var(--tinta)}

/* ---- Hero ---- */
body .hero{padding-top:clamp(2rem,6vw,4rem)}
body .hero-grid{grid-template-columns:1.25fr 1fr;gap:clamp(1.5rem,5vw,4rem);align-items:center}
body .hero h1{font-size:clamp(2.5rem,7vw,5rem);line-height:.98;max-width:11ch}
body .hero p{font-size:1.1rem;color:var(--ink);max-width:44ch}

/* Pizarra de tienda: el dato vivo, escrito a tiza (Kalam ya viene en style.css) */
body .stat-panel{margin:0;background:var(--pizarra);color:#F2F0E6;border:6px solid #C98A4B;border-radius:4px;
  padding:1.3rem 1.4rem 1.5rem;transform:rotate(1.2deg);
  box-shadow:inset 0 0 40px rgba(0,0,0,.35),6px 8px 0 rgba(20,38,58,.18)}
body .stat-panel::before{display:none !important}
body .stat-panel .label{font-family:'Kalam',cursive;font-size:1.25rem;color:var(--mango) !important}
body .stat-panel .live-dot{background:var(--coral)}
body .stat-panel .stat-line{font-family:'Kalam',cursive;font-size:clamp(1.15rem,2.6vw,1.45rem);line-height:1.5;margin-top:.5rem;color:#F6F4EA !important}
body .stat-panel .stat-line strong{font-family:'Kalam',cursive;font-size:1.3em;color:var(--mango) !important;border-bottom:3px solid var(--coral)}

/* Calle de fachadas: lo memorable de la página (SVG en index.html) */
.fachadas{margin-top:clamp(2rem,5vw,3.5rem);height:clamp(150px,24vw,250px);border-bottom:6px solid var(--tinta)}
.fachadas svg{display:block;width:100%;height:100%}

/* ---- Buscador ---- */
body .search-card{border:3px solid var(--tinta);border-radius:8px;box-shadow:6px 6px 0 var(--mango);padding:1rem}
body .search-input-wrap{background:transparent;border-bottom:3px solid var(--tinta);border-radius:0;padding:.6rem .4rem}
body .search-input-wrap:focus-within{border-bottom-color:var(--brick)}
body .search-input-wrap input{font-size:1.1rem}
body .type-tabs{border-bottom:0}
body .type-tabs button{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:1rem;margin-bottom:0}
body .type-tabs button.active{color:var(--tinta);border-bottom-color:var(--brick);border-bottom-width:4px}
body .chip{border:2px solid var(--tinta);border-radius:4px;background:#fff;color:var(--tinta)}
body .chip:hover{border-color:var(--tinta);background:var(--mustard-tint)}
body .chip.active{background:var(--tinta);border-color:var(--tinta);color:#fff}

/* ---- Resultados ---- */
body .results-head{border-bottom:3px solid var(--tinta);padding-bottom:.5rem;margin-bottom:1.5rem}
body .results-head h2{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:800}
body .results-count{font-weight:700;color:var(--mar)}
body .empty-state{border:2.5px solid var(--tinta);border-radius:4px;background:#fff}
body .empty-state .big-icon{background:var(--mango);color:var(--tinta)}

body .card-grid{column-count:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr));gap:1.6rem 1.3rem;align-items:start}
body .card-grid > .biz-card:nth-child(n){--c:var(--mango);margin:0;transform:none;background:#fff;border-radius:3px;
  border:2.5px solid var(--tinta);border-top:14px solid var(--c);padding:1.1rem 1.1rem 1.1rem;
  box-shadow:5px 5px 0 rgba(20,38,58,.14);transition:transform .12s,box-shadow .12s}
body .card-grid > .biz-card:nth-child(5n+2){--c:var(--mar)}
body .card-grid > .biz-card:nth-child(5n+3){--c:var(--brick)}
body .card-grid > .biz-card:nth-child(5n+4){--c:var(--coral)}
body .card-grid > .biz-card:nth-child(5n+5){--c:var(--cielo)}
body .card-grid > .biz-card:nth-child(n):hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--tinta)}
body .biz-card::before{content:none}
body .biz-card .avatar{border-radius:8px}
body .biz-card .avatar::after{display:none}
body .biz-card .name{font-size:1.1rem;font-weight:800}
body .badge-open,body .badge-closed{transform:none;box-shadow:none;border:2px solid currentColor;border-radius:4px}
body .biz-card .desc{color:var(--ink)}
body .biz-card .meta{border-top:2px solid var(--line)}
body .btn-call{border-radius:6px;border:2px solid var(--tinta);background:var(--brick);box-shadow:3px 3px 0 var(--tinta)}
body .btn-call:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--tinta)}
body .btn-wa{border-radius:6px;border:2px solid var(--tinta);width:2.75rem}

/* ---- Pie ---- */
body .cta-panel{background:var(--mango);color:var(--tinta);border:3px solid var(--tinta);border-radius:8px;
  box-shadow:8px 8px 0 var(--tinta);padding:clamp(1.5rem,4vw,2.6rem)}
body .cta-panel h2{font-size:clamp(1.6rem,4.5vw,2.5rem);line-height:1.05;max-width:20ch}
body .cta-btn{background:var(--tinta);color:#fff;border-radius:6px}
body .cta-btn:hover{background:var(--brick)}
body .cta-login-note{color:var(--tinta)}
body .cta-login-note a{color:var(--tinta)}

@media (max-width:760px){
  body .hero-grid{grid-template-columns:1fr}
  body .stat-panel{transform:rotate(.6deg)}
}
@media (prefers-reduced-motion:reduce){body .card-grid > .biz-card:nth-child(n){transition:none}}

/* ==========================================================================
   Resto de páginas: tablón de la JAC, ingreso, anunciar y panel
   ========================================================================== */
body .pill-link.active{background:none;border:0;color:var(--tinta);text-decoration-color:var(--brick)}
body .cta-btn{transform:none}

/* ---- Tablón de la JAC: una pared pintada con avisos pegados ---- */
body .page-title-block h1,body .tablon-heading{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;
  font-size:clamp(2.2rem,6vw,3.6rem);line-height:1;letter-spacing:-.02em;color:var(--tinta)}
body .tablon-heading svg{color:var(--brick);transform:none}
body .page-title-block p{color:var(--ink);font-size:1.05rem}
body .back-link{color:var(--tinta);font-weight:600;text-decoration:underline;text-decoration-color:var(--mango);
  text-decoration-thickness:3px;text-underline-offset:4px}
body .back-link:hover{color:var(--tinta);text-decoration-color:var(--brick)}
body .board-panel{background:var(--mar);border:3px solid var(--tinta);border-radius:6px;
  box-shadow:8px 8px 0 var(--tinta);padding:2rem 1rem 1.2rem}
body .notice-grid{column-gap:1.4rem}
body .board-panel .notice:nth-child(n){transform:none;margin:0 0 1.4rem;background:#fff;border:2.5px solid var(--tinta);
  border-top:12px solid var(--mango);border-radius:3px;padding:1rem 1.1rem 1.1rem;box-shadow:5px 5px 0 rgba(20,38,58,.35);
  transition:none}
body .board-panel .notice:has(.tag-alerta){border-top-color:var(--brick)}
body .board-panel .notice:has(.tag-convocatoria){border-top-color:var(--cielo)}
body .board-panel .notice::before{content:none}
body .board-panel .notice h3{font-family:'Bricolage Grotesque',sans-serif;font-size:1.15rem;font-weight:800;line-height:1.2;color:var(--tinta)}
body .board-panel .notice p{color:var(--ink)}
body .notice .tag,body .board-panel .notice .tag{border:2px solid currentColor;border-radius:3px;box-shadow:none;font-size:.72rem}
body .tag-convocatoria{background:#DCE8FB;color:#1F4FA8}
body .notice-toggle{color:var(--tinta);text-decoration-color:var(--brick);text-decoration-thickness:2px;text-underline-offset:3px}
body .board-panel .empty-state{border:2.5px solid var(--tinta);border-radius:3px;box-shadow:5px 5px 0 rgba(20,38,58,.35)}

/* ---- Tarjetas de formulario (ingreso, anunciar, panel) ---- */
body .panel-header{background:var(--background);backdrop-filter:none;border-bottom:3px solid var(--tinta)}
body .panel-header .who strong{font-family:'Bricolage Grotesque',sans-serif;font-weight:800}
body .auth-card,body .panel-card{background:#fff;border:3px solid var(--tinta);border-radius:8px;box-shadow:6px 6px 0 var(--mango)}
body .auth-card h1{font-size:clamp(1.7rem,5vw,2.2rem);line-height:1.05;margin:0 0 .5rem}
body .auth-card > p.lead{color:var(--ink);font-size:1rem}
body .panel-card h2{font-family:'Bricolage Grotesque',sans-serif;font-size:1.35rem;font-weight:800}
body .panel-section-title{display:inline-block;text-transform:none;letter-spacing:0;font-size:1rem;font-weight:800;
  font-family:'Bricolage Grotesque',sans-serif;color:var(--tinta);border-bottom:4px solid var(--mango);padding-bottom:.1rem}
body .field label{font-size:.9rem}
body .field .hint,body .field-count{color:var(--ink-soft)}
body .field input[type="text"],body .field input[type="tel"],body .field select,body .field textarea{
  border:2.5px solid var(--tinta);border-radius:4px;background:#fff;font-size:1rem}
body .field input:focus,body .field select:focus,body .field textarea:focus{border-color:var(--brick);box-shadow:3px 3px 0 var(--brick)}
body .tipo-choice label,body .tag-choice label{border:2.5px solid var(--tinta);border-radius:4px;background:#fff;color:var(--tinta)}
body .tipo-choice label:has(input:checked),body .tag-choice label:has(input:checked){background:var(--mango);border-color:var(--tinta);color:var(--tinta);box-shadow:3px 3px 0 var(--tinta)}
body .tipo-choice label:has(input:focus-visible),body .tag-choice label:has(input:focus-visible){outline:3px solid var(--cielo);outline-offset:3px}
body .switch-row{border:2.5px solid var(--tinta);border-radius:4px;background:#fff}
body .switch .track{background:#C9CEC3;border:2px solid var(--tinta)}
body .switch input:checked + .track{background:var(--mar)}
body .switch input:focus-visible + .track{outline:3px solid var(--cielo);outline-offset:2px}

body .btn-primary{border:2.5px solid var(--tinta);border-radius:6px;background:var(--brick);color:#fff;font-weight:800;
  box-shadow:4px 4px 0 var(--tinta);text-decoration:none}
body .btn-primary:hover{transform:translate(1px,1px);box-shadow:3px 3px 0 var(--tinta)}
body .btn-secondary,body .btn-mini{border:2.5px solid var(--tinta);border-radius:6px;background:#fff;color:var(--tinta);text-decoration:none}
body .btn-secondary:hover,body .btn-mini:hover{background:var(--mustard-tint)}
body .btn-mini-danger{background:var(--brick-tint);color:var(--brick);border-color:var(--brick)}
body .auth-foot a{color:var(--tinta);text-decoration:underline;text-decoration-color:var(--mango);text-decoration-thickness:3px;text-underline-offset:4px}
body .alert{border:2px solid currentColor;border-radius:4px}
body .recovery-code-box{border:2.5px dashed var(--tinta);border-radius:4px;background:#fff}
body .completion-banner{background:var(--mustard-tint);color:var(--tinta);border:2.5px solid var(--tinta);border-radius:4px}

/* ---- Tablón: pared con zócalo, avisos pegados con cinta ---- */
body .notice-grid > .empty-state{column-span:all;max-width:32rem;margin-left:auto;margin-right:auto}
body .board-panel{background:radial-gradient(rgba(255,255,255,.1) 1px,transparent 1.5px) 0 0/14px 14px,
  radial-gradient(rgba(20,38,58,.1) 1px,transparent 1.5px) 7px 7px/19px 19px,var(--mar);
  padding:2.4rem 1.2rem 4.2rem;min-height:22rem}
body .board-panel::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2.4rem;
  background:rgba(20,38,58,.3);border-top:3px solid var(--tinta);pointer-events:none}
body .board-panel .notice::before{content:"";position:absolute;top:-1.1rem;left:50%;width:3.4rem;height:1.2rem;
  background:rgba(255,184,28,.92);border:1.5px solid rgba(20,38,58,.4);transform:translateX(-50%) rotate(-3deg)}
body .board-panel .notice:nth-child(2n+1){transform:rotate(-.7deg)}
body .board-panel .notice:nth-child(2n){transform:rotate(.6deg)}
body .board-panel .notice{margin-top:.6rem}
.fachadas-mini{height:clamp(90px,14vw,150px);margin-top:1.2rem}

/* ---- Avisos en el panel de la Junta (fuera del tablón público) ---- */
body .notice{background:#fff;border:2.5px solid var(--tinta);border-top:12px solid var(--mango);border-radius:3px;
  box-shadow:5px 5px 0 rgba(20,38,58,.14)}
body .notice:has(.tag-alerta){border-top-color:var(--brick)}
body .notice:has(.tag-convocatoria){border-top-color:var(--cielo)}
body .notice h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--tinta)}
body .notice p{color:var(--ink)}

/* ---- Aviso del tablón: tarjeta corta + lectura completa en ventana ---- */
body .notice-text{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
body .notice-toggle{font-weight:700;padding:.35rem 0}
.aviso-dialog{width:100%;max-width:min(42rem,calc(100vw - 1.5rem));max-height:calc(100dvh - 2rem);padding:0;overflow:hidden;
  background:#fff;color:var(--tinta);border:3px solid var(--tinta);border-radius:6px;box-shadow:8px 8px 0 var(--tinta)}
.aviso-dialog[open]{display:flex}
.aviso-dialog::backdrop{background:rgba(20,38,58,.62)}
.aviso-dialog article{display:flex;flex-direction:column;min-height:0;width:100%}
.aviso-head{border-top:14px solid var(--mango);padding:1rem 1.3rem .5rem}
.aviso-dialog[data-tag="Alerta"] .aviso-head{border-top-color:var(--brick)}
.aviso-dialog[data-tag="Convocatoria"] .aviso-head{border-top-color:var(--cielo)}
.aviso-head .row{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.6rem}
.aviso-head h2{margin:0;font-size:clamp(1.3rem,4vw,1.8rem);line-height:1.15}
.aviso-body{flex:1;min-height:0;overflow-y:auto;padding:.4rem 1.3rem 1.2rem;white-space:pre-line;
  font-size:1.05rem;line-height:1.7;overflow-wrap:anywhere}
.aviso-foot{border-top:2.5px solid var(--tinta);padding:.8rem 1.3rem;text-align:right;background:var(--background)}

/* ---- Cartas adjuntas (PDF / imagen) ---- */
body .notice-thumb-btn{display:block;width:100%;margin:.2rem 0 .7rem;padding:0;background:none;border:2px solid var(--tinta);
  border-radius:3px;cursor:zoom-in;overflow:hidden;color:var(--tinta)}
body .notice-thumb{display:block;width:100%;height:11rem;object-fit:cover;object-position:top}
body .notice-pdf{display:flex;align-items:center;gap:.6rem;padding:.8rem .9rem;background:var(--mustard-tint);
  font-family:'Bricolage Grotesque',sans-serif;font-weight:800;cursor:pointer;text-align:left}
body .notice-thumb-btn:focus-visible{outline:3px solid var(--cielo);outline-offset:3px}
.aviso-dialog.con-adjunto{max-width:min(58rem,calc(100vw - 1.5rem))}
.aviso-scroll{flex:1;min-height:0;overflow-y:auto}
body .aviso-body{overflow:visible;flex:none}
.aviso-adjunto{padding:.5rem 1.3rem 0}
.aviso-adjunto img{display:block;max-width:100%;height:auto;margin:0 auto;border:2px solid var(--tinta);cursor:zoom-in}
.aviso-adjunto iframe{display:block;width:100%;height:min(68dvh,640px);border:2.5px solid var(--tinta);background:#fff}
.aviso-ayuda{margin:.5rem 0 0;font-size:.85rem;color:var(--ink-soft);text-align:center}
.aviso-acciones{display:flex;gap:.7rem;flex-wrap:wrap;margin:.9rem 0 .2rem}
.aviso-acciones .btn-primary{width:auto;flex:1 1 12rem}
.aviso-acciones .btn-secondary{flex:0 0 auto}
body .field input[type="file"]{width:100%;border:2.5px dashed var(--tinta);border-radius:4px;background:#fff;padding:.7rem;font-family:inherit;font-size:.95rem}

/* ---- Tendedero de oficios (hero de index y mini de la Junta) ---- */
.fachadas-tendedero .sway{animation:tendedero-sway 1.8s cubic-bezier(.3,1.6,.5,1) both}
@keyframes tendedero-sway{from{transform:rotate(16deg)}to{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.fachadas-tendedero .sway{animation:none}}

/* ---- Páginas del comerciante (anunciar.php): mismo lenguaje del tema ---- */
body .page-title{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;color:var(--tinta);
  font-size:clamp(1.7rem,5vw,2.2rem);line-height:1.05;letter-spacing:-.01em;margin:.35rem 0 .6rem}
body .page-lead{color:var(--ink);font-size:1rem;line-height:1.55;max-width:60ch;margin:0 0 1.25rem}
body .page-lead strong{text-decoration:underline;text-decoration-color:var(--mango);text-decoration-thickness:3px;text-underline-offset:3px}
body .nota-chica{font-size:.85rem;color:var(--ink-soft);text-align:left}
body .nota-chica a{color:var(--tinta);text-decoration:underline;text-decoration-color:var(--mango);text-decoration-thickness:3px;text-underline-offset:3px}
body .alert-aviso{background:var(--mustard-tint);color:var(--tinta);border:2px solid var(--tinta)}
body .alert-error{background:var(--brick-tint);color:#8F1448;border:2px solid #8F1448}
body .biz-card-preview{--c:var(--mango);margin:0 0 1rem;transform:none;background:#fff;border:2.5px solid var(--tinta);
  border-top:14px solid var(--c);border-radius:3px;padding:1.1rem;box-shadow:5px 5px 0 rgba(20,38,58,.14)}
/* Código para quitar el anuncio: escrito a tiza, como la pizarra del inicio */
body .codigo-pizarra{margin:0 0 1rem;text-align:center;background:var(--pizarra);color:#F2F0E6;border:6px solid #C98A4B;
  border-radius:4px;padding:1.1rem 1.2rem 1.3rem;transform:rotate(-1deg);
  box-shadow:inset 0 0 40px rgba(0,0,0,.35),5px 7px 0 rgba(20,38,58,.18)}
body .codigo-pizarra p{margin:0}
body .codigo-pizarra .cp-label{font-family:'Kalam',cursive;font-size:1.15rem;color:var(--mango)}
body .codigo-pizarra .cp-code{font-family:'Kalam',cursive;font-size:2.4rem;font-weight:700;letter-spacing:.2em;color:#fff;
  border-bottom:3px dashed var(--coral);display:inline-block;padding:0 .2em;margin:.2rem 0 .4rem}
body .codigo-pizarra .cp-nota{font-size:.9rem;color:#F6F4EA}

/* ---- Tarjeta de negocio: mejoras v12 ----
   La franja de color la pone app.js con --c según la categoría. */
body .biz-card{gap:.7rem}
body .biz-card .name{text-transform:capitalize;overflow-wrap:anywhere}
body .biz-card .cat-label{font-size:.78rem}
body .biz-card .desc{margin:0}
body .biz-card .meta{padding-top:.6rem;gap:.3rem}
body .biz-card .meta .meta-horario svg{color:var(--ink-soft);transform:none}
body .biz-card .actions{padding-top:.2rem;gap:.6rem}
body .btn-call{flex:1 1 0;min-height:2.9rem}
body .btn-wa{
  flex:1 1 0;width:auto;height:auto;min-height:2.9rem;display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  background:var(--whatsapp-tint);color:var(--whatsapp);border:2px solid var(--tinta);border-radius:6px;
  box-shadow:3px 3px 0 var(--tinta);font-size:.875rem;font-weight:800;text-decoration:none;
  transition:transform .12s,box-shadow .12s}
body .btn-wa:hover{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--tinta)}
body .card-foot{margin:0;padding-top:.4rem;font-size:.78rem;color:var(--ink-soft);
  display:flex;justify-content:space-between;align-items:center;gap:.5rem;flex-wrap:wrap}
body .btn-report{background:none;border:0;padding:.45rem .2rem;min-height:2rem;font:inherit;font-weight:600;
  color:var(--ink);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
body .btn-report:hover{color:var(--brick)}