/* ═══════════════════════════════════════════════
   MIKANAH SUITE — Modal de Zona v3.1
   ═══════════════════════════════════════════════ */

/* ── Variables ── */
:root{
  --mk-brand:    #76236c;
  --mk-brand-l:  #9b3a8e;
  --mk-bg:       #ffffff;
  --mk-text:     #1e293b;
  --mk-muted:    #64748b;
  --mk-border:   #e2e8f0;
  --mk-radius:   14px;
  --mk-shadow:   0 20px 60px rgba(0,0,0,.18);
}

/* ── Overlay ── */
#mkz-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.55);
  z-index:99998;backdrop-filter:blur(3px);
}

/* ── Wizard container ── */
#mkz-wizard{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:99999;width:min(420px,92vw);
  background:var(--mk-bg);border-radius:var(--mk-radius);
  box-shadow:var(--mk-shadow);overflow:hidden;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
}

/* ── Header ── */
.mkz-header{
  background:var(--mk-brand);color:#fff;
  padding:16px 22px;display:flex;align-items:center;
  font-weight:700;font-size:15px;letter-spacing:.3px;
}
.mkz-title{ flex:1; }

/* ── Paso ── */
.mkz-step{ padding:28px 26px 24px;display:none; }
.mkz-step.active{ display:block; }

.mkz-wizard-icon{ font-size:38px;text-align:center;margin-bottom:12px; }

#mkz-wizard h2{
  margin:0 0 6px;font-size:18px;font-weight:700;
  color:var(--mk-text);text-align:center;
}
#mkz-wizard p{
  margin:0 0 18px;font-size:13px;color:var(--mk-muted);
  text-align:center;line-height:1.5;
}

/* ── Input CP ── */
#mkz-cp{
  display:block;width:100%;box-sizing:border-box;
  padding:13px 16px;font-size:22px;font-weight:700;letter-spacing:4px;
  text-align:center;border:2px solid var(--mk-border);border-radius:10px;
  outline:none;transition:border .2s;color:var(--mk-text);
  background:#f8fafc;
}
#mkz-cp:focus{ border-color:var(--mk-brand);background:#fff; }

/* ── Error ── */
.mkz-error-msg{
  min-height:18px;margin:8px 0 4px;font-size:12px;
  color:#dc2626;text-align:center;line-height:1.4;
}

/* ── Botón principal ── */
#mkz-next{
  display:block;width:100%;margin-top:14px;
  padding:13px;background:var(--mk-brand);color:#fff;
  border:none;border-radius:10px;font-size:15px;font-weight:700;
  cursor:pointer;transition:background .18s,transform .1s;
}
#mkz-next:hover{ background:var(--mk-brand-l); }
#mkz-next:active{ transform:scale(.98); }
#mkz-next:disabled{ opacity:.6;cursor:not-allowed; }

/* ── Botón "Continuar sin CP" ── */
.mkz-btn-skip{
  display:block;width:100%;margin-top:10px;
  padding:11px;background:transparent;color:var(--mk-muted);
  border:1.5px solid var(--mk-border);border-radius:10px;
  font-size:13px;font-weight:500;cursor:pointer;
  transition:border-color .18s,color .18s;
}
.mkz-btn-skip:hover{ border-color:var(--mk-brand);color:var(--mk-brand); }

/* ── Prevenir scroll ── */
body.mkz-no-scroll{ overflow:hidden !important; }

/* ── Barra flotante ── */
#mkz-floatbar{
  display:none;position:fixed;bottom:0;left:0;right:0;
  background:#fff;border-top:1px solid var(--mk-border);
  box-shadow:0 -4px 20px rgba(0,0,0,.08);
  z-index:9990;padding:10px 16px;
}
.mkz-floatbar-inner{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;
}
#mkz-float-text{
  flex:1;font-size:13px;color:var(--mk-text);min-width:0;
}
.mkz-float-sub{ opacity:.7;font-size:12px; }
.mkz-where{ cursor:pointer;font-weight:700;color:var(--mk-brand); }

.mkz-float-action{
  padding:7px 16px;border-radius:8px;border:none;
  font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;
}
.mkz-float-action.is-mk{
  background:var(--mk-brand);color:#fff;
}
.mkz-float-action.is-warn{
  background:#fef3c7;color:#92400e;border:1.5px solid #fcd34d;
}

/* ── Topbar ── */
#mkz-topbar{
  background:var(--mk-brand);color:#fff;
  font-size:12px;text-align:center;padding:6px 12px;
  position:relative;z-index:100;
}
#mkz-topbar a,#mkz-topbar span[style*="cursor"]{
  color:#fde68a !important;
}

/* ── Modal detección GPS/IP ── */
#mkz-detect-modal{
  display:none;position:fixed;inset:0;
  background:rgba(0,0,0,.55);z-index:99999;
  align-items:center;justify-content:center;
  backdrop-filter:blur(3px);
}
.mkz-detect-box{
  background:#fff;border-radius:var(--mk-radius);
  padding:30px 26px;max-width:360px;width:90%;
  box-shadow:var(--mk-shadow);text-align:center;position:relative;
}
.mkz-detect-close{
  position:absolute;top:12px;right:14px;
  background:none;border:none;font-size:18px;
  cursor:pointer;color:var(--mk-muted);
}
.mkz-detect-icon{ font-size:36px;margin-bottom:10px; }
.mkz-detect-text{ font-size:14px;color:var(--mk-text);line-height:1.6;margin-bottom:18px; }
.mkz-detect-actions{ display:flex;gap:10px;flex-wrap:wrap;justify-content:center; }
.mkz-detect-actions button{
  padding:10px 20px;border-radius:8px;border:none;
  font-size:13px;font-weight:600;cursor:pointer;
}
#mkz-detect-ok{ background:var(--mk-brand);color:#fff; }
#mkz-detect-change{ background:#f1f5f9;color:var(--mk-text); }

/* ── Loader pantalla completa ── */
#mkz-loading-overlay{
  position:fixed;inset:0;background:rgba(255,255,255,.92);
  z-index:999999;display:flex;align-items:center;justify-content:center;
}
.mkz-loading-box{ text-align:center; }
.mkz-spinner{
  width:44px;height:44px;border:4px solid #e2e8f0;
  border-top-color:var(--mk-brand);border-radius:50%;
  margin:0 auto 14px;animation:mkz-spin .8s linear infinite;
}
.mkz-loading-text{
  font-size:14px;color:var(--mk-muted);font-weight:500;
  transition:opacity .2s;
}
@keyframes mkz-spin{ to{transform:rotate(360deg)} }
