/* Alto al Ciberacoso — Report wizard (sealed intake). CROA palette. */

/* ---- Sticky always-visible report button ---- */
.report-fab{
  position:fixed; right:20px; bottom:20px; z-index:60;
  display:inline-flex; align-items:center; gap:9px; padding:14px 22px; border-radius:999px;
  font-family:'Manrope'; font-weight:700; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase;
  background:linear-gradient(180deg,var(--gold-lite),var(--gold)); color:#3a2c07;
  border:1px solid var(--gold-deep); box-shadow:0 14px 34px -12px rgba(138,107,31,.85); cursor:pointer;
  transition:transform .18s var(--ease),box-shadow .18s;
}
.report-fab:hover{transform:translateY(-2px)}
.report-fab .pulse{width:9px;height:9px;border-radius:50%;background:var(--wine);box-shadow:0 0 0 0 rgba(110,31,44,.6);animation:fabpulse 2.4s infinite}
@keyframes fabpulse{0%{box-shadow:0 0 0 0 rgba(110,31,44,.55)}70%{box-shadow:0 0 0 12px rgba(110,31,44,0)}100%{box-shadow:0 0 0 0 rgba(110,31,44,0)}}
@media (prefers-reduced-motion:reduce){.report-fab .pulse{animation:none}}
@media (max-width:600px){.report-fab span.t{display:none}.report-fab{padding:15px}}

/* ---- Overlay + dialog ---- */
.rp-overlay{
  position:fixed; inset:0; z-index:100; display:none;
  background:rgba(20,29,56,.62); backdrop-filter:blur(6px);
  padding:24px; overflow:auto;
}
.rp-overlay.open{display:flex; align-items:flex-start; justify-content:center}
.rp-dialog{
  width:100%; max-width:660px; margin:auto; background:var(--paper);
  border:1px solid var(--line); border-radius:8px; box-shadow:0 40px 90px -30px rgba(20,17,8,.6);
  display:flex; flex-direction:column; max-height:calc(100vh - 48px); overflow:hidden;
  animation:rpIn .28s var(--ease);
}
@keyframes rpIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.rp-dialog{animation:none}}

.rp-head{padding:18px 22px 12px; border-bottom:1px solid var(--line); position:relative}
.rp-head .eyebrow{color:var(--gold-deep)}
.rp-head h3{font-size:1.5rem; margin:2px 0 0}
.rp-close{position:absolute; top:14px; right:14px; width:34px; height:34px; border-radius:50%;
  border:1px solid var(--line); background:transparent; color:var(--muted); font-size:1.1rem; cursor:pointer; line-height:1}
.rp-close:hover{background:var(--navy); color:var(--beige); border-color:var(--navy)}
.rp-prog{height:4px; background:var(--beige-deep); border-radius:99px; margin-top:14px; overflow:hidden}
.rp-prog>i{display:block; height:100%; width:16%; background:linear-gradient(90deg,var(--gold-deep),var(--gold-lite)); transition:width .3s var(--ease)}
.rp-step-label{font-size:.68rem; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); margin-top:8px}

.rp-body{padding:20px 22px; overflow:auto}
.rp-foot{padding:14px 22px; border-top:1px solid var(--line); display:flex; gap:12px; justify-content:space-between; align-items:center; background:var(--paper)}
.rp-foot .btn{padding:12px 22px; font-size:.76rem}

/* ---- Steps ---- */
.rstep{display:none} .rstep.active{display:block; animation:rpFade .25s var(--ease)}
@keyframes rpFade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.rstep h4{font-size:1.28rem; margin:0 0 6px}
.rstep .sub{color:var(--muted); font-size:.96rem; margin:0 0 16px}

/* ---- Fields ---- */
.rf{margin-bottom:15px}
.rf > label{display:block; font-family:'Manrope'; font-weight:600; font-size:.82rem; color:var(--navy); margin-bottom:6px}
.rf .hint{font-weight:400; color:var(--muted); font-size:.76rem}
.rf input[type=text], .rf input[type=email], .rf input[type=tel], .rf input[type=date], .rf input[type=time], .rf textarea, .rf select{
  width:100%; padding:12px 13px; font-family:'Manrope'; font-size:.94rem; color:var(--ink);
  background:#fff; border:1px solid var(--line); border-radius:5px; transition:border-color .18s,box-shadow .18s;
}
.rf textarea{min-height:120px; resize:vertical; line-height:1.5}
.rf input:focus, .rf textarea:focus, .rf select:focus{outline:none; border-color:var(--gold-deep); box-shadow:0 0 0 3px rgba(184,145,47,.16)}
.rf.two{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:520px){.rf.two{grid-template-columns:1fr}}
.rf.invalid input, .rf.invalid textarea{border-color:var(--wine); box-shadow:0 0 0 3px rgba(110,31,44,.12)}

