.o-spreadsheet {
  .o-table-style-popover {
    /* 7 tables preview + padding by line */
    width: calc((66px + 4px * 2) * 7 + 1.5rem * 2);
    font-size: 14px;
    user-select: none;

    .o-notebook {
      border-bottom: 1px solid var(--os-gray-300);

      .o-notebook-tab {
        padding: 5px 15px;
        margin-bottom: -1px;
        margin-left: -1px;
        color: var(--os-text-body);
        cursor: pointer;
        transition: color 0.2s, border-color 0.2s;

        &.selected {
          border-bottom-color: var(--os-white-bg) !important;
          border-top-color: var(--os-primary-button-bg) !important;
          color: var(--os-button-active-text-color);
        }
      }
    }

    .o-table-style-list-item {
      padding: 3px;
    }

    .o-pivot-previews {
      .o-table-preview {
        width: 66px;
        height: 57px;
      }
    }

    .o-table-previews {
      .o-table-preview {
        width: 66px;
        height: 51px;
      }
    }

    .o-new-table-style {
      font-size: 36px;
      color: var(--os-text-body-muted);

      &:hover {
        background: var(--os-button-hover-bg);
      }
    }
  }
}
