/* =========================
   MozaViajes - Site Theme
   ========================= */

:root{
  /* ===== Paleta oficial MozaViajes ===== */
  --mv-blue: #193D6E;
  --mv-magenta: #B12A53;
  --mv-pink: #E54770;
  --mv-night: #141B31;

  /* Neutrales */
  --mv-bg: #f6f7fb;
  --mv-surface: #ffffff;
  --mv-muted: #6b7280;

  /* Degradados oficiales */
  --mv-gradient: linear-gradient(135deg, var(--mv-blue) 0%, var(--mv-magenta) 55%, var(--mv-pink) 100%);
  --mv-gradient-dark: linear-gradient(180deg, #0f1630 0%, var(--mv-night) 60%, #0b1220 100%);

  /* UI tokens */
  --mv-radius: 18px;
  --mv-radius-sm: 12px;
  --mv-shadow: 0 14px 30px rgba(20,27,49,.08);
  --mv-shadow-strong: 0 22px 55px rgba(20,27,49,.35);
  --mv-border: 1px solid rgba(20,27,49,.10);
}

html, body { height: 100%; }

body{
  background: var(--mv-bg);
  color: var(--mv-night);
  font-size: 0.95rem;
}

a{ text-decoration: none; }
.table td, .table th{ vertical-align: middle; }

/* ===== Focus ring (reemplaza el azul Bootstrap default) ===== */
.btn:focus, .btn:active:focus, .btn-link.nav-link:focus,
.form-control:focus, .form-check-input:focus{
  box-shadow: 0 0 0 .20rem rgba(177,42,83,.20);
  border-color: rgba(177,42,83,.50);
}

/* ===== Top accent (línea marca) ===== */
.mv-top-accent{
  height: 3px;
  background: linear-gradient(90deg, var(--mv-blue) 0%, var(--mv-magenta) 50%, var(--mv-pink) 100%);
}

/* ===== Cards ===== */
.mv-card{
  border-radius: var(--mv-radius);
  border: var(--mv-border);
  box-shadow: var(--mv-shadow);
  background: var(--mv-surface);
}

/* ===== Botones corporativos ===== */
.btn-mv{
  background: var(--mv-gradient);
  border: none;
  color:#fff !important;
  border-radius: var(--mv-radius-sm);
  padding: 10px 14px;
  font-weight: 900;
}
.btn-mv:hover{ filter: brightness(1.03); }

.btn-mv-outline{
  background: transparent;
  border: 1px solid rgba(25,61,110,.35);
  color: var(--mv-blue) !important;
  border-radius: var(--mv-radius-sm);
  padding: 10px 14px;
  font-weight: 900;
}
.btn-mv-outline:hover{
  background: rgba(25,61,110,.06);
}

/* ===== Inputs pro ===== */
.mv-input{
  border-radius: var(--mv-radius-sm);
  padding: 10px 12px;
  border: 1px solid rgba(20,27,49,.16);
}
.mv-input:focus{
  border-color: rgba(177,42,83,.55);
}

/* ===== Navbar pública corporativa ===== */
.mv-navbar{
  background: #fff;
  border-bottom: 1px solid rgba(20,27,49,.07);
  box-shadow: 0 10px 30px rgba(20,27,49,.06);
}
.mv-brand{
  display:flex;
  align-items:center;
  gap:.65rem;
  font-weight: 950;
  letter-spacing: .3px;
  color: var(--mv-night);
}
.mv-brand img{
  height: 34px;
  width:auto;
  display:block;
}
.mv-navlink{
  font-weight: 800;
  color: var(--mv-night) !important;
  opacity: .92;
}
.mv-navlink:hover{
  opacity: 1;
  color: var(--mv-magenta) !important;
}

/* ===== Contenedor de páginas normales ===== */
.mv-page{
  min-height: calc(100vh - 72px);
  padding: 18px 0 40px;
}

/* =========================
   AUTH (Login / AccessDenied)
   ========================= */
.mv-auth-shell{
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

.mv-auth-bgimg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(900px 520px at 10% 10%, rgba(229,71,112,.22), transparent 60%),
    radial-gradient(900px 520px at 90% 30%, rgba(25,61,110,.26), transparent 60%),
    var(--mv-gradient-dark);
  background-size: cover;
  background-position: center;
  transform: scale(1.02);
}

.mv-auth-bgimg::after{
  content:"";
  position:absolute;
  inset:0;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.08), transparent 45%);
}

