/* Utility Classes - Reusable helper classes for common patterns */

/* Text Colors */
.text-samba-primary-navy {
  color: var(--samba-primary-blue-navy) !important;
}

/* Borders */
.darker-border-checkbox.form-check-input {
  border-color: var(--samba-gray-text);
}

.gridShaddow {
  border-radius: var(--samba-border-radius-sm);
  box-shadow: none !important; /* No shadow */
}

.cardShaddow {
  background-color: var(--samba-white);
  box-shadow: none !important; /* No shadow */
  transition: box-shadow .2s ease-in-out;
  border-radius: var(--samba-border-radius-md);
}


/* Menu Utilities */
.samba-menu {
  margin-top: 20px;
  background-color: transparent !important;
  color: var(--samba-white);
}

.samba-sub-menu {
  background-color: var(--samba-white) !important;
  color: var(--samba-primary-blue-navy) !important;
}

.samba-menu-item-content {
  display: flex;
  flex-direction: row; /* Text to the right of icon, not underneath */
  align-items: center;
  justify-content: flex-start;
  gap: var(--samba-spacing-sm); /* Gap between icon and text */
  width: 100%;
  margin-bottom: 0;
}

.samba-menu-item-content > span,
.samba-menu-item-content > p {
  margin: 0;
  padding: 0;
  color: var(--samba-primary-blue-navy) !important;
}

/* Grid Button Utilities */
.btnGridNew {
  height: 25px !important;
  color: var(--samba-black);
  border-color: var(--samba-gray-border);
}

.btnGridEdit {
  height: 25px !important;
  color: var(--samba-black);
  border-color: var(--samba-gray-border);
}

.btnGridDelete {
  height: 25px !important;
  color: var(--samba-red);
  border-color: var(--samba-gray-border);
}

.btnGridEmail {
  height: 25px !important;
  color: var(--samba-black);
  border-color: var(--samba-gray-border);
}

/* Asterix on lables for required fields */
.required-field::after {
  content: "*";
  vertical-align: central;
  color: red;
  font-size: small;
  padding-left: 4px
}

.validation-field::after {
  content: "*";
  vertical-align: central;
  color: blue;
  font-size: small;
  padding-left: 4px
}