/* option chips (checkbox / radio) */
.optset{display:flex; flex-wrap:wrap; gap:10px}
.opt{display:flex; align-items:center; gap:9px; padding:11px 15px; border:1px solid var(--line); border-radius:6px;
  cursor:pointer; font-size:.9rem; background:#fff; transition:border-color .16s,background .16s}
.opt:hover{border-color:var(--gold-lite)}
.opt input{accent-color:var(--gold-deep); width:17px; height:17px}
.opt.on{border-color:var(--gold-deep); background:linear-gradient(180deg,#fff,#fdf7e9)}
.opt.danger.on{border-color:var(--wine); background:#fbf0f1}

/* ---- The pact / disclosure ---- */
.pact{border:1px solid var(--line); border-left:3px solid var(--gold-deep); background:linear-gradient(180deg,#fff,#fbf7ec);
  border-radius:6px; padding:16px 18px; margin-bottom:16px}
.pact h5{font-family:'Cormorant Garamond'; font-size:1.15rem; margin:0 0 10px; color:var(--navy)}
.pact ul{list-style:none; margin:0; padding:0}
.pact li{position:relative; padding:7px 0 7px 26px; font-size:.9rem; line-height:1.5; border-bottom:1px dashed var(--line)}
.pact li:last-child{border-bottom:0}
.pact li::before{content:"✦"; position:absolute; left:0; top:7px; color:var(--gold-deep); font-size:.8rem}
.pact li b{color:var(--navy)}
.pact.flow li::before{content:"→"; color:var(--wine)}
.rp-note{font-size:.82rem; color:var(--muted); line-height:1.55; margin-top:10px}
.rp-note b{color:var(--wine)}

/* consent */
.consent{display:flex; gap:11px; align-items:flex-start; padding:13px 15px; border:1px solid var(--gold-deep);
  border-radius:6px; background:#fdf7e9; margin-top:6px}
.consent input{margin-top:3px; width:18px; height:18px; accent-color:var(--gold-deep)}
.consent label{font-size:.9rem; line-height:1.5; color:var(--ink)}

/* ---- Evidence ---- */
.drop{border:1.5px dashed var(--gold-deep); border-radius:8px; padding:26px 16px; text-align:center; cursor:pointer;
  background:#fdfaf2; transition:background .16s,border-color .16s}
.drop:hover{background:#fbf4e2}
.drop .ic{font-size:1.7rem}
.drop p{margin:6px 0 0; font-size:.9rem; color:var(--navy); font-weight:600}
.drop small{color:var(--muted)}
.thumbs{display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:10px; margin-top:14px}
.thumb{position:relative; border:1px solid var(--line); border-radius:6px; overflow:hidden; aspect-ratio:1; background:#fff}
.thumb img{width:100%; height:100%; object-fit:cover}
.thumb .doc{display:flex; align-items:center; justify-content:center; height:100%; font-size:.7rem; color:var(--muted); padding:6px; text-align:center}
.thumb button{position:absolute; top:4px; right:4px; width:22px; height:22px; border-radius:50%; border:0;
  background:rgba(110,31,44,.92); color:#fff; cursor:pointer; font-size:.8rem; line-height:1}
.ev-meter{font-size:.76rem; color:var(--muted); margin-top:8px}

/* ---- Messages / success ---- */
.rp-msg{padding:11px 14px; border-radius:6px; font-size:.86rem; margin-top:12px; display:none}
.rp-msg.err{display:block; background:#fbf0f1; border:1px solid var(--wine); color:var(--wine-lite)}
.rp-success{text-align:center; padding:14px 6px}
.rp-success .seal{width:74px; height:74px; margin:0 auto 14px; border-radius:50%;
  background:radial-gradient(circle at 50% 40%,var(--gold-lite),var(--gold-deep)); color:#2a2007;
  display:flex; align-items:center; justify-content:center; font-size:2rem; box-shadow:0 14px 30px -12px rgba(138,107,31,.7)}
.rp-success h4{font-size:1.5rem; margin:0 0 4px}
.rp-caseid{font-family:'Cormorant Garamond'; font-size:1.6rem; color:var(--gold-deep); letter-spacing:.04em; margin:10px 0}
.rp-success .reminder{border:1px solid var(--wine); background:#fbf0f1; border-radius:6px; padding:12px 15px; font-size:.86rem; color:var(--wine-lite); text-align:left; margin-top:14px; line-height:1.5}