/* ══════════════════════════════════════════════════════════════
   WeddingDir Login / Register / Forgot-Password Modal — Theme
   ══════════════════════════════════════════════════════════════ */

/* Modal shell */
.modal-content:has(.sidebar-img) {
  border: none;
  border-radius: var(--mw-radius-lg);
  overflow: hidden;
  box-shadow: var(--mw-shadow-xl);
}

/* Image panel */
.sidebar-img {
  min-height: 420px;
  background-color: var(--mw-primary-light);
  position: relative;
}
.sidebar-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(45, 36, 36, 0.1),
    rgba(45, 36, 36, 0.45)
  );
}

/* Close button */
.modal-content button.close {
  position: absolute;
  top: 0.85rem;
  right: 0.85rem;
  z-index: var(--mw-z-overlay);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid var(--mw-border);
  background: var(--mw-surface);
  color: var(--mw-text-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    background var(--mw-transition),
    color var(--mw-transition),
    border-color var(--mw-transition);
  font-size: 0.75rem;
  line-height: 1;
  padding: 0;
}
.modal-content button.close:hover {
  background: var(--mw-primary);
  color: #fff;
  border-color: var(--mw-primary);
}

/* Form area */
.login-sidebar-pad {
  padding: 2rem 2rem 1.25rem;
  position: relative;
}
.login-sidebar-pad h3 {
  font-family: var(--mw-font-heading);
  font-size: var(--mw-fs-2xl);
  font-weight: 700;
  color: var(--mw-secondary);
  margin-bottom: 0.25rem;
}
.login-sidebar-pad > p,
.login-sidebar-pad > span:not(.feat-cat-pill) {
  font-size: var(--mw-fs-sm);
  color: var(--mw-text-muted);
  display: block;
  margin-bottom: 1rem;
}

/* OR divider */
.or-text {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: var(--mw-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--mw-ls-widest);
  color: var(--mw-text-muted);
  margin: 1rem 0;
}
.or-text::before,
.or-text::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--mw-border);
}

/* Inputs */
.login-sidebar-pad .form-control,
.login-sidebar-pad .form-select {
  height: var(--mw-input-height-md);
  border: var(--mw-border-width-sm) solid var(--mw-border);
  border-radius: var(--mw-radius-md);
  font-family: var(--mw-font-body);
  font-size: var(--mw-fs-sm);
  color: var(--mw-text);
  background: var(--mw-surface);
  padding: 0.5rem 1rem;
  width: 100%;
  margin-bottom: 0.65rem;
  transition:
    border-color var(--mw-transition),
    box-shadow var(--mw-transition);
}
.login-sidebar-pad .form-control:focus,
.login-sidebar-pad .form-select:focus {
  border-color: var(--mw-primary);
  box-shadow: var(--mw-focus-ring);
  outline: none;
}

/* Submit button */
.login-sidebar-pad .btn.btn-default,
.login-sidebar-pad .btn.btn-default.btn-rounded {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: var(--mw-input-height-md);
  background: var(--mw-primary);
  color: #fff !important;
  border: 2px solid var(--mw-primary);
  border-radius: var(--mw-radius-full);
  font-family: var(--mw-font-body);
  font-weight: 600;
  font-size: var(--mw-fs-sm);
  letter-spacing: var(--mw-ls-normal);
  cursor: pointer;
  transition:
    background var(--mw-transition),
    border-color var(--mw-transition),
    transform var(--mw-duration-fast) var(--mw-ease),
    box-shadow var(--mw-transition);
  box-shadow: 0 4px 14px rgba(196, 137, 106, 0.25);
  margin-top: 0.25rem;
}
.login-sidebar-pad .btn.btn-default:hover {
  background: var(--mw-primary-dark) !important;
  border-color: var(--mw-primary-dark) !important;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(196, 137, 106, 0.4);
}

/* Text links */
.btn-link-primary {
  color: var(--mw-primary);
  font-weight: 600;
  text-decoration: none;
  transition: color var(--mw-transition);
}
.btn-link-primary:hover {
  color: var(--mw-primary-dark);
  text-decoration: underline;
}
.btn-link-default {
  color: var(--mw-secondary);
  font-weight: 600;
  font-size: var(--mw-fs-sm);
  text-decoration: none;
  transition: color var(--mw-transition);
}
.btn-link-default:hover {
  color: var(--mw-primary);
}

