/* ================================================================
   NEXUS ERP — Design System v2.1
   Nexa typography · Sharp enterprise UI · No rounded borders
   ================================================================ */

/* ── Nexa Font (Fontshare CDN) ───────────────────────────────── */
@import url('https://api.fontshare.com/v2/css?f[]=nexa@900,700,400,300&display=swap');

/* ── CSS Variables ───────────────────────────────────────────── */
:root {
  --nx-blue:       #1D4ED8;
  --nx-blue-mid:   #2563EB;
  --nx-blue-dark:  #1E3A8A;
  --nx-blue-light: #EFF6FF;
  --nx-dark:       #0C0F1A;
  --nx-gray-900:   #111827;
  --nx-gray-700:   #374151;
  --nx-gray-500:   #9CA3AF;
  --nx-gray-300:   #D1D5DB;
  --nx-gray-200:   #E5E7EB;
  --nx-gray-100:   #F3F4F6;
  --nx-gray-50:    #F9FAFB;
  --nx-radius:     0px;
  --nx-radius-sm:  0px;
  --nx-radius-lg:  0px;
  --nx-shadow:     0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --nx-shadow-md:  0 4px 16px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.04);
  --nx-shadow-lg:  0 8px 24px rgba(12,15,26,.12);
  --nx-font:       'Nexa', 'Inter', system-ui, sans-serif;
}

/* ── Global Typography Override ──────────────────────────────── */
body,
.sidebar .nav .menu-title,
.navbar,
.card,
.modal,
p, span, div, label, input, select, textarea, button, a,
h1, h2, h3, h4, h5, h6 {
  font-family: var(--nx-font) !important;
}

/* ── Cards: sharp corners ────────────────────────────────────── */
.card {
  border-radius: 0 !important;
  border: 1px solid var(--nx-gray-200) !important;
  box-shadow: var(--nx-shadow) !important;
}
.card:hover {
  box-shadow: var(--nx-shadow-md) !important;
  transition: box-shadow .2s ease !important;
}

/* ── Modals ──────────────────────────────────────────────────── */
.modal-content {
  border-radius: 0 !important;
  border: 1px solid var(--nx-gray-200) !important;
}
.modal-header { border-radius: 0 !important; }
.modal-footer { border-radius: 0 !important; }

/* ── Buttons: premium design system ──────────────────────────── */
.btn {
  border-radius: 0 !important;
  font-family: var(--nx-font) !important;
  font-weight: 600 !important;
  letter-spacing: .025em !important;
  transition: all .18s ease !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .25rem !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}
.btn i, .btn .mdi {
  font-size: 1rem !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

/* Primary — gradient blue with glow */
.btn-primary {
  background: linear-gradient(135deg, var(--nx-blue) 0%, var(--nx-blue-mid) 100%) !important;
  border-color: var(--nx-blue) !important;
  color: #fff !important;
  box-shadow: 0 2px 8px rgba(29,78,216,.28), 0 1px 2px rgba(29,78,216,.18) !important;
}
.btn-primary:hover {
  background: linear-gradient(135deg, var(--nx-blue-dark) 0%, var(--nx-blue) 100%) !important;
  border-color: var(--nx-blue-dark) !important;
  color: #fff !important;
  box-shadow: 0 6px 20px rgba(29,78,216,.40), 0 2px 6px rgba(29,78,216,.22) !important;
  transform: translateY(-1px) !important;
}
.btn-primary:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 8px rgba(29,78,216,.28) !important;
}
.btn-primary:focus {
  box-shadow: 0 0 0 3px rgba(29,78,216,.22) !important;
}

/* Light — clean white secondary */
.btn-light {
  background: #fff !important;
  border: 1px solid var(--nx-gray-200) !important;
  color: var(--nx-gray-700) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}
.btn-light:hover {
  background: var(--nx-gray-50) !important;
  border-color: var(--nx-gray-300) !important;
  color: var(--nx-gray-900) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.09) !important;
  transform: translateY(-1px) !important;
}
.btn-light:active {
  transform: translateY(0) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}

/* Outline secondary */
.btn-outline-secondary {
  border: 1px solid var(--nx-gray-200) !important;
  color: var(--nx-gray-700) !important;
  background: #fff !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.05) !important;
}
.btn-outline-secondary:hover {
  background: var(--nx-gray-50) !important;
  border-color: var(--nx-gray-300) !important;
  color: var(--nx-gray-900) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.08) !important;
  transform: translateY(-1px) !important;
}
.btn-outline-secondary:active { transform: translateY(0) !important; }

