:root {
  --fida-brand: #0f766e;
  --fida-brand-dark: #115e59;
  --fida-bg: #f4f6fb;
  --fida-sidebar: #0f172a;
  --fida-muted: #64748b;
}

body { background: var(--fida-bg); font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }

/* Sidebar */
.sidebar {
  width: 248px; min-height: 100vh; background: var(--fida-sidebar); color: #cbd5e1;
  position: sticky; top: 0; height: 100vh; overflow-y: auto;
}
.sidebar .brand { color: #fff; font-size: 1.05rem; }
.sidebar .brand i { color: #2dd4bf; }
.sidebar .tenant-tag { color: #94a3b8; }
.sidebar .nav-group-header {
  padding: 0.6rem 0.75rem 0.25rem; font-size: 0.68rem; letter-spacing: 0.06em;
  color: #64748b; font-weight: 700;
}
.sidebar .nav-link { color: #cbd5e1; border-radius: 0.5rem; margin: 1px 0; font-size: 0.875rem; }
.sidebar .nav-link i { width: 20px; text-align: center; }
.sidebar .nav-link:hover { background: rgba(148,163,184,0.12); color: #fff; }
.sidebar .nav-link.active { background: var(--fida-brand); color: #fff; }

/* Content */
.content { min-width: 0; }
.page-title { font-size: 1.4rem; font-weight: 700; color: #0f172a; margin-bottom: 0.25rem; }
.page-sub { color: var(--fida-muted); margin-bottom: 1.25rem; }

.card { border: 1px solid #e5e7eb; border-radius: 0.85rem; box-shadow: 0 1px 2px rgba(15,23,42,0.04); }
.stat-card { border-left: 4px solid var(--fida-brand); }
.stat-card .num { font-size: 1.7rem; font-weight: 700; color: #0f172a; }
.stat-card .lbl { color: var(--fida-muted); font-size: 0.85rem; }
.stat-card i { font-size: 1.6rem; color: #cbd5e1; }

.btn-fida { background: var(--fida-brand); border-color: var(--fida-brand); color: #fff; }
.btn-fida:hover, .btn-fida:focus { background: var(--fida-brand-dark); border-color: var(--fida-brand-dark); color: #fff; }

.badge-soft { font-weight: 600; font-size: 0.75rem; }
.text-muted { color: var(--fida-muted) !important; }

.table > :not(caption) > * > * { padding: 0.6rem 0.75rem; vertical-align: middle; }
.table thead th { text-transform: uppercase; font-size: 0.72rem; letter-spacing: 0.04em; color: var(--fida-muted); border-bottom-width: 1px; }

/* Login */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #0f172a 0%, #134e4a 100%); }
.login-card { width: 100%; max-width: 400px; border-radius: 1rem; }

/* Error */
.error-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; }

/* OA8 responsive shell */
.mobile-topbar { background: #0f172a; color: #fff; }
.mobile-topbar .btn { border-color: rgba(255,255,255,.35); color: #fff; }
.mobile-topbar .btn:hover { background: rgba(255,255,255,.1); }
.truncate { max-width: 55vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@media (min-width: 992px) {
  .offcanvas-lg.sidebar { position: static; width: 260px; flex: 0 0 260px; transform: none; visibility: visible; background-color: #fff; border-right: 1px solid #e7eaf0; overflow-y: auto; z-index: auto; }
  /* Desktop uses a light sidebar; the dark-theme defaults above leave inactive
     items in pale grey. Re-colour text for the light background while keeping
     the clean design, an obvious active pill, and separate disabled styling. */
  .offcanvas-lg.sidebar .brand { color: #0f172a; }
  .offcanvas-lg.sidebar .brand i { color: var(--fida-brand); }
  .offcanvas-lg.sidebar .tenant-tag { color: #64748b; }
  .offcanvas-lg.sidebar .nav-group-header { color: #64748b; }
  .offcanvas-lg.sidebar .nav-link:not(.active):not(.disabled) { color: #3f4756; }
  .offcanvas-lg.sidebar .nav-link:not(.active):not(.disabled):hover { background: rgba(15,23,42,0.06); color: #0f172a; }
  .offcanvas-lg.sidebar .nav-link.active { background: var(--fida-brand); color: #fff; }
  .offcanvas-lg.sidebar .nav-link.disabled { color: #b3bac7; }
}
@media (max-width: 991.98px) {
  .offcanvas-lg.sidebar { width: 280px !important; max-width: 85vw; }
}

/* OA4 quote workspace */
.progress-step { height: 34px; width: 34px; margin: 0 auto; border-radius: 50%; background: #e2e8f0; color: #94a3b8; display: flex; align-items: center; justify-content: center; font-size: 1rem; }
.progress-step.done { background: var(--fida-brand); color: #fff; }
.btn-xs { padding: 0.15rem 0.4rem; font-size: 0.72rem; line-height: 1.2; }



/* Final catalogue batch: product images */
.product-thumb { width: 34px; height: 34px; -o-object-fit: cover; object-fit: cover; border-radius: 6px; border: 1px solid var(--fida-brand, #e2e8f0); background: #fff; flex: 0 0 auto; }
.product-thumb-empty { background: #f1f5f9; }
.product-img { max-width: 320px; width: 100%; border-radius: 10px; border: 1px solid #e2e8f0; object-fit: cover; }
.product-img-wrap { position: relative; display: inline-block; }


/* Final catalogue batch: import review table (usable at 1280x585) */
.import-table-wrap { max-height: calc(100vh - 240px); overflow: auto; }
.import-table-wrap thead th { position: sticky; top: 0; background: #fff; z-index: 2; box-shadow: 0 1px 0 #e2e8f0; }
.sticky-import-actions { position: sticky; top: 0; z-index: 3; background: var(--bs-body-bg, #fff); }
