/* ===== Modo edición de Dana (solo se ve si inició sesión) ===== */

/* --- Barra inferior --- */
.dana-bar{
  position:fixed; right:18px; bottom:18px;
  z-index:900; display:flex; align-items:center; gap:.6rem;
  background:rgba(255,255,255,.97); border:1px solid #f0d8e6;
  border-radius:999px; padding:.5rem .7rem;
  box-shadow:0 10px 30px rgba(160,106,147,.28);
  font-family:'Quicksand',system-ui,sans-serif;
  max-width:calc(100vw - 24px);
}
.dana-bar button{
  font:inherit; font-weight:700; font-size:.9rem; cursor:pointer;
  border:0; border-radius:999px; padding:.55rem 1rem; white-space:nowrap;
  background:#f7eef4; color:#7e5176; transition:filter .15s, transform .15s;
}
.dana-bar button:hover{ filter:brightness(.96); transform:translateY(-1px); }
.dana-bar button.on{ background:linear-gradient(135deg,#f4a6c0,#c98bb4); color:#fff; }
.dana-bar .dana-bar-hint{ font-size:.8rem; color:#a06a93; padding:0 .3rem; }
@media(max-width:620px){
  .dana-bar{ left:10px; right:10px; bottom:10px; justify-content:center; gap:.35rem; padding:.4rem .5rem; }
  .dana-bar button{ padding:.5rem .7rem; font-size:.82rem; }
  .dana-bar .dana-bar-hint{ display:none; }
}

/* --- Resaltado de lo editable --- */
.dana-edit [data-s]{
  outline:2px dashed #e5a9c8; outline-offset:4px; border-radius:6px;
  cursor:pointer; transition:background .15s;
}
.dana-edit [data-s]:hover{ background:#fdf2f8; }

.dana-edit .dana-zone{ position:relative; }
.dana-zone-btn{
  position:absolute; z-index:60; top:10px; left:10px;
  font:600 .8rem 'Quicksand',system-ui,sans-serif; cursor:pointer;
  border:0; border-radius:999px; padding:.45rem .8rem;
  background:rgba(255,255,255,.95); color:#7e5176;
  box-shadow:0 4px 14px rgba(0,0,0,.18);
}
.dana-zone-btn:hover{ background:#fff; }
.dana-zone-btn.right{ left:auto; right:10px; }

/* --- Botones sobre tarjetas (videos, servicios, etc.) --- */
.dana-card-tools{
  position:absolute; z-index:60; top:8px; right:8px; display:flex; gap:.3rem;
}
.dana-card-tools button{
  font:600 .85rem 'Quicksand',system-ui,sans-serif; cursor:pointer;
  border:0; border-radius:50%; width:30px; height:30px; line-height:1;
  background:rgba(255,255,255,.95); color:#7e5176;
  box-shadow:0 3px 10px rgba(0,0,0,.2);
}
.dana-card-tools button:hover{ background:#fff; }
.dana-edit .vcard, .dana-edit .scard, .dana-edit .rcard,
.dana-edit .ocard, .dana-edit .marca-card{ position:relative; }
.dana-edit .vcard-empty{ cursor:pointer; outline:2px dashed #e5a9c8; outline-offset:3px; }

/* --- Ventana de edición --- */
.dana-modal{
  position:fixed; inset:0; z-index:1000; display:flex;
  align-items:center; justify-content:center; padding:16px;
  font-family:'Quicksand',system-ui,sans-serif;
}
.dana-modal-bg{ position:absolute; inset:0; background:rgba(60,30,50,.55); backdrop-filter:blur(3px); }
.dana-modal-card{
  position:relative; background:#fff; border-radius:20px; padding:1.5rem;
  width:min(560px,100%); max-height:88vh; overflow:auto;
  box-shadow:0 20px 60px rgba(90,50,80,.35);
}
.dana-modal-card h3{
  margin:0 0 1rem; font-family:'Cormorant Garamond',serif;
  font-size:1.6rem; color:#7e5176; font-weight:600;
}
.dana-modal-card label{
  display:block; margin:.9rem 0 .3rem;
  font-size:.82rem; font-weight:700; color:#a06a93; letter-spacing:.02em;
}
.dana-modal-card input[type=text],
.dana-modal-card textarea,
.dana-modal-card select{
  width:100%; font:inherit; font-size:.95rem; color:#4a3550;
  border:1.5px solid #eddbe7; border-radius:12px; padding:.7rem .85rem;
  background:#fdfafc; box-sizing:border-box;
}
.dana-modal-card textarea{ min-height:150px; resize:vertical; line-height:1.55; }
.dana-modal-card input:focus, .dana-modal-card textarea:focus, .dana-modal-card select:focus{
  outline:0; border-color:#e5a9c8; background:#fff;
}
.dana-modal-actions{ display:flex; gap:.6rem; margin-top:1.3rem; flex-wrap:wrap; }
.dana-btn{
  font:inherit; font-weight:700; font-size:.92rem; cursor:pointer;
  border:0; border-radius:999px; padding:.7rem 1.3rem;
}
.dana-btn-primary{ background:linear-gradient(135deg,#f4a6c0,#c98bb4); color:#fff; }
.dana-btn-ghost{ background:#f7eef4; color:#7e5176; }
.dana-btn-danger{ background:#fdeaea; color:#c0392b; margin-left:auto; }
.dana-btn:disabled{ opacity:.55; cursor:default; }
.dana-hint{ font-size:.8rem; color:#a06a93; margin:.4rem 0 0; line-height:1.5; }
.dana-file-row{ display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; margin-top:.4rem; }
.dana-preview{
  margin-top:.7rem; border-radius:12px; overflow:hidden;
  max-height:220px; display:flex; justify-content:center; background:#faf3f8;
}
.dana-preview img, .dana-preview video{ max-height:220px; max-width:100%; object-fit:contain; }

/* --- Avisos --- */
.dana-toast{
  position:fixed; left:50%; bottom:92px; transform:translateX(-50%);
  z-index:1100; background:#4a3550; color:#fff; font-family:'Quicksand',system-ui,sans-serif;
  font-size:.9rem; font-weight:600; padding:.7rem 1.2rem; border-radius:999px;
  box-shadow:0 8px 24px rgba(0,0,0,.28); max-width:calc(100vw - 32px); text-align:center;
}
.dana-toast.err{ background:#c0392b; }
.dana-toast.ok{ background:linear-gradient(135deg,#a06a93,#7e5176); }

/* Barra de progreso de subida */
.dana-progress{ height:6px; border-radius:999px; background:#f2e2ec; overflow:hidden; margin-top:.8rem; }
.dana-progress span{ display:block; height:100%; width:0; background:linear-gradient(90deg,#f4a6c0,#c98bb4); transition:width .2s; }

/* En celular todo debe ser fácil de tocar con el dedo */
@media(max-width:620px){
  .dana-card-tools button{ width:38px; height:38px; font-size:1rem; }
  .dana-card-tools{ top:6px; right:6px; gap:.4rem; }
  .dana-zone-btn{ padding:.6rem 1rem; font-size:.85rem; }
  .dana-modal-card{ padding:1.2rem; border-radius:16px; max-height:92vh; }
  .dana-modal-card textarea{ min-height:180px; font-size:1rem; }
  .dana-modal-card input[type=text], .dana-modal-card select{ font-size:1rem; }
  .dana-btn{ padding:.8rem 1.2rem; }
  .dana-modal-actions{ position:sticky; bottom:0; background:#fff; padding-top:.6rem; }
}