/* app/static/css/style.css */

/* Tipografía y base */
:root {
  --radius: 1rem;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f8f9fb;
  --card: #ffffff;
  --text: #1e1e2d;
  --muted: #6c757d;
  --border: #e6e8ef;
  --shadow: 0 6px 24px rgba(20, 20, 40, 0.06);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0f1115;
  --card: #151821;
  --text: #e8eaf0;
  --muted: #9aa4b2;
  --border: #222738;
  --shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
}

body.bg-body {
  background: var(--bg);
  color: var(--text);
}

/* Navbar */
.navbar {
  backdrop-filter: saturate(120%) blur(6px);
}

/* App layout */
.app-wrapper {
  min-height: calc(100vh - 56px);
}

.app-sidebar {
  width: 260px;
  transition: transform .2s ease-in-out, box-shadow .2s ease-in-out;
  background: var(--card) !important;
}
.app-sidebar.open {
  transform: translateX(0);
}

@media (max-width: 991.98px) {
  .app-sidebar {
    position: fixed;
    z-index: 1040;
    inset: 56px auto 0 0;
    transform: translateX(-100%);
    box-shadow: var(--shadow);
  }
}

.app-content .card {
  background: var(--card);
  border: 1px solid var(--border);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
}

/* Sidebar nav */
.app-sidebar .nav-link {
  border-radius: .5rem;
  color: var(--text);
  opacity: .85;
}
.app-sidebar .nav-link:hover {
  background: rgba(100, 108, 255, 0.08);
  opacity: 1;
}
.app-sidebar .nav-link.active {
  background: rgba(100, 108, 255, 0.16);
  border: 1px solid rgba(100, 108, 255, 0.3);
}

/* Breadcrumb */
.breadcrumb a {
  text-decoration: none;
}

/* Inputs */
.form-control, .form-select {
  background: var(--card);
  color: var(--text);
  border: 1px solid var(--border);
}

/* Buttons */
.btn-outline-secondary {
  border-color: var(--border);
}

/* Utilities */
.rounded-4 { border-radius: var(--radius) !important; }