@use "vars" as vars;

.plover-dashboard-wrap {

  .dashboard-widgets-area {
    background: vars.$neutral-0;
    border: 1px solid vars.$neutral-300;
    border-radius: vars.$border-radius;

    .dashboard-widget {
      padding: vars.$spacing;
      border-bottom: 1px solid vars.$neutral-300;

      &, p {
        font-size: 15px;
      }

      &:last-child {
        border-bottom: none;
      }

      .widget-title {
        margin-top: 0;
      }

      .widget-actions {
        display: flex;
        flex-wrap: wrap;
        gap: vars.$spacing-sm;
      }

      .links {
        .link-item {
          display: flex;
          align-items: center;
          padding: 4px 0;

          svg {
            width: 16px;
            height: 16px;
            margin-right: 12px;
          }
        }
      }
    }
  }

}