@layer components {
  .icon {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

  .button {
    min-height: 36px;
    padding: 0 14px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px solid transparent;
    border-radius: 11px;
    font-size: 11px;
    font-weight: 600;
  }

  .button .icon {
    width: 14px;
  }

  .button-primary {
    color: #fff;
    background: var(--green);
  }

  .button-secondary {
    background: var(--surface);
    border-color: var(--line);
  }

  .text-link {
    color: var(--green);
    font-size: 11px;
    font-weight: 600;
  }

  .records-actions,
  .records-header-actions,
  .form-actions,
  .map-editor-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 9px;
  }
}