/* Outline primary */
.btn-outline-primary {
  border: 1px solid var(--nx-blue) !important;
  color: var(--nx-blue) !important;
  background: transparent !important;
}
.btn-outline-primary:hover {
  background: var(--nx-blue-light) !important;
  color: var(--nx-blue-dark) !important;
  border-color: var(--nx-blue) !important;
  transform: translateY(-1px) !important;
}
.btn-outline-primary:active { transform: translateY(0) !important; }

/* Danger */
.btn-danger {
  box-shadow: 0 2px 8px rgba(220,38,38,.24) !important;
}
.btn-danger:hover {
  box-shadow: 0 4px 14px rgba(220,38,38,.36) !important;
  transform: translateY(-1px) !important;
}

/* Outline danger */
.btn-outline-danger {
  border: 1px solid #FCA5A5 !important;
  color: #DC2626 !important;
  background: transparent !important;
}
.btn-outline-danger:hover {
  background: #FEF2F2 !important;
  border-color: #DC2626 !important;
  color: #B91C1C !important;
  transform: translateY(-1px) !important;
}

/* Success */
.btn-success {
  box-shadow: 0 2px 8px rgba(22,163,74,.24) !important;
}
.btn-success:hover {
  box-shadow: 0 4px 14px rgba(22,163,74,.36) !important;
  transform: translateY(-1px) !important;
}

/* Outline success */
.btn-outline-success {
  border: 1px solid #6EE7B7 !important;
  color: #16A34A !important;
  background: transparent !important;
}
.btn-outline-success:hover {
  background: #F0FDF4 !important;
  border-color: #16A34A !important;
  color: #15803D !important;
  transform: translateY(-1px) !important;
}

/* Sizes */
.btn:not(.btn-sm):not(.btn-lg):not(.btn-xs) {
  padding: .5rem 1.25rem !important;
  font-size: .875rem !important;
}
.btn-sm {
  font-size: .8rem !important;
  padding: .375rem 1rem !important;
}
.btn-xs {
  font-size: .75rem !important;
  padding: .2rem .6rem !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
}

/* Icon-only buttons */
.btn-icon {
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  justify-content: center !important;
}
.btn-icon.btn-sm { width: 30px !important; height: 30px !important; }

/* ── Dropdowns ───────────────────────────────────────────────── */
.dropdown-menu {
  border-radius: 0 !important;
  border: 1px solid var(--nx-gray-200) !important;
  box-shadow: var(--nx-shadow-md) !important;
}

/* ── Form controls ───────────────────────────────────────────── */
.form-control {
  border-radius: 0 !important;
  border: 1px solid var(--nx-gray-200) !important;
  font-family: var(--nx-font) !important;
  font-size: .875rem !important;
  color: var(--nx-gray-900) !important;
  transition: border-color .15s ease !important;
}
.form-control:focus {
  border-color: var(--nx-blue) !important;
  box-shadow: none !important;
  outline: none !important;
}
.input-group-text {
  border-radius: 0 !important;
}

/* ── Badges ──────────────────────────────────────────────────── */
.badge {
  border-radius: 2px !important;
  font-family: var(--nx-font) !important;
  font-weight: 600 !important;
}

/* ── Alerts ──────────────────────────────────────────────────── */
.alert { border-radius: 0 !important; }

/* ── Table ───────────────────────────────────────────────────── */
.table th {
  font-family: var(--nx-font) !important;
  font-size: .6875rem !important;
  font-weight: 700 !important;
  letter-spacing: .07em !important;
}
.table td { font-family: var(--nx-font) !important; }

/* ── Sidebar font ────────────────────────────────────────────── */
.sidebar .nav .menu-title {
  font-weight: 500 !important;
  letter-spacing: .02em !important;
}
.sidebar .nav .nav-category {
  font-family: var(--nx-font) !important;
  font-size: .625rem !important;
  letter-spacing: .12em !important;
}

/* ── Sidebar icon-bg: sharp corners, identidad verde del ERP ── */
.sidebar .nav .nav-item .nav-link .icon-bg {
  border-radius: 0 !important;
  width: 28px !important;
  height: 28px !important;
  background: rgba(51,201,45,.10) !important;
  transition: background .18s ease !important;
}
.sidebar .nav .nav-item .nav-link .icon-bg .menu-icon {
  font-size: 1.1rem !important;
  color: #33c92d !important;
}
.sidebar .nav .nav-item:hover .icon-bg {
  background: rgba(51,201,45,.18) !important;
}

/* ── Remove textures / patterns ──────────────────────────────── */
.content-wrapper,
.container-scroller,
.page-body-wrapper {
  background: #F8FAFC !important;
}

/* ── No banner / promo ───────────────────────────────────────── */
#proBanner { display: none !important; }