/* ServiHogar V16: editor local de fotos de perfil. */

body.photo-editor-open{overflow:hidden}
.photo-editor[hidden]{display:none!important}
.photo-editor{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  padding:max(14px,env(safe-area-inset-top)) 14px max(14px,env(safe-area-inset-bottom));
  background:rgba(5,24,48,.76);
  -webkit-backdrop-filter:blur(9px);
  backdrop-filter:blur(9px);
}
.photo-editor-panel{
  width:min(100%,460px);
  max-height:calc(100dvh - 28px);
  overflow:auto;
  overscroll-behavior:contain;
  border:1px solid #c7d8e8;
  border-radius:24px;
  background:#fffefa;
  box-shadow:0 26px 80px rgba(0,20,48,.32);
}
.photo-editor-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  padding:18px 18px 12px;
}
.photo-editor-head h2{margin:0;color:#123255;font-size:1.35rem;line-height:1.12}
.photo-editor-head p{margin:5px 0 0;color:#536980;font-size:.84rem;line-height:1.38}
.photo-editor-close{
  flex:0 0 44px;
  width:44px;
  height:44px;
  border:1px solid #c8d8e8;
  border-radius:14px;
  background:#fff;
  color:#123255;
  font-size:1.5rem;
  line-height:1;
  cursor:pointer;
}
.photo-editor-close:hover{background:#eef6ff}
.photo-editor-close:focus-visible,
.photo-editor button:focus-visible,
.photo-editor input:focus-visible{outline:3px solid #064aa8;outline-offset:3px}
.photo-editor-stage{
  position:relative;
  margin:0 18px;
  overflow:hidden;
  border:1px solid #bfd2e5;
  border-radius:22px;
  background:#dfeaf5;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.8);
}
.photo-editor-stage::after{
  content:"";
  position:absolute;
  inset:8%;
  border:2px solid rgba(255,255,255,.94);
  border-radius:50%;
  box-shadow:0 0 0 100vmax rgba(7,35,67,.18);
  pointer-events:none;
}
.photo-editor-canvas{
  display:block;
  width:100%;
  aspect-ratio:1;
  touch-action:none;
  cursor:grab;
}
.photo-editor-canvas.is-dragging{cursor:grabbing}
.photo-editor-tools{display:grid;gap:13px;padding:15px 18px 8px}
.photo-editor-rotate{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.photo-editor-tool{
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid #c8d8e8;
  border-radius:14px;
  background:#f6faff;
  color:#123255;
  font:inherit;
  font-size:.86rem;
  font-weight:780;
  cursor:pointer;
}
.photo-editor-tool:hover{border-color:#7ea9d4;background:#eaf4ff}
.photo-editor-zoom{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;color:#123255;font-size:.84rem;font-weight:750}
.photo-editor-zoom input{width:100%;accent-color:#0759b2}
.photo-editor-hint{margin:0;padding:0 18px;color:#536980;font-size:.77rem;text-align:center}
.photo-editor-error{min-height:20px;margin:6px 18px 0;color:#a72838;font-size:.8rem;text-align:center}
.photo-editor-actions{display:grid;grid-template-columns:1fr 1.35fr;gap:9px;padding:10px 18px 18px}
.photo-editor-actions .button{width:100%;min-height:48px}

@media(max-width:420px){
  .photo-editor{padding-inline:8px}
  .photo-editor-panel{border-radius:20px}
  .photo-editor-head{padding:14px 14px 10px}
  .photo-editor-stage{margin-inline:14px}
  .photo-editor-tools{padding-inline:14px}
  .photo-editor-actions{padding:9px 14px 14px}
}

@media(prefers-reduced-motion:reduce){
  .photo-editor,.photo-editor *{scroll-behavior:auto!important;transition:none!important}
}