.inventory-flow-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: -4px 0 22px;
}

.inventory-flow-card {
  position: relative;
  overflow: hidden;
  min-height: 92px;
  padding: 17px 18px;
  border: 1px solid rgba(35, 94, 73, .11);
  border-radius: 15px;
  background: linear-gradient(145deg, #fff, #f5f8f6);
}

.inventory-flow-card::after {
  position: absolute;
  top: -25px;
  right: -20px;
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background: rgba(37, 103, 79, .06);
  content: "";
}

.inventory-flow-card span,
.inventory-flow-card small,
.inventory-flow-card b {
  display: block;
}

.inventory-flow-card span {
  color: var(--muted);
  font-size: 10px;
}

.inventory-flow-card b {
  margin: 9px 0 4px;
  color: var(--green);
  font: 25px Georgia, serif;
}

.inventory-flow-card small {
  color: #93a099;
  font-size: 9px;
}

.movement-in {
  color: #197052;
  font-weight: 700;
}

.movement-out,
.transfer-difference {
  color: #b24e43;
  font-weight: 700;
}

.role-permission-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin: 18px 0;
}

.role-permission-card {
  min-height: 205px;
  padding: 20px;
  border: 1px solid rgba(35, 94, 73, .11);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(31, 57, 46, .04);
}

.role-permission-card header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 15px;
}

.role-permission-card h3 {
  margin: 0 0 5px;
  font: 17px "Songti SC", serif;
}

.role-permission-card header small {
  color: var(--muted);
  font-size: 9px;
}

.role-scope {
  padding: 5px 8px;
  border-radius: 20px;
  background: #edf4f0;
  color: var(--green);
  font-size: 9px;
}

.permission-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.permission-chip {
  padding: 6px 8px;
  border-radius: 7px;
  background: #f5f7f5;
  color: #65746d;
  font-size: 9px;
  line-height: 1.2;
}

.permission-chip.critical {
  background: #f8ecea;
  color: #a54a42;
}

.nav-item.permission-hidden {
  display: none;
}

.read-only-products #products [data-modal="productModal"] {
  display: none;
}

@media (max-width: 1180px) {
  .inventory-flow-grid,
  .role-permission-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .inventory-flow-grid,
  .role-permission-grid {
    grid-template-columns: 1fr;
  }
}