/* Footer strip */
.login-footer {
  padding: 1rem 2rem 1.25rem;
  border-top: 1px solid var(--mw-border);
  background: var(--mw-bg);
  text-align: center;
  font-size: var(--mw-fs-sm);
  color: var(--mw-text-muted);
}
.login-footer .or-text {
  margin: 0 0 0.4rem;
  justify-content: center;
}
.login-footer .or-text::before,
.login-footer .or-text::after {
  display: none;
}

/* Register form (tighter top) */
.login-sidebar-pad.register-form {
  padding-top: 1.25rem;
}

/* Social login buttons spacing */
.social-logins-btn {
  margin-bottom: 0.5rem;
}

/* Forgot-password link alignment */
.login-sidebar-pad .col-12 > a.btn-link-primary {
  display: inline-block;
  margin-bottom: 0.5rem;
  font-size: var(--mw-fs-sm);
}

/* Mobile: hide sidebar-img on small screens (already d-none d-lg-block, just enforce) */
@media (max-width: 991px) {
  .sidebar-img {
    display: none !important;
  }
  .login-sidebar-pad {
    padding: 1.5rem;
  }
  .login-footer {
    padding: 0.85rem 1.5rem 1rem;
  }
}

/* ══════════════════════════════════════════════════════════════
   Logout Page
   ══════════════════════════════════════════════════════════════ */

.mw-logout-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
}

