/* custom-icons.css */

/* Base icon class */
.icon {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}


/* Example: user icon */
.icon-user {
  background-image: url('/assets/icons/user.svg');
}

/* Example: settings icon */
.icon-settings {
  background-image: url('/assets/icons/settings.svg');
}


/* Example: search icon */
.icon-search {
  background-image: url('/assets/icons/search.svg');
}

/* Example: edit icon */
.icon-edit {
  background-image: url('/assets/icons/edit.svg');
}

/* Example: delete icon */
.icon-delete {
  background-image: url('/assets/icons/delete.svg');
}

/* Example: add icon */
.icon-add {
  background-image: url('/assets/icons/add.svg');
}

/* Example: save icon */
.icon-save {
  background-image: url('/assets/icons/save.svg');
}

.icon-close {
  background-image: url('/assets/icons/close.svg');
}

/* Example: info icon */
.icon-info {
  background-image: url('/assets/icons/info.svg');
}

.icon-warning {
  background-image: url('/assets/icons/warning.svg');
}

.icon-success {
  background-image: url('/assets/icons/success.svg');
}

.icon-dashboard {
  background-image: url('/assets/icons/dashboard.svg');
}

.icon-reports {
  background-image: url('/assets/icons/reports.svg');
}

.icon-logout {
  background-image: url('/assets/icons/logout.svg');
}

.icon-home {
  background-image: url('/assets/icons/home.svg');
}

.icon-calendar {
  background-image: url('/assets/icons/calendar.svg');
}

.icon-designation {
  background-image: url('/assets/icons/designation.svg');
}

.icon-department {
  background-image: url('/assets/icons/department.svg');
}

.icon-notifications {
  background-image: url('/assets/icons/notifications.svg');
}

.icon-messages {
  background-image: url('/assets/icons/messages.svg');
}

.icon-profile {
  background-image: url('/assets/icons/profile.svg');
}

.icon-notification-alert {
  background-image: url('/assets/icons/notification-alert.svg');
}

.icon-notification-message {
  background-image: url('/assets/icons/notification-message.svg');
}
.icon-employee {
  background-image: url('/assets/icons/employee.svg');
}
.icon-employee-list {
  background-image: url('/assets/icons/employee-list.svg');
}

/* Sizing and color overrides */
.icon-small {
  width: 16px;
  height: 16px;
}

.icon-large {
  width: 32px;
  height: 32px;
}

/* Optionally color tint icons using filter or SVG fill */