:root{
  --bg: #f5f7fb;
  --card-radius: 1.2rem;
}

body{ background: var(--bg); }

.auth-bg{
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  min-height: 100vh;
}
.auth-overlay{
  position: fixed; inset: 0;
  background: rgba(2, 20, 35, .55);
}
.auth-card{ max-width: 980px; width: 100%; position: relative; z-index: 2; }
.auth-left{
  background: linear-gradient(135deg, rgba(5,45,79,.92), rgba(36,90,100,.92));
  min-height: 360px;
}
.rounded-4{ border-radius: var(--card-radius) !important; }

.navbar .nav-link{ border-radius: 999px; padding: .45rem .85rem; }
.navbar .nav-link.active{ background: #0d6efd; color: #fff !important; }

.card-action{ cursor:pointer; transition: transform .08s ease, box-shadow .08s ease; }
.card-action:hover{ transform: translateY(-2px); box-shadow: 0 0.5rem 1.2rem rgba(0,0,0,.08) !important; }

.icon-circle{
  width:46px;height:46px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background: rgba(255,255,255,.22);
}

.table thead th{ color:#64748b; font-weight: 600; }
.btn-icon{
  width:38px;height:38px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;
  padding:0;
}

/* Select2 (POS) - que se vea como Bootstrap (rounded pill) */
.select2-container--bootstrap-5 .select2-selection{
  min-height: calc(2.375rem + 2px);
  padding: .375rem .75rem;
}
.select2-container--bootstrap-5 .select2-selection--single{
  display: flex;
  align-items: center;
}
.select2--rounded-pill.select2-selection{
  border-radius: 999px !important;
}
.select2--rounded-4.select2-dropdown,
.select2--rounded-4 .select2-results{
  border-radius: 1rem !important;
}


.app-container{max-width:1280px;}