/* Editor de foto de perfil */
.lpfp-wrap{ margin:10px 0; }

.lpfp-panel{
  display:grid; grid-template-columns: 1fr auto; align-items:center; gap:8px;
  position:relative; z-index:0;
}
.lpfp-help{ margin:0; font-size:12px; color:#6b7280; line-height:1.4; }

/* Match 'Desactivar mi anuncio' button style */
.lpfp-btn{
  -webkit-appearance:none; appearance:none;
  background:#d9125e !important;
  color:#fff !important;
  font-size:15px;
  line-height:1;
  padding:12px 22px;
  border:0 !important;
  border-radius:9999px;
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  box-shadow:0 6px 16px rgba(217,18,94,0.25);
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.lpfp-btn:hover{ transform:translateY(-1px); filter:brightness(.97); }
.lpfp-btn:active{ transform:translateY(0); filter:brightness(.93); }
.lpfp-btn:focus-visible{ outline:2px solid #2c2a5f; outline-offset:2px; }
.lpfp-btn[disabled]{ opacity:.6; cursor:not-allowed; }

/* Prevent theme button styles leaking in */
button.lpfp-btn.button,
button.lpfp-btn.button-secondary,
button.lpfp-btn.button-primary{
  all: initial;
  font-family: inherit;
  -webkit-appearance:none; appearance:none;
  background:#d9125e !important;
  color:#fff !important;
  font-size:15px;
  line-height:1;
  padding:12px 22px;
  border:0 !important;
  border-radius:9999px;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  box-shadow:0 6px 16px rgba(217,18,94,0.25);
  cursor:pointer;
}


.lpfp-btn:hover{ background:#b80f4b; opacity:1; }

/* Overlay idéntico */
.lpfp-overlay{
  position:fixed; inset:0; z-index:9999;
  display:grid; grid-template-rows:auto 1fr auto;
  background:rgba(0,0,0,.85); opacity:0; pointer-events:none; transition:opacity .15s ease;
}
.lpfp-overlay.is-open{ opacity:1; pointer-events:auto; }
.lpfp-topbar{ height:12px; } /* visual neutral */
.lpfp-stage{ position:relative; width:100%; height:100%; display:grid; place-items:center; }
#lpfp-canvas{ background:#111; border:none !important; outline:none !important; max-width:96vw; max-height:70vh; }

/* Marco: solo oscurece por fuera; borde blanco fino */
.lpfp-frame{
  position:absolute; pointer-events:none;
  border:2px solid rgba(255,255,255,.95);
  background:transparent;
  box-shadow:0 0 0 9999px rgba(0,0,0,.6);
}

/* Hint */
.lpfp-hint{
  position:absolute; top:12px; left:50%; transform:translateX(-50%);
  background:rgba(0,0,0,.55); color:#fff; padding:6px 10px; border-radius:999px; font-size:13px;
  pointer-events:none;
}

/* Acciones flotantes (igual que cabecera) */
.lpfp-actions-floating{
  position:absolute; right:14px; bottom:14px;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.2);
  border-radius:12px; padding:8px; z-index:10001;
  box-shadow:0 6px 24px rgba(0,0,0,.35);
  display:flex; gap:8px; align-items:center;
}
.lpfp-action{
  display:inline-flex; align-items:center; justify-content:center;
  padding:10px 14px; border-radius:10px;
  border:0 !important; outline:0 !important; appearance:none;
  background:#2c2a5f; color:#fff; font-weight:700; cursor:pointer;
  box-shadow:none !important;
}
.lpfp-action:focus, .lpfp-action:active, .lpfp-action:hover{
  border:0 !important; outline:0 !important; box-shadow:none !important;
}
.lpfp-action.ghost{ background:#6b7280; border:0 !important; }
.lpfp-action.ghost{ background:#6b7280; border:none !important; }

/* Blindaje contra bordes punteados heredados */
.lpfp-overlay, .lpfp-overlay *, .lpfp-stage, .lpfp-stage *{
  outline:none !important; border-style:solid !important;
}


/* Column layout: button above, text below */
.lpfp-panel{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:6px;
}
.lpfp-btn{ order:0; }
.lpfp-help{ order:1; }


/* Hint: gray text only, no rounded background */
.lpfp-hint{
  position:absolute; top:12px; left:50%; transform:translateX(-50%);
  background:transparent !important;
  color:#9ca3af !important;
  padding:0 !important;
  border-radius:0 !important;
  font-size:12px !important;
  text-shadow:none !important;
  border:none !important;
}


/* Remove borders on Save/Cancel buttons (hard override) */
.lpfp-action,
.lpfp-action:hover,
.lpfp-action:focus,
.lpfp-action:active{
  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
  border-color:transparent !important;
}
.lpfp-action.ghost{
  background:#6b7280 !important;
  border:0 !important;
  box-shadow:none !important;
}


/* 1. Center align panel (button above, text below) */
.lpfp-panel{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  text-align:center;
  width:100%;
}
.lpfp-help{ text-align:center; }

/* 2. Black border for Save/Cancel (hard override) */
.lpfp-actions-floating .lpfp-action,
.lpfp-actions-floating .lpfp-action:hover,
.lpfp-actions-floating .lpfp-action:focus,
.lpfp-actions-floating .lpfp-action:active{
  border:1px solid #000 !important;
  outline:0 !important;
  box-shadow:none !important;
}
.lpfp-actions-floating .lpfp-action.ghost{
  border:1px solid #000 !important;
}