/* Utility Classes - Reusable helper classes for common patterns */

/* Text Colors */
.text-CFP-primary-navy {
  color: var(--CFP-primary-blue-navy) !important;
}

/* Borders */
.darker-border-checkbox.form-check-input {
  border-color: var(--CFP-gray-text);
}

.gridShaddow {
  border-radius: var(--CFP-border-radius-sm);
  box-shadow: none !important; /* No shadow */
}

.cardShaddow {
  background-color: var(--CFP-white);
  box-shadow: none !important; /* No shadow */
  transition: box-shadow .2s ease-in-out;
  border-radius: var(--CFP-border-radius-md);
}


/* Menu Utilities */
.CFP-menu {
  margin-top: 20px;
  background-color: transparent !important;
  color: var(--CFP-white);
}

.CFP-sub-menu {
  background-color: var(--CFP-white) !important;
  color: var(--CFP-primary-blue-navy) !important;
}

.CFP-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(--CFP-spacing-sm); /* Gap between icon and text */
  width: 100%;
  margin-bottom: 0;
}

  .CFP-menu-item-content > span,
  .CFP-menu-item-content > p {
    margin: 0;
    padding: 0;
    color: var(--CFP-primary-blue-navy) !important;
  }

/* Grid Button Utilities */
.btnGridNew {
  height: 25px !important;
  color: var(--CFP-black);
  border-color: var(--CFP-gray-border);
}

.btnGridEdit {
  height: 25px !important;
  color: var(--CFP-black);
  border-color: var(--CFP-gray-border);
}

.btnGridDelete {
  height: 25px !important;
  color: var(--CFP-red);
  border-color: var(--CFP-gray-border);
}

.btnGridEmail {
  height: 25px !important;
  color: var(--CFP-black);
  border-color: var(--CFP-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
}

.delivery-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 0.7rem;
  min-width: 1.25rem;
  border-radius: 9999px;
  border: 1px solid transparent;
  box-sizing: border-box;
}
.delivery-status-pill--success {
  background-color: var(--bs-success, #198754);
  border-color: var(--bs-success, #198754);
}
.delivery-status-pill--success .delivery-status-pill-line {
  background-color: rgba(255, 255, 255, 0.95);
}
.delivery-status-pill--muted {
  background-color: transparent;
  border-color: #adb5bd;
}
.delivery-status-pill--muted .delivery-status-pill-line {
  background-color: #adb5bd;
}
.delivery-status-pill-line {
  width: 6px;
  height: 1px;
  border-radius: 1px;
}