/* Messages - Using the GIN messages SCSS as a base 
This will override the messages, and be used in UCT base theme - JA */
.messages-list {
  --colorGinWarning: #734c00;
  --colorGinWarningBackground: #e09600;
  --colorGinWarningLightBackground: #fcf5e0;
  --colorGinDanger: #a51b00;
  --colorGinDangerBackground: #e62600;
  --colorGinDangerLightest: #fdd9d9;
  --colorGinGreen: #325e1c;
  --colorGinGreenBackground: #77b259;
  --colorGinGreenLightBackground: #f3faef;
  --colorGinInfo: #092d58;
  --colorGinInfoBackground: #2075de;
  --colorGinInfoLightBackground: #eff4fa;
  margin-top: 1rem;
  margin-bottom: 1rem; }
  .messages-list + .messages-list {
    margin-top: 1rem; }
    .messages-list + .messages-list:last-child {
      margin-bottom: 2.5rem; }

.messages {
  padding: 1rem;
  border: 2px solid transparent;
  border-radius: none;
  box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.1);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0; }
  .gin--dark-mode .messages {
    box-shadow: 0px 6px 16px rgba(0, 0, 0, 0.05); }
  .messages, .messages-list {
    margin-top: 1rem; }
  .messages a, .messages a:hover, .messages a:active {
    color: var(--colorGinPrimary); }
  .messages__title {
    font-weight: 600; }
  .messages__title, .messages__content {
    margin-left: 2.125rem; }
  .messages__list {
    margin: 0;
    padding: 0;
    list-style: none; }
  .messages__item:not(:last-child) {
    padding-bottom: 0.5rem; }
  .messages--message-title {
    margin-top: 0;
    margin-bottom: 0.25rem;
    line-height: 24px; }
  .messages .messages__header {
    position: relative;
    background-image: none;
    margin-bottom: 0; }
    .messages .messages__header:before {
      content: "";
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      width: 24px;
      height: 24px; }
    .messages .messages__header .messages__title {
      display: none; }
  .messages.messages--status {
    color: var(--colorGinGreen);
    background-color: var(--colorGinGreenLightBackground);
    background-image: none;
    border: 1px solid var(--colorGinGreenBackground);
    border-left-width: 8px; }
    .messages.messages--status .messages__header:before {
      background-color: var(--colorGinGreenBackground);
      -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M22 11.08V12a10 10 0 11-5.93-9.14'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M22 4L12 14.01l-3-3'/%3e%3c/svg%3e");
      mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M22 11.08V12a10 10 0 11-5.93-9.14'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M22 4L12 14.01l-3-3'/%3e%3c/svg%3e");
      mask-repeat: no-repeat;
      mask-position: center left; }
  .messages.messages--warning {
    color: var(--colorGinWarning);
    background-color: var(--colorGinWarningLightBackground);
    background-image: none;
    border: 1px solid var(--colorGinWarningBackground);
    border-left-width: 8px; }
    .messages.messages--warning .messages__header:before {
      background-color: var(--colorGinWarningBackground);
      -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M7.86 2h8.28L22 7.86v8.28L16.14 22H7.86L2 16.14V7.86L7.86 2zM12 8v4'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M12 16h.01'/%3e%3c/svg%3e");
      mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M7.86 2h8.28L22 7.86v8.28L16.14 22H7.86L2 16.14V7.86L7.86 2zM12 8v4'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' d='M12 16h.01'/%3e%3c/svg%3e");
      mask-repeat: no-repeat;
      mask-position: center left; }
  .messages.messages--error {
    color: var(--colorGinDanger);
    background-color: var(--colorGinDangerLightest);
    background-image: none;
    border: 1px solid var(--colorGinDangerBackground);
    border-left-width: 8px;
    border-radius: 0; }
    .messages.messages--error .messages__header:before {
      background-color: var(--colorGinDangerBackground);
      -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3ccircle fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='10'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4.93 4.93l14.14 14.14'/%3e%3c/svg%3e");
      mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3e%3ccircle fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' cx='12' cy='12' r='10'/%3e%3cpath fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4.93 4.93l14.14 14.14'/%3e%3c/svg%3e");
      mask-repeat: no-repeat;
      mask-position: center left; }
  .messages.messages--custom, .messages.messages--info {
    color: var(--colorGinInfo);
    background-color: var(--colorGinInfoLightBackground);
    border: 1px solid var(--colorGinInfoBackground);
    border-left-width: 8px; }
    .messages.messages--custom .messages__header, .messages.messages--info .messages__header {
      background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 13'%3E%3Cpath d='M2 6.57143L5.6 10L14 2' fill='none' stroke='%2342a877' stroke-width='3'/%3E%3C/svg%3E%0A") no-repeat center left; }
      .messages.messages--custom .messages__header:before, .messages.messages--info .messages__header:before {
        background-color: var(--colorGinInfoBackground);
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fal' data-icon='info-circle' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' class='svg-inline--fa fa-info-circle fa-w-16 fa-3x'%3E%3Cpath fill='currentColor' d='M256 40c118.621 0 216 96.075 216 216 0 119.291-96.61 216-216 216-119.244 0-216-96.562-216-216 0-119.203 96.602-216 216-216m0-32C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm-36 344h12V232h-12c-6.627 0-12-5.373-12-12v-8c0-6.627 5.373-12 12-12h48c6.627 0 12 5.373 12 12v140h12c6.627 0 12 5.373 12 12v8c0 6.627-5.373 12-12 12h-72c-6.627 0-12-5.373-12-12v-8c0-6.627 5.373-12 12-12zm36-240c-17.673 0-32 14.327-32 32s14.327 32 32 32 32-14.327 32-32-14.327-32-32-32z'%3E%3C/path%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' focusable='false' data-prefix='fal' data-icon='info-circle' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512' class='svg-inline--fa fa-info-circle fa-w-16 fa-3x'%3E%3Cpath fill='currentColor' d='M256 40c118.621 0 216 96.075 216 216 0 119.291-96.61 216-216 216-119.244 0-216-96.562-216-216 0-119.203 96.602-216 216-216m0-32C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm-36 344h12V232h-12c-6.627 0-12-5.373-12-12v-8c0-6.627 5.373-12 12-12h48c6.627 0 12 5.373 12 12v140h12c6.627 0 12 5.373 12 12v8c0 6.627-5.373 12-12 12h-72c-6.627 0-12-5.373-12-12v-8c0-6.627 5.373-12 12-12zm36-240c-17.673 0-32 14.327-32 32s14.327 32 32 32 32-14.327 32-32-14.327-32-32-32z'%3E%3C/path%3E%3C/svg%3E");
        mask-repeat: no-repeat;
        mask-position: center left; }