/* Image panel */
.mw-logout-img {
  position: relative;
  background: linear-gradient(135deg, var(--mw-secondary) 0%, #5a3535 100%)
    center/cover no-repeat;
  overflow: hidden;
}
.mw-logout-img::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom right,
    rgba(196, 137, 106, 0.35),
    rgba(45, 36, 36, 0.6)
  );
}
.mw-logout-img-brand {
  position: absolute;
  top: 2.5rem;
  left: 2.5rem;
  z-index: 2;
  font-family: var(--mw-font-heading);
  font-size: var(--mw-fs-3xl);
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
.mw-logout-img-brand span {
  color: var(--mw-primary-light);
}
.mw-logout-img-tagline {
  position: absolute;
  bottom: 2.5rem;
  left: 2.5rem;
  right: 2.5rem;
  z-index: 2;
  color: rgba(255, 255, 255, 0.85);
  font-size: var(--mw-fs-lg);
  font-family: var(--mw-font-heading);
  line-height: var(--mw-lh-snug);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

/* Form panel */
.mw-logout-panel {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--mw-surface);
  padding: 3rem 2rem;
}
.mw-logout-box {
  width: 100%;
  max-width: 420px;
  text-align: center;
}

/* Icon */
.mw-logout-icon {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  background: var(--mw-primary-light);
  color: var(--mw-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  margin: 0 auto 1.5rem;
}
.mw-logout-icon--success {
  background: #edf7ee;
  color: #3a8a40;
}

/* Title + desc */
.mw-logout-title {
  font-size: var(--mw-fs-3xl);
  font-weight: 700;
  color: var(--mw-secondary);
  margin-bottom: 0.75rem;
  line-height: var(--mw-lh-tight);
}
.mw-logout-desc {
  font-size: var(--mw-fs-md);
  color: var(--mw-text-muted);
  line-height: var(--mw-lh-relaxed);
  margin-bottom: 2rem;
}

/* Action buttons */
.mw-logout-actions {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.mw-logout-actions .btn-mw-primary,
.mw-logout-actions .btn-mw-outline {
  width: 100%;
  justify-content: center;
  padding: 0.75rem 1.5rem;
}

/* Ornament divider */
.mw-logout-ornament {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--mw-primary);
  margin-bottom: 1.5rem;
  justify-content: center;
}
.mw-logout-ornament::before,
.mw-logout-ornament::after {
  content: "";
  flex: 1;
  max-width: 60px;
  height: 1px;
  background: var(--mw-primary);
  opacity: 0.4;
}

/* Mobile — blurred gallery bg, form as card overlay */
@media (max-width: 767px) {
  .mw-logout-wrap {
    display: block;
    position: relative;
    min-height: 100vh;
  }

  /* Background: full-screen blurred slideshow */
  .mw-logout-img {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 0;
    filter: blur(10px);
    transform: scale(1.08); /* cover blur edges */
  }
  .mw-logout-img::after {
    background: rgba(45, 36, 36, 0.5); /* darker overlay on mobile */
  }

  /* Form panel: centered over blurred bg */
  .mw-logout-panel {
    position: relative;
    z-index: 1;
    min-height: 100vh;
    background: transparent;
    padding: 2rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Card */
  .mw-logout-box,
  .mw-auth-box {
    background: rgba(255, 255, 255, 1);
    border-radius: var(--mw-radius-lg);
    padding: 2rem 1.5rem;
    box-shadow: var(--mw-shadow-xl);
    width: 100%;
    max-width: 420px;
  }
}

/* ══════════════════════════════════════════════════════════════
   Frontend Login Page (page-login.php)
   ══════════════════════════════════════════════════════════════ */

.mw-auth-box {
  text-align: left;
}

.mw-auth-logo {
  text-align: center;
  margin-bottom: 1.75rem;
}
.mw-auth-logo a {
  display: inline-block;
  text-decoration: none;
}
.mw-auth-logo img {
  max-height: 100px;
  width: auto;
  display: block;
  margin: 0 auto;
}

.mw-auth-box .mw-logout-title {
  text-align: center;
}
.mw-auth-box .mw-logout-desc {
  text-align: center;
}

/* Error notice */
.mw-auth-error {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  background: #fce8e8;
  border-left: 4px solid #d63638;
  border-radius: var(--mw-radius-md);
  color: #8a1c1e;
  font-size: var(--mw-fs-sm);
  padding: 0.75rem 1rem;
  margin-bottom: 1.25rem;
}

/* Form fields */
.mw-auth-form {
  width: 100%;
}

.mw-auth-field {
  margin-bottom: 1rem;
}
.mw-auth-field label {
  display: block;
  font-size: var(--mw-fs-xs);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: var(--mw-ls-wider);
  color: var(--mw-text-muted);
  margin-bottom: 0.4rem;
}
.mw-auth-field input {
  display: block;
  width: 100%;
  height: 44px;
  border: 1px solid var(--mw-border);
  border-radius: var(--mw-radius-md);
  font-family: var(--mw-font-body);
  font-size: var(--mw-fs-sm);
  color: var(--mw-text);
  background: var(--mw-bg);
  padding: 0.35rem 0.85rem;
  box-sizing: border-box;
  box-shadow: none;
  transition:
    border-color var(--mw-transition),
    box-shadow var(--mw-transition);
}
.mw-auth-field input:focus {
  border-color: var(--mw-primary);
  box-shadow: var(--mw-focus-ring);
  outline: none;
  background: var(--mw-surface);
}

/* Remember + forgot row */
.mw-auth-remember {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
  font-size: var(--mw-fs-sm);
}
.mw-auth-remember label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--mw-text-muted);
  cursor: pointer;
  font-weight: 500;
}
.mw-auth-remember input[type="checkbox"] {
  accent-color: var(--mw-primary);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  cursor: pointer;
}
.mw-auth-forgot {
  font-size: var(--mw-fs-sm);
  color: var(--mw-primary);
  text-decoration: none;
  font-weight: 600;
  transition: color var(--mw-transition);
}
.mw-auth-forgot:hover {
  color: var(--mw-primary-dark);
  text-decoration: underline;
}

/* Social login */
.mw-auth-social {
  margin-top: 1rem;
}

/* Footer link */
.mw-auth-footer {
  text-align: center;
  font-size: var(--mw-fs-sm);
  color: var(--mw-text-muted);
  margin-top: 1.25rem;
  margin-bottom: 0;
}

/* ── Login page image slideshow ── */
.mw-login-slideshow-wrap {
  overflow: hidden;
}

.mw-login-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 1.2s ease;
}
.mw-login-slide.active {
  opacity: 1;
}

/* ── Auth page entrance animations ── */
.mw-auth-page .mw-logout-panel {
  animation: mw-fadeIn 0.65s ease 0.2s both;
}