/* public/assets/css/app.css */
body { background-color: #f8f9fa; }

/* Amber color utilities (used for reminder icons/timestamps) */
.text-amber { color: #b76e00 !important; }
.icon-amber { color: #b76e00 !important; }

/* Fixed-width numeric badges for counts */
.badge-count {
  width: 2.8ch; /* more breathing room for 2 digits */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
  line-height: 1.1;
  font-variant-numeric: tabular-nums; /* align digits evenly */
  box-sizing: content-box; /* padding won't change width */
  font-size: .8rem; /* slightly larger for readability */
  font-weight: 600;
}

/* Normalize action button groups across lists (anchors + forms together) */
.actions-group {
  display: inline-flex;
  gap: 0; /* rely on borders to separate */
}
/* Allow buttons inside forms to behave like direct children of the group */
.actions-group form {
  display: contents; /* so the button becomes a direct child for rounded corners */
  margin: 0 !important;
}
/* Ensure contiguous borders and correct rounding regardless of whitespace/text nodes */
/* Base: make all action buttons square by default */
.actions-group a.btn,
.actions-group button.btn { border-radius: 0 !important; }

/* Apply overlap to all except the very first button */
.actions-group a.btn,
.actions-group button.btn { margin-left: -1px; }
.actions-group > a.btn:first-child { margin-left: 0; }
.actions-group > button.btn:first-child { margin-left: 0; }
.actions-group > form:first-child > .btn { margin-left: 0; }

/* Left rounding for the first button (anchor or form>button) */
.actions-group > a.btn:first-child,
.actions-group > button.btn:first-child {
  border-top-left-radius: .375rem !important;
  border-bottom-left-radius: .375rem !important;
}
.actions-group > form:first-child > .btn {
  border-top-left-radius: .375rem !important;
  border-bottom-left-radius: .375rem !important;
}

/* Right rounding for the last button (anchor or form>button) */
.actions-group > a.btn:last-child,
.actions-group > button.btn:last-child {
  border-top-right-radius: .375rem !important;
  border-bottom-right-radius: .375rem !important;
}
.actions-group > form:last-child > .btn {
  border-top-right-radius: .375rem !important;
  border-bottom-right-radius: .375rem !important;
}

/* --- Login page enhancements --- */
.full-bleed { /* let a section extend edge-to-edge inside a centered container */
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}
.login-hero {
  /* Let global blobs (body.blobs-bg) be visible */
  background: transparent !important;
  position: relative;
  overflow: visible;
}

/* Remove any background/shadow from wrappers inside the hero */
.login-hero > .container,
.login-hero > .container > .row,
.login-hero > .container > .row > [class^="col-"],
.login-hero > .container > .row > [class*=" col-"] {
  background: transparent !important;
  box-shadow: none !important;
}

.auth-card {
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(13,110,253,.08), 0 2px 10px rgba(0,0,0,.04);
  transform: translateY(8px);
  opacity: 0;
  animation: floatIn .7s ease forwards;
}

.login-icon {
  font-size: 3rem; /* requires bootstrap-icons in layout */
  line-height: 1;
  display: inline-block;
  background: linear-gradient(135deg, #0d6efd, #6f42c1);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 6px 12px rgba(13,110,253,.25));
}

.btn-glow {
  position: relative;
  box-shadow: 0 8px 18px rgba(13,110,253,.25);
  transition: transform .15s ease, box-shadow .2s ease;
}
.btn-glow:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(13,110,253,.35); }
.btn-glow:active { transform: translateY(0); box-shadow: 0 6px 14px rgba(13,110,253,.2); }

@keyframes floatIn {
  from { transform: translateY(16px); opacity: 0; }
  to   { transform: translateY(0); opacity: 1; }
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  .auth-card { animation: none; opacity: 1; transform: none; }
  .btn-glow { transition: none; }
}

/* Decorative blobs inspired by marketing pages (global) */
.blobs-bg::before,
.blobs-bg::after {
  content: '';
  position: fixed;
  width: 432px; /* +20% */
  height: 432px; /* +20% */
  border-radius: 50%;
  filter: blur(30px);
  opacity: .35;
  z-index: 0;
  pointer-events: none;
}
.blobs-bg::before {
  left: -144px;   /* -120 * 1.2 */
  bottom: -72px;  /* -60 * 1.2 */
  background: radial-gradient(circle at 30% 30%, var(--brand-primary, #0d6efd), rgba(13,110,253,0) 60%),
              radial-gradient(circle at 70% 70%, var(--brand-accent, #6f42c1), rgba(111,66,193,0) 60%),
              linear-gradient(135deg, var(--brand-primary, #0d6efd), var(--brand-accent, #6f42c1));
}
.blobs-bg::after {
  right: -120px;  /* -100 * 1.2 */
  top: 12px;      /* 10 * 1.2 */
  background: radial-gradient(circle at 30% 30%, var(--brand-accent, #6f42c1), rgba(111,66,193,0) 60%),
              radial-gradient(circle at 70% 70%, var(--brand-primary, #0d6efd), rgba(13,110,253,0) 60%),
              linear-gradient(135deg, var(--brand-accent, #6f42c1), var(--brand-primary, #0d6efd));
}

/* Ensure content renders above global blobs */
main { position: relative; z-index: 1; }
/* Navbar and dropdowns should be above main content */
/* Do not force a position on .navbar so Bootstrap's .sticky-top can work */
.navbar { z-index: 1040; }
/* Ensure sticky navbar actually stays sticky even if other rules try to override */
.navbar.sticky-top { position: sticky; top: 0; }
.dropdown-menu { z-index: 1050; }

/* Brand-styled button and pill shape */
.btn-brand {
  color: #fff;
  background-image: linear-gradient(135deg, var(--brand-primary, #0d6efd) 0%, var(--brand-accent, #6f42c1) 100%);
  border: 0;
}
.btn-brand:hover { color:#fff; background-image: linear-gradient(135deg, color-mix(in oklab, var(--brand-primary, #0d6efd), #000 10%) 0%, color-mix(in oklab, var(--brand-accent, #6f42c1), #000 10%) 100%); }
.btn-brand:active { color:#fff; background-image: linear-gradient(135deg, color-mix(in oklab, var(--brand-primary, #0d6efd), #000 18%) 0%, color-mix(in oklab, var(--brand-accent, #6f42c1), #000 18%) 100%); }
.btn-brand:focus { box-shadow: 0 0 0 .25rem color-mix(in oklab, var(--brand-primary, #0d6efd), transparent 70%); }

.btn-pill { border-radius: 999px; }

/* --- Operations page: collapse toggle arrow icons --- */
.inv-toggle .icon-collapse::before { content: "▼"; display: inline-block; }
.inv-toggle[aria-expanded="true"] .icon-collapse::before { content: "▲"; }