.mv-auth-wrap{
  position: relative;
  min-height: 100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 28px 12px;
  z-index: 2;
}

.mv-auth-card{
  width: 100%;
  max-width: 520px;
  border-radius: var(--mv-radius);
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: var(--mv-shadow-strong);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  position: relative;
  overflow: hidden;
}

.mv-auth-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: radial-gradient(circle at 20% 10%, rgba(255,255,255,.35), transparent 45%);
  pointer-events:none;
}

.mv-auth-header{
  text-align:center;
  padding: 18px 18px 0;
  position: relative;
  z-index: 2;
}

.mv-brand-lockup{
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 12px;
  margin: 0 auto 8px;
}
.mv-brand-lockup img{
  height: 48px;
  width:auto;
  display:block;
}

.mv-brand-name{
  font-weight: 950;
  font-size: 1.55rem;
  margin: 0;
  color: var(--mv-night);
  line-height: 1;
}
.mv-brand-tagline{
  margin: 3px 0 0;
  font-size: .92rem;
  color: var(--mv-muted);
}
.mv-auth-body{
  padding: 18px;
  position: relative;
  z-index: 2;
}

.mv-auth-watermark{
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
  z-index: 1;
}
.mv-auth-watermark img{
  width: min(420px, 72vw);
  opacity: .10;
  filter: grayscale(1);
  transform: translateY(10px);
}

/* =========================
   APP SHELL (Sidebar + content)
   ========================= */
.mv-app-body{
  display:flex;
  min-height:100vh;
  flex-direction:column;
  background: var(--mv-bg);
}

.mv-app-main{
  flex:1;
  display:flex;
}

.mv-sidebar{
  width:260px;
  background: var(--mv-night);
  color:#fff;
  padding:12px 10px;
  border-right:1px solid #0b1220;
}

.mv-sidebar.show{ display:block; }

.mv-sidebar h6{
  text-transform:uppercase;
  font-size:.75rem;
  letter-spacing:.05em;
  color:rgba(255,255,255,.65);
  padding:0 10px;
  margin:6px 0 10px;
}
.mv-sidebar .nav{ gap:2px; }
.mv-sidebar .nav-link{
  display:flex;
  align-items:center;
  padding:8px 10px;
  border-radius:12px;
  color:rgba(255,255,255,.88);
  font-size:.92rem;
  transition: background-color .15s ease, color .15s ease, transform .05s ease;
}
.mv-sidebar .nav-link i{ font-size:1rem; margin-right:.6rem; opacity:.95; }
.mv-sidebar .nav-link:hover{
  background-color: rgba(255,255,255,.06);
  color:#fff;
  transform: translateX(1px);
}
.mv-sidebar .nav-link.active{
  background: linear-gradient(90deg, #193D6E 0%, #B12A53 55%, #E54770 100%);
  color:#fff;
  box-shadow:0 8px 18px rgba(229,71,112,.18);
}

.mv-content{
  flex:1;
  padding:20px 24px;
}

.mv-brand-logo-top{ height:34px; width:auto; display:block; }
.mv-brand-logo-side{
  width:100%;
  max-width:170px;
  height:auto;
  display:block;
  margin:10px auto 12px;
  border-radius:10px;
}

@media (max-width: 991.98px){
  .mv-app-main{ flex-direction:column; }
  .mv-sidebar{
    width:100%;
    display:none;
    border-right:none;
    border-top:1px solid #0b1220;
  }
  .mv-content{ padding:15px 12px; }
  .mv-brand-logo-side{ max-width:150px; }
}