//
// Copyright (c) Tiny Technologies, Inc. All rights reserved.
// Licensed under the LGPL or a commercial license.
// For LGPL see License.txt in the project root for license information.
// For commercial licenses see https://www.tiny.cloud/
//

//
// Notification
//

.tox {
  // Wraps around many notifications
  .tox-notifications-container {
    //
  }

  // An individual notification
  .tox-notification {
    background-color: #fffaea;
    border-color: darken($background-color, 15%);
    border-style: solid;
    border-width: 1px;
    box-sizing: border-box;
    color: #222f3e;
    display: grid;
    grid-template-columns: minmax(40px, 1fr) auto minmax(40px, 1fr);
    margin-top: 5px;
    opacity: 0;
    padding: 5px;
    transition: transform 100ms ease-in, opacity 150ms ease-in;

    a {
      color: @color-tint;
      text-decoration: underline;
    }
  }

  .tox-notification--in {
    opacity: 1;
  }

  .tox-notification--success {
    background-color: #dff0d8;
    border-color: #d6e9c6;

    a {
      color: darken(#d6e9c6, 55%);
    }
  }

  .tox-notification--error {
    background-color: #f2dede;
    border-color: #ebccd1;

    a {
      color: darken(#ebccd1, 50%);
    }
  }

  .tox-notification--warn {
    background-color: #fcf8e3;
    border-color: #faebcc;
  }

  .tox-notification--info {
    background-color: #d9edf7;
    border-color: #779ecb;
  }

  // Content within the notification
  .tox-notification__body {
    align-self: center;
    color: @text-color;
    font-size: 14px;
    grid-column-end: 3;
    -ms-grid-column-span: 1;
    grid-column-start: 2;
    grid-row-end: 2;
    grid-row-start: 1;
    text-align: center;
    white-space: normal;
    word-break: break-all;
    word-break: break-word;
  }

  .tox-notification__body > * {
    margin: 0;
  }

  .tox-notification__body > * + * {
    margin-top: 1rem;
  }

  .tox-notification-inner a {
    //
  }

  .tox-notification__icon {
    align-self: center;
    -ms-grid-column-align: end;
    grid-column-end: 2;
    -ms-grid-column-span: 1;
    grid-column-start: 1;
    grid-row-end: 2;
    grid-row-start: 1;
    justify-self: end;
  }

  .tox-notification__icon svg {
    display: block;
  }

  .tox-notification__dismiss {
    align-self: start;
    -ms-grid-column-align: end;
    grid-column-end: 4;
    -ms-grid-column-span: 1;
    grid-column-start: 3;
    grid-row-end: 2;
    grid-row-start: 1;
    justify-self: end;
  }

  .tox-notification .tox-progress-bar {
    -ms-grid-column-align: center;
    grid-column-end: 4;
    -ms-grid-column-span: 3;
    grid-column-start: 1;
    grid-row-end: 3;
    -ms-grid-row-span: 1;
    grid-row-start: 2;
    justify-self: center;
  }
}