/* ============================================================
   log-wizard.css - Estilos del Wizard post-alistamiento
   Panel modal con 3 acciones rápidas: Siigo / Despacho / Guía
   ============================================================ */

.log-wiz-overlay {
  position: fixed; inset: 0;
  background: rgba(8, 71, 52, .55);
  backdrop-filter: blur(4px);
  z-index: 1000;
  display: none;
  align-items: center; justify-content: center;
  padding: 1rem;
  animation: logWizFadeIn .25s ease;
}

@keyframes logWizFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.log-wiz {
  background: var(--brand-surface, #fff);
  border-radius: 18px;
  width: 100%; max-width: 560px;
  box-shadow: 0 24px 48px rgba(0, 0, 0, .18);
  overflow: hidden;
  animation: logWizSlideUp .3s cubic-bezier(.2, .8, .2, 1);
  border: 1px solid var(--brand-border, #E5E7EB);
}

@keyframes logWizSlideUp {
  from { transform: translateY(24px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}

/* ── Head con éxito ── */
.log-wiz__head {
  display: flex; align-items: center; gap: .85rem;
  padding: 1.1rem 1.25rem;
  background: linear-gradient(135deg,
    rgba(147, 193, 31, .12),
    rgba(206, 244, 49, .08));
  border-bottom: 1px solid var(--brand-border, #E5E7EB);
  position: relative;
}

.log-wiz__success {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--brand-accent, #93C11F);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.35rem;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(147, 193, 31, .35);
  animation: logWizPop .4s cubic-bezier(.3, 1.5, .5, 1);
}

@keyframes logWizPop {
  0% { transform: scale(0); }
  80% { transform: scale(1.15); }
  100% { transform: scale(1); }
}

.log-wiz__title {
  font-size: 1.05rem; font-weight: 700;
  color: var(--brand-text, #1F2937);
  line-height: 1.2;
}

.log-wiz__sub {
  font-size: .8rem;
  color: var(--brand-text-muted, #6B7280);
  margin-top: .2rem;
  line-height: 1.3;
}

.log-wiz__close {
  position: absolute; top: .6rem; right: .75rem;
  width: 30px; height: 30px;
  border-radius: 8px;
  background: transparent;
  border: none; cursor: pointer;
  color: var(--brand-text-muted, #6B7280);
  display: flex; align-items: center; justify-content: center;
  transition: all .15s ease;
}
.log-wiz__close:hover {
  background: rgba(0, 0, 0, .05);
  color: var(--brand-text, #1F2937);
}

/* ── Body ── */
.log-wiz__body {
  padding: 1rem 1.25rem;
}

.log-wiz__steps {
  display: flex; flex-direction: column;
  gap: .6rem;
}

/* ── Step ── */
.log-wiz-step {
  display: flex; align-items: center; gap: .85rem;
  padding: .85rem;
  border-radius: 12px;
  background: var(--brand-bg, #F6F4F4);
  border: 1px solid var(--brand-border, #E5E7EB);
  transition: all .2s ease;
}
.log-wiz-step:hover {
  border-color: var(--brand-accent, #93C11F);
  background: var(--brand-surface, #fff);
}
.log-wiz-step--done {
  background: rgba(147, 193, 31, .08);
  border-color: rgba(147, 193, 31, .35);
}

.log-wiz-step__icon {
  width: 40px; height: 40px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: .95rem;
  flex-shrink: 0;
}
.log-wiz-step__icon--accent     { background: var(--brand-accent, #93C11F); }
.log-wiz-step__icon--secondary  { background: var(--brand-secondary, #014651); }
.log-wiz-step__icon--primary    { background: var(--brand-primary, #084734); }

.log-wiz-step--done .log-wiz-step__icon {
  background: #16A34A !important;
}

.log-wiz-step__info {
  flex: 1; min-width: 0;
}
.log-wiz-step__title {
  font-size: .9rem; font-weight: 600;
  color: var(--brand-text, #1F2937);
  line-height: 1.2;
}
.log-wiz-step__desc {
  font-size: .75rem;
  color: var(--brand-text-muted, #6B7280);
  margin-top: .15rem;
  line-height: 1.3;
}

.log-wiz-btn {
  flex-shrink: 0;
  white-space: nowrap;
}
.log-wiz-btn:disabled {
  opacity: .6; cursor: not-allowed;
}

/* ── Foot ── */
.log-wiz__foot {
  display: flex; justify-content: space-between;
  gap: .5rem; flex-wrap: wrap;
  padding: .85rem 1.25rem;
  background: var(--brand-bg, #F6F4F4);
  border-top: 1px solid var(--brand-border, #E5E7EB);
}

/* ── Responsive ── */
@media (max-width: 520px) {
  .log-wiz { border-radius: 14px; }
  .log-wiz__head { padding: .9rem 1rem; }
  .log-wiz__success { width: 40px; height: 40px; font-size: 1.15rem; }
  .log-wiz__title { font-size: .95rem; }
  .log-wiz-step { flex-wrap: wrap; }
  .log-wiz-step__info { flex: 1 1 calc(100% - 56px); }
  .log-wiz-btn { flex: 1 1 100%; margin-top: .25rem; }
  .log-wiz__foot { flex-direction: column-reverse; }
  .log-wiz__foot .btn { width: 100%; }
}

/* Dark mode */
html[data-theme="dark"] .log-wiz {
  background: var(--brand-surface);
}
html[data-theme="dark"] .log-wiz__head {
  background: linear-gradient(135deg,
    rgba(147, 193, 31, .15),
    rgba(206, 244, 49, .05));
}
html[data-theme="dark"] .log-wiz-step {
  background: var(--brand-bg);
}
html[data-theme="dark"] .log-wiz-step:hover {
  background: var(--brand-surface);